@akanjs/cli 2.4.2-rc.3 → 3.0.0-alpha.0

package/templates/appSample/lib/task/Task.View.tsx

@@ -4,7 +4,8 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: { a
   return {
     filename: "Task.View.tsx",
     content: `import { type cnst, usePage } from "@apps/${dict.appName}/client";
-import { clsx } from "akanjs/client";
+import { cn } from "akanjs/client";
+import { badgeRecipe } from "akanjs/ui";
 
 // ===== Task.View.tsx =====
 // Convention: lib/<module>/ — PascalCase .tsx, View suffix = detail display component.
@@ -20,25 +21,25 @@ interface GeneralProps {
 export const General = ({ className, task }: GeneralProps) => {
   const { l } = usePage();
   const statusColor = {
-    todo: "text-base-content/50",
+    todo: "text-foreground/50",
     inProgress: "text-primary",
     completed: "text-success",
   }[task.status];
 
   return (
-    <div className={clsx("flex w-full flex-col gap-4", className)}>
+    <div className={cn("flex w-full flex-col gap-4", className)}>
       <div>
-        <h1 className="font-bold text-2xl text-base-content">{task.title}</h1>
-        <div className={clsx("mt-1 font-medium text-sm", statusColor)}>{l(\`taskStatus.\${task.status}\`)}</div>
+        <h1 className="font-bold text-2xl text-foreground">{task.title}</h1>
+        <div className={cn("mt-1 font-medium text-sm", statusColor)}>{l(\`taskStatus.\${task.status}\`)}</div>
       </div>
 
       {task.content && (
-        <div className="rounded-lg border border-base-content/10 bg-base-100 p-4">
-          <p className="whitespace-pre-wrap text-base-content/80 text-sm">{task.content}</p>
+        <div className="rounded-lg border border-foreground/10 bg-background p-4">
+          <p className="whitespace-pre-wrap text-foreground/80 text-sm">{task.content}</p>
         </div>
       )}
 
-      <div className="flex items-center gap-4 text-base-content/60 text-sm">
+      <div className="flex items-center gap-4 text-foreground/60 text-sm">
         <div>
           <span className="font-medium">{l("task.taskDueLabel")} </span>
           {task.due ? task.due.toDate().toLocaleDateString() : l("task.taskNoDue")}
@@ -46,23 +47,25 @@ export const General = ({ className, task }: GeneralProps) => {
       </div>
 
       {task.workHistory && task.workHistory.length > 0 && (
-        <div className="mt-2 border-base-content/10 border-t pt-4">
-          <h3 className="mb-3 font-semibold text-base-content text-sm">{l("task.taskWorkHistoryTitle")}</h3>
+        <div className="mt-2 border-foreground/10 border-t pt-4">
+          <h3 className="mb-3 font-semibold text-foreground text-sm">{l("task.taskWorkHistoryTitle")}</h3>
           <ul className="space-y-2">
             {task.workHistory.map((entry, i) => (
               <li key={i} className="flex items-start gap-3 text-sm">
                 <span
-                  className={clsx("badge badge-xs mt-0.5 shrink-0", {
-                    "badge-ghost": entry.action === "created",
-                    "badge-primary": entry.action === "started",
-                    "badge-success": entry.action === "completed",
-                  })}
+                  className={cn(
+                    badgeRecipe({
+                      variant:
+                        entry.action === "started" ? "primary" : entry.action === "completed" ? "success" : "default",
+                    }),
+                    "mt-0.5 shrink-0",
+                  )}
                 >
                   {l(\`workHistoryAction.\${entry.action}\`)}
                 </span>
                 <div>
-                  <span className="text-base-content/60">{entry.at.toDate().toLocaleString()}</span>
-                  {entry.note && <span className="ml-2 text-base-content/50">{entry.note}</span>}
+                  <span className="text-foreground/60">{entry.at.toDate().toLocaleString()}</span>
+                  {entry.note && <span className="ml-2 text-foreground/50">{entry.note}</span>}
                 </div>
               </li>
             ))}
@@ -76,9 +79,9 @@ export const General = ({ className, task }: GeneralProps) => {
 // ---- Expandable additional fields: ----
 // Compact: for narrow spaces like sidebars or modals
 // export const Compact = ({ className, task }: CompactProps) => (
-//   <div className={clsx("text-sm", className)}>
+//   <div className={cn("text-sm", className)}>
 //     <span className="font-medium">{task.title}</span>
-//     {task.due && <span className="text-base-content/50 ml-2">Due: {new Date(task.due).toLocaleDateString()}</span>}
+//     {task.due && <span className="text-foreground/50 ml-2">Due: {new Date(task.due).toLocaleDateString()}</span>}
 //   </div>
 // );
 `,

package/templates/appSample/lib/task/Task.Zone.tsx

@@ -6,7 +6,7 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: { a
     content: `"use client";
 import { type cnst, Task, usePage } from "@apps/${dict.appName}/client";
 import type { ClientInit, ClientView } from "akanjs/fetch";
-import { Link, Load } from "akanjs/ui";
+import { Link, Load, buttonRecipe } from "akanjs/ui";
 
 // ===== Task.Zone.tsx =====
 // Convention: lib/<module>/ — PascalCase .tsx, Zone suffix = composition layer between pages and UI.
@@ -28,9 +28,9 @@ export const Card = ({ className, init }: CardProps) => {
       init={init}
       renderEmpty={() => (
         <div className="flex flex-col items-center gap-4 py-16 text-center">
-          <div className="text-base-content/40 text-lg">{l("task.taskNoTasks")}</div>
+          <div className="text-foreground/40 text-lg">{l("task.taskNoTasks")}</div>
           <Link href="/task/new">
-            <button className="btn btn-primary btn-sm">{l("task.taskCreateFirst")}</button>
+            <button className={buttonRecipe({ variant: "primary", size: "sm" })}>{l("task.taskCreateFirst")}</button>
           </Link>
         </div>
       )}

package/templates/appSample/page/task/[taskId]/_index.tsx

@@ -6,7 +6,7 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: { a
     content: `
 import { fetch, usePage } from "@apps/${dict.appName}/client";
 import { Task } from "@apps/${dict.appName}/lib/task";
-import { Link } from "akanjs/ui";
+import { Link, buttonRecipe } from "akanjs/ui";
 
 // ===== page/task/[taskId]/_index.tsx =====
 // Convention: Akan.js file-based routing with dynamic segments.
@@ -22,10 +22,10 @@ export default async function Page({ params: { taskId } }: PageProps) {
   return (
     <main className="mx-auto max-w-4xl px-6 py-8">
       <div className="mb-6 flex items-center justify-between">
-        <a href="/task" className="btn btn-ghost btn-sm">
+        <a href="/task" className={buttonRecipe({ variant: "ghost", size: "sm" })}>
           {l("task.taskBackToTasks")}
         </a>
-        <Link href={\`/task/\${taskId}/edit\`} className="btn btn-primary btn-sm">
+        <Link href={\`/task/\${taskId}/edit\`} className={buttonRecipe({ variant: "primary", size: "sm" })}>
           {l("task.taskEdit")}
         </Link>
       </div>

package/templates/appSample/page/task/[taskId]/edit.tsx

@@ -4,7 +4,7 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: { a
   return {
     filename: "edit.tsx",
     content: `import { fetch, Task } from "@apps/${dict.appName}/client";
-import { Load, Link } from "akanjs/ui";
+import { Load, Link, buttonRecipe } from "akanjs/ui";
 
 // ===== page/task/[taskId]/edit.tsx =====
 // Convention: Server-side edit form page using Load.Edit from akanjs/ui.
@@ -21,15 +21,15 @@ export default async function Page({ params: { taskId } }: PageProps) {
   return (
     <main className="mx-auto max-w-2xl px-6 py-8">
       <div className="mb-6">
-        <Link href={\`/task/\${taskId}\`} className="btn btn-ghost btn-sm">
+        <Link href={\`/task/\${taskId}\`} className={buttonRecipe({ variant: "ghost", size: "sm" })}>
           ← Back to Task
         </Link>
       </div>
       <div className="mb-6">
-        <h1 className="font-extrabold text-3xl text-base-content">Edit Task</h1>
-        <p className="mt-1 text-base-content/60 text-sm">Update the task details</p>
+        <h1 className="font-extrabold text-3xl text-foreground">Edit Task</h1>
+        <p className="mt-1 text-foreground/60 text-sm">Update the task details</p>
       </div>
-      <div className="rounded-xl border border-base-content/10 bg-base-100 p-6 shadow-sm">
+      <div className="rounded-xl border border-foreground/10 bg-background p-6 shadow-sm">
         <Load.Edit slice={fetch.slice.taskInPublic} edit={taskEdit} type="form" onSubmit={\`/task/\${taskId}\`}>
           <Task.Template.General />
         </Load.Edit>

package/templates/appSample/page/task/_index.tsx

@@ -4,7 +4,7 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: { a
   return {
     filename: "_index.tsx",
     content: `import { fetch, Task, usePage } from "@apps/${dict.appName}/client";
-import { Link } from "akanjs/ui";
+import { Link, buttonRecipe } from "akanjs/ui";
 
 // ===== page/task/_index.tsx =====
 // Convention: Akan.js file-based routing — _index.tsx is the index page for /task.
@@ -18,10 +18,10 @@ export default async function Page() {
     <main className="mx-auto max-w-4xl px-6 py-8">
       <div className="mb-6 flex items-center justify-between">
         <div>
-          <h1 className="font-extrabold text-3xl text-base-content">{l("task.modelName")}</h1>
-          <p className="mt-1 text-base-content/60 text-sm">{l("task.modelDesc")}</p>
+          <h1 className="font-extrabold text-3xl text-foreground">{l("task.modelName")}</h1>
+          <p className="mt-1 text-foreground/60 text-sm">{l("task.modelDesc")}</p>
         </div>
-        <Link href="/task/new" className="btn btn-primary btn-sm">
+        <Link href="/task/new" className={buttonRecipe({ variant: "primary", size: "sm" })}>
           {l("task.taskNew")}
         </Link>
       </div>

package/templates/appSample/page/task/_layout.tsx

@@ -14,7 +14,7 @@ interface LayoutProps {
 }
 export default function Layout({ children }: LayoutProps) {
   return (
-    <div className="min-h-screen bg-base-200">
+    <div className="min-h-screen bg-muted">
       {children}
     </div>
   );

package/templates/appSample/page/task/new.tsx

@@ -4,7 +4,7 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: { a
   return {
     filename: "new.tsx",
     content: `import { type cnst, fetch, Task, usePage } from "@apps/${dict.appName}/client";
-import { Load, Link } from "akanjs/ui";
+import { Load, Link, buttonRecipe } from "akanjs/ui";
 
 // ===== page/task/new.tsx =====
 // Convention: Server-side form page using Load.Edit from akanjs/ui.
@@ -19,15 +19,15 @@ export default async function Page() {
   return (
     <main className="mx-auto max-w-2xl px-6 py-8">
       <div className="mb-6">
-        <Link href="/task" className="btn btn-ghost btn-sm">
+        <Link href="/task" className={buttonRecipe({ variant: "ghost", size: "sm" })}>
           ← Tasks
         </Link>
       </div>
       <div className="mb-6">
-        <h1 className="font-extrabold text-3xl text-base-content">New Task</h1>
-        <p className="mt-1 text-base-content/60 text-sm">Create a new task with title and description</p>
+        <h1 className="font-extrabold text-3xl text-foreground">New Task</h1>
+        <p className="mt-1 text-foreground/60 text-sm">Create a new task with title and description</p>
       </div>
-      <div className="rounded-xl border border-base-content/10 bg-base-100 p-6 shadow-sm">
+      <div className="rounded-xl border border-foreground/10 bg-background p-6 shadow-sm">
         <Load.Edit slice={fetch.slice.taskInPublic} edit={taskForm} type="form" onCancel="back" onSubmit="/task">
           <Task.Template.General />
         </Load.Edit>

package/templates/appSample/ui/GlobalLoading.tsx

@@ -5,7 +5,7 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: { a
     filename: "GlobalLoading.tsx",
     content: `"use client";
 
-import { clsx } from "akanjs/client";
+import { cn } from "akanjs/client";
 
 // ===== GlobalLoading.tsx =====
 // Convention: ui/ folder — reusable visual components. PascalCase .tsx, "use client" directive.
@@ -19,9 +19,9 @@ interface GlobalLoadingProps {
 
 export const GlobalLoading = ({ className, message = "Loading..." }: GlobalLoadingProps) => {
   return (
-    <div className={clsx("flex flex-col items-center justify-center gap-4 py-32", className)}>
-      <span className="loading loading-spinner loading-lg text-primary" />
-      <span className="text-base-content/60 text-sm">{message}</span>
+    <div className={cn("flex flex-col items-center justify-center gap-4 py-32", className)}>
+      <span className="inline-block size-8 animate-spin rounded-full border-2 border-primary border-t-transparent" />
+      <span className="text-foreground/60 text-sm">{message}</span>
     </div>
   );
 };

package/templates/appSample/ui/QuantityControl.tsx

@@ -5,7 +5,8 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: { a
     filename: "QuantityControl.tsx",
     content: `"use client";
 
-import { clsx } from "akanjs/client";
+import { cn } from "akanjs/client";
+import { buttonRecipe } from "akanjs/ui";
 
 // ===== QuantityControl.tsx =====
 // Convention: ui/ folder — reusable visual components. PascalCase .tsx, "use client" directive.
@@ -28,9 +29,9 @@ export const QuantityControl = ({
   max = 99,
 }: QuantityControlProps) => {
   return (
-    <div className={clsx("inline-flex items-center gap-1", className)}>
+    <div className={cn("inline-flex items-center gap-1", className)}>
       <button
-        className="btn btn-circle btn-outline btn-xs"
+        className={buttonRecipe({ variant: "outline", size: "icon" }, "size-6 rounded-full")}
         disabled={value <= min}
         onClick={() => onChange(Math.max(min, value - 1))}
       >
@@ -38,7 +39,7 @@ export const QuantityControl = ({
       </button>
       <span className="w-8 text-center font-medium tabular-nums">{value}</span>
       <button
-        className="btn btn-circle btn-outline btn-xs"
+        className={buttonRecipe({ variant: "outline", size: "icon" }, "size-6 rounded-full")}
         disabled={value >= max}
         onClick={() => onChange(Math.min(max, value + 1))}
       >

package/templates/crudPages/[__model__Id]/page.tsx

@@ -38,7 +38,7 @@ export default async function Page({ params }: PageProps) {
       <div className="flex gap-4 font-bold text-lg items-center">
         <${dict.Model}.Zone.View view={${dict.model}View} />
         <Link href={\`/${dict.model}/\${${dict.model}.id}/edit\`}>
-          <button className="btn">
+          <button className="inline-flex items-center justify-center gap-2 rounded-field bg-primary px-4 py-2 font-medium text-primary-foreground text-sm transition-colors hover:bg-primary/90">
             {l("base.updateModel", { model: l("${dict.model}.modelName") })}
           </button>
         </Link>

package/templates/crudPages/page.tsx

@@ -23,7 +23,7 @@ export default async function Page() {
         <div className="animate-fadeIn px-4 pt-4 flex gap-4 items-center">
           <div className="font-bold text-lg md:text-4xl">${dict.Model}s</div>
           <Link href={\`/${dict.model}/new\`}>
-            <button className="btn">+ {l("base.createModel", { model: l("${dict.model}.modelName") })}</button>
+            <button className="inline-flex items-center justify-center gap-2 rounded-field bg-primary px-4 py-2 font-medium text-primary-foreground text-sm transition-colors hover:bg-primary/90">+ {l("base.createModel", { model: l("${dict.model}.modelName") })}</button>
           </Link>
         </div>
         <div>{l("${dict.model}.modelDesc")}</div>

package/templates/crudSinglePage/page.tsx

@@ -20,7 +20,7 @@ export default async function Page() {
     <>
       <div className="animate-fadeIn flex items-center gap-4 px-4 pt-4">
         <div className="text-lg font-bold md:text-4xl">{l("${dict.model}.modelName")}</div>
-        <Model.New className="btn btn-ghost" slice={fetch.slice["${dict.model}InPublic"]} renderTitle="id">
+        <Model.New className="inline-flex items-center gap-2 rounded-field px-3 py-1.5 text-sm transition-colors hover:bg-muted" slice={fetch.slice["${dict.model}InPublic"]} renderTitle="id">
           <${dict.Model}.Template.General />
         </Model.New>
       </div>

package/templates/module/__Model__.Template.tsx

@@ -4,6 +4,7 @@ interface Dict {
   Model: string;
   model: string;
   sysName: string;
+  sysType: string;
 }
 export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: Dict) {
   return {
@@ -11,7 +12,7 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: Dic
     content: `
 "use client";
 import { Field, Layout } from "akanjs/ui";
-import { st, usePage } from "@${scanInfo?.type ?? "apps"}/${dict.sysName}/client";
+import { st, usePage } from "@${dict.sysType}s/${dict.sysName}/client";
 
 interface GeneralProps {
   className?: string;

package/templates/module/__Model__.Unit.tsx

@@ -4,13 +4,14 @@ interface Dict {
   Model: string;
   model: string;
   sysName: string;
+  sysType: string;
 }
 export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: Dict) {
   return {
     filename: `${dict.Model}.Unit.tsx`,
     content: `
 import type { ModelProps } from "akanjs/client";
-import { cnst, usePage } from "@${scanInfo?.type ?? "apps"}/${dict.sysName}/client";
+import { cnst, usePage } from "@${dict.sysType}s/${dict.sysName}/client";
 import { Link } from "akanjs/ui";
 
 export const Card = ({ ${dict.model}, href }: ModelProps<"${dict.model}", cnst.Light${dict.Model}>) => {

package/templates/module/__Model__.Util.tsx

@@ -4,6 +4,7 @@ interface Dict {
   Model: string;
   model: string;
   sysName: string;
+  sysType: string;
 }
 export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: Dict) {
   return {
@@ -11,7 +12,7 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: Dic
     content: `
 "use client";
 import { Model } from "akanjs/ui";
-import { fetch, usePage } from "@${scanInfo?.type ?? "apps"}/${dict.sysName}/client";
+import { fetch, usePage } from "@${dict.sysType}s/${dict.sysName}/client";
 import { BiTrash } from "react-icons/bi";
 
 interface RemoveProps {

package/templates/module/__Model__.View.tsx

@@ -4,13 +4,14 @@ interface Dict {
   Model: string;
   model: string;
   sysName: string;
+  sysType: string;
 }
 export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: Dict) {
   return {
     filename: `${dict.Model}.View.tsx`,
     content: `
-import { clsx } from "akanjs/client";
-import { cnst, usePage } from "@${scanInfo?.type ?? "apps"}/${dict.sysName}/client";
+import { cn } from "akanjs/client";
+import { cnst, usePage } from "@${dict.sysType}s/${dict.sysName}/client";
 
 interface GeneralProps {
   className?: string;
@@ -19,7 +20,7 @@ interface GeneralProps {
 export const General = ({ className, ${dict.model} }: GeneralProps) => {
   const { l } = usePage();
   return (
-    <div className={clsx("w-full", className)}>
+    <div className={cn("w-full", className)}>
       <div>{l("${dict.model}.name")}: {${dict.model}.name}</div>
     </div>
   );

package/templates/module/__Model__.Zone.tsx

@@ -4,6 +4,7 @@ interface Dict {
   Model: string;
   model: string;
   sysName: string;
+  sysType: string;
 }
 export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: Dict) {
   return {
@@ -13,7 +14,7 @@ export default function getContent(scanInfo: AppInfo | LibInfo | null, dict: Dic
 import { Load } from "akanjs/ui";
 // Alias the domain namespace so the Card/View exports below never collide with the model name
 // (a model literally named "card" or "view" would otherwise shadow this import).
-import { type cnst, ${dict.Model} as ${dict.Model}Domain } from "@${scanInfo?.type ?? "apps"}/${dict.sysName}/client";
+import { type cnst, ${dict.Model} as ${dict.Model}Domain } from "@${dict.sysType}s/${dict.sysName}/client";
 import type { ClientInit, ClientView, SliceMeta } from "akanjs/fetch";
 
 interface CardProps {

package/templates/workspaceRoot/AGENTS.md.template

@@ -239,7 +239,7 @@ final fallback when no CLI command covers the change.
 | Add a pure workflow / integration (e.g., Payment, Email) | `lib/_<service>/` → service, signal, store, dictionary, abstract | `akan sync <name>` |
 | Add a reusable value type (e.g., Address, WorkHistory) | `lib/__scalar/<type>/` → constant, dictionary, abstract | `akan sync <name>` |
 | Create a new URL-visitable page | `page/` → `_index.tsx`, `_layout.tsx`, `[param]/_index.tsx` | Rebuild (akan start auto-detects) |
-| Change the app color theme / design tokens | `apps/<app>/page/styles.css` → edit the daisyUI `@plugin "daisyui/theme"` blocks (`light`/`dark`, the `--color-*` variables) | akan start hot-reloads |
+| Change the app color theme / design tokens | `apps/<app>/page/styles.css` → override the semantic token values under `:root, [data-theme="dark"]` and `[data-theme="light"]` (`--primary`, `--background`, `--foreground`, …) | akan start hot-reloads |
 | Add a form or reusable UI component | `ui/` → PascalCase `.tsx` with `"use client"` if needed | `akan sync <name>` |
 | Add a React hook or browser helper | `webkit/` → camelCase `.ts` with `"use client"` | `akan sync <name>` |
 | Add a server-only guard, middleware, or adaptor | `srvkit/` → PascalCase `.ts` | `akan sync <name>` |
@@ -439,11 +439,9 @@ const form = st.use.taskForm();
 
 // 4. apps/<app>/lib/<model>/<Model>.Unit.tsx
 // Display the new field in card/list views
-<span className={clsx("badge badge-sm", {
-  "badge-error": task.priority === "high",
-  "badge-warning": task.priority === "medium",
-  "badge-ghost": task.priority === "low",
-})}>{task.priority}</span>
+<Badge variant={task.priority === "high" ? "error" : task.priority === "medium" ? "warning" : "default"}>
+  {task.priority}
+</Badge>
 
 // 5. Regenerate barrels
 // akan sync <name>
@@ -632,7 +630,7 @@ async startTask(taskId: string) {
 
 // 6. <Model>.Util.tsx — Reusable button component
 export const Start = ({ taskId }: { taskId: string }) => (
-  <button className="btn btn-xs btn-primary" onClick={() => st.do.startTask(taskId)}>
+  <button className={buttonRecipe({ variant: "primary", size: "xs" })} onClick={() => st.do.startTask(taskId)}>
     Start
   </button>
 );
@@ -694,13 +692,13 @@ export class TaskInsight extends via(Task, (field) => ({
 // 3. <Model>.View.tsx — Display component consuming an Insight model
 export const Stats = ({ taskInsight }: { taskInsight: cnst.TaskInsight }) => (
   <div className="grid grid-cols-2 gap-4">
-    <div className="stat rounded-lg border border-base-content/10 bg-base-100 p-4">
-      <div className="stat-title text-base-content/60">{l("task.totalCount")}</div>
-      <div className="stat-value text-primary">{taskInsight.totalCount}</div>
+    <div className="rounded-lg border border-border bg-card p-4">
+      <div className="text-muted-foreground text-sm">{l("task.totalCount")}</div>
+      <div className="font-bold text-2xl text-primary">{taskInsight.totalCount}</div>
     </div>
-    <div className="stat rounded-lg border border-base-content/10 bg-base-100 p-4">
-      <div className="stat-title text-base-content/60">{l("task.completedCount")}</div>
-      <div className="stat-value text-success">{taskInsight.completedCount}</div>
+    <div className="rounded-lg border border-border bg-card p-4">
+      <div className="text-muted-foreground text-sm">{l("task.completedCount")}</div>
+      <div className="font-bold text-2xl text-success">{taskInsight.completedCount}</div>
     </div>
   </div>
 );

package/templates/workspaceRoot/biome.json.template

@@ -93,7 +93,7 @@
           "fix": "safe",
           "options": {
             "attributes": ["classList"],
-            "functions": ["clsx", "cva"]
+            "functions": ["clsx", "cn"]
           }
         }
       },

package/{workflow.command-yy0d9gk3.js → workflow.command-jswbgk90.js}

@@ -1,32 +1,33 @@
 // @bun
 import {
   WorkflowRunner
-} from "./index-h971erkm.js";
-import {
-  ScalarScript
-} from "./index-z5v766nx.js";
+} from "./index-csqk9z5j.js";
 import {
   PrimitiveScript
-} from "./index-acwxfncv.js";
+} from "./index-r4w8cry5.js";
 import {
   ModuleScript
-} from "./index-04as43rp.js";
-import"./index-dgeaqwmw.js";
+} from "./index-vhv3xnjz.js";
+import"./index-hjzr8ja1.js";
+import {
+  ScalarScript
+} from "./index-fmgbwsr5.js";
 import"./index-ss469dec.js";
-import"./index-v9jqrdd1.js";
+import"./index-3pgtw35d.js";
+import"./index-4yp06pn1.js";
 import {
   createWorkflowStepRegistry
-} from "./index-pfnh87f9.js";
-import"./index-xftstr5s.js";
-import"./index-nsj2ftxj.js";
+} from "./index-4zgs8g1w.js";
+import"./index-xwgm94zr.js";
 import {
   Workspace,
   command,
   script
-} from "./index-d0h48d2f.js";
-import"./index-xwfg9bam.js";
-import"./index-67546d0j.js";
+} from "./index-jk9q6pse.js";
+import"./index-jtm86byd.js";
 import"./index-6pz1j0zj.js";
+import"./index-xys926f2.js";
+import"./index-67546d0j.js";
 import"./index-r24hmh0q.js";
 
 // pkgs/@akanjs/cli/workflow/workflow.script.ts