@inf-monkeys-tech/monkeys-design 2.0.66 → 2.0.67

package/dist/index.js

@@ -31474,8 +31474,8 @@ function WorkbenchTaskCard({
       "data-monkeys-component": "workbench-task-card",
       "data-view-mode": viewMode,
       className: cn(
-        "border-border/70",
-        viewMode === "grid" ? "flex h-full flex-col gap-5 rounded-lg border bg-card p-5 shadow-sm" : "grid items-center gap-6 border-b py-8 last:border-b-0 lg:grid-cols-2 lg:gap-10",
+        "border-border/70 font-[family-name:var(--font-sans)] text-sm leading-5",
+        viewMode === "grid" ? "flex h-full flex-col gap-global rounded-lg border bg-card p-global shadow-sm" : "grid items-center gap-global border-b py-global last:border-b-0 lg:grid-cols-2",
         className
       ),
       children: [
@@ -31488,11 +31488,11 @@ function WorkbenchTaskCard({
               viewMode === "grid" ? "flex-1" : "min-h-60"
             ),
             children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 flex flex-wrap items-center gap-x-3 gap-y-2", children: heading }),
-              metadata != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 flex flex-wrap items-center gap-x-4 gap-y-2 text-xs tabular-nums text-muted-foreground [&_span]:text-inherit [&_time]:text-inherit", children: metadata }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-global flex flex-wrap items-center gap-global", children: heading }),
+              metadata != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-global flex flex-wrap items-center gap-global text-sm tabular-nums text-muted-foreground [&_span]:text-inherit [&_time]:text-inherit", children: metadata }),
               children,
-              message != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-3 break-words text-sm text-destructive-text", children: message }),
-              actions != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto flex flex-wrap gap-3 pt-6", children: actions })
+              message != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-global break-words text-sm text-destructive-text", children: message }),
+              actions != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-auto flex flex-wrap gap-global pt-global", children: actions })
             ]
           }
         ),
@@ -31524,40 +31524,36 @@ function WorkbenchTaskToolbar({
     {
       "data-monkeys-component": "workbench-task-toolbar",
       classNames: {
-        root: "min-h-0 flex-row flex-wrap items-center gap-4 border-0 px-0 pt-0 pb-3",
-        end: "max-w-full flex-wrap gap-2"
+        root: "min-h-0 flex-row flex-wrap items-center gap-global border-0 p-0 font-[family-name:var(--font-sans)] text-sm leading-5",
+        end: "max-w-full flex-wrap gap-global"
       },
       className,
       end: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         filters,
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            Button,
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-global", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            BaseButton,
             {
               type: "button",
               variant: "outline",
               disabled,
               title: labels.sort,
-              className: "h-10 min-w-28 gap-2 rounded-xl bg-muted/40 px-4 text-sm font-medium shadow-none hover:bg-muted/70",
+              icon: sortOrder === "latest" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowDownWideNarrow, {}) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUpNarrowWide, {}),
+              className: "h-10 min-w-28 gap-global rounded-lg bg-muted/40 px-global py-global-1/2 text-sm font-medium shadow-none hover:bg-muted/70",
               onClick: () => onSortOrderChange(sortOrder === "latest" ? "oldest" : "latest"),
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { "data-slot": "icon", children: sortOrder === "latest" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowDownWideNarrow, {}) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUpNarrowWide, {}) }),
-                sortOrder === "latest" ? labels.latest : labels.oldest
-              ]
+              children: sortOrder === "latest" ? labels.latest : labels.oldest
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsxs(
-            Button,
+          /* @__PURE__ */ jsxRuntime.jsx(
+            BaseButton,
             {
               type: "button",
               variant: "outline",
               disabled,
-              className: "h-10 gap-2 rounded-xl bg-muted/40 px-4 text-sm font-medium shadow-none hover:bg-muted/70",
+              icon: viewMode === "list" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Grid2X2, {}) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LayoutList, {}),
+              className: "h-10 gap-global rounded-lg bg-muted/40 px-global py-global-1/2 text-sm font-medium shadow-none hover:bg-muted/70",
               onClick: () => onViewModeChange(viewMode === "list" ? "grid" : "list"),
-              children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { "data-slot": "icon", children: viewMode === "list" ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Grid2X2, {}) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.LayoutList, {}) }),
-                viewMode === "list" ? labels.gridView : labels.listView
-              ]
+              children: viewMode === "list" ? labels.gridView : labels.listView
             }
           )
         ] })
@@ -31579,7 +31575,7 @@ function WorkbenchTaskOutputs({
   onPreview,
   className
 }) {
-  const size = viewMode === "grid" ? "aspect-square w-full" : "aspect-square w-[calc((100%-2.25rem)/4)] min-w-32 max-w-48";
+  const size = viewMode === "grid" ? "aspect-square w-full" : "aspect-square w-[calc((100%-3*var(--global-spacing))/4)] min-w-32 max-w-48";
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -31588,7 +31584,7 @@ function WorkbenchTaskOutputs({
       "aria-label": ariaLabel,
       tabIndex: 0,
       className: cn(
-        "flex w-full min-w-0 snap-x snap-proximity items-center gap-3 overflow-x-auto py-2 focus-visible:outline focus-visible:outline-2",
+        "flex w-full min-w-0 snap-x snap-proximity items-center gap-global overflow-x-auto py-global-1/2 font-[family-name:var(--font-sans)] text-sm leading-5 focus-visible:outline focus-visible:outline-2",
         className
       ),
       children: [
@@ -31620,7 +31616,7 @@ function WorkbenchTaskOutputs({
           ) : /* @__PURE__ */ jsxRuntime.jsx(
             "pre",
             {
-              className: "h-60 w-full min-w-0 shrink-0 snap-start overflow-auto whitespace-pre-wrap break-words rounded-xl border bg-muted/20 p-4 text-xs",
+              className: "h-60 w-full min-w-0 shrink-0 snap-start overflow-auto whitespace-pre-wrap break-words rounded-lg border bg-muted/20 p-global font-[family-name:var(--font-sans)] text-sm leading-5",
               children: item.content
             },
             item.id
@@ -31643,7 +31639,7 @@ function WorkbenchTaskOutputs({
               }
             )
           }
-        ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-h-60 w-full items-center justify-center rounded-xl border border-dashed bg-muted/20 p-5 text-center text-sm text-muted-foreground", children: emptyState }))
+        ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-h-60 w-full items-center justify-center rounded-lg border border-dashed bg-muted/20 p-global text-center text-sm text-muted-foreground", children: emptyState }))
       ]
     }
   );
@@ -31738,7 +31734,7 @@ function WorkbenchTaskPrompt({
     "div",
     {
       "data-monkeys-component": "workbench-task-prompt",
-      className: cn("min-w-0", className),
+      className: cn("min-w-0 font-[family-name:var(--font-sans)] text-sm leading-5", className),
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "p",
@@ -31746,7 +31742,7 @@ function WorkbenchTaskPrompt({
             ref,
             id,
             className: cn(
-              "whitespace-pre-wrap break-words text-sm leading-6 text-foreground [overflow-wrap:anywhere]",
+              "whitespace-pre-wrap break-words text-sm leading-5 text-foreground [overflow-wrap:anywhere]",
               !expanded && "line-clamp-3"
             ),
             children: content
@@ -31759,7 +31755,7 @@ function WorkbenchTaskPrompt({
             "aria-expanded": expanded,
             "aria-controls": id,
             onClick: () => setExpanded((value) => !value),
-            className: "mt-2 inline-flex min-h-8 items-center gap-1 rounded px-1 text-sm font-semibold text-foreground underline underline-offset-4 hover:bg-muted focus-visible:outline focus-visible:outline-2",
+            className: "mt-global-1/2 inline-flex min-h-8 items-center gap-global-1/2 rounded-lg px-global-1/2 text-sm font-medium text-foreground underline underline-offset-4 hover:bg-muted focus-visible:outline focus-visible:outline-2",
             children: [
               expanded ? labels.less : labels.more,
               expanded ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUp, { "aria-hidden": "true", className: "size-4" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { "aria-hidden": "true", className: "size-4" })