@kidecms/core 0.1.7 → 0.1.9

package/admin/components/DocumentActions.tsx

@@ -78,7 +78,13 @@ export default function DocumentActions({
 
   const canDuplicate = !!(showDuplicate && collectionSlug && documentId);
   const hasActions =
-    canDuplicate || showUnpublish || showDiscardDraft || showDelete || showSchedule || showCancelSchedule || versions.length > 0;
+    canDuplicate ||
+    showUnpublish ||
+    showDiscardDraft ||
+    showDelete ||
+    showSchedule ||
+    showCancelSchedule ||
+    versions.length > 0;
   if (!hasActions) return null;
 
   const duplicate = async () => {

package/admin/components/FieldControl.astro

@@ -68,7 +68,7 @@ const isTreeEditor =
 const builtInComponents = new Set(["radio", "taxonomy-select", "menu-items", "taxonomy-terms"]);
 const CustomComponent =
   field.admin?.component && !builtInComponents.has(field.admin.component)
-    ? customFields[field.admin.component] ?? null
+    ? (customFields[field.admin.component] ?? null)
     : null;
 
 // Build serializable block types metadata for BlockEditor
@@ -122,276 +122,239 @@ const blockTypesMeta =
 
   {
     CustomComponent && (
-      <CustomComponent
-        client:load
-        name={name}
-        field={field}
-        value={serializedValue}
-        readOnly={readOnly}
-      />
+      <CustomComponent client:load name={name} field={field} value={serializedValue} readOnly={readOnly} />
     )
   }
 
-  {!CustomComponent && (
-  <Fragment>
-
   {
-    field.type === "image" && !readOnly && (
-      <ImagePicker client:load name={name} value={serializedValue} placeholder={placeholder} />
-    )
-  }
+    !CustomComponent && (
+      <Fragment>
+        {field.type === "image" && !readOnly && (
+          <ImagePicker client:load name={name} value={serializedValue} placeholder={placeholder} />
+        )}
 
-  {
-    field.type === "image" && readOnly && (
-      <Input
-        className={controlClass}
-        type="text"
-        id={name}
-        name={name}
-        defaultValue={serializedValue}
-        placeholder={placeholder}
-        readOnly={readOnly}
-      />
-    )
-  }
+        {field.type === "image" && readOnly && (
+          <Input
+            className={controlClass}
+            type="text"
+            id={name}
+            name={name}
+            defaultValue={serializedValue}
+            placeholder={placeholder}
+            readOnly={readOnly}
+          />
+        )}
 
-  {
-    field.type === "text" && field.admin?.component === "taxonomy-select" && !readOnly && (
-      <TaxonomySelect client:load name={name} value={serializedValue} taxonomySlug={field.admin?.placeholder ?? ""} />
-    )
-  }
+        {field.type === "text" && field.admin?.component === "taxonomy-select" && !readOnly && (
+          <TaxonomySelect
+            client:load
+            name={name}
+            value={serializedValue}
+            taxonomySlug={field.admin?.placeholder ?? ""}
+          />
+        )}
 
-  {
-    (field.type === "text" || field.type === "email" || field.type === "date") &&
-      field.admin?.component !== "taxonomy-select" &&
-      (field.type === "text" && field.admin?.rows ? (
-        <Textarea
-          className={controlClass}
-          id={name}
-          name={name}
-          rows={field.admin.rows}
-          defaultValue={serializedValue}
-          placeholder={placeholder}
-          readOnly={readOnly}
-          required={field.required}
-        />
-      ) : (
-        <Input
-          className={controlClass}
-          type={field.type === "email" ? "email" : field.type === "date" ? "date" : "text"}
-          id={name}
-          name={name}
-          defaultValue={serializedValue}
-          placeholder={placeholder}
-          readOnly={readOnly}
-          required={field.required}
-        />
-      ))
-  }
+        {(field.type === "text" || field.type === "email" || field.type === "date") &&
+          field.admin?.component !== "taxonomy-select" &&
+          (field.type === "text" && field.admin?.rows ? (
+            <Textarea
+              className={controlClass}
+              id={name}
+              name={name}
+              rows={field.admin.rows}
+              defaultValue={serializedValue}
+              placeholder={placeholder}
+              readOnly={readOnly}
+              required={field.required}
+            />
+          ) : (
+            <Input
+              className={controlClass}
+              type={field.type === "email" ? "email" : field.type === "date" ? "date" : "text"}
+              id={name}
+              name={name}
+              defaultValue={serializedValue}
+              placeholder={placeholder}
+              readOnly={readOnly}
+              required={field.required}
+            />
+          ))}
 
-  {
-    field.type === "slug" && (
-      <SlugField
-        client:load
-        name={name}
-        value={serializedValue}
-        from={field.from}
-        readOnly={readOnly}
-        required={field.required}
-        placeholder={placeholder || "auto-generated-slug"}
-        className={controlClass}
-      />
-    )
-  }
+        {field.type === "slug" && (
+          <SlugField
+            client:load
+            name={name}
+            value={serializedValue}
+            from={field.from}
+            readOnly={readOnly}
+            required={field.required}
+            placeholder={placeholder || "auto-generated-slug"}
+            className={controlClass}
+          />
+        )}
 
-  {
-    field.type === "number" && (
-      <Input
-        className={controlClass}
-        type="number"
-        id={name}
-        name={name}
-        defaultValue={serializedValue}
-        inputMode={inputMode}
-        readOnly={readOnly}
-        required={field.required}
-      />
-    )
-  }
+        {field.type === "number" && (
+          <Input
+            className={controlClass}
+            type="number"
+            id={name}
+            name={name}
+            defaultValue={serializedValue}
+            inputMode={inputMode}
+            readOnly={readOnly}
+            required={field.required}
+          />
+        )}
 
-  {field.type === "boolean" && <CheckboxField client:load name={name} checked={Boolean(value)} disabled={readOnly} />}
+        {field.type === "boolean" && (
+          <CheckboxField client:load name={name} checked={Boolean(value)} disabled={readOnly} />
+        )}
 
-  {
-    field.type === "select" && field.admin?.component !== "radio" && (
-      <SelectField
-        client:load
-        name={name}
-        value={String(value ?? "")}
-        placeholder="Select an option"
-        disabled={readOnly}
-        items={field.options.map((option) => ({ value: option, label: option }))}
-      />
-    )
-  }
+        {field.type === "select" && field.admin?.component !== "radio" && (
+          <SelectField
+            client:load
+            name={name}
+            value={String(value ?? "")}
+            placeholder="Select an option"
+            disabled={readOnly}
+            items={field.options.map((option) => ({ value: option, label: option }))}
+          />
+        )}
 
-  {
-    field.type === "select" && field.admin?.component === "radio" && (
-      <div class="flex flex-wrap gap-x-5 gap-y-2 has-disabled:opacity-50">
-        {field.options.map((option) => (
-          <label class="hover:text-foreground flex items-center gap-2 text-sm transition-colors has-disabled:cursor-not-allowed has-disabled:hover:text-current">
-            <input
-              class="border-input hover:border-primary/60 checked:border-primary checked:hover:border-primary focus-visible:ring-ring/50 disabled:hover:border-input size-4 shrink-0 appearance-none rounded-full border transition-all checked:border-[5px] focus-visible:ring-3 focus-visible:outline-none disabled:cursor-not-allowed"
-              type="radio"
-              name={name}
-              value={option}
-              checked={String(value ?? "") === option}
-              disabled={readOnly}
-            />
-            <span class="select-none">{option}</span>
-          </label>
-        ))}
-      </div>
-    )
-  }
+        {field.type === "select" && field.admin?.component === "radio" && (
+          <div class="flex flex-wrap gap-x-5 gap-y-2 has-disabled:opacity-50">
+            {field.options.map((option) => (
+              <label class="hover:text-foreground flex items-center gap-2 text-sm transition-colors has-disabled:cursor-not-allowed has-disabled:hover:text-current">
+                <input
+                  class="border-input hover:border-primary/60 checked:border-primary checked:hover:border-primary focus-visible:ring-ring/50 disabled:hover:border-input size-4 shrink-0 appearance-none rounded-full border transition-all checked:border-[5px] focus-visible:ring-3 focus-visible:outline-none disabled:cursor-not-allowed"
+                  type="radio"
+                  name={name}
+                  value={option}
+                  checked={String(value ?? "") === option}
+                  disabled={readOnly}
+                />
+                <span class="select-none">{option}</span>
+              </label>
+            ))}
+          </div>
+        )}
 
-  {
-    field.type === "relation" && !readOnly && relationMeta && (
-      <RelationField
-        client:load
-        name={name}
-        value={Array.isArray(value) ? JSON.stringify(value) : String(value ?? "")}
-        hasMany={relationMeta.hasMany}
-        options={relationOptions}
-        collectionSlug={relationMeta.collectionSlug}
-        collectionLabel={relationMeta.collectionLabel}
-        labelField={relationMeta.labelField}
-      />
-    )
-  }
+        {field.type === "relation" && !readOnly && relationMeta && (
+          <RelationField
+            client:load
+            name={name}
+            value={Array.isArray(value) ? JSON.stringify(value) : String(value ?? "")}
+            hasMany={relationMeta.hasMany}
+            options={relationOptions}
+            collectionSlug={relationMeta.collectionSlug}
+            collectionLabel={relationMeta.collectionLabel}
+            labelField={relationMeta.labelField}
+          />
+        )}
 
-  {
-    field.type === "relation" && (readOnly || !relationMeta) && (
-      <SelectField
-        client:load
-        name={name}
-        value={String(value ?? "")}
-        placeholder="Select a document"
-        disabled={readOnly}
-        items={relationOptions}
-      />
-    )
-  }
+        {field.type === "relation" && (readOnly || !relationMeta) && (
+          <SelectField
+            client:load
+            name={name}
+            value={String(value ?? "")}
+            placeholder="Select a document"
+            disabled={readOnly}
+            items={relationOptions}
+          />
+        )}
 
-  {
-    field.type === "richText" && !readOnly && (
-      <RichTextEditor client:load name={name} initialValue={value ? JSON.stringify(value) : ""} rows={rows} />
-    )
-  }
+        {field.type === "richText" && !readOnly && (
+          <RichTextEditor client:load name={name} initialValue={value ? JSON.stringify(value) : ""} rows={rows} />
+        )}
 
-  {
-    field.type === "richText" && readOnly && (
-      <Textarea
-        className={controlClass}
-        id={name}
-        name={name}
-        rows={rows}
-        readOnly={readOnly}
-        defaultValue={serializedValue}
-      />
-    )
-  }
+        {field.type === "richText" && readOnly && (
+          <Textarea
+            className={controlClass}
+            id={name}
+            name={name}
+            rows={rows}
+            readOnly={readOnly}
+            defaultValue={serializedValue}
+          />
+        )}
 
-  {
-    field.type === "json" && field.admin?.component === "menu-items" && !readOnly && (
-      <TreeItemsEditor
-        client:load
-        name={name}
-        value={serializedValue}
-        variant="menu"
-        label={label}
-        linkOptions={menuLinkOptions}
-      />
-    )
-  }
+        {field.type === "json" && field.admin?.component === "menu-items" && !readOnly && (
+          <TreeItemsEditor
+            client:load
+            name={name}
+            value={serializedValue}
+            variant="menu"
+            label={label}
+            linkOptions={menuLinkOptions}
+          />
+        )}
 
-  {
-    field.type === "json" && field.admin?.component === "taxonomy-terms" && !readOnly && (
-      <TreeItemsEditor client:load name={name} value={serializedValue} variant="taxonomy" label={label} />
-    )
-  }
+        {field.type === "json" && field.admin?.component === "taxonomy-terms" && !readOnly && (
+          <TreeItemsEditor client:load name={name} value={serializedValue} variant="taxonomy" label={label} />
+        )}
 
-  {
-    field.type === "json" &&
-      (field.admin?.component === "menu-items" || field.admin?.component === "taxonomy-terms") &&
-      readOnly && (
-        <Textarea
-          className={controlClass}
-          id={name}
-          name={name}
-          rows={rows}
-          readOnly={readOnly}
-          defaultValue={serializedValue}
-        />
-      )
-  }
+        {field.type === "json" &&
+          (field.admin?.component === "menu-items" || field.admin?.component === "taxonomy-terms") &&
+          readOnly && (
+            <Textarea
+              className={controlClass}
+              id={name}
+              name={name}
+              rows={rows}
+              readOnly={readOnly}
+              defaultValue={serializedValue}
+            />
+          )}
 
-  {
-    field.type === "blocks" && !readOnly && (
-      <BlockEditor
-        client:load
-        name={name}
-        value={serializedValue}
-        types={blockTypesMeta}
-        blockRelationOptions={blockRelationOptions}
-      />
-    )
-  }
+        {field.type === "blocks" && !readOnly && (
+          <BlockEditor
+            client:load
+            name={name}
+            value={serializedValue}
+            types={blockTypesMeta}
+            blockRelationOptions={blockRelationOptions}
+          />
+        )}
 
-  {
-    field.type === "blocks" && readOnly && (
-      <Textarea
-        className={controlClass}
-        id={name}
-        name={name}
-        rows={rows}
-        readOnly={readOnly}
-        defaultValue={serializedValue}
-      />
-    )
-  }
+        {field.type === "blocks" && readOnly && (
+          <Textarea
+            className={controlClass}
+            id={name}
+            name={name}
+            rows={rows}
+            readOnly={readOnly}
+            defaultValue={serializedValue}
+          />
+        )}
 
-  {
-    field.type === "array" && "of" in field && field.of?.type === "text" && (
-      <Input
-        className={controlClass}
-        id={name}
-        name={name}
-        placeholder={placeholder || "item1, item2, item3"}
-        readOnly={readOnly}
-        required={field.required}
-        defaultValue={serializedValue}
-      />
-    )
-  }
+        {field.type === "array" && "of" in field && field.of?.type === "text" && (
+          <Input
+            className={controlClass}
+            id={name}
+            name={name}
+            placeholder={placeholder || "item1, item2, item3"}
+            readOnly={readOnly}
+            required={field.required}
+            defaultValue={serializedValue}
+          />
+        )}
 
-  {
-    ((field.type === "array" && !("of" in field && field.of?.type === "text")) ||
-      (field.type === "json" &&
-        field.admin?.component !== "menu-items" &&
-        field.admin?.component !== "taxonomy-terms")) && (
-      <Textarea
-        className={controlClass}
-        id={name}
-        name={name}
-        rows={rows}
-        placeholder={placeholder}
-        readOnly={readOnly}
-        required={field.required}
-        defaultValue={serializedValue}
-      />
+        {((field.type === "array" && !("of" in field && field.of?.type === "text")) ||
+          (field.type === "json" &&
+            field.admin?.component !== "menu-items" &&
+            field.admin?.component !== "taxonomy-terms")) && (
+          <Textarea
+            className={controlClass}
+            id={name}
+            name={name}
+            rows={rows}
+            placeholder={placeholder}
+            readOnly={readOnly}
+            required={field.required}
+            defaultValue={serializedValue}
+          />
+        )}
+      </Fragment>
     )
   }
-
-  </Fragment>
-  )}
 </div>

package/admin/components/RichTextEditor.tsx

@@ -180,7 +180,7 @@ const ToolbarButton = ({
     disabled={disabled}
     title={title}
     className={cn(
-      "focus-visible:ring-ring/50 focus-visible:border-ring inline-flex size-8 items-center justify-center rounded-md transition-colors outline-none focus-visible:ring-2 disabled:opacity-50 disabled:hover:bg-transparent disabled:hover:text-muted-foreground",
+      "focus-visible:ring-ring/50 focus-visible:border-ring disabled:hover:text-muted-foreground inline-flex size-8 items-center justify-center rounded-md transition-colors outline-none focus-visible:ring-2 disabled:opacity-50 disabled:hover:bg-transparent",
       active ? "bg-accent text-accent-foreground" : "text-muted-foreground hover:bg-accent/60 hover:text-foreground",
     )}
   >
@@ -623,7 +623,7 @@ export default function RichTextEditor({ name, initialValue, rows = 10, onChange
           disabled={!editor}
           title={markdownMode ? "Switch to editor" : "Switch to Markdown"}
         >
-          <span className="text-xs font-semibold leading-none">MD</span>
+          <span className="text-xs leading-none font-semibold">MD</span>
         </ToolbarButton>
       </div>
 

package/admin/layouts/AdminLayout.astro

@@ -37,10 +37,36 @@ import {
 } from "lucide-react";
 
 const navIconMap: Record<string, any> = {
-  BarChart, Bell, Bookmark, Calendar, Clock, Database, FileText, FolderTree,
-  Globe, Home, Image, Key, Layers, LayoutGrid, Link, Lock, Mail,
-  Menu, MessageSquare, Package, Palette, PencilRuler, Search, Settings,
-  Shield, Star, Tag, Terminal, Users, Zap,
+  BarChart,
+  Bell,
+  Bookmark,
+  Calendar,
+  Clock,
+  Database,
+  FileText,
+  FolderTree,
+  Globe,
+  Home,
+  Image,
+  Key,
+  Layers,
+  LayoutGrid,
+  Link,
+  Lock,
+  Mail,
+  Menu,
+  MessageSquare,
+  Package,
+  Palette,
+  PencilRuler,
+  Search,
+  Settings,
+  Shield,
+  Star,
+  Tag,
+  Terminal,
+  Users,
+  Zap,
 };
 
 import MobileSidebar from "../components/MobileSidebar";
@@ -90,7 +116,15 @@ const singletonSlugs = new Set(collections.filter((c) => c.singleton).map((c) =>
 const isActiveSingles =
   activeCollection === "singles" || (activeCollection !== null && singletonSlugs.has(activeCollection));
 
-type NavItem = { href: string; label: string; singularLabel?: string; Icon: any; active: boolean; newHref?: string; weight: number };
+type NavItem = {
+  href: string;
+  label: string;
+  singularLabel?: string;
+  Icon: any;
+  active: boolean;
+  newHref?: string;
+  weight: number;
+};
 const navItems: NavItem[] = [];
 
 // Built-in nav items with default weights (spaced by 10 for easy interleaving)
@@ -210,31 +244,31 @@ navItems.sort((a, b) => a.weight - b.weight);
             <nav class="flex-1 space-y-1 overflow-y-auto px-3 py-3">
               {navItems.map((item) => (
                 <div
+                  class={cn(
+                    "group relative rounded-lg",
+                    item.active ? "bg-foreground/10 dark:bg-accent" : "hover:bg-foreground/5 dark:hover:bg-accent/60",
+                  )}
+                >
+                  <a
+                    href={item.href}
                     class={cn(
-                      "group relative rounded-lg",
-                      item.active ? "bg-foreground/10 dark:bg-accent" : "hover:bg-foreground/5 dark:hover:bg-accent/60",
+                      "flex items-center gap-3 px-3 py-2.5 text-sm",
+                      item.newHref && "pr-8",
+                      item.active ? "text-accent-foreground" : "text-foreground/70 group-hover:text-foreground",
                     )}
                   >
+                    <item.Icon className="size-4 shrink-0 stroke-1" />
+                    <span>{item.label}</span>
+                  </a>
+                  {item.newHref && (
                     <a
-                      href={item.href}
-                      class={cn(
-                        "flex items-center gap-3 px-3 py-2.5 text-sm",
-                        item.newHref && "pr-8",
-                        item.active ? "text-accent-foreground" : "text-foreground/70 group-hover:text-foreground",
-                      )}
+                      href={item.newHref}
+                      title={`Add new ${(item.singularLabel ?? item.label).toLowerCase()}`}
+                      class="text-foreground/40 hover:text-foreground/70 absolute top-1/2 right-1.5 hidden -translate-y-1/2 rounded p-1 group-hover:block"
                     >
-                      <item.Icon className="size-4 shrink-0 stroke-1" />
-                      <span>{item.label}</span>
+                      <Plus className="size-3.5" />
                     </a>
-                    {item.newHref && (
-                      <a
-                        href={item.newHref}
-                        title={`Add new ${(item.singularLabel ?? item.label).toLowerCase()}`}
-                        class="text-foreground/40 hover:text-foreground/70 absolute top-1/2 right-1.5 hidden -translate-y-1/2 rounded p-1 group-hover:block"
-                      >
-                        <Plus className="size-3.5" />
-                      </a>
-                    )}
+                  )}
                 </div>
               ))}
             </nav>