@dyrected/admin 2.0.0 → 2.4.0

package/CHANGELOG.md

@@ -1,5 +1,51 @@
 # @dyrected/admin
 
+## 2.4.0
+
+### Minor Changes
+
+- Infrastructure standardization, MySQL adapter improvements, and SDK robustness testing.
+
+### Patch Changes
+
+- Updated dependencies
+  - @dyrected/core@2.4.0
+  - @dyrected/sdk@2.4.0
+
+## 2.3.0
+
+### Minor Changes
+
+- Standardize database infrastructure and implement field promotion.
+  - **Field Promotion**: Added 'promoted' option to Collection fields to extract JSON data into native SQL columns for indexing and performance.
+  - **Lazy Migrations**: Added 'renameTo' support for seamless field renames without breaking existing data.
+  - **Auto-Seeding**: Standardized 'initialData' seeding logic across all adapters.
+  - **MySQL Adapter**: New robust MySQL adapter implementation.
+  - **Strict Filtering**: Improved query translation parity across all SQL-based adapters.
+
+### Patch Changes
+
+- Updated dependencies
+  - @dyrected/core@2.3.0
+  - @dyrected/sdk@2.3.0
+
+## 2.0.1
+
+### Patch Changes
+
+- 220818c: ### @dyrected/core
+  - **New Discovery Workflow**: Refined the AI setup prompt with a multi-step "Phase 0" discovery process to improve initial project scoping.
+  - **Nomenclature Standardization**: Updated all system prompts to use "Nuxt.js" nomenclature and improved schema definition examples.
+
+  ### @dyrected/db-postgres & @dyrected/db-sqlite
+  - **Architecture Documentation**: Added source-level documentation explaining the use of raw SQL drivers (postgres.js/better-sqlite3) alongside Drizzle to support dynamic runtime schemas.
+
+  ### @dyrected/admin
+  - **Internal Maintenance**: Synchronized internal documentation and field renderer context to support the latest core setup workflows.
+
+- Updated dependencies [220818c]
+  - @dyrected/core@2.1.0
+
 ## 2.0.0
 
 ### Major Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dyrected/admin",
-  "version": "2.0.0",
+  "version": "2.4.0",
   "type": "module",
   "main": "./dist/index.mjs",
   "module": "./dist/index.mjs",
@@ -60,8 +60,8 @@
     "tailwind-merge": "^3.5.0",
     "tailwindcss-animate": "^1.0.7",
     "zod": "^3.25.76",
-    "@dyrected/sdk": "^2.0.0",
-    "@dyrected/core": "^2.0.0"
+    "@dyrected/core": "^2.4.0",
+    "@dyrected/sdk": "^2.4.0"
   },
   "devDependencies": {
     "@eslint/js": "^10.0.1",
@@ -76,7 +76,7 @@
     "globals": "^17.5.0",
     "postcss": "^8.5.14",
     "tailwindcss": "^3.4.19",
-    "typescript": "~6.0.2",
+    "typescript": "^5.7.3",
     "typescript-eslint": "^8.58.2",
     "vite": "^8.0.10",
     "vite-plugin-dts": "^5.0.0",

package/scripts/prefix-tailwind-precision.py

@@ -0,0 +1,98 @@
+import os
+import re
+
+EXCLUDED_WORDS = {
+    "default", "ghost", "outline", "secondary", "destructive", "link", "icon",
+    "sm", "md", "lg", "xl", "2xl", "top", "bottom", "left", "right",
+    "expanded", "collapsed", "sidebar", "floating", "inset", "offcanvas", "none",
+    "sidebar_state", "top-right", "asChild", "className", "variant", "size", "side",
+    "true", "false", "item", "index", "key", "id", "name", "type", "value", "variant"
+}
+
+def prefix_single_class(c):
+    if not c or c.startswith(("dy-", "{", "$", "--", "http")):
+        return c
+    
+    if ":" in c:
+        parts = c.split(":")
+        modifiers = parts[:-1]
+        base = parts[-1]
+        
+        new_modifiers = []
+        for m in modifiers:
+            if m.startswith(("group", "peer")):
+                new_modifiers.append(f"dy-{m}")
+            else:
+                new_modifiers.append(m)
+        
+        if base and base not in EXCLUDED_WORDS and not base.startswith("["):
+            base = f"dy-{base}"
+            
+        return ":".join(new_modifiers + [base])
+    else:
+        if c in EXCLUDED_WORDS or c.startswith("["):
+            return c
+        if c.startswith(("group", "peer")):
+            return f"dy-{c}"
+        return f"dy-{c}"
+
+def prefix_classes_in_string(s):
+    if not s: return s
+    return " ".join([prefix_single_class(c) for c in s.split()])
+
+def process_content(content):
+    # 1. className="literal"
+    def class_name_replacer(m):
+        quote = m.group(1)
+        classes = m.group(2)
+        return f'className={quote}{prefix_classes_in_string(classes)}{quote}'
+    content = re.sub(r'className=([\'"])(.*?)\1', class_name_replacer, content)
+    
+    # 2. cn(...)
+    def cn_replacer(m):
+        inner = m.group(1)
+        def inner_string_replacer(sm):
+            quote = sm.group(1)
+            s = sm.group(2)
+            preceding = inner[:sm.start()]
+            # Only exclude if it's a comparison or arrow function
+            if preceding.strip().endswith(("===", "!==", "==", "!=", "=>")):
+                return sm.group(0)
+            
+            return f'{quote}{prefix_classes_in_string(s)}{quote}'
+        new_inner = re.sub(r'([\'"])(.*?)\1', inner_string_replacer, inner)
+        return f'cn({new_inner})'
+    content = re.sub(r'cn\((.*?)\)', cn_replacer, content, flags=re.DOTALL)
+    
+    # 3. cva(...)
+    def cva_replacer(m):
+        inner = m.group(1)
+        def cva_string_replacer(sm):
+            quote = sm.group(1)
+            s = sm.group(2)
+            following = inner[sm.end():]
+            if following.strip().startswith(":"):
+                return sm.group(0)
+            return f'{quote}{prefix_classes_in_string(s)}{quote}'
+        new_inner = re.sub(r'([\'"])(.*?)\1', cva_string_replacer, inner)
+        return f'cva({new_inner})'
+    content = re.sub(r'cva\((.*?)\)', cva_replacer, content, flags=re.DOTALL)
+    
+    return content
+
+def main():
+    src_dir = "packages/admin/src"
+    for root, dirs, files in os.walk(src_dir):
+        for file in files:
+            if file.endswith((".tsx", ".ts")):
+                filepath = os.path.join(root, file)
+                with open(filepath, 'r') as f:
+                    content = f.read()
+                new_content = process_content(content)
+                if new_content != content:
+                    with open(filepath, 'w') as f:
+                        f.write(new_content)
+                    print(f"Updated {filepath}")
+
+if __name__ == "__main__":
+    main()

package/scripts/prefix-tailwind.py

@@ -0,0 +1,67 @@
+import os
+import re
+
+def prefix_classes_in_string(s):
+    # Skip empty strings or strings that already have the prefix
+    if not s or s.startswith("dy-"):
+        return s
+    
+    # Split by whitespace, prefix each class, then rejoin
+    classes = s.split()
+    prefixed = []
+    for c in classes:
+        # Skip variables like {className} or strings that look like CSS variables
+        if c.startswith("{") or c.startswith("$") or c.startswith("--"):
+            prefixed.append(c)
+        # Skip already prefixed
+        elif c.startswith("dy-"):
+            prefixed.append(c)
+        # Prefix everything else (assuming they are tailwind classes)
+        else:
+            prefixed.append(f"dy-{c}")
+    return " ".join(prefixed)
+
+def process_content(content):
+    # 1. Handle className="literal classes"
+    content = re.sub(r'className=([\'"])(.*?)\1', 
+                    lambda m: f'className={m.group(1)}{prefix_classes_in_string(m.group(2))}{m.group(1)}', 
+                    content)
+    
+    # 2. Handle className={cn("literal classes", ...)}
+    # We look for strings inside cn(...)
+    def cn_match(m):
+        # This is a bit rough but works for simple cn calls
+        inner = m.group(1)
+        # Replace string literals inside the cn call
+        new_inner = re.sub(r'([\'"])(.*?)\1', 
+                          lambda sm: f'{sm.group(1)}{prefix_classes_in_string(sm.group(2))}{sm.group(1)}', 
+                          inner)
+        return f'cn({new_inner})'
+    
+    content = re.sub(r'cn\((.*?)\)', cn_match, content, flags=re.DOTALL)
+    
+    # 3. Handle @apply in CSS
+    content = re.sub(r'@apply (.*?);', 
+                    lambda m: f'@apply {prefix_classes_in_string(m.group(1))};', 
+                    content)
+    
+    return content
+
+def main():
+    src_dir = "packages/admin/src"
+    for root, dirs, files in os.walk(src_dir):
+        for file in files:
+            if file.endswith((".tsx", ".ts", ".css")):
+                filepath = os.path.join(root, file)
+                with open(filepath, 'r') as f:
+                    content = f.read()
+                
+                new_content = process_content(content)
+                
+                if new_content != content:
+                    with open(filepath, 'w') as f:
+                        f.write(new_content)
+                    print(f"Updated {filepath}")
+
+if __name__ == "__main__":
+    main()

package/src/components/auth/auth-gate.tsx

@@ -32,10 +32,10 @@ export function AuthGate({ children }: { children: React.ReactNode }) {
 
   if (isLoading) {
     return (
-      <div className="flex h-screen items-center justify-center bg-background">
-        <div className="flex flex-col items-center gap-4">
-          <div className="h-8 w-8 animate-spin rounded-full border-2 border-primary border-t-transparent" />
-          <p className="text-sm text-muted-foreground animate-pulse">Authenticating...</p>
+      <div className="dy-flex dy-h-screen dy-items-center dy-justify-center dy-bg-background">
+        <div className="dy-flex dy-flex-col dy-items-center dy-gap-4">
+          <div className="dy-h-8 dy-w-8 dy-animate-spin dy-rounded-full dy-border-2 dy-border-primary dy-border-t-transparent" />
+          <p className="dy-text-sm dy-text-muted-foreground dy-animate-pulse">Authenticating...</p>
         </div>
       </div>
     );

package/src/components/error-boundary.tsx

@@ -27,12 +27,12 @@ export class ErrorBoundary extends Component<Props, State> {
   public render() {
     if (this.state.hasError) {
       return this.props.fallback || (
-        <div className="flex-1 flex flex-col items-center justify-center p-12 bg-destructive/5 text-destructive min-h-[400px]">
-          <h2 className="text-xl font-bold mb-2">Something went wrong</h2>
-          <p className="text-sm opacity-80 mb-4">{this.state.error?.message}</p>
+        <div className="dy-flex-1 dy-flex dy-flex-col dy-items-center dy-justify-center dy-p-12 dy-bg-destructive/5 dy-text-destructive dy-min-h-[400px]">
+          <h2 className="dy-text-xl dy-font-bold dy-mb-2">Something went wrong</h2>
+          <p className="dy-text-sm dy-opacity-80 dy-mb-4">{this.state.error?.message}</p>
           <button 
             onClick={() => window.location.reload()}
-            className="px-4 py-2 bg-destructive text-destructive-foreground rounded-md text-sm font-medium hover:bg-destructive/90 transition-colors"
+            className="dy-px-4 dy-py-2 dy-bg-destructive dy-text-destructive-foreground dy-rounded-md dy-text-sm dy-font-medium hover:dy-bg-destructive/90 dy-transition-colors"
           >
             Reload Page
           </button>

package/src/components/forms/fields/block-builder.tsx

@@ -77,33 +77,33 @@ function SortableBlockItem({
   if (!blockConfig) return null
 
   return (
-    <div ref={setNodeRef} style={style} className="relative group left-accent mb-4 py-4 animate-in">
+    <div ref={setNodeRef} style={style} className="dy-relative dy-group dy-left-accent dy-mb-4 dy-py-4 dy-animate-in">
       {/* Header / Drag Handle */}
-      <div className="flex items-center justify-between pb-3">
-        <div className="flex items-center justify-between gap-2">
-          <div {...attributes} {...listeners} className="cursor-grab opacity-20 group-hover:opacity-100 hover:bg-muted p-1 rounded-md transition-all">
-            <GripVertical className="w-3.5 h-3.5 text-muted-foreground" />
+      <div className="dy-flex dy-items-center dy-justify-between dy-pb-3">
+        <div className="dy-flex dy-items-center dy-justify-between dy-gap-2">
+          <div {...attributes} {...listeners} className="dy-cursor-grab dy-opacity-20 dy-group-hover:dy-opacity-100 hover:dy-bg-muted dy-p-1 dy-rounded-md dy-transition-all">
+            <GripVertical className="dy-w-3.5 dy-h-3.5 dy-text-muted-foreground" />
           </div>
-          <span className="font-bold text-xs text-foreground/70 tracking-tight">
+          <span className="dy-font-bold dy-text-xs dy-text-foreground/70 dy-tracking-tight">
             {blockConfig.labels?.singular || blockConfig.slug}
           </span>
-          <span className="text-[10px] text-muted-foreground/40 ml-2 uppercase tracking-widest font-semibold">
+          <span className="dy-text-[10px] dy-text-muted-foreground/40 dy-ml-2 dy-uppercase dy-tracking-widest dy-font-semibold">
             Item {index + 1}
           </span>
         </div>
-        <div className="flex items-center gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
-          <Button type="button" variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground/40" onClick={() => setIsExpanded(!isExpanded)}>
-            {isExpanded ? <ChevronUp className="w-3.5 h-3.5" /> : <ChevronDown className="w-3.5 h-3.5" />}
+        <div className="dy-flex dy-items-center dy-gap-1 dy-opacity-0 dy-group-hover:dy-opacity-100 dy-transition-opacity">
+          <Button type="button" variant="ghost" size="icon" className="dy-h-7 dy-w-7 dy-text-muted-foreground/40" onClick={() => setIsExpanded(!isExpanded)}>
+            {isExpanded ? <ChevronUp className="dy-w-3.5 dy-h-3.5" /> : <ChevronDown className="dy-w-3.5 dy-h-3.5" />}
           </Button>
-          <Button type="button" variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground/30 hover:text-destructive hover:bg-destructive/10" onClick={() => remove(index)}>
-            <X className="w-3.5 h-3.5" />
+          <Button type="button" variant="ghost" size="icon" className="dy-h-7 dy-w-7 dy-text-muted-foreground/30 hover:dy-text-destructive hover:dy-bg-destructive/10" onClick={() => remove(index)}>
+            <X className="dy-w-3.5 dy-h-3.5" />
           </Button>
         </div>
       </div>
 
       {/* Content */}
       {isExpanded && (
-        <div className="space-y-6">
+        <div className="dy-space-y-6">
           {blockConfig.fields.map(subField => (
             <FormFieldRenderer
               key={subField.name}
@@ -148,26 +148,26 @@ export function BlockBuilder({ schema, basePath, control, collection }: BlockBui
   }
 
   return (
-    <div className="space-y-4">
-      <div className="flex justify-between items-center pb-2">
+    <div className="dy-space-y-4">
+      <div className="dy-flex dy-justify-between dy-items-center dy-pb-2">
         <div>
-          <h4 className="font-bold text-sm text-foreground tracking-tight">{schema.label}</h4>
+          <h4 className="dy-font-bold dy-text-sm dy-text-foreground dy-tracking-tight">{schema.label}</h4>
           {schema.admin?.description && (
-            <p className="text-[11px] text-muted-foreground/60 italic">{schema.admin.description}</p>
+            <p className="dy-text-[11px] dy-text-muted-foreground/60 dy-italic">{schema.admin.description}</p>
           )}
         </div>
 
         {schema.blocks && schema.blocks.length > 0 && (
           <DropdownMenu>
             <DropdownMenuTrigger asChild>
-              <Button type="button" variant="outline" size="sm" className="h-7 text-[11px] rounded-md border-primary/20 hover:bg-primary/5 hover:text-primary">
+              <Button type="button" variant="outline" size="sm" className="dy-h-7 dy-text-[11px] dy-rounded-md dy-border-primary/20 hover:dy-bg-primary/5 hover:dy-text-primary">
                 Add Block
-                <ChevronDown className="w-3 h-3 ml-1.5" />
+                <ChevronDown className="dy-w-3 dy-h-3 dy-ml-1.5" />
               </Button>
             </DropdownMenuTrigger>
-            <DropdownMenuContent align="end" className="rounded-lg border-border/40 shadow-xl">
+            <DropdownMenuContent align="end" className="dy-rounded-lg dy-border-border/40 dy-shadow-xl">
               {schema.blocks.map((block) => (
-                <DropdownMenuItem key={block.slug} onClick={() => handleAddBlock(block)} className="text-[13px] rounded-md focus:bg-primary/5 focus:text-primary transition-colors">
+                <DropdownMenuItem key={block.slug} onClick={() => handleAddBlock(block)} className="dy-text-[13px] dy-rounded-md focus:dy-bg-primary/5 focus:dy-text-primary dy-transition-colors">
                   {block.labels?.singular || block.slug}
                 </DropdownMenuItem>
               ))}
@@ -177,8 +177,8 @@ export function BlockBuilder({ schema, basePath, control, collection }: BlockBui
       </div>
 
       {fields.length === 0 ? (
-        <div className="text-center p-8 border border-dashed border-border/40 rounded-md">
-          <p className="text-[11px] text-muted-foreground/50">No blocks added yet.</p>
+        <div className="dy-text-center dy-p-8 dy-border dy-border-dashed dy-border-border/40 dy-rounded-md">
+          <p className="dy-text-[11px] dy-text-muted-foreground/50">No blocks added yet.</p>
         </div>
       ) : (
         <DndContext
@@ -190,7 +190,7 @@ export function BlockBuilder({ schema, basePath, control, collection }: BlockBui
             items={fields.map(f => f.id)}
             strategy={verticalListSortingStrategy}
           >
-            <div className="pt-2">
+            <div className="dy-pt-2">
               {fields.map((item, index) => (
                 <SortableBlockItem
                   key={item.id}

package/src/components/forms/fields/date-picker.tsx

@@ -21,25 +21,25 @@ export function DatePicker({ value, onChange, label, disabled }: DatePickerProps
   const date = value ? new Date(value) : undefined
 
   return (
-    <div className="flex flex-col gap-2">
-      {label && <label className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">{label}</label>}
+    <div className="dy-flex dy-flex-col dy-gap-2">
+      {label && <label className="dy-text-sm dy-font-medium dy-leading-none dy-peer-disabled:dy-cursor-not-allowed dy-peer-disabled:dy-opacity-70">{label}</label>}
       <Popover open={disabled ? false : undefined}>
         <PopoverTrigger asChild>
           <Button
             variant={"outline"}
             disabled={disabled}
             className={cn(
-              "w-full justify-start text-left font-normal h-11 px-4 bg-white hover:bg-muted/50 border-border/60 shadow-sm transition-all hover:shadow-md",
-              !date && "text-muted-foreground"
+              "dy-w-full dy-justify-start dy-text-left dy-font-normal dy-h-11 dy-px-4 dy-bg-white hover:dy-bg-muted/50 dy-border-border/60 dy-shadow-sm dy-transition-all hover:dy-shadow-md",
+              !date && "dy-text-muted-foreground"
             )}
           >
-            <CalendarIcon className="mr-3 h-4 w-4 text-primary" />
-            <span className="flex-1 truncate">
+            <CalendarIcon className="dy-mr-3 dy-h-4 dy-w-4 dy-text-primary" />
+            <span className="dy-flex-1 dy-truncate">
               {date ? format(date, "PPP") : "Pick a date..."}
             </span>
           </Button>
         </PopoverTrigger>
-        <PopoverContent className="w-auto p-0 border-border/50 shadow-2xl rounded-xl" align="start">
+        <PopoverContent className="dy-w-auto dy-p-0 dy-border-border/50 dy-shadow-2xl dy-rounded-xl" align="start">
           <Calendar
             mode="single"
             selected={date}

package/src/components/forms/fields/json-editor.tsx

@@ -44,19 +44,19 @@ export function JsonEditor({ value, onChange, label, disabled }: JsonEditorProps
   }
 
   return (
-    <div className="flex flex-col gap-2">
-      {label && <label className="text-sm font-medium leading-none">{label}</label>}
+    <div className="dy-flex dy-flex-col dy-gap-2">
+      {label && <label className="dy-text-sm dy-font-medium dy-leading-none">{label}</label>}
       <Textarea
         value={internalValue}
         onChange={handleChange}
         disabled={disabled}
         className={cn(
-          "font-mono text-xs min-h-[150px]",
-          error && "border-destructive focus-visible:ring-destructive"
+          "dy-font-mono dy-text-xs dy-min-h-[150px]",
+          error && "dy-border-destructive focus-visible:dy-ring-destructive"
         )}
         placeholder='{ "key": "value" }'
       />
-      {error && <span className="text-xs text-destructive">{error}</span>}
+      {error && <span className="dy-text-xs dy-text-destructive">{error}</span>}
     </div>
   )
 }