@zenith-open/zenithcms-plugin-ai-architect-ui 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Aman T Shekar
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/AIWriterPage.d.ts

@@ -0,0 +1,2 @@
+declare const AIWriterPage: () => import("react/jsx-runtime").JSX.Element;
+export default AIWriterPage;

package/dist/AIWriterPage.js

@@ -0,0 +1,192 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useState, useRef, useEffect } from 'react';
+import { Sparkles, Send, Loader2, Copy, Zap, Terminal, Cpu, PenTool, ShieldCheck, Search, Image as ImageIcon, CheckCircle2, AlertCircle, ChevronRight, RotateCcw, Save, Download, Code2, Wand2, Hash } from 'lucide-react';
+import api from '../lib/api';
+import { motion, AnimatePresence } from 'framer-motion';
+import { cn } from '../lib/utils';
+import toast from 'react-hot-toast';
+import { useTheme } from '../context/ThemeContext';
+import { PageHeader } from '../components/ui/PageHeader';
+// ── Tool Definitions ───────────────────────────────────────────────────────────
+const TOOLS = [
+    { id: 'seo', name: 'SEO Analysis', icon: Search, endpoint: '/content-tools/seo-analysis', desc: 'Score title, meta, content', color: 'text-amber-400' },
+    { id: 'quality', name: 'Quality Audit', icon: ShieldCheck, endpoint: '/content-tools/quality', desc: 'Readability + word structure', color: 'text-z-active-text' },
+    { id: 'improve', name: 'Refine Text', icon: Wand2, endpoint: '/content-tools/ai/improve', desc: 'AI-powered rewrite', color: 'text-purple-400' },
+    { id: 'meta', name: 'Meta Generator', icon: Hash, endpoint: '/content-tools/ai/meta-description', desc: 'Auto SEO meta description', color: 'text-z-active-text' },
+    { id: 'alt', name: 'Alt Text', icon: ImageIcon, endpoint: '/content-tools/ai/alt-text', desc: 'Generate image alt text', color: 'text-pink-400' },
+];
+const MODES = [
+    { id: 'writer', label: 'Writer', icon: PenTool, desc: 'Generate content from a prompt' },
+    { id: 'architect', label: 'Architect', icon: Cpu, desc: 'Design a collection schema with AI' },
+    { id: 'tools', label: 'Tools', icon: Zap, desc: 'SEO, quality, meta & more' },
+];
+// ── Result Renderers ──────────────────────────────────────────────────────────
+function SeoResultView({ data }) {
+    return (_jsxs("div", { className: "space-y-5", children: [_jsxs("div", { className: "flex items-end gap-4", children: [_jsxs("div", { children: [_jsx("p", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-z-secondary mb-1", children: "SEO Score" }), _jsx("span", { className: cn('text-5xl font-black tabular-nums', data.score >= 70 ? 'text-z-active-text' : data.score >= 45 ? 'text-amber-400' : 'text-red-400'), children: data.score }), _jsx("span", { className: "text-lg text-z-secondary font-black", children: "/100" })] }), _jsx("div", { className: "flex-1 h-2 bg-z-hover rounded-full overflow-hidden mb-3", children: _jsx("div", { className: cn('h-full transition-all duration-700', data.score >= 70 ? 'bg-z-accent' : data.score >= 45 ? 'bg-amber-500' : 'bg-red-500'), style: { width: `${data.score}%` } }) })] }), data.passed?.length > 0 && (_jsxs("div", { className: "space-y-1.5", children: [_jsx("p", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-z-active-text/70", children: "Passing" }), data.passed.map((p, i) => (_jsxs("div", { className: "flex items-center gap-2.5 text-[10px] text-z-muted", children: [_jsx(CheckCircle2, { size: 11, className: "text-z-active-text flex-shrink-0" }), p] }, i)))] })), data.issues?.length > 0 && (_jsxs("div", { className: "space-y-1.5", children: [_jsx("p", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-red-500/70", children: "Issues" }), data.issues.map((p, i) => (_jsxs("div", { className: "flex items-center gap-2.5 text-[10px] text-z-muted", children: [_jsx(AlertCircle, { size: 11, className: "text-red-500 flex-shrink-0" }), p] }, i)))] })), data.suggestions?.length > 0 && (_jsxs("div", { className: "space-y-1.5", children: [_jsx("p", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-amber-500/70", children: "Suggestions" }), data.suggestions.map((p, i) => (_jsxs("div", { className: "flex items-center gap-2.5 text-[10px] text-z-muted", children: [_jsx(ChevronRight, { size: 11, className: "text-amber-500 flex-shrink-0" }), p] }, i)))] }))] }));
+}
+function QualityResultView({ data }) {
+    const gradeColor = { A: 'text-z-active-text', B: 'text-z-active-text', C: 'text-amber-400', D: 'text-orange-400', F: 'text-red-400' };
+    return (_jsxs("div", { className: "space-y-5", children: [_jsxs("div", { className: "flex items-start gap-6", children: [_jsxs("div", { children: [_jsx("p", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-z-secondary mb-1", children: "Grade" }), _jsx("span", { className: cn('text-6xl font-black', gradeColor[data.grade] || 'text-white'), children: data.grade })] }), _jsx("div", { className: "grid grid-cols-3 gap-3 flex-1 pt-1", children: [
+                            { label: 'Words', val: data.wordCount },
+                            { label: 'Sentences', val: data.sentenceCount },
+                            { label: 'Avg Words/Sent', val: data.avgWordsPerSentence },
+                        ].map(m => (_jsxs("div", { className: "bg-z-hover border border-z-border p-3", children: [_jsx("p", { className: "text-[8px] font-black uppercase tracking-widest text-z-secondary mb-1", children: m.label }), _jsx("p", { className: "text-lg font-black text-white tabular-nums", children: m.val })] }, m.label))) })] }), data.issues?.length > 0 && (_jsxs("div", { className: "space-y-1.5", children: [_jsx("p", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-red-500/70", children: "Issues" }), data.issues.map((p, i) => _jsxs("div", { className: "flex items-center gap-2.5 text-[10px] text-z-muted", children: [_jsx(AlertCircle, { size: 11, className: "text-red-500 flex-shrink-0" }), p] }, i))] })), data.suggestions?.length > 0 && (_jsxs("div", { className: "space-y-1.5", children: [_jsx("p", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-z-active-text/70", children: "Suggestions" }), data.suggestions.map((p, i) => _jsxs("div", { className: "flex items-center gap-2.5 text-[10px] text-z-muted", children: [_jsx(CheckCircle2, { size: 11, className: "text-z-active-text flex-shrink-0" }), p] }, i))] }))] }));
+}
+function SchemaResultView({ data }) {
+    return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex items-start justify-between gap-3 flex-wrap", children: [_jsxs("div", { children: [_jsx("h3", { className: "text-lg font-black text-white tracking-tight", children: data.name }), _jsxs("p", { className: "text-[9px] text-z-secondary font-mono mt-0.5", children: ["/", data.slug] })] }), _jsxs("div", { className: "flex gap-2", children: [data.drafts && _jsx("span", { className: "px-2 py-0.5 text-[7px] font-black uppercase tracking-widest bg-z-accent/10 border border-z-accent/20 text-z-active-text", children: "Drafts" }), data.timestamps && _jsx("span", { className: "px-2 py-0.5 text-[7px] font-black uppercase tracking-widest bg-gray-500/10 border border-gray-500/20 text-z-muted", children: "Timestamps" })] })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("p", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-z-secondary", children: [data.fields?.length || 0, " Fields"] }), data.fields?.map((f, i) => (_jsxs("div", { className: "flex items-center justify-between px-3 py-2 bg-z-hover border border-z-border hover:border-z-border-strong transition-colors group", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("span", { className: "text-[9px] font-mono text-z-active-text", children: f.name }), f.required && _jsx("span", { className: "text-[6px] font-black text-red-500 uppercase tracking-wider", children: "required" })] }), _jsx("span", { className: "text-[8px] text-gray-600 uppercase tracking-widest font-black", children: f.type })] }, i)))] })] }));
+}
+// ── Main Component ─────────────────────────────────────────────────────────────
+const AIWriterPage = () => {
+    const { theme } = useTheme();
+    const dark = theme === 'dark';
+    const [mode, setMode] = useState('writer');
+    const [prompt, setPrompt] = useState('');
+    const [loading, setLoading] = useState(false);
+    const [result, setResult] = useState(null);
+    const [activeTool, setActiveTool] = useState('seo');
+    const [history, setHistory] = useState([]);
+    const [schemaForSave, setSchemaForSave] = useState(null);
+    const [savingSchema, setSavingSchema] = useState(false);
+    const textareaRef = useRef(null);
+    // Auto-resize textarea
+    useEffect(() => {
+        if (textareaRef.current) {
+            textareaRef.current.style.height = 'auto';
+            textareaRef.current.style.height = `${Math.min(textareaRef.current.scrollHeight, 300)}px`;
+        }
+    }, [prompt]);
+    const handleExecute = async () => {
+        if (!prompt.trim() && activeTool !== 'alt')
+            return;
+        setLoading(true);
+        setResult(null);
+        setSchemaForSave(null);
+        try {
+            let res;
+            let resultData;
+            if (mode === 'architect') {
+                res = await api.post('/system/ai-architect', { prompt });
+                resultData = res.data.data.schema;
+                setSchemaForSave(resultData);
+            }
+            else if (mode === 'writer') {
+                res = await api.post('/content-tools/ai/generate', { prompt });
+                resultData = res.data.data.text;
+            }
+            else {
+                const tool = TOOLS.find(t => t.id === activeTool);
+                let payload = { content: prompt };
+                if (activeTool === 'improve') {
+                    payload = { text: prompt, instruction: 'Make it more professional, clear, and concise. Improve grammar and flow.' };
+                }
+                else if (activeTool === 'meta') {
+                    payload = { title: 'Content', content: prompt };
+                }
+                else if (activeTool === 'seo') {
+                    payload = { title: prompt.split('\n')[0]?.substring(0, 60), content: prompt, description: prompt.substring(0, 160) };
+                }
+                else if (activeTool === 'alt') {
+                    payload = { imageUrl: prompt };
+                }
+                res = await api.post(tool.endpoint, payload);
+                const d = res.data.data;
+                if (activeTool === 'seo')
+                    resultData = d;
+                else if (activeTool === 'quality')
+                    resultData = d;
+                else if (activeTool === 'improve')
+                    resultData = d.text;
+                else if (activeTool === 'meta')
+                    resultData = d.description;
+                else if (activeTool === 'alt')
+                    resultData = d.altText;
+            }
+            setResult(resultData);
+            setHistory(prev => [{
+                    id: Date.now().toString(),
+                    mode,
+                    prompt: prompt.substring(0, 80),
+                    result: resultData,
+                    timestamp: new Date()
+                }, ...prev.slice(0, 19)]);
+            toast.success('Generated');
+        }
+        catch (err) {
+            const msg = err?.response?.data?.error?.message || err?.response?.data?.message || 'AI request failed';
+            toast.error(msg);
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const handleKeyDown = (e) => {
+        if ((e.metaKey || e.ctrlKey) && e.key === 'Enter')
+            handleExecute();
+    };
+    const saveSchemaToDb = async () => {
+        if (!schemaForSave)
+            return;
+        setSavingSchema(true);
+        try {
+            await api.post('/schemas', schemaForSave);
+            toast.success(`Collection "${schemaForSave.name}" created!`);
+            setSchemaForSave(null);
+        }
+        catch (err) {
+            toast.error(err?.response?.data?.error?.message || 'Failed to save schema');
+        }
+        finally {
+            setSavingSchema(false);
+        }
+    };
+    const copyResult = () => {
+        const text = typeof result === 'string' ? result : JSON.stringify(result, null, 2);
+        navigator.clipboard.writeText(text);
+        toast.success('Copied to clipboard');
+    };
+    const downloadResult = () => {
+        const text = typeof result === 'string' ? result : JSON.stringify(result, null, 2);
+        const ext = mode === 'architect' ? 'json' : 'txt';
+        const blob = new Blob([text], { type: 'text/plain' });
+        const url = URL.createObjectURL(blob);
+        const a = document.createElement('a');
+        a.href = url;
+        a.download = `zenith-ai-output.${ext}`;
+        a.click();
+        URL.revokeObjectURL(url);
+    };
+    const renderResult = () => {
+        if (!result)
+            return null;
+        if (mode === 'architect')
+            return _jsx(SchemaResultView, { data: result });
+        if (mode === 'tools' && activeTool === 'seo')
+            return _jsx(SeoResultView, { data: result });
+        if (mode === 'tools' && activeTool === 'quality')
+            return _jsx(QualityResultView, { data: result });
+        return (_jsx(motion.div, { initial: { opacity: 0, y: 4 }, animate: { opacity: 1, y: 0 }, className: "whitespace-pre-wrap text-[12px] leading-relaxed text-gray-300 font-sans", children: typeof result === 'string' ? result : JSON.stringify(result, null, 2) }));
+    };
+    const activePlaceholder = mode === 'architect'
+        ? 'Describe a collection schema... e.g., "An e-commerce product with variants, pricing, and inventory tracking"'
+        : mode === 'writer'
+            ? 'Describe the content you want to generate... e.g., "Write a compelling blog intro about sustainable fashion"'
+            : activeTool === 'alt'
+                ? 'Paste an image URL to generate alt text...'
+                : activeTool === 'meta'
+                    ? 'Paste your content to generate a meta description...'
+                    : 'Paste text to analyze...';
+    return (_jsxs("div", { className: "flex flex-col h-[calc(100vh-64px)] overflow-hidden", children: [_jsx(PageHeader, { title: "AI Architect", description: "Generate content, design schemas, and analyze text quality", actions: _jsx("div", { className: cn('flex p-0.5 border', dark ? 'bg-black border-z-border' : 'bg-z-panel border-z-border'), children: MODES.map(m => (_jsxs("button", { onClick: () => { setMode(m.id); setResult(null); setSchemaForSave(null); }, title: m.desc, className: cn('flex items-center gap-2 px-4 py-2 text-[9px] font-black uppercase tracking-widest transition-all', mode === m.id
+                            ? (dark ? 'bg-white text-black' : 'bg-gray-900 text-white')
+                            : (dark ? 'text-z-secondary hover:text-white' : 'text-z-secondary hover:text-z-primary')), children: [_jsx(m.icon, { size: 11 }), _jsx("span", { className: "hidden sm:inline", children: m.label })] }, m.id))) }) }), _jsxs("div", { className: "flex flex-1 overflow-hidden", children: [_jsxs("div", { className: cn('w-56 flex-shrink-0 border-r flex flex-col hidden lg:flex', dark ? 'border-z-border bg-black' : 'border-z-border bg-gray-50'), children: [_jsx("div", { className: cn('px-4 py-3 border-b flex-shrink-0', dark ? 'border-z-border' : 'border-z-border'), children: _jsx("p", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-z-secondary", children: "History" }) }), _jsxs("div", { className: "flex-1 overflow-y-auto p-2 space-y-1", children: [history.length === 0 && (_jsx("p", { className: "text-[8px] text-gray-600 uppercase tracking-widest p-2 text-center mt-4", children: "No history yet" })), history.map(h => (_jsxs("button", { onClick: () => { setResult(h.result); setSchemaForSave(h.mode === 'architect' ? h.result : null); }, className: cn('w-full text-left p-2.5 border border-transparent transition-all', dark ? 'hover:bg-z-hover hover:border-z-border' : 'hover:bg-white hover:border-z-border'), children: [_jsx("div", { className: "flex items-center gap-1.5 mb-1", children: _jsx("span", { className: cn('text-[7px] font-black uppercase tracking-widest', h.mode === 'architect' ? 'text-purple-400' : h.mode === 'tools' ? 'text-amber-400' : 'text-z-active-text'), children: h.mode }) }), _jsx("p", { className: "text-[9px] text-z-secondary truncate", children: h.prompt })] }, h.id)))] })] }), _jsxs("div", { className: "flex-1 flex flex-col min-w-0 border-r", style: { borderColor: dark ? 'rgba(255,255,255,0.08)' : '#e5e7eb' }, children: [_jsx(AnimatePresence, { children: mode === 'tools' && (_jsx(motion.div, { initial: { height: 0, opacity: 0 }, animate: { height: 'auto', opacity: 1 }, exit: { height: 0, opacity: 0 }, className: cn('flex-shrink-0 border-b overflow-hidden', dark ? 'border-z-border' : 'border-z-border'), children: _jsx("div", { className: "p-3 flex gap-2 flex-wrap", children: TOOLS.map(tool => (_jsxs("button", { onClick: () => { setActiveTool(tool.id); setResult(null); }, title: tool.desc, className: cn('flex items-center gap-2 px-3 py-2 text-[9px] font-black uppercase tracking-widest border transition-all', activeTool === tool.id
+                                                ? (dark ? 'bg-white text-black border-white' : 'bg-gray-900 text-white border-gray-900')
+                                                : (dark ? 'border-z-border text-z-secondary hover:text-white hover:border-white/20' : 'border-z-border text-z-secondary hover:border-gray-400 hover:text-z-primary')), children: [_jsx(tool.icon, { size: 11, className: activeTool === tool.id ? '' : tool.color }), tool.name] }, tool.id))) }) })) }), _jsxs("div", { className: "flex-1 flex flex-col overflow-hidden", children: [_jsxs("div", { className: cn('flex-shrink-0 flex items-center gap-3 px-5 py-3 border-b', dark ? 'border-z-border' : 'border-z-border'), children: [_jsx(Terminal, { size: 12, className: "text-z-secondary" }), _jsx("span", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-z-secondary", children: mode === 'architect' ? 'Schema Prompt' : mode === 'writer' ? 'Content Prompt' : TOOLS.find(t => t.id === activeTool)?.name }), _jsx("span", { className: "ml-auto text-[8px] text-gray-600 uppercase tracking-widest hidden sm:block", children: "\u2318 + Enter to run" })] }), _jsx("textarea", { ref: textareaRef, value: prompt, onChange: e => setPrompt(e.target.value), onKeyDown: handleKeyDown, placeholder: activePlaceholder, className: cn('flex-1 w-full p-5 text-sm outline-none resize-none font-sans leading-relaxed', dark
+                                            ? 'bg-transparent text-white placeholder:text-gray-700'
+                                            : 'bg-transparent text-z-primary placeholder:text-z-muted') }), _jsx("div", { className: cn('flex-shrink-0 p-4 border-t', dark ? 'border-z-border' : 'border-z-border'), children: _jsxs("div", { className: "flex items-center gap-3", children: [prompt.trim() && (_jsx("button", { onClick: () => { setPrompt(''); setResult(null); }, className: "p-2.5 text-gray-600 hover:text-white transition-colors border border-transparent hover:border-white/10", title: "Clear", children: _jsx(RotateCcw, { size: 14 }) })), _jsx("button", { onClick: handleExecute, disabled: loading || (!prompt.trim() && activeTool !== 'alt'), className: cn('flex-1 py-3 font-black uppercase tracking-widest text-[10px] transition-all flex items-center justify-center gap-2.5', 'bg-z-accent hover:opacity-90 text-white', 'disabled:opacity-40 disabled:cursor-not-allowed', 'shadow-sm hover:shadow-sm'), children: loading
+                                                        ? _jsxs(_Fragment, { children: [_jsx(Loader2, { size: 13, className: "animate-spin" }), " Generating\u2026"] })
+                                                        : _jsxs(_Fragment, { children: [_jsx(Send, { size: 13 }), " ", mode === 'architect' ? 'Design Schema' : mode === 'writer' ? 'Generate Content' : 'Analyze'] }) })] }) })] })] }), _jsxs("div", { className: "flex-1 flex flex-col min-w-0", children: [_jsxs("div", { className: cn('flex-shrink-0 flex items-center justify-between px-5 py-3 border-b', dark ? 'border-z-border' : 'border-z-border'), children: [_jsxs("div", { className: "flex items-center gap-2.5", children: [_jsx(Sparkles, { size: 12, className: result ? 'text-z-active-text' : 'text-z-secondary' }), _jsx("span", { className: "text-[8px] font-black uppercase tracking-[0.3em] text-z-secondary", children: "Output" }), result && _jsx("div", { className: "w-1.5 h-1.5 rounded-full bg-z-accent shadow-sm" })] }), result && (_jsxs("div", { className: "flex items-center gap-1", children: [_jsx("button", { onClick: copyResult, title: "Copy", className: "p-2 text-z-secondary hover:text-white transition-colors border border-transparent hover:border-white/10", children: _jsx(Copy, { size: 13 }) }), _jsx("button", { onClick: downloadResult, title: "Download", className: "p-2 text-z-secondary hover:text-white transition-colors border border-transparent hover:border-white/10", children: _jsx(Download, { size: 13 }) }), mode === 'architect' && (_jsx("button", { onClick: () => { setResult(null); setSchemaForSave(null); }, title: "Clear", className: "p-2 text-z-secondary hover:text-white transition-colors border border-transparent hover:border-white/10", children: _jsx(RotateCcw, { size: 13 }) }))] }))] }), _jsx("div", { className: "flex-1 overflow-auto p-6", children: loading ? (_jsxs("div", { className: "h-full flex flex-col items-center justify-center gap-4", children: [_jsxs("div", { className: "relative", children: [_jsx(Loader2, { size: 32, className: "animate-spin text-z-active-text" }), _jsx("div", { className: "absolute inset-0 blur-xl bg-z-accent/20 animate-pulse" })] }), _jsx("p", { className: "text-[9px] font-black uppercase tracking-[0.4em] text-z-secondary animate-pulse", children: mode === 'architect' ? 'Designing Schema…' : mode === 'writer' ? 'Writing Content…' : 'Analyzing…' })] })) : !result ? (_jsxs("div", { className: "h-full flex flex-col items-center justify-center gap-5 opacity-30", children: [_jsx(Cpu, { size: 40, className: "text-z-secondary" }), _jsxs("div", { className: "text-center space-y-1", children: [_jsx("p", { className: "text-[9px] font-black uppercase tracking-[0.4em] text-z-secondary", children: "Awaiting Input" }), _jsx("p", { className: "text-[8px] text-gray-600 uppercase tracking-widest", children: mode === 'architect' ? 'Describe a collection to generate a schema' : mode === 'writer' ? 'Write a prompt to generate content' : 'Paste content to analyze' })] })] })) : (_jsx(AnimatePresence, { mode: "wait", children: _jsx(motion.div, { initial: { opacity: 0, y: 6 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.2 }, children: renderResult() }, JSON.stringify(result).substring(0, 50)) })) }), _jsx(AnimatePresence, { children: result && mode === 'architect' && schemaForSave && (_jsx(motion.div, { initial: { height: 0, opacity: 0 }, animate: { height: 'auto', opacity: 1 }, exit: { height: 0, opacity: 0 }, className: cn('flex-shrink-0 border-t overflow-hidden', dark ? 'border-z-border' : 'border-z-border'), children: _jsxs("div", { className: "px-5 py-3 flex items-center justify-between gap-3", children: [_jsx("p", { className: "text-[8px] text-z-secondary uppercase tracking-widest", children: "Schema looks good? Save it as a live collection." }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("button", { onClick: () => {
+                                                            const text = JSON.stringify(schemaForSave, null, 2);
+                                                            navigator.clipboard.writeText(text);
+                                                            toast.success('Schema copied as JSON');
+                                                        }, className: cn('px-4 py-2 border text-[9px] font-black uppercase tracking-widest flex items-center gap-2 transition-all', dark ? 'border-z-border text-z-muted hover:text-white hover:border-white/20' : 'border-z-border text-z-secondary hover:border-gray-400'), children: [_jsx(Code2, { size: 11 }), " Copy JSON"] }), _jsxs("button", { onClick: saveSchemaToDb, disabled: savingSchema, className: "px-5 py-2 bg-z-accent hover:opacity-90 text-white text-[9px] font-black uppercase tracking-widest flex items-center gap-2 transition-all disabled:opacity-50 shadow-sm", children: [savingSchema ? _jsx(Loader2, { size: 11, className: "animate-spin" }) : _jsx(Save, { size: 11 }), "Save Collection"] })] })] }) })) })] })] })] }));
+};
+export default AIWriterPage;

package/dist/SettingsAi.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface SettingsAiProps {
+    settings: Record<string, any>;
+    setSettings: (s: any) => void;
+    theme: 'light' | 'dark';
+}
+declare const SettingsAi: React.FC<SettingsAiProps>;
+export default SettingsAi;

package/dist/SettingsAi.js

@@ -0,0 +1,245 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Lock, Loader2, CheckCircle2, AlertCircle, ExternalLink, Eye, EyeOff, Cpu, Zap, ChevronRight, Info, TestTube2 } from 'lucide-react';
+import { cn } from '../../lib/utils';
+import api from '../../lib/api';
+import toast from 'react-hot-toast';
+const PROVIDERS = [
+    {
+        id: 'openrouter',
+        name: 'OpenRouter',
+        color: 'text-z-active-text',
+        description: 'Unified gateway to 200+ models from any provider via one API key',
+        docsUrl: 'https://openrouter.ai/keys',
+        keyPlaceholder: 'sk-or-v1-...',
+        keyField: 'openRouterApiKey',
+        badge: 'Recommended',
+        models: [
+            { value: 'anthropic/claude-3.5-sonnet', label: 'Claude 3.5 Sonnet', tier: 'pro' },
+            { value: 'anthropic/claude-3.5-haiku', label: 'Claude 3.5 Haiku', tier: 'pro' },
+            { value: 'anthropic/claude-3-opus', label: 'Claude 3 Opus', tier: 'ultra' },
+            { value: 'openai/gpt-4o', label: 'GPT-4o', tier: 'pro' },
+            { value: 'openai/gpt-4o-mini', label: 'GPT-4o Mini', tier: 'free' },
+            { value: 'openai/gpt-4-turbo', label: 'GPT-4 Turbo', tier: 'pro' },
+            { value: 'google/gemini-pro-1.5', label: 'Gemini 1.5 Pro', tier: 'pro' },
+            { value: 'google/gemini-flash-1.5', label: 'Gemini 1.5 Flash', tier: 'free' },
+            { value: 'meta-llama/llama-3.3-70b-instruct', label: 'Llama 3.3 70B', tier: 'free' },
+            { value: 'mistralai/mistral-large', label: 'Mistral Large', tier: 'pro' },
+            { value: 'mistralai/mixtral-8x7b-instruct', label: 'Mixtral 8x7B', tier: 'free' },
+            { value: 'deepseek/deepseek-r1', label: 'DeepSeek R1', tier: 'pro' },
+            { value: 'x-ai/grok-beta', label: 'Grok Beta', tier: 'pro' },
+            { value: 'cohere/command-r-plus', label: 'Cohere Command R+', tier: 'pro' },
+            { value: 'perplexity/llama-3.1-sonar-large-128k-online', label: 'Perplexity Sonar Large', tier: 'pro' },
+        ],
+    },
+    {
+        id: 'openai',
+        name: 'OpenAI',
+        color: 'text-z-active-text',
+        description: 'Direct access to GPT-4o, o1, and all OpenAI models',
+        docsUrl: 'https://platform.openai.com/api-keys',
+        keyPlaceholder: 'sk-proj-...',
+        keyField: 'openaiApiKey',
+        models: [
+            { value: 'gpt-4o', label: 'GPT-4o', tier: 'pro' },
+            { value: 'gpt-4o-mini', label: 'GPT-4o Mini', tier: 'free' },
+            { value: 'gpt-4-turbo', label: 'GPT-4 Turbo', tier: 'pro' },
+            { value: 'o1-preview', label: 'o1 Preview', tier: 'ultra' },
+            { value: 'o1-mini', label: 'o1 Mini', tier: 'pro' },
+            { value: 'o3-mini', label: 'o3 Mini', tier: 'pro' },
+        ],
+    },
+    {
+        id: 'anthropic',
+        name: 'Anthropic',
+        color: 'text-orange-400',
+        description: 'Direct access to Claude models with vision and context support',
+        docsUrl: 'https://console.anthropic.com/settings/keys',
+        keyPlaceholder: 'sk-ant-...',
+        keyField: 'anthropicApiKey',
+        models: [
+            { value: 'claude-3-5-sonnet-20241022', label: 'Claude 3.5 Sonnet', tier: 'pro' },
+            { value: 'claude-3-5-haiku-20241022', label: 'Claude 3.5 Haiku', tier: 'free' },
+            { value: 'claude-3-opus-20240229', label: 'Claude 3 Opus', tier: 'ultra' },
+        ],
+    },
+    {
+        id: 'google',
+        name: 'Google Gemini',
+        color: 'text-z-active-text',
+        description: 'Gemini Pro/Flash with long context and multimodal capabilities',
+        docsUrl: 'https://aistudio.google.com/app/apikey',
+        keyPlaceholder: 'AIza...',
+        keyField: 'googleApiKey',
+        models: [
+            { value: 'gemini-1.5-pro-latest', label: 'Gemini 1.5 Pro', tier: 'pro' },
+            { value: 'gemini-1.5-flash-latest', label: 'Gemini 1.5 Flash', tier: 'free' },
+            { value: 'gemini-2.0-flash-exp', label: 'Gemini 2.0 Flash', tier: 'pro' },
+        ],
+    },
+    {
+        id: 'groq',
+        name: 'Groq',
+        color: 'text-pink-400',
+        description: 'Ultra-fast inference with LPU hardware — 800+ tokens/sec',
+        docsUrl: 'https://console.groq.com/keys',
+        keyPlaceholder: 'gsk_...',
+        keyField: 'groqApiKey',
+        badge: 'Fastest',
+        models: [
+            { value: 'llama-3.3-70b-versatile', label: 'Llama 3.3 70B', tier: 'free' },
+            { value: 'llama-3.1-8b-instant', label: 'Llama 3.1 8B Instant', tier: 'free' },
+            { value: 'mixtral-8x7b-32768', label: 'Mixtral 8x7B', tier: 'free' },
+            { value: 'gemma2-9b-it', label: 'Gemma 2 9B', tier: 'free' },
+        ],
+    },
+    {
+        id: 'nvidia',
+        name: 'NVIDIA NIM',
+        color: 'text-green-400',
+        description: 'NVIDIA-hosted models with GPU-accelerated inference',
+        docsUrl: 'https://build.nvidia.com/explore/discover',
+        keyPlaceholder: 'nvapi-...',
+        keyField: 'nvidiaApiKey',
+        models: [
+            { value: 'meta/llama-3.1-405b-instruct', label: 'Llama 3.1 405B', tier: 'ultra' },
+            { value: 'meta/llama-3.1-70b-instruct', label: 'Llama 3.1 70B', tier: 'pro' },
+            { value: 'meta/llama-3.1-8b-instruct', label: 'Llama 3.1 8B', tier: 'free' },
+            { value: 'mistralai/mistral-large-2-instruct', label: 'Mistral Large 2', tier: 'pro' },
+            { value: 'nvidia/llama-3.1-nemotron-70b-instruct', label: 'Nemotron 70B', tier: 'pro' },
+        ],
+    },
+    {
+        id: 'together',
+        name: 'Together AI',
+        color: 'text-yellow-400',
+        description: 'Open-source models on fast distributed inference infrastructure',
+        docsUrl: 'https://api.together.xyz/settings/api-keys',
+        keyPlaceholder: 'together-...',
+        keyField: 'togetherApiKey',
+        models: [
+            { value: 'meta-llama/Llama-3.3-70B-Instruct-Turbo', label: 'Llama 3.3 70B Turbo', tier: 'pro' },
+            { value: 'mistralai/Mixtral-8x7B-Instruct-v0.1', label: 'Mixtral 8x7B', tier: 'free' },
+            { value: 'deepseek-ai/DeepSeek-R1', label: 'DeepSeek R1', tier: 'pro' },
+        ],
+    },
+    {
+        id: 'mistral',
+        name: 'Mistral AI',
+        color: 'text-amber-400',
+        description: 'Direct access to Mistral, Codestral, and Pixtral models',
+        docsUrl: 'https://console.mistral.ai/api-keys',
+        keyPlaceholder: 'mistral-...',
+        keyField: 'mistralApiKey',
+        models: [
+            { value: 'mistral-large-latest', label: 'Mistral Large', tier: 'pro' },
+            { value: 'mistral-small-latest', label: 'Mistral Small', tier: 'free' },
+            { value: 'codestral-latest', label: 'Codestral', tier: 'pro' },
+            { value: 'pixtral-large-latest', label: 'Pixtral Large', tier: 'ultra' },
+        ],
+    },
+    {
+        id: 'cohere',
+        name: 'Cohere',
+        color: 'text-teal-400',
+        description: 'Enterprise-grade models optimized for search and RAG workflows',
+        docsUrl: 'https://dashboard.cohere.com/api-keys',
+        keyPlaceholder: 'co_...',
+        keyField: 'cohereApiKey',
+        models: [
+            { value: 'command-r-plus', label: 'Command R+', tier: 'ultra' },
+            { value: 'command-r', label: 'Command R', tier: 'pro' },
+            { value: 'command-light', label: 'Command Light', tier: 'free' },
+        ],
+    },
+    {
+        id: 'xai',
+        name: 'xAI / Grok',
+        color: 'text-gray-300',
+        description: "Elon Musk's xAI Grok model with real-time X/Twitter integration",
+        docsUrl: 'https://console.x.ai/',
+        keyPlaceholder: 'xai-...',
+        keyField: 'xaiApiKey',
+        models: [
+            { value: 'grok-beta', label: 'Grok Beta', tier: 'pro' },
+            { value: 'grok-vision-beta', label: 'Grok Vision Beta', tier: 'pro' },
+        ],
+    },
+];
+const TIER_BADGE = {
+    free: 'bg-z-active-bg text-z-active-text border-z-accent/20',
+    pro: 'bg-z-accent/10 text-z-active-text border-z-accent/20',
+    ultra: 'bg-purple-500/10 text-purple-400 border-purple-500/20',
+};
+const SettingsAi = ({ settings, setSettings, theme }) => {
+    const dark = theme === 'dark';
+    const [validating, setValidating] = useState(false);
+    const [testResult, setTestResult] = useState(null);
+    const [showKeys, setShowKeys] = useState({});
+    const [expandedProvider, setExpandedProvider] = useState('openrouter');
+    const [dynamicModels, setDynamicModels] = useState({});
+    const [fetchingModels, setFetchingModels] = useState(null);
+    const activeProvider = PROVIDERS.find(p => {
+        const key = settings[p.keyField]?.trim();
+        return key && key !== '[MASKED_CREDENTIAL]';
+    }) || PROVIDERS.find(p => p.id === 'openrouter');
+    const handleValidate = async () => {
+        setValidating(true);
+        setTestResult(null);
+        try {
+            const providerId = settings.aiProvider || 'openrouter';
+            const providerConfig = PROVIDERS.find(p => p.id === providerId);
+            const apiKeyField = providerConfig ? providerConfig.keyField : 'openRouterApiKey';
+            const apiKey = settings[apiKeyField];
+            const res = await api.post('/system/settings/ai/validate', {
+                provider: providerId,
+                model: settings.aiModel,
+                apiKey: apiKey
+            });
+            setTestResult({ ok: true, msg: res.data.message || 'API Key is valid' });
+            toast.success('AI connection verified');
+        }
+        catch (err) {
+            const msg = err?.response?.data?.error?.message || err?.response?.data?.message || 'Connection failed';
+            setTestResult({ ok: false, msg });
+            toast.error('AI connection failed');
+        }
+        finally {
+            setValidating(false);
+        }
+    };
+    const handleFetchModels = async (providerId, apiKeyField) => {
+        setFetchingModels(providerId);
+        try {
+            const apiKey = settings[apiKeyField];
+            const res = await api.post('/system/settings/ai/models', {
+                provider: providerId,
+                apiKey: apiKey
+            });
+            const models = res.data?.data || [];
+            setDynamicModels(prev => ({ ...prev, [providerId]: models }));
+            toast.success(`Fetched ${models.length} models for ${providerId}`);
+        }
+        catch (err) {
+            const msg = err?.response?.data?.error?.message || err?.response?.data?.message || 'Failed to fetch models';
+            toast.error(msg);
+        }
+        finally {
+            setFetchingModels(null);
+        }
+    };
+    const toggleKey = (id) => setShowKeys(prev => ({ ...prev, [id]: !prev[id] }));
+    const inp = (dark) => cn('w-full border px-3 py-2.5 text-sm font-semibold outline-none transition-colors rounded-none focus-visible:ring-2 focus-visible:ring-z-active-border focus-visible:ring-offset-1 focus-visible:ring-offset-black', dark
+        ? 'bg-black border-z-border text-white placeholder:text-gray-700 focus:border-z-accent'
+        : 'bg-z-panel border-z-border text-z-primary placeholder:text-z-muted focus:border-z-accent');
+    return (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: cn('p-5 border space-y-4 shadow-sm', dark ? 'bg-z-panel backdrop-blur-md border-z-border' : 'bg-z-input border-z-border'), children: [_jsxs("div", { className: "flex items-center gap-2.5", children: [_jsx(Cpu, { size: 14, className: "text-z-active-text" }), _jsx("span", { className: cn('text-sm font-semibold  ', dark ? 'text-white' : 'text-z-primary'), children: "Active Model" }), _jsx("span", { className: "ml-auto text-sm text-z-secondary", children: "Used by all AI features" })] }), _jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-3", children: [_jsxs("div", { className: "space-y-1.5", children: [_jsx("label", { className: "text-sm font-semibold text-z-secondary", children: "AI Provider" }), _jsx("select", { value: settings.aiProvider || 'openrouter', onChange: e => setSettings({ ...settings, aiProvider: e.target.value, aiModel: PROVIDERS.find(p => p.id === e.target.value)?.models[0]?.value || '' }), className: inp(dark), children: PROVIDERS.map(p => _jsx("option", { value: p.id, children: p.name }, p.id)) })] }), _jsxs("div", { className: "space-y-1.5", children: [_jsx("label", { className: "text-sm font-semibold text-z-secondary", children: "Model" }), _jsx("select", { value: settings.aiModel || '', onChange: e => setSettings({ ...settings, aiModel: e.target.value }), className: inp(dark), children: (dynamicModels[settings.aiProvider || 'openrouter'] || PROVIDERS.find(p => p.id === (settings.aiProvider || 'openrouter'))?.models || []).map(m => (_jsxs("option", { value: m.value, children: [m.label, " ", m.tier ? `(${m.tier})` : ''] }, m.value))) })] })] }), _jsxs("div", { className: "flex items-center gap-3 pt-1", children: [_jsxs("button", { onClick: handleValidate, disabled: validating, className: "px-4 py-2 bg-z-accent hover:opacity-90 shadow-sm text-white text-sm font-semibold flex items-center gap-2 disabled:opacity-50 transition-all", children: [validating ? _jsx(Loader2, { size: 11, className: "animate-spin" }) : _jsx(TestTube2, { size: 11 }), "Test Connection"] }), testResult && (_jsxs("div", { className: cn('flex items-center gap-2 text-sm font-semibold  ', testResult.ok ? 'text-z-active-text' : 'text-red-400'), children: [testResult.ok ? _jsx(CheckCircle2, { size: 11 }) : _jsx(AlertCircle, { size: 11 }), testResult.msg] }))] })] }), _jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "flex items-center gap-2 mb-3", children: [_jsx(Lock, { size: 12, className: "text-z-secondary" }), _jsx("span", { className: "text-sm font-semibold text-z-secondary", children: "Provider API Keys" }), _jsx("span", { className: "ml-auto text-sm text-gray-600", children: "All keys encrypted at rest" })] }), PROVIDERS.map(provider => {
+                        const isExpanded = expandedProvider === provider.id;
+                        const keyValue = settings[provider.keyField] || '';
+                        const hasKey = keyValue.trim() && keyValue !== '[MASKED_CREDENTIAL]';
+                        const isMasked = keyValue === '[MASKED_CREDENTIAL]';
+                        return (_jsxs("div", { className: cn('border transition-all shadow-sm', isExpanded
+                                ? (dark ? 'border-white/15 bg-black/80 backdrop-blur-md shadow-sm' : 'border-z-border-strong bg-white')
+                                : ('z-card-interactive')), children: [_jsxs("button", { onClick: () => setExpandedProvider(isExpanded ? '' : provider.id), className: "w-full flex items-center gap-3 px-4 py-3 text-left", children: [_jsxs("div", { className: "flex items-center gap-3 flex-1 min-w-0", children: [_jsx("div", { className: cn('w-2 h-2 rounded-full flex-shrink-0', hasKey || isMasked ? 'bg-z-accent shadow-sm' : 'bg-gray-700') }), _jsx("div", { className: cn('text-sm font-semibold', provider.color), children: provider.name }), provider.badge && (_jsx("span", { className: "text-sm font-semibold px-1.5 py-0.5 bg-z-active-bg border border-z-active-border text-z-active-text", children: provider.badge })), _jsx("span", { className: "text-sm text-gray-600 truncate hidden sm:block", children: provider.description })] }), _jsxs("div", { className: "flex items-center gap-2 flex-shrink-0", children: [isMasked && _jsx("span", { className: "text-sm text-z-active-text font-semibold", children: "Configured" }), hasKey && !isMasked && _jsx("span", { className: "text-sm text-z-active-text font-semibold", children: "Active" }), _jsx(ChevronRight, { size: 12, className: cn('text-z-secondary transition-transform', isExpanded && 'rotate-90') })] })] }), isExpanded && (_jsxs("div", { className: "px-4 pb-4 space-y-3 border-t", style: { borderColor: dark ? 'rgba(255,255,255,0.06)' : 'rgba(0,0,0,0.06)' }, children: [_jsx("p", { className: "text-sm text-z-secondary pt-3", children: provider.description }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("label", { className: "text-sm font-semibold text-z-secondary", children: "API Key" }), _jsxs("a", { href: provider.docsUrl, target: "_blank", rel: "noopener noreferrer", className: "text-sm text-z-active-text hover:text-z-active-text flex items-center gap-1 transition-colors", children: ["Get Key ", _jsx(ExternalLink, { size: 9 })] })] }), _jsxs("div", { className: "relative", children: [_jsx("input", { type: showKeys[provider.id] ? 'text' : 'password', value: keyValue, onChange: e => setSettings({ ...settings, [provider.keyField]: e.target.value }), placeholder: isMasked ? '••••••••••••••••' : provider.keyPlaceholder, className: cn(inp(dark), 'pr-10 font-mono') }), _jsx("button", { type: "button", onClick: () => toggleKey(provider.id), className: "absolute right-3 top-1/2 -translate-y-1/2 text-z-secondary hover:text-white transition-colors", children: showKeys[provider.id] ? _jsx(EyeOff, { size: 13 }) : _jsx(Eye, { size: 13 }) })] }), isMasked && (_jsxs("p", { className: "text-sm text-amber-500/70 flex items-center gap-1", children: [_jsx(Lock, { size: 9 }), " Key is stored \u2014 enter a new value to replace it"] }))] }), _jsxs("div", { className: "space-y-1.5", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("label", { className: "text-sm font-semibold text-z-secondary", children: ["Available Models ", dynamicModels[provider.id] ? `(${dynamicModels[provider.id].length})` : ''] }), _jsxs("button", { type: "button", onClick: () => handleFetchModels(provider.id, provider.keyField), disabled: fetchingModels === provider.id || (!hasKey && !isMasked), className: "text-sm text-z-active-text hover:text-z-active-text flex items-center gap-1 disabled:opacity-50 transition-colors", children: [fetchingModels === provider.id ? _jsx(Loader2, { size: 9, className: "animate-spin" }) : _jsx(Zap, { size: 9 }), "Fetch Models"] })] }), _jsx("div", { className: "flex flex-wrap gap-1.5 max-h-[120px] overflow-y-auto pr-2 custom-scrollbar", children: (dynamicModels[provider.id] || provider.models).map(m => (_jsx("span", { title: m.value, className: cn('text-sm font-semibold   px-2 py-1 border', m.tier ? TIER_BADGE[m.tier] : 'bg-z-hover border-white/10 text-z-muted'), children: m.label }, m.value))) })] })] }))] }, provider.id));
+                    })] }), _jsxs("div", { className: cn('flex gap-3 p-4 border', dark ? 'bg-z-accent/5 border-z-accent/15' : 'bg-z-active-bg border-z-active-border'), children: [_jsx(Info, { size: 12, className: "text-z-active-text flex-shrink-0 mt-0.5" }), _jsxs("div", { className: "space-y-1", children: [_jsx("p", { className: "text-sm font-semibold text-z-active-text", children: "Provider Priority" }), _jsx("p", { className: "text-sm text-z-secondary leading-relaxed", children: "The AI engine auto-selects providers in this order: OpenRouter \u2192 xAI \u2192 NVIDIA NIM \u2192 Groq \u2192 Together AI \u2192 Mistral \u2192 Cohere \u2192 OpenAI \u2192 Anthropic \u2192 Google Gemini. Set the \"Active Model\" above to override. Keys are never sent to the client." })] })] })] }));
+};
+export default SettingsAi;

package/dist/admin/src/components/ui/PageHeader.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+export interface PageHeaderProps {
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    icon?: React.ReactNode;
+    actions?: React.ReactNode;
+    className?: string;
+    backLink?: {
+        to: string;
+        label: string;
+    };
+    breadcrumbs?: any;
+}
+export declare function PageHeader({ title, description, icon, actions, className, backLink }: PageHeaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/admin/src/components/ui/PageHeader.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { cn } from '../../lib/utils';
+import { useTheme } from '../../context/ThemeContext';
+export function PageHeader({ title, description, icon, actions, className, backLink }) {
+    const { theme } = useTheme();
+    return (_jsxs("div", { className: cn("px-6 py-4 border-b flex items-center justify-between transition-colors", theme === 'dark' ? 'bg-[var(--z-bg-modal)] backdrop-blur-md border-z-border' : 'bg-z-panel/80 backdrop-blur-md border-z-border', className), children: [_jsxs("div", { className: "flex items-center gap-4", children: [backLink && (_jsx("a", { href: backLink.to, className: "flex items-center justify-center p-2 rounded-none border border-transparent hover:border-z-border hover:bg-z-hover transition-all text-z-secondary", children: _jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "lucide lucide-arrow-left", children: [_jsx("path", { d: "m12 19-7-7 7-7" }), _jsx("path", { d: "M19 12H5" })] }) })), icon && (_jsx("div", { className: cn("p-2.5 rounded-none-none border", theme === 'dark' ? 'bg-z-panel border-z-border text-z-active-text' : 'bg-z-input border-z-border text-z-accent'), children: icon })), _jsxs("div", { children: [_jsx("h1", { className: cn("text-xl font-semibold   leading-none", 'text-z-primary'), children: title }), description && (_jsx("p", { className: cn("text-xs mt-1", theme === 'dark' ? 'text-z-muted' : 'text-z-secondary'), children: description }))] })] }), actions && (_jsx("div", { className: "flex items-center gap-3", children: actions }))] }));
+}

package/dist/admin/src/context/ThemeContext.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+type Theme = 'light' | 'dark';
+interface ThemeContextType {
+    theme: Theme;
+    toggleTheme: () => void;
+    setTheme: (theme: Theme) => void;
+}
+export declare const ThemeProvider: React.FC<{
+    children: React.ReactNode;
+}>;
+export declare const useTheme: () => ThemeContextType;
+export {};

package/dist/admin/src/context/ThemeContext.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useEffect, useState } from 'react';
+const ThemeContext = createContext(undefined);
+export const ThemeProvider = ({ children }) => {
+    const [theme, setThemeState] = useState(localStorage.getItem('zenith_theme') || 'dark');
+    useEffect(() => {
+        const root = window.document.documentElement;
+        root.classList.remove('light', 'dark');
+        root.classList.add(theme);
+        localStorage.setItem('zenith_theme', theme);
+    }, [theme]);
+    const setTheme = (newTheme) => {
+        setThemeState(newTheme);
+    };
+    const toggleTheme = () => {
+        setThemeState(prev => prev === 'dark' ? 'light' : 'dark');
+    };
+    return (_jsx(ThemeContext.Provider, { value: { theme, toggleTheme, setTheme }, children: children }));
+};
+export const useTheme = () => {
+    const context = useContext(ThemeContext);
+    if (!context)
+        throw new Error('useTheme must be used within ThemeProvider');
+    return context;
+};

package/dist/admin/src/lib/ApiError.d.ts

@@ -0,0 +1,41 @@
+/**
+ * Unified, typed error for all API-layer failures.
+ *
+ * Every `api` call throws `ApiError` on failure, so callers can catch
+ * with predictable properties instead of casting `unknown` / `any`.
+ *
+ * ```ts
+ * import api from './api'
+ * import { ApiError } from './ApiError'
+ *
+ * try {
+ * await api.post('/collections', data)
+ * } catch (err) {
+ * if (err instanceof ApiError) {
+ * console.error((err as { status?: number }).status, (err as { code?: string }).code, (err instanceof Error ? err.message : String(err)))
+ * }
+ * }
+ * ```
+ */
+export declare class ApiError extends Error {
+    /** HTTP status code, or 0 for network/tenant errors */
+    status: number;
+    /** Machine-readable short code: 'ERR_NETWORK', 'ERR_NO_TENANT', 'ERR_CSRF', etc. */
+    code: string;
+    /** The raw response payload (if any) */
+    response?: {
+        data: any;
+        status: number;
+        headers?: Headers;
+    };
+    constructor(opts: {
+        message: string;
+        status?: number;
+        code?: string;
+        response?: {
+            data: any;
+            status: number;
+            headers?: Headers;
+        };
+    });
+}