@newt-app/templates 0.17.0 → 0.18.0

package/dist/index.js

@@ -474,38 +474,38 @@ export default function Home() {
   return (
     <main className="max-w-lg mx-auto min-h-full px-4 py-8 space-y-4">
       <div className="pb-4 border-b">
-        <p className="font-mono text-sm text-gray-400">apps/web/page.tsx</p>
-        <p className="text-sm text-gray-400">Delete me to get started!</p>
+        <p className="font-mono text-sm text-muted-foreground">apps/web/page.tsx</p>
+        <p className="text-sm text-muted-foreground">Delete me to get started!</p>
       </div>
 
       <div className="flex items-center gap-3 py-2">
         <Logo className="w-10 h-auto text-foreground" />
         <div>
           <h1 className="text-4xl font-black tracking-tight"><%= projectName %></h1>
-          <p className="text-sm text-gray-400 tracking-widest uppercase">
+          <p className="text-sm text-muted-foreground tracking-widest uppercase">
             Next + Nest = Newt \u{1F49C}
           </p>
         </div>
       </div>
 
       <div className="rounded-xl border p-6 space-y-1">
-        <p className="text-xs font-mono uppercase tracking-widest text-gray-400">next.js</p>
-        <p className="font-mono text-sm text-gray-400">apps/web/layout.tsx</p>
-        <p className="text-sm text-gray-400">Next.js rendering</p>
+        <p className="text-xs font-mono uppercase tracking-widest text-muted-foreground">next.js</p>
+        <p className="font-mono text-sm text-muted-foreground">apps/web/layout.tsx</p>
+        <p className="text-sm text-muted-foreground">Next.js rendering</p>
       </div>
 
       <div className="rounded-xl border p-6 space-y-1">
-        <p className="text-xs font-mono uppercase tracking-widest text-gray-400">nest.js</p>
-        <p className="font-mono text-sm text-gray-400">GET /api/hello</p>
-        <pre className="mt-2 border rounded-md p-3 text-sm bg-neutral-800">
+        <p className="text-xs font-mono uppercase tracking-widest text-muted-foreground">nest.js</p>
+        <p className="font-mono text-sm text-muted-foreground">GET /api/hello</p>
+        <pre className="mt-2 border rounded-md p-3 text-sm bg-muted/50">
           <code>{JSON.stringify(hello, null, 2)}</code>
         </pre>
       </div>
 
       <div className="rounded-xl border p-6">
-        <p className="text-xs font-mono uppercase tracking-widest text-gray-400 mb-4">better-auth</p>
+        <p className="text-xs font-mono uppercase tracking-widest text-muted-foreground mb-4">better-auth</p>
         {isPending ? (
-          <p className="text-sm text-gray-400">Loading\u2026</p>
+          <p className="text-sm text-muted-foreground">Loading\u2026</p>
         ) : session ? (
           <div className="space-y-3">
             <p className="text-sm">Signed in as {session.user.name}</p>
@@ -519,7 +519,7 @@ export default function Home() {
       </div>
 
       <div className="px-2 py-4 text-sm">
-        <p className="mb-2 text-gray-400">Learn more</p>
+        <p className="mb-2 text-muted-foreground">Learn more</p>
         <ul className="list-disc list-inside space-y-2 mt-2">
           <li>
             <Link href="https://github.com">GitHub</Link>
@@ -587,7 +587,7 @@ export function AuthForm() {
           className={
             tab === 'signup'
               ? 'font-semibold'
-              : 'text-gray-400 hover:text-gray-200'
+              : 'text-muted-foreground hover:text-gray-200'
           }
         >
           Sign up
@@ -598,7 +598,7 @@ export function AuthForm() {
           className={
             tab === 'signin'
               ? 'font-semibold'
-              : 'text-gray-400 hover:text-gray-200'
+              : 'text-muted-foreground hover:text-gray-200'
           }
         >
           Sign in
@@ -622,7 +622,7 @@ export function AuthForm() {
                   value={field.state.value}
                   onChange={(e) => field.handleChange(e.target.value)}
                   required
-                  className="flex h-9 w-full rounded-md border border-neutral-700 bg-neutral-800/50 px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none placeholder:text-neutral-500 focus-visible:border-neutral-500 focus-visible:ring-2 focus-visible:ring-neutral-500/20"
+                  className="flex h-9 w-full rounded-md border border-neutral-700 bg-muted/50/50 px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none placeholder:text-neutral-500 focus-visible:border-neutral-500 focus-visible:ring-2 focus-visible:ring-neutral-500/20"
                 />
               </div>
             )}
@@ -638,7 +638,7 @@ export function AuthForm() {
                 value={field.state.value}
                 onChange={(e) => field.handleChange(e.target.value)}
                 required
-                className="flex h-9 w-full rounded-md border border-neutral-700 bg-neutral-800/50 px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none placeholder:text-neutral-500 focus-visible:border-neutral-500 focus-visible:ring-2 focus-visible:ring-neutral-500/20"
+                className="flex h-9 w-full rounded-md border border-neutral-700 bg-muted/50/50 px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none placeholder:text-neutral-500 focus-visible:border-neutral-500 focus-visible:ring-2 focus-visible:ring-neutral-500/20"
               />
             </div>
           )}
@@ -654,7 +654,7 @@ export function AuthForm() {
                 onChange={(e) => field.handleChange(e.target.value)}
                 required
                 minLength={8}
-                className="flex h-9 w-full rounded-md border border-neutral-700 bg-neutral-800/50 px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none placeholder:text-neutral-500 focus-visible:border-neutral-500 focus-visible:ring-2 focus-visible:ring-neutral-500/20"
+                className="flex h-9 w-full rounded-md border border-neutral-700 bg-muted/50/50 px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none placeholder:text-neutral-500 focus-visible:border-neutral-500 focus-visible:ring-2 focus-visible:ring-neutral-500/20"
               />
             </div>
           )}
@@ -1260,6 +1260,7 @@ var globals_css_default = {
 :root {
   --background: oklch(0.145 0 0);
   --foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
   --muted-foreground: oklch(0.708 0 0);
   --border: oklch(0.469 0 0);
 }
@@ -1267,6 +1268,7 @@ var globals_css_default = {
 @theme inline {
   --color-background: var(--background);
   --color-foreground: var(--foreground);
+  --color-muted: var(--muted);
   --color-muted-foreground: var(--muted-foreground);
   --color-border: var(--border);
 }
@@ -1328,6 +1330,31 @@ var ui = {
 };
 var ui_default = ui;
 
+// src/shadcn-ui/templates/components-json.ts
+var components_json_default = {
+  filename: "packages/ui/components.json",
+  template: `{
+  "$schema": "https://ui.shadcn.com/schema.json",
+  "style": "base-nova",
+  "rsc": true,
+  "tsx": true,
+  "tailwind": {
+    "config": "",
+    "css": "src/styles/globals.css",
+    "baseColor": "neutral",
+    "cssVariables": true
+  },
+  "iconLibrary": "lucide",
+  "aliases": {
+    "components": "@<%= projectName %>/ui/components",
+    "utils": "@<%= projectName %>/ui/lib/utils",
+    "hooks": "@<%= projectName %>/ui/hooks",
+    "lib": "@<%= projectName %>/ui/lib",
+    "ui": "@<%= projectName %>/ui/components"
+  }
+}`
+};
+
 // src/shadcn-ui/templates/package-json.ts
 var package_json_default6 = {
   filename: "packages/ui/package.json",
@@ -9025,7 +9052,8 @@ var shadcnUi = {
     toggle_group_default,
     toggle_default,
     tooltip_default,
-    mode_toggle_default
+    mode_toggle_default,
+    components_json_default
   ],
   packages: [
     { package: "next-themes", module: "apps/web", version: "^0.4.6" }
@@ -10594,7 +10622,7 @@ export function TodoList({
     <>
       <div className="flex items-center justify-between mb-8">
         <h1 className="text-2xl font-semibold">Todos</h1>
-        <div className="flex items-center gap-3 text-sm text-gray-400">
+        <div className="flex items-center gap-3 text-sm text-muted-foreground">
           <span>{session.user.email}</span>
           <button
             className="hover:text-gray-100"
@@ -10618,7 +10646,7 @@ export function TodoList({
               value={field.state.value}
               onChange={(e) => field.handleChange(e.target.value)}
               placeholder="New todo\u2026"
-              className="flex h-9 flex-1 rounded-md border border-neutral-700 bg-neutral-800/50 px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none placeholder:text-neutral-500 focus-visible:border-neutral-500 focus-visible:ring-2 focus-visible:ring-neutral-500/20"
+              className="flex h-9 flex-1 rounded-md border border-neutral-700 bg-muted/50/50 px-3 py-1 text-sm shadow-xs transition-[color,box-shadow] outline-none placeholder:text-neutral-500 focus-visible:border-neutral-500 focus-visible:ring-2 focus-visible:ring-neutral-500/20"
             />
           )}
         </form.Field>
@@ -10633,7 +10661,7 @@ export function TodoList({
       </form>
 
       {isPending ? (
-        <p className="text-sm text-gray-400">Loading\u2026</p>
+        <p className="text-sm text-muted-foreground">Loading\u2026</p>
       ) : (
         <ul className="divide-y divide-neutral-700">
           {todos.map((todo) => (
@@ -10644,7 +10672,7 @@ export function TodoList({
                 onChange={() => toggleMutation.mutate(todo.id)}
               />
               <span
-                className={\`flex-1 text-sm \${todo.done ? 'line-through text-gray-400' : ''}\`}
+                className={\`flex-1 text-sm \${todo.done ? 'line-through text-muted-foreground' : ''}\`}
               >
                 {todo.title}
               </span>
@@ -10660,7 +10688,7 @@ export function TodoList({
       )}
 
       {!isPending && todos.length === 0 && (
-        <p className="text-sm text-gray-400">No todos yet.</p>
+        <p className="text-sm text-muted-foreground">No todos yet.</p>
       )}
     </>
   );
@@ -10690,38 +10718,38 @@ export default function Home() {
   return (
     <main className="max-w-lg mx-auto min-h-full px-4 py-8 space-y-4">
       <div className="pb-4 border-b">
-        <p className="font-mono text-sm text-gray-400">apps/web/page.tsx</p>
-        <p className="text-sm text-gray-400">Delete me to get started!</p>
+        <p className="font-mono text-sm text-muted-foreground">apps/web/page.tsx</p>
+        <p className="text-sm text-muted-foreground">Delete me to get started!</p>
       </div>
 
       <div className="flex items-center gap-3 py-2">
         <Logo className="w-10 h-auto text-foreground" />
         <div>
           <h1 className="text-4xl font-black tracking-tight"><%= projectName %></h1>
-          <p className="text-sm text-gray-400 tracking-widest uppercase">
+          <p className="text-sm text-muted-foreground tracking-widest uppercase">
             Next + Nest = Newt \u{1F49C}
           </p>
         </div>
       </div>
 
       <div className="rounded-xl border p-6 space-y-1">
-        <p className="text-xs font-mono uppercase tracking-widest text-gray-400">next.js</p>
-        <p className="font-mono text-sm text-gray-400">apps/web/layout.tsx</p>
-        <p className="text-sm text-gray-400">Next.js rendering</p>
+        <p className="text-xs font-mono uppercase tracking-widest text-muted-foreground">next.js</p>
+        <p className="font-mono text-sm text-muted-foreground">apps/web/layout.tsx</p>
+        <p className="text-sm text-muted-foreground">Next.js rendering</p>
       </div>
 
       <div className="rounded-xl border p-6 space-y-1">
-        <p className="text-xs font-mono uppercase tracking-widest text-gray-400">nest.js</p>
-        <p className="font-mono text-sm text-gray-400">GET /api/hello</p>
-        <pre className="mt-2 border rounded-md p-3 text-sm bg-neutral-800">
+        <p className="text-xs font-mono uppercase tracking-widest text-muted-foreground">nest.js</p>
+        <p className="font-mono text-sm text-muted-foreground">GET /api/hello</p>
+        <pre className="mt-2 border rounded-md p-3 text-sm bg-muted/50">
           <code>{JSON.stringify(hello, null, 2)}</code>
         </pre>
       </div>
 
       <div className="rounded-xl border p-6">
-        <p className="text-xs font-mono uppercase tracking-widest text-gray-400 mb-4">better-auth</p>
+        <p className="text-xs font-mono uppercase tracking-widest text-muted-foreground mb-4">better-auth</p>
         {isPending ? (
-          <p className="text-sm text-gray-400">Loading\u2026</p>
+          <p className="text-sm text-muted-foreground">Loading\u2026</p>
         ) : session ? (
           <TodoList session={session} />
         ) : (
@@ -10730,7 +10758,7 @@ export default function Home() {
       </div>
 
       <div className="px-2 py-4 text-sm">
-        <p className="mb-2 text-gray-400">Learn more</p>
+        <p className="mb-2 text-muted-foreground">Learn more</p>
         <ul className="list-disc list-inside space-y-2 mt-2">
           <li>
             <Link href="https://github.com">GitHub</Link>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@newt-app/templates",
-  "version": "0.17.0",
+  "version": "0.18.0",
   "private": false,
   "description": "Templates for newt-app",
   "type": "module",