@kyro-cms/admin 0.8.0 → 0.9.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kyro-cms/admin",
-  "version": "0.8.0",
+  "version": "0.9.1",
   "engines": {
     "node": ">=22"
   },
@@ -77,12 +77,19 @@
     "@dnd-kit/utilities": "^3.2.2",
     "@graphiql/react": "^0.37.3",
     "@kyro-cms/core": "file:..",
-    "@portabletext/editor": "^6.6.3",
-    "@portabletext/react": "^6.0.3",
-    "@portabletext/schema": "^2.1.1",
-    "@portabletext/toolbar": "^7.0.26",
-    "@portabletext/types": "^4.0.2",
     "@tailwindcss/vite": "^4.0.0",
+    "@tiptap/extension-color": "^3.23.6",
+    "@tiptap/extension-highlight": "^3.23.6",
+    "@tiptap/extension-image": "^3.23.6",
+    "@tiptap/extension-link": "^3.23.6",
+    "@tiptap/extension-task-item": "^3.23.6",
+    "@tiptap/extension-task-list": "^3.23.6",
+    "@tiptap/extension-text-align": "^3.23.6",
+    "@tiptap/extension-text-style": "^3.23.6",
+    "@tiptap/extension-underline": "^3.23.6",
+    "@tiptap/pm": "^3.23.6",
+    "@tiptap/react": "^3.23.6",
+    "@tiptap/starter-kit": "^3.23.6",
     "@types/pg": "^8.20.0",
     "@uiw/codemirror-theme-aura": "^4.25.9",
     "@uiw/codemirror-theme-dracula": "^4.25.9",
@@ -96,14 +103,11 @@
     "lucide-react": "^0.475.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "react-icons": "^5.0.0",
     "react-image-crop": "^11.0.10",
-    "slate": "^0.124.1",
-    "slate-history": "^0.113.1",
-    "slate-react": "^0.124.0",
     "swup": "^4.9.0",
     "tailwindcss": "^4.0.0",
     "unstorage": "^1.17.5",
+    "use-sync-external-store": "1.5.0",
     "zustand": "^5.0.3"
   },
   "devDependencies": {
@@ -111,7 +115,7 @@
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "dotenv-cli": "^11.0.0",
-    "tsup": "^6.0.0",
+    "tsup": "^8.5.1",
     "typescript": "^5.7.3",
     "vitest": "^4.1.4"
   },

package/src/components/ActionBar.tsx

@@ -170,7 +170,7 @@ export function ActionBar({
           <button type="button"
             onClick={onPublish}
             disabled={saveStatus === "saving"}
-            className="bg-[var(--kyro-primary)] hover:opacity-90 text-white kyro-btn-md flex items-center gap-2"
+            className="kyro-btn-success hover:opacity-90 kyro-btn-md flex items-center gap-2"
           >
             <svg
               width="16"
@@ -204,19 +204,32 @@ export function ActionBar({
             Unpublish
           </button>
         )}
-        <button type="button"
-          onClick={onSave}
-          disabled={
-            saveStatus === "saving" || (!hasChanges && saveStatus !== "error")
-          }
-          className={getSaveButtonClass()}
-        >
-          {saveStatus === "saving"
-            ? "Saving..."
-            : saveStatus === "saved"
-              ? "Saved"
-              : "Save"}
-        </button>
+        {status === "published" && !hasChanges && saveStatus !== "saving" && saveStatus !== "error" ? (
+          <span className="inline-flex items-center gap-1.5 px-4 py-2 rounded-lg text-[11px] font-bold tracking-widest bg-green-100 text-green-700 border border-green-200 cursor-not-allowed shadow-sm">
+            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5">
+              <path d="M22 2L11 13M22 2l-7 20-4-9-9-4 20-7z" />
+            </svg>
+            Published
+          </span>
+        ) : (
+          <button type="button"
+            onClick={onSave}
+            disabled={
+              saveStatus === "saving" || (!hasChanges && saveStatus !== "error")
+            }
+            className={getSaveButtonClass()}
+          >
+            {saveStatus === "saving"
+              ? "Saving..."
+              : saveStatus === "saved"
+                ? "Saved"
+                : hasChanges && status === "published"
+                  ? "Save Draft"
+                  : status === "draft" && hasChanges
+                    ? "Save Draft"
+                    : "Save"}
+          </button>
+        )}
 
         <Dropdown
           trigger={

package/src/components/Admin.tsx

@@ -158,7 +158,7 @@ const toasts = useToastStore((state) => state.toasts);
             collection={collection}
             documentId={activeDocumentId}
             onBack={() => setCurrentView("list")}
-            onSave={() => toast.success("Changes saved")}
+            onSave={() => {}}
             onError={(msg) => toast.error(msg)}
           />
         ) : null;

package/src/components/ApiKeysManager.tsx

@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 import { apiPost } from "../lib/api";
 import { useResourceManager } from "../lib/useResourceManager";
-import { useUIStore } from "../lib/stores";
+import { useUIStore, toast } from "../lib/stores";
 import {
   Key, Plus, Trash2, Copy, CheckCircle2, Clock,
   Shield, Zap, AlertTriangle, Info, Terminal,
@@ -65,7 +65,7 @@ export function ApiKeysManager() {
   const [copiedId, setCopiedId] = useState<string | null>(null);
   const [createError, setCreateError] = useState("");
   const [rotatingId, setRotatingId] = useState<string | null>(null);
-  const { alert, confirm: kyroConfirm } = useUIStore();
+  const { confirm: kyroConfirm } = useUIStore();
 
   const handleCreateKey = async () => {
     if (!newKeyName.trim()) { setCreateError("Name is required"); return; }
@@ -92,7 +92,7 @@ export function ApiKeysManager() {
           const rotated = await apiPost<ApiKeyItem>(`/api/keys/${key.id}/rotate`);
           setNewKey(rotated);
         } catch {
-          alert({ title: "Error", message: "Failed to rotate key. Please try again." });
+          toast.error("Failed to rotate key. Please try again.");
         } finally {
           setRotatingId(null);
         }
@@ -287,7 +287,7 @@ export function ApiKeysManager() {
                   <button
                     type="button"
                     onClick={() => copyToClipboard(newKey.key!, newKey.id)}
-                    className="flex items-center justify-center gap-2 px-8 py-4 bg-[var(--kyro-primary)] text-white rounded-2xl font-bold hover:scale-[1.02] active:scale-[0.98] transition-all shadow-lg shadow-[var(--kyro-primary)]/20"
+                    className="kyro-btn kyro-btn-primary flex items-center justify-center gap-2 px-8 py-4 rounded-2xl font-bold hover:scale-[1.02] active:scale-[0.98] transition-all shadow-lg shadow-[var(--kyro-primary)]/20"
                   >
                     {copiedId === newKey.id ? <CheckCircle2 className="w-5 h-5" /> : <Copy className="w-5 h-5" />}
                     <span>{copiedId === newKey.id ? "Copied" : "Copy Key"}</span>
@@ -333,7 +333,7 @@ export function ApiKeysManager() {
               <button
                 type="button"
                 onClick={() => setIsCreateModalOpen(true)}
-                className="inline-flex items-center gap-3 px-8 py-4 bg-[var(--kyro-primary)] text-white rounded-2xl font-bold hover:scale-[1.05] transition-all shadow-xl shadow-[var(--kyro-primary)]/10"
+                className="kyro-btn kyro-btn-primary inline-flex items-center gap-3 px-8 py-4 rounded-2xl font-bold hover:scale-[1.05] transition-all shadow-xl shadow-[var(--kyro-primary)]/10"
               >
                 <Plus className="w-5 h-5" />
                 Generate API Key