npm - @base44-preview/cli - Versions diffs - 0.0.1-pr.15.8b10ac1 → 0.0.1-pr.16.c796b32 - Mend

@base44-preview/cli 0.0.1-pr.15.8b10ac1 → 0.0.1-pr.16.c796b32

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (22) hide show

package/dist/cli/templates/backend-and-client/README.md ADDED Viewed

@@ -0,0 +1,41 @@
+# Todo App
+A simple todo list app built with React and Base44 backend.
+## Structure
+```
+base44/               # Backend configuration
+├── config.jsonc      # Project settings
+└── entities/         # Data schemas
+    └── task.jsonc    # Task entity
+src/                  # Frontend code
+├── App.jsx           # Main todo app
+├── api/              # Base44 client
+├── components/ui/    # UI components
+└── lib/              # Utilities
+```
+## Development
+```bash
+npm install
+npm run dev
+```
+## Commands
+| Command | Description |
+|---------|-------------|
+| `npm run dev` | Start dev server |
+| `npm run build` | Build for production |
+| `npm run preview` | Preview production build |
+## Base44 CLI
+```bash
+base44 login          # Authenticate
+base44 entities push  # Push entity schemas
+base44 deploy         # Deploy backend + hosting
+```

package/dist/cli/templates/backend-and-client/base44/config.jsonc.ejs ADDED Viewed

@@ -0,0 +1,17 @@
+// Base44 Project Configuration
+// JSONC enables inline documentation and discoverability directly in config files.
+// Full-stack template with backend and client configuration.
+{
+  "name": "<%= name %>"<% if (description) { %>,
+  "description": "<%= description %>"<% } %>,
+  // Site/hosting configuration for the client application
+  // Docs: https://docs.base44.com/configuration/hosting
+  "site": {
+    "buildCommand": "npm run build",
+    "serveCommand": "npm run dev",
+    "outputDirectory": "./dist",
+    "installCommand": "npm ci"
+  }
+}

package/dist/cli/templates/backend-and-client/base44/entities/task.jsonc ADDED Viewed

@@ -0,0 +1,16 @@
+{
+  "name": "Task",
+  "type": "object",
+  "properties": {
+    "title": {
+      "type": "string",
+      "description": "Task title"
+    },
+    "completed": {
+      "type": "boolean",
+      "default": false,
+      "description": "Whether the task is completed"
+    }
+  },
+  "required": ["title"]
+}

package/dist/cli/templates/backend-and-client/components.json ADDED Viewed

@@ -0,0 +1,16 @@
+{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "new-york",
+  "rsc": false,
+  "tsx": false,
+  "tailwind": {
+    "config": "tailwind.config.js",
+    "css": "src/index.css",
+    "baseColor": "slate",
+    "cssVariables": true
+  },
+  "aliases": {
+    "components": "@/components",
+    "ui": "@/components/ui"
+  }
+}

package/dist/cli/templates/backend-and-client/index.html ADDED Viewed

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="https://base44.com/logo_v2.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Todo App</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.jsx"></script>
+  </body>
+</html>

package/dist/cli/templates/backend-and-client/jsconfig.json ADDED Viewed

@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["./src/*"]
+    },
+    "jsx": "react-jsx",
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "target": "esnext"
+  },
+  "include": ["src"]
+}

package/dist/cli/templates/backend-and-client/package.json ADDED Viewed

@@ -0,0 +1,24 @@
+{
+  "name": "base44-app",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@base44/sdk": "^0.8.3",
+    "lucide-react": "^0.475.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-react": "^4.3.4",
+    "autoprefixer": "^10.4.20",
+    "postcss": "^8.5.3",
+    "tailwindcss": "^3.4.17",
+    "vite": "^6.1.0"
+  }
+}

package/dist/cli/templates/backend-and-client/postcss.config.js ADDED Viewed

@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+};

package/dist/cli/templates/backend-and-client/src/App.jsx ADDED Viewed

@@ -0,0 +1,135 @@
+import { useState, useEffect } from 'react';
+import { base44 } from '@/api/base44Client';
+import { Button } from '@/components/ui/button';
+import { Checkbox } from '@/components/ui/checkbox';
+import { Input } from '@/components/ui/input';
+import { Plus, Trash2, CheckCircle2 } from 'lucide-react';
+const Task = base44.entities.Task;
+export default function App() {
+  const [tasks, setTasks] = useState([]);
+  const [newTaskTitle, setNewTaskTitle] = useState('');
+  const [isLoading, setIsLoading] = useState(true);
+  const fetchTasks = async () => {
+    const data = await Task.list();
+    setTasks(data);
+    setIsLoading(false);
+  };
+  useEffect(() => {
+    fetchTasks();
+  }, []);
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    if (!newTaskTitle.trim()) return;
+    await Task.create({ title: newTaskTitle.trim(), completed: false });
+    setNewTaskTitle('');
+    fetchTasks();
+  };
+  const toggleTask = async (id, completed) => {
+    await Task.update(id, { completed });
+    fetchTasks();
+  };
+  const deleteTask = async (id) => {
+    await Task.delete(id);
+    fetchTasks();
+  };
+  const clearCompleted = async () => {
+    await Promise.all(tasks.filter((t) => t.completed).map((t) => Task.delete(t.id)));
+    fetchTasks();
+  };
+  const completedCount = tasks.filter((t) => t.completed).length;
+  const totalCount = tasks.length;
+  return (
+    <div className="min-h-screen bg-gradient-to-br from-slate-50 via-white to-orange-50/30">
+      <div className="max-w-lg mx-auto px-6 py-16">
+        {/* Header */}
+        <div className="text-center mb-12">
+          <div className="inline-flex items-center justify-center w-14 h-14 rounded-2xl bg-gradient-to-br from-orange-500 to-orange-600 shadow-lg shadow-orange-500/25 mb-6">
+            <CheckCircle2 className="w-7 h-7 text-white" />
+          </div>
+          <h1 className="text-3xl font-semibold text-slate-900 tracking-tight">Tasks</h1>
+          {totalCount > 0 && (
+            <p className="text-slate-500 mt-2 text-sm">
+              {completedCount} of {totalCount} completed
+            </p>
+          )}
+        </div>
+        {/* Add Task Form */}
+        <form onSubmit={handleSubmit} className="mb-8">
+          <div className="flex gap-3">
+            <Input
+              type="text"
+              value={newTaskTitle}
+              onChange={(e) => setNewTaskTitle(e.target.value)}
+              placeholder="What needs to be done?"
+              className="flex-1 h-12 bg-white border-slate-200 rounded-xl shadow-sm"
+            />
+            <Button
+              type="submit"
+              disabled={!newTaskTitle.trim()}
+              className="h-12 px-5 rounded-xl bg-slate-900 hover:bg-slate-800 shadow-sm"
+            >
+              <Plus className="w-5 h-5" />
+            </Button>
+          </div>
+        </form>
+        {/* Task List */}
+        <div className="space-y-2">
+          {isLoading ? (
+            <div className="flex items-center justify-center py-12">
+              <div className="w-6 h-6 border-2 border-slate-200 border-t-orange-500 rounded-full animate-spin" />
+            </div>
+          ) : tasks.length === 0 ? (
+            <div className="text-center py-12">
+              <p className="text-slate-400">No tasks yet. Add one above!</p>
+            </div>
+          ) : (
+            tasks.map((task) => (
+              <div
+                key={task.id}
+                className="group flex items-center gap-4 p-4 bg-white rounded-xl border border-slate-100 shadow-sm hover:shadow-md transition-all duration-200"
+              >
+                <Checkbox
+                  checked={task.completed}
+                  onCheckedChange={(checked) => toggleTask(task.id, checked)}
+                  className="w-5 h-5 rounded-md border-slate-300 data-[state=checked]:bg-orange-500 data-[state=checked]:border-orange-500"
+                />
+                <span className={`flex-1 text-slate-700 transition-all ${task.completed ? 'line-through text-slate-400' : ''}`}>
+                  {task.title}
+                </span>
+                <Button
+                  variant="ghost"
+                  size="icon"
+                  onClick={() => deleteTask(task.id)}
+                  className="opacity-0 group-hover:opacity-100 h-8 w-8 text-slate-400 hover:text-red-500 hover:bg-red-50 transition-all"
+                >
+                  <Trash2 className="w-4 h-4" />
+                </Button>
+              </div>
+            ))
+          )}
+        </div>
+        {/* Footer */}
+        {completedCount > 0 && (
+          <div className="mt-8 text-center">
+            <button onClick={clearCompleted} className="text-sm text-slate-400 hover:text-slate-600 transition-colors">
+              Clear completed
+            </button>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}

package/dist/cli/templates/backend-and-client/src/api/base44Client.js.ejs ADDED Viewed

@@ -0,0 +1,5 @@
+import { createClient } from '@base44/sdk';
+export const base44 = createClient({
+  appId: '<%= projectId %>',
+});

package/dist/cli/templates/backend-and-client/src/components/ui/button.jsx ADDED Viewed

@@ -0,0 +1,23 @@
+import { forwardRef } from 'react';
+const Button = forwardRef(({ className = '', variant, size, ...props }, ref) => {
+  const baseStyles = 'inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50';
+  const variantStyles = variant === 'ghost'
+    ? 'hover:bg-slate-100'
+    : 'bg-slate-900 text-white shadow hover:bg-slate-800';
+  const sizeStyles = size === 'icon' ? 'h-9 w-9' : 'h-9 px-4 py-2';
+  return (
+    <button
+      ref={ref}
+      className={`${baseStyles} ${variantStyles} ${sizeStyles} ${className}`}
+      {...props}
+    />
+  );
+});
+Button.displayName = 'Button';
+export { Button };

package/dist/cli/templates/backend-and-client/src/components/ui/checkbox.jsx ADDED Viewed

@@ -0,0 +1,20 @@
+import { forwardRef } from 'react';
+import { Check } from 'lucide-react';
+const Checkbox = forwardRef(({ className = '', checked, onCheckedChange, ...props }, ref) => (
+  <button
+    ref={ref}
+    type="button"
+    role="checkbox"
+    aria-checked={checked}
+    onClick={() => onCheckedChange?.(!checked)}
+    className={`h-4 w-4 shrink-0 rounded-sm border border-slate-300 shadow-sm flex items-center justify-center focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-slate-400 disabled:cursor-not-allowed disabled:opacity-50 ${checked ? 'bg-slate-900 text-white border-slate-900' : 'bg-white'} ${className}`}
+    {...props}
+  >
+    {checked && <Check className="h-3 w-3" />}
+  </button>
+));
+Checkbox.displayName = 'Checkbox';
+export { Checkbox };

package/dist/cli/templates/backend-and-client/src/components/ui/input.jsx ADDED Viewed

@@ -0,0 +1,13 @@
+import { forwardRef } from 'react';
+const Input = forwardRef(({ className = '', ...props }, ref) => (
+  <input
+    ref={ref}
+    className={`flex h-9 w-full rounded-md border border-slate-200 bg-white px-3 py-1 text-sm shadow-sm transition-colors placeholder:text-slate-400 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-slate-400 disabled:cursor-not-allowed disabled:opacity-50 ${className}`}
+    {...props}
+  />
+));
+Input.displayName = 'Input';
+export { Input };

package/dist/cli/templates/backend-and-client/src/index.css ADDED Viewed

@@ -0,0 +1,37 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+@layer base {
+  :root {
+    --background: 0 0% 100%;
+    --foreground: 222.2 84% 4.9%;
+    --card: 0 0% 100%;
+    --card-foreground: 222.2 84% 4.9%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 222.2 84% 4.9%;
+    --primary: 222.2 47.4% 11.2%;
+    --primary-foreground: 210 40% 98%;
+    --secondary: 210 40% 96.1%;
+    --secondary-foreground: 222.2 47.4% 11.2%;
+    --muted: 210 40% 96.1%;
+    --muted-foreground: 215.4 16.3% 46.9%;
+    --accent: 210 40% 96.1%;
+    --accent-foreground: 222.2 47.4% 11.2%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 210 40% 98%;
+    --border: 214.3 31.8% 91.4%;
+    --input: 214.3 31.8% 91.4%;
+    --ring: 222.2 84% 4.9%;
+    --radius: 0.5rem;
+  }
+}
+@layer base {
+  * {
+    @apply border-border;
+  }
+  body {
+    @apply bg-background text-foreground antialiased;
+  }
+}

package/dist/cli/templates/backend-and-client/src/main.jsx ADDED Viewed

@@ -0,0 +1,6 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import App from '@/App.jsx';
+import '@/index.css';
+ReactDOM.createRoot(document.getElementById('root')).render(<App />);

package/dist/cli/templates/backend-and-client/tailwind.config.js ADDED Viewed

@@ -0,0 +1,41 @@
+/** @type {import('tailwindcss').Config} */
+export default {
+  content: ['./index.html', './src/**/*.{js,jsx}'],
+  theme: {
+    extend: {
+      borderRadius: {
+        lg: 'var(--radius)',
+        md: 'calc(var(--radius) - 2px)',
+        sm: 'calc(var(--radius) - 4px)',
+      },
+      colors: {
+        background: 'hsl(var(--background))',
+        foreground: 'hsl(var(--foreground))',
+        primary: {
+          DEFAULT: 'hsl(var(--primary))',
+          foreground: 'hsl(var(--primary-foreground))',
+        },
+        secondary: {
+          DEFAULT: 'hsl(var(--secondary))',
+          foreground: 'hsl(var(--secondary-foreground))',
+        },
+        muted: {
+          DEFAULT: 'hsl(var(--muted))',
+          foreground: 'hsl(var(--muted-foreground))',
+        },
+        accent: {
+          DEFAULT: 'hsl(var(--accent))',
+          foreground: 'hsl(var(--accent-foreground))',
+        },
+        destructive: {
+          DEFAULT: 'hsl(var(--destructive))',
+          foreground: 'hsl(var(--destructive-foreground))',
+        },
+        border: 'hsl(var(--border))',
+        input: 'hsl(var(--input))',
+        ring: 'hsl(var(--ring))',
+      },
+    },
+  },
+  plugins: [],
+};

package/dist/cli/templates/backend-and-client/vite.config.js ADDED Viewed

@@ -0,0 +1,12 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import path from 'path';
+export default defineConfig({
+  plugins: [react()],
+  resolve: {
+    alias: {
+      '@': path.resolve(__dirname, './src'),
+    },
+  },
+});

package/dist/cli/templates/backend-only/base44/.env.local.ejs ADDED Viewed

@@ -0,0 +1,6 @@
+# Base44 Project Environment Variables
+# This file contains environment-specific configuration for your Base44 project.
+# Do not commit this file to version control if it contains sensitive data.
+# Your Base44 Application ID
+BASE44_CLIENT_ID=<%= projectId %>

package/dist/cli/templates/backend-only/base44/config.jsonc.ejs ADDED Viewed

@@ -0,0 +1,17 @@
+// Base44 Project Configuration
+// JSONC enables inline documentation and discoverability directly in config files.
+// Commented-out properties show available options you can enable.
+{
+  "name": "<%= name %>"<% if (description) { %>,
+  "description": "<%= description %>"<% } %>
+  // Site/hosting configuration
+  // Docs: https://docs.base44.com/configuration/hosting
+  // "site": {
+  //   "buildCommand": "npm run build",
+  //   "serveCommand": "npm run dev",
+  //   "outputDirectory": "./dist",
+  //   "installCommand": "npm ci"
+  // }
+}

package/dist/cli/templates/templates.json ADDED Viewed

@@ -0,0 +1,16 @@
+{
+  "templates": [
+    {
+      "id": "backend-only",
+      "name": "Backend Only",
+      "description": "Create a Base44 backend project with entities, functions, and APIs",
+      "path": "backend-only"
+    },
+    {
+      "id": "backend-and-client",
+      "name": "To Do App - Backend + Client",
+      "description": "Full-stack project with Base44 backend, Vite and a React client application",
+      "path": "backend-and-client"
+    }
+  ]
+}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@base44-preview/cli",
-  "version": "0.0.1-pr.15.8b10ac1",
+  "version": "0.0.1-pr.16.c796b32",
   "description": "Base44 CLI - Unified interface for managing Base44 applications",
   "type": "module",
   "main": "./dist/cli/index.js",
@@ -36,14 +36,19 @@
     "@clack/prompts": "^0.11.0",
     "chalk": "^5.6.2",
     "commander": "^12.1.0",
+    "dotenv": "^17.2.3",
+    "ejs": "^3.1.10",
     "globby": "^16.1.0",
     "jsonc-parser": "^3.3.1",
     "ky": "^1.14.2",
+    "lodash.kebabcase": "^4.1.1",
     "p-wait-for": "^6.0.0",
     "zod": "^4.3.5"
   },
   "devDependencies": {
     "@stylistic/eslint-plugin": "^5.6.1",
+    "@types/ejs": "^3.1.5",
+    "@types/lodash.kebabcase": "^4.1.9",
     "@types/node": "^22.10.5",
     "@typescript-eslint/eslint-plugin": "^8.51.0",
     "@typescript-eslint/parser": "^8.51.0",