@agent-native/core 0.86.0 → 0.87.0

package/corpus/templates/plan/app/components/plan/CanvasArea.tsx

@@ -1,4 +1,6 @@
 import { useT } from "@agent-native/core/client";
+import { Button } from "@agent-native/toolkit/ui/button";
+import { Textarea } from "@agent-native/toolkit/ui/textarea";
 import type {
   PlanAnnotation,
   PlanAnnotationPlacement,
@@ -25,9 +27,6 @@ import {
   type RefObject,
 } from "react";
 
-import { Button } from "@/components/ui/button";
-import { Textarea } from "@/components/ui/textarea";
-
 import { Wireframe, type DesignElementSelection } from "./wireframe/Wireframe";
 
 const useIsomorphicLayoutEffect =

package/corpus/templates/plan/app/components/plan/DocumentArea.tsx

@@ -9,6 +9,8 @@ import {
   useT,
   type RichMarkdownCollabUser,
 } from "@agent-native/core/client";
+import { Button } from "@agent-native/toolkit/ui/button";
+import { Textarea } from "@agent-native/toolkit/ui/textarea";
 import { imageDataSchema, type PlanBlock } from "@shared/plan-content";
 import {
   IconAlertTriangle,
@@ -29,8 +31,6 @@ import {
 } from "react";
 import { toast } from "sonner";
 
-import { Button } from "@/components/ui/button";
-import { Textarea } from "@/components/ui/textarea";
 import { cn } from "@/lib/utils";
 
 import { PlanImageViewer } from "./PlanImageViewer";

package/corpus/templates/plan/app/components/plan/GuestModeBanner.tsx

@@ -1,8 +1,7 @@
 import { useT } from "@agent-native/core/client";
+import { Button } from "@agent-native/toolkit/ui/button";
 import { IconCloudUpload } from "@tabler/icons-react";
 
-import { Button } from "@/components/ui/button";
-
 /**
  * Slim, non-modal "you're a guest" strip for unauthenticated hosted visitors.
  * Public plans can still be viewed without an account, but creating a plan needs

package/corpus/templates/plan/app/components/plan/LocalCodebasePicker.tsx

@@ -1,4 +1,12 @@
 import { setClientAppState, useT } from "@agent-native/core/client";
+import { Badge } from "@agent-native/toolkit/ui/badge";
+import { Button } from "@agent-native/toolkit/ui/button";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "@agent-native/toolkit/ui/tooltip";
 import {
   IconAlertCircle,
   IconCircleCheck,
@@ -10,14 +18,6 @@ import { useQueryClient } from "@tanstack/react-query";
 import { useCallback, useEffect, useMemo, useState } from "react";
 import { toast } from "sonner";
 
-import { Badge } from "@/components/ui/badge";
-import { Button } from "@/components/ui/button";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-} from "@/components/ui/tooltip";
 import {
   chooseLocalCodebase,
   clearLocalCodebaseSelection,

package/corpus/templates/plan/app/components/plan/PlanContentRenderer.tsx

@@ -10,6 +10,7 @@ import {
   type CollabUser,
   type RichMarkdownCollabUser,
 } from "@agent-native/core/client";
+import { Button } from "@agent-native/toolkit/ui/button";
 import type { PlanFileTreeBlock } from "@shared/plan-content";
 import type {
   PlanAnnotation,
@@ -33,7 +34,6 @@ import {
   type ReactNode,
 } from "react";
 
-import { Button } from "@/components/ui/button";
 import { usePlanPresence } from "@/hooks/use-plan-presence";
 import { cn } from "@/lib/utils";
 

package/corpus/templates/plan/app/components/plan/PlanImageViewer.tsx

@@ -1,5 +1,16 @@
 import { useT } from "@agent-native/core/client";
-import * as DialogPrimitive from "@radix-ui/react-dialog";
+import {
+  Dialog,
+  DialogContent,
+  DialogTitle,
+} from "@agent-native/toolkit/ui/dialog";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "@agent-native/toolkit/ui/dropdown-menu";
 import {
   IconCopy,
   IconDownload,
@@ -15,14 +26,6 @@ import {
 } from "@tabler/icons-react";
 import { useState, type MouseEvent } from "react";
 
-import { Dialog, DialogOverlay, DialogTitle } from "@/components/ui/dialog";
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu";
 import { cn } from "@/lib/utils";
 
 import {
@@ -248,82 +251,80 @@ function PlanImageLightbox({
 
   return (
     <Dialog open={open} onOpenChange={handleOpenChange}>
-      <DialogPrimitive.Portal>
-        <DialogOverlay className="z-[250] bg-black/85 backdrop-blur-sm" />
-        <DialogPrimitive.Content
-          className="fixed inset-0 z-[251] flex items-center justify-center focus:outline-none"
-          aria-describedby={undefined}
-          onOpenAutoFocus={(event) => event.preventDefault()}
+      <DialogContent
+        hideClose
+        className="fixed inset-0 left-0 top-0 z-[281] flex h-screen max-h-none w-screen max-w-none translate-x-0 translate-y-0 items-center justify-center gap-0 overflow-hidden rounded-none border-0 bg-black/85 p-0 text-white shadow-none backdrop-blur-sm focus:outline-none data-[state=closed]:zoom-out-100 data-[state=open]:zoom-in-100"
+        aria-describedby={undefined}
+        onOpenAutoFocus={(event) => event.preventDefault()}
+      >
+        <DialogTitle className="sr-only">
+          {alt || t("raw.imageViewer.closePreview")}
+        </DialogTitle>
+
+        <div
+          className="flex h-full w-full items-center justify-center overflow-auto p-6"
+          onClick={(event) => {
+            if (event.target === event.currentTarget) handleOpenChange(false);
+          }}
         >
-          <DialogTitle className="sr-only">
-            {alt || t("raw.imageViewer.closePreview")}
-          </DialogTitle>
+          <img
+            src={src}
+            alt={alt}
+            draggable={false}
+            onClick={() => setZoomed((value) => !value)}
+            className={cn(
+              "rounded-lg shadow-2xl transition-transform",
+              zoomed
+                ? "max-w-none cursor-zoom-out"
+                : "max-h-[90vh] max-w-[92vw] cursor-zoom-in object-contain",
+            )}
+          />
+        </div>
 
-          <div
-            className="flex h-full w-full items-center justify-center overflow-auto p-6"
-            onClick={(event) => {
-              if (event.target === event.currentTarget) handleOpenChange(false);
-            }}
+        <div className="fixed bottom-6 left-1/2 flex -translate-x-1/2 items-center gap-1 rounded-full border border-white/15 bg-black/70 px-2 py-1.5 text-white shadow-xl backdrop-blur">
+          <button
+            type="button"
+            className="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-white/90 transition-colors hover:bg-white/15 disabled:cursor-default disabled:opacity-40"
+            aria-label={t("raw.imageViewer.fitToScreen")}
+            disabled={!zoomed}
+            onClick={() => setZoomed(false)}
           >
-            <img
-              src={src}
-              alt={alt}
-              draggable={false}
-              onClick={() => setZoomed((value) => !value)}
-              className={cn(
-                "rounded-lg shadow-2xl transition-transform",
-                zoomed
-                  ? "max-w-none cursor-zoom-out"
-                  : "max-h-[90vh] max-w-[92vw] cursor-zoom-in object-contain",
-              )}
-            />
-          </div>
-
-          <div className="fixed bottom-6 left-1/2 flex -translate-x-1/2 items-center gap-1 rounded-full border border-white/15 bg-black/70 px-2 py-1.5 text-white shadow-xl backdrop-blur">
-            <button
-              type="button"
-              className="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-white/90 transition-colors hover:bg-white/15 disabled:cursor-default disabled:opacity-40"
-              aria-label={t("raw.imageViewer.fitToScreen")}
-              disabled={!zoomed}
-              onClick={() => setZoomed(false)}
-            >
-              <IconMinus size={17} />
-            </button>
-            <span className="min-w-[5.5rem] text-center text-xs font-medium tabular-nums">
-              {zoomed
-                ? t("raw.imageViewer.actualSize")
-                : t("raw.imageViewer.fitToScreen")}
-            </span>
-            <button
-              type="button"
-              className="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-white/90 transition-colors hover:bg-white/15 disabled:cursor-default disabled:opacity-40"
-              aria-label={t("raw.imageViewer.actualSize")}
-              disabled={zoomed}
-              onClick={() => setZoomed(true)}
-            >
-              <IconPlus size={17} />
-            </button>
-            <span className="mx-1 h-5 w-px bg-white/20" aria-hidden />
-            <button
-              type="button"
-              className="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-white/90 transition-colors hover:bg-white/15"
-              aria-label={t("raw.imageViewer.downloadImage")}
-              onClick={() => void downloadImage(src, alt, actionMessages)}
-            >
-              <IconDownload size={17} />
-            </button>
-            <span className="mx-1 h-5 w-px bg-white/20" aria-hidden />
-            <button
-              type="button"
-              className="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-white/90 transition-colors hover:bg-white/15"
-              aria-label={t("raw.imageViewer.closePreview")}
-              onClick={() => handleOpenChange(false)}
-            >
-              <IconX size={17} />
-            </button>
-          </div>
-        </DialogPrimitive.Content>
-      </DialogPrimitive.Portal>
+            <IconMinus size={17} />
+          </button>
+          <span className="min-w-[5.5rem] text-center text-xs font-medium tabular-nums">
+            {zoomed
+              ? t("raw.imageViewer.actualSize")
+              : t("raw.imageViewer.fitToScreen")}
+          </span>
+          <button
+            type="button"
+            className="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-white/90 transition-colors hover:bg-white/15 disabled:cursor-default disabled:opacity-40"
+            aria-label={t("raw.imageViewer.actualSize")}
+            disabled={zoomed}
+            onClick={() => setZoomed(true)}
+          >
+            <IconPlus size={17} />
+          </button>
+          <span className="mx-1 h-5 w-px bg-white/20" aria-hidden />
+          <button
+            type="button"
+            className="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-white/90 transition-colors hover:bg-white/15"
+            aria-label={t("raw.imageViewer.downloadImage")}
+            onClick={() => void downloadImage(src, alt, actionMessages)}
+          >
+            <IconDownload size={17} />
+          </button>
+          <span className="mx-1 h-5 w-px bg-white/20" aria-hidden />
+          <button
+            type="button"
+            className="inline-flex h-8 w-8 cursor-pointer items-center justify-center rounded-full text-white/90 transition-colors hover:bg-white/15"
+            aria-label={t("raw.imageViewer.closePreview")}
+            onClick={() => handleOpenChange(false)}
+          >
+            <IconX size={17} />
+          </button>
+        </div>
+      </DialogContent>
     </Dialog>
   );
 }

package/corpus/templates/plan/app/components/plan/PlanVisualSurface.tsx

@@ -1,4 +1,7 @@
 import { useT } from "@agent-native/core/client";
+import { Button } from "@agent-native/toolkit/ui/button";
+import { Input } from "@agent-native/toolkit/ui/input";
+import { Label } from "@agent-native/toolkit/ui/label";
 import type { PlanBlock, PlanContent } from "@shared/plan-content";
 import type { PlanAnnotation } from "@shared/plan-content";
 import {
@@ -9,9 +12,6 @@ import {
 } from "@tabler/icons-react";
 import { useEffect, useMemo, useState } from "react";
 
-import { Button } from "@/components/ui/button";
-import { Input } from "@/components/ui/input";
-import { Label } from "@/components/ui/label";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
 
 import {

package/corpus/templates/plan/app/components/plan/planBlocks.tsx

@@ -17,14 +17,14 @@ import {
   useT,
   type RichMarkdownCollabUser,
 } from "@agent-native/core/client";
-import type { PlanBlock } from "@shared/plan-content";
-import { lazy, Suspense, useEffect, useRef, useState } from "react";
-
 import {
   Popover,
   PopoverContent,
   PopoverTrigger,
-} from "@/components/ui/popover";
+} from "@agent-native/toolkit/ui/popover";
+import type { PlanBlock } from "@shared/plan-content";
+import { lazy, Suspense, useEffect, useRef, useState } from "react";
+
 import { cn } from "@/lib/utils";
 
 import { PlanBlockView } from "./DocumentArea";

package/corpus/templates/plan/app/i18n/ar-SA.ts

@@ -641,6 +641,9 @@ const messages = {
       signIn: "تسجيل الدخول",
       haveAccount: "لدي حساب بالفعل",
       retry: "حاول ثانية",
+      sendFeedback: "إرسال الملاحظات",
+      feedbackPlaceholder: "صف ما حدث قبل ظهور خطأ الخطة هذا.",
+      openGitHubIssue: "فتح مشكلة في GitHub",
       joinedOrg: "انضم {{orgName}}. خطة الافتتاح...",
       acceptingInvite: "قبول الدعوة",
       joiningOrg: "الانضمام إلى المنظمة",

package/corpus/templates/plan/app/i18n/de-DE.ts

@@ -653,6 +653,10 @@ const messages = {
       signIn: "Einloggen",
       haveAccount: "Ich habe bereits ein Konto",
       retry: "Versuchen Sie es erneut",
+      sendFeedback: "Feedback senden",
+      feedbackPlaceholder:
+        "Beschreiben Sie, was vor diesem Planfehler passiert ist.",
+      openGitHubIssue: "GitHub-Issue öffnen",
       joinedOrg: "Beigetreten {{orgName}}. Eröffnungsplan...",
       acceptingInvite: "Einladung annehmen",
       joiningOrg: "Beitritt zur Organisation",

package/corpus/templates/plan/app/i18n/en-US.ts

@@ -630,6 +630,10 @@ const messages = {
       signIn: "Sign in",
       haveAccount: "I have an account",
       retry: "Retry",
+      sendFeedback: "Send feedback",
+      feedbackPlaceholder:
+        "Describe what happened before this plan error appeared.",
+      openGitHubIssue: "Open GitHub issue",
       joinedOrg: "Joined {{orgName}}. Opening plan...",
       acceptingInvite: "Accepting invite",
       joiningOrg: "Joining organization",

package/corpus/templates/plan/app/i18n/es-ES.ts

@@ -474,6 +474,10 @@ const messages = {
       requestAccessTitle: "Solicitar acceso a este plan",
       requestSent: "Solicitud enviada",
       retry: "Rever",
+      sendFeedback: "Enviar comentarios",
+      feedbackPlaceholder:
+        "Describe qué pasó antes de que apareciera este error del plan.",
+      openGitHubIssue: "Abrir issue en GitHub",
       retryHelp:
         "Vuelva a intentar la carga o inicie sesión con otra cuenta si se trata de un enlace de plan privado.",
       signIn: "Iniciar sesión",

package/corpus/templates/plan/app/i18n/fr-FR.ts

@@ -476,6 +476,10 @@ const messages = {
       requestAccessTitle: "Demander l'accès à ce plan",
       requestSent: "Demande envoyée",
       retry: "Réessayer",
+      sendFeedback: "Envoyer un retour",
+      feedbackPlaceholder:
+        "Décrivez ce qui s'est passé avant cette erreur de plan.",
+      openGitHubIssue: "Ouvrir une issue GitHub",
       retryHelp:
         "Réessayez le chargement ou connectez-vous avec un autre compte s'il s'agit d'un lien vers un forfait privé.",
       signIn: "Se connecter",

package/corpus/templates/plan/app/i18n/hi-IN.ts

@@ -626,6 +626,9 @@ const messages = {
       signIn: "लॉग इन करें",
       haveAccount: "मेरा पहले से ही खाता है",
       retry: "पुनः प्रयास करें",
+      sendFeedback: "फ़ीडबैक भेजें",
+      feedbackPlaceholder: "इस प्लान त्रुटि से पहले क्या हुआ, उसका वर्णन करें।",
+      openGitHubIssue: "GitHub issue खोलें",
       joinedOrg: "{{orgName}} से जुड़े। उद्घाटन योजना...",
       acceptingInvite: "निमंत्रण स्वीकार कर रहा हूँ",
       joiningOrg: "संगठन से जुड़ना",

package/corpus/templates/plan/app/i18n/ja-JP.ts

@@ -626,6 +626,10 @@ const messages = {
       signIn: "登录",
       haveAccount: "我已有账户",
       retry: "重试",
+      sendFeedback: "フィードバックを送信",
+      feedbackPlaceholder:
+        "このプランエラーの直前に起きたことを説明してください。",
+      openGitHubIssue: "GitHub issue を開く",
       joinedOrg: "已加入 {{orgName}}。正在打开计划...",
       acceptingInvite: "正在接受邀请",
       joiningOrg: "正在加入组织",

package/corpus/templates/plan/app/i18n/ko-KR.ts

@@ -615,6 +615,10 @@ const messages = {
       signIn: "登录",
       haveAccount: "我已有账户",
       retry: "重试",
+      sendFeedback: "피드백 보내기",
+      feedbackPlaceholder:
+        "이 계획 오류가 나타나기 전에 무슨 일이 있었는지 적어 주세요.",
+      openGitHubIssue: "GitHub issue 열기",
       joinedOrg: "已加入 {{orgName}}。正在打开计划...",
       acceptingInvite: "正在接受邀请",
       joiningOrg: "正在加入组织",

package/corpus/templates/plan/app/i18n/pt-BR.ts

@@ -651,6 +651,10 @@ const messages = {
       signIn: "Conecte-se",
       haveAccount: "Eu já tenho uma conta",
       retry: "Tente novamente",
+      sendFeedback: "Enviar feedback",
+      feedbackPlaceholder:
+        "Descreva o que aconteceu antes deste erro do plano aparecer.",
+      openGitHubIssue: "Abrir issue no GitHub",
       joinedOrg: "Inscreveu-se em {{orgName}}. Plano de abertura...",
       acceptingInvite: "Aceitando convite",
       joiningOrg: "Aderindo à organização",

package/corpus/templates/plan/app/i18n/zh-CN.ts

@@ -445,6 +445,9 @@ const messages = {
       requestAccessTitle: "请求访问此计划",
       requestSent: "请求已发送",
       retry: "重试",
+      sendFeedback: "发送反馈",
+      feedbackPlaceholder: "描述此计划错误出现前发生了什么。",
+      openGitHubIssue: "打开 GitHub issue",
       retryHelp: "重试加载，或者如果这是私人计划链接，则使用其他帐户登录。",
       signIn: "登入",
       signInTitle: "登录查看此计划",

package/corpus/templates/plan/app/i18n/zh-TW.ts

@@ -445,6 +445,9 @@ const messages = {
       requestAccessTitle: "請求存取此計畫",
       requestSent: "請求已傳送",
       retry: "重試",
+      sendFeedback: "傳送意見回饋",
+      feedbackPlaceholder: "描述此計畫錯誤出現前發生了什麼。",
+      openGitHubIssue: "開啟 GitHub issue",
       retryHelp: "重試載入，或者如果這是私人計畫連結，則使用其他帳戶登入。",
       signIn: "登入",
       signInTitle: "登入檢視此計畫",