@nextclaw/ui 0.26.1 → 0.26.3

package/src/shared/components/ui/dialog.tsx

@@ -40,6 +40,7 @@ const DialogContent = React.forwardRef<
       data-theme-overlay="dialog"
       className={cn(
         "fixed left-[50%] top-[50%] z-[var(--z-modal,10050)] grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 rounded-2xl border border-border bg-popover p-6 text-popover-foreground shadow-xl duration-base data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
+        "max-md:max-w-[calc(100vw-1.5rem)] max-h-[calc(100dvh-1.5rem)] max-md:max-h-[calc(100dvh-env(safe-area-inset-top,0px)-env(safe-area-inset-bottom,0px)-1.5rem)] overflow-y-auto overscroll-contain",
         className
       )}
       {...props}
@@ -48,7 +49,7 @@ const DialogContent = React.forwardRef<
       }}
     >
       {children}
-      <DialogPrimitive.Close className="absolute right-4 top-4 rounded-lg p-1 opacity-70 transition-all duration-fast hover:bg-[var(--interaction-hover)] hover:text-accent-foreground hover:opacity-100 focus:outline-none focus-visible:ring-1 focus-visible:ring-border disabled:pointer-events-none">
+      <DialogPrimitive.Close className="absolute right-1 top-1 flex h-11 w-11 items-center justify-center rounded-lg opacity-70 transition-all duration-fast hover:bg-[var(--interaction-hover)] hover:text-accent-foreground hover:opacity-100 focus:outline-none focus-visible:ring-1 focus-visible:ring-border disabled:pointer-events-none sm:right-4 sm:top-4 sm:h-6 sm:w-6">
         <X className="h-4 w-4 text-muted-foreground" />
         <span className="sr-only">Close</span>
       </DialogPrimitive.Close>
@@ -63,7 +64,7 @@ const DialogHeader = ({
 }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
+      "flex flex-col space-y-2 pr-7 text-left",
       className
     )}
     {...props}
@@ -77,7 +78,7 @@ const DialogFooter = ({
 }: React.HTMLAttributes<HTMLDivElement>) => (
   <div
     className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-3",
+      "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end sm:gap-3",
       className
     )}
     {...props}

package/src/shared/components/ui/input.tsx

@@ -10,6 +10,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
         type={type}
         className={cn(
           'flex h-9 w-full rounded-xl border border-border/75 bg-card px-3.5 py-2 text-sm text-foreground file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground/55 placeholder:font-normal transition-colors focus:outline-none focus:ring-0 disabled:cursor-not-allowed disabled:opacity-50',
+          'max-md:min-h-[var(--control-touch-size)] max-md:text-base',
           className
         )}
         ref={ref}

package/src/shared/components/ui/select.tsx

@@ -26,6 +26,7 @@ const SelectTrigger = React.forwardRef<
         ref={ref}
         className={cn(
             "flex h-9 w-full items-center justify-between whitespace-nowrap rounded-xl border border-border/75 bg-card px-3 py-2 text-sm text-foreground ring-offset-background placeholder:text-muted-foreground transition-colors focus:outline-none focus:ring-0 focus:border-border disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+            'max-md:min-h-[var(--control-touch-size)]',
             className
         )}
         {...props}
@@ -120,7 +121,7 @@ const SelectItem = React.forwardRef<
     <SelectPrimitive.Item
         ref={ref}
         className={cn(
-            "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 hover:bg-[var(--interaction-hover)]",
+            "relative flex max-md:min-h-[var(--control-touch-size)] w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 hover:bg-[var(--interaction-hover)]",
             className
         )}
         {...props}

package/src/shared/components/ui/tab-strip/compact-tab-strip.tsx

@@ -2,6 +2,7 @@ import * as React from "react";
 import { MoreVertical, X } from "lucide-react";
 import {
   IconActionButton,
+  IconActionGroup,
   type IconActionButtonProps,
 } from "@/shared/components/ui/actions/icon-action-button";
 import {
@@ -305,13 +306,14 @@ export function CompactTabStrip({
           ))}
         </div>
       </div>
-      <div
-        className={cn("flex shrink-0 items-center gap-1", actionsClassName)}
+      <IconActionGroup
+        className={actionsClassName}
         data-testid={actionsTestId}
         onPointerDown={(event) => event.stopPropagation()}
       >
         {actions.map((action) => (
           <IconActionButton
+            size="sm"
             key={action.key}
             icon={action.icon}
             label={action.label}
@@ -320,7 +322,7 @@ export function CompactTabStrip({
             className={actionButtonClassName}
           />
         ))}
-      </div>
+      </IconActionGroup>
     </div>
   );
 }

package/src/shared/components/ui/tabs.tsx

@@ -63,7 +63,7 @@ export function TabsList({ children, className }: TabsListProps) {
       role="tablist"
       onKeyDown={handleKeyDown}
       className={cn(
-        'inline-flex h-9 items-center justify-center rounded-xl bg-muted p-1 text-muted-foreground',
+        'inline-flex h-9 max-md:h-auto items-center justify-center rounded-xl bg-muted p-1 text-muted-foreground',
         className
       )}
     >
@@ -87,7 +87,7 @@ export function TabsTrigger({ value, children, className }: TabsTriggerProps) {
       tabIndex={isActive ? 0 : -1}
       data-state={isActive ? 'active' : 'inactive'}
       className={cn(
-        'inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-[13px] font-medium transition-all duration-fast focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border disabled:pointer-events-none disabled:opacity-50',
+        'inline-flex max-md:min-h-[var(--control-touch-size)] items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-[13px] font-medium transition-all duration-fast focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border disabled:pointer-events-none disabled:opacity-50',
         isActive
           ? 'bg-card text-foreground shadow-sm'
           : 'text-muted-foreground hover:bg-[var(--interaction-hover)] hover:text-accent-foreground',

package/src/shared/components/ui/textarea.tsx

@@ -8,6 +8,7 @@ export const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
     <textarea
       className={cn(
         "flex min-h-28 w-full rounded-xl border border-border/75 bg-card px-3.5 py-2.5 text-sm text-foreground placeholder:text-muted-foreground/55 placeholder:font-normal transition-colors focus:outline-none focus:ring-0 disabled:cursor-not-allowed disabled:opacity-50",
+        'max-md:text-base',
         className,
       )}
       ref={ref}

package/src/shared/components/workbench/workbench-surface-toolbar.tsx

@@ -7,7 +7,7 @@ import {
   PictureInPicture2,
   X,
 } from "lucide-react";
-import { IconActionButton } from "@/shared/components/ui/actions/icon-action-button";
+import { IconActionButton, IconActionGroup } from "@/shared/components/ui/actions/icon-action-button";
 import { t } from "@/shared/lib/i18n";
 import type { WorkbenchSurfaceState } from "./types/workbench-surface.types";
 
@@ -33,8 +33,7 @@ export function WorkbenchSurfaceToolbar({
   onOpenMain?: () => void;
 }) {
   return (
-    <div
-      className="flex shrink-0 items-center gap-0.5"
+    <IconActionGroup
       data-workbench-actions=""
     >
       {onOpenMain && (
@@ -97,6 +96,6 @@ export function WorkbenchSurfaceToolbar({
         label={closeLabel}
         onClick={onClose}
       />
-    </div>
+    </IconActionGroup>
   );
 }

package/src/shared/components/workbench/workbench-surface.tsx

@@ -265,8 +265,8 @@ export function WorkbenchSurface({
       }}
     >
       <header
-        className="flex min-h-10 shrink-0 select-none items-center gap-2 border-b border-border/60 bg-muted/30 px-2"
-        style={{ touchAction: floating ? "none" : undefined }}
+        className="flex min-h-10 shrink-0 select-none items-center gap-1 border-b border-border/60 bg-muted/30 px-2"
+        style={{ touchAction: floating ? "none" : undefined, paddingTop: isCompact ? "env(safe-area-inset-top, 0px)" : undefined }}
         onPointerDown={(event) => startInteraction(event)}
         onDoubleClick={(event) => {
           if (!isCompact && !blocksDrag(event.target))

package/src/shared/lib/i18n/locales/en-US/agents.json

@@ -1,5 +1,7 @@
 {
   "agentsPageTitle": "Agents",
+  "mobileAgents": "Agents",
+  "mobileNavigation": "Main navigation",
   "agentsPageDescription": "Manage conversational agent identities. Each agent owns its home directory, setup, memory, and skills.",
   "agentsHeroEyebrow": "Agent Gallery",
   "agentsHeroTitle": "Give every agent the presence of a real collaborator",

package/src/shared/lib/i18n/locales/en-US/core.json

@@ -1,4 +1,5 @@
 {
+  "refresh": "Refresh",
   "chat": "Chat",
   "model": "Model",
   "searchChannels": "Search Channels",

package/src/shared/lib/i18n/locales/en-US/desktop-update.json

@@ -4,7 +4,7 @@
   "runtimeUpdatesPageDescription": "NextClaw checks every two hours; you choose when to start each update.",
   "runtimeUpdatesUnavailableTitle": "Updates Are Currently Unavailable",
   "runtimeUpdatesUnavailableDescription": "This runtime environment does not currently expose an update host.",
-  "runtimeUpdatesUnavailableHint": "The update entry appears automatically once the host supports updates.",
+  "runtimeUpdatesUnavailableHint": "Update using the method you used to install NextClaw. An update button will appear when in-app updates are supported.",
   "runtimeUpdatesHostVersion": "Host Version",
   "runtimeUpdatesDownloadedBannerDescription": "Version {version} has finished downloading and is ready to finish updating.",
   "runtimeUpdatesActionsDescription": "Check manually, then complete the update in one action whenever you are ready.",

package/src/shared/lib/i18n/locales/zh-CN/agents.json

@@ -1,5 +1,7 @@
 {
   "agentsPageTitle": "Agent 管理",
+  "mobileAgents": "Agent",
+  "mobileNavigation": "主导航",
   "agentsPageDescription": "管理可对话的 Agent 身份。每个 Agent 都有自己的主目录、设定、记忆与技能。",
   "agentsHeroEyebrow": "Agent 管理台",
   "agentsHeroTitle": "让每个 Agent 都像真正的协作者一样存在",

package/src/shared/lib/i18n/locales/zh-CN/core.json

@@ -1,4 +1,5 @@
 {
+  "refresh": "刷新",
   "chat": "对话",
   "model": "模型",
   "searchChannels": "搜索渠道",

package/src/shared/lib/i18n/locales/zh-CN/desktop-update.json

@@ -4,7 +4,7 @@
   "runtimeUpdatesPageDescription": "系统每两小时自动检查新版本；发现更新后，由你决定何时开始更新。",
   "runtimeUpdatesUnavailableTitle": "当前环境暂不支持更新",
   "runtimeUpdatesUnavailableDescription": "这个运行环境暂时没有可用的更新宿主。",
-  "runtimeUpdatesUnavailableHint": "更新入口会在宿主支持后自动出现，不需要前端单独区分环境。",
+  "runtimeUpdatesUnavailableHint": "请使用安装 NextClaw 时的方式更新；支持应用内更新后，更新按钮会自动出现。",
   "runtimeUpdatesHostVersion": "宿主版本",
   "runtimeUpdatesDownloadedBannerDescription": "版本 {version} 已下载完成，可以继续完成更新。",
   "runtimeUpdatesActionsDescription": "你可以手动检查，并在准备好之后一次完成更新。",