fix: polish canvas send icon and text edit dialog

components/agents/AgentImageTextEditDialog.tsx

@@ -368,8 +368,8 @@ export function AgentImageTextEditDialog({
 
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
-      <DialogContent className="max-h-[88vh] overflow-hidden border-slate-200 bg-white p-0 sm:max-w-[620px] dark:border-zinc-800 dark:bg-zinc-950">
-        <DialogHeader className="border-b border-slate-200 px-6 py-4 dark:border-zinc-800">
+      <DialogContent className="flex max-h-[90vh] flex-col overflow-hidden border-slate-200 bg-white p-0 sm:max-w-[620px] dark:border-zinc-800 dark:bg-zinc-950">
+        <DialogHeader className="shrink-0 border-b border-slate-200 px-6 py-4 dark:border-zinc-800">
           <DialogTitle className="flex items-center gap-2 text-left text-lg">
             <Type className="h-5 w-5" />
             <span>编辑文字</span>
@@ -380,7 +380,7 @@ export function AgentImageTextEditDialog({
           </DialogDescription>
         </DialogHeader>
 
-        <div className="agent-dark-scrollbar max-h-[calc(88vh-156px)] space-y-4 overflow-y-auto px-6 py-5">
+        <div className="agent-dark-scrollbar min-h-0 flex-1 space-y-4 overflow-y-auto px-6 py-5">
           {normalizedImageUrl ? (
             <div className="overflow-hidden rounded-2xl border border-slate-200 bg-slate-50 dark:border-zinc-800 dark:bg-zinc-900">
               <img
@@ -519,7 +519,7 @@ export function AgentImageTextEditDialog({
           ) : null}
         </div>
 
-        <div className="flex items-center justify-between gap-3 border-t border-slate-200 px-6 py-4 dark:border-zinc-800">
+        <div className="shrink-0 flex items-center justify-between gap-3 border-t border-slate-200 px-6 py-4 dark:border-zinc-800">
           <Button
             type="button"
             variant="outline"

components/canvas/CanvasToolbarIcon.tsx

@@ -14,6 +14,27 @@ type CanvasToolbarIconProps = {
   active?: boolean;
 };
 
+function isSvgIconUrl(url: string) {
+  return (
+    /^data:image\/svg\+xml/i.test(url) ||
+    /\.svg(?:[?#].*)?$/i.test(url)
+  );
+}
+
+function stripImageFilterClasses(className?: string) {
+  return String(className || "")
+    .split(/\s+/)
+    .filter(
+      (token) =>
+        token &&
+        token !== "brightness-0" &&
+        token !== "invert" &&
+        token !== "dark:invert" &&
+        token !== "dark:invert-0"
+    )
+    .join(" ");
+}
+
 export function CanvasToolbarIcon({
   item,
   iconUrl,
@@ -25,6 +46,29 @@ export function CanvasToolbarIcon({
   const resolvedIconUrl = String(iconUrl || item?.iconUrl || "").trim();
 
   if (resolvedIconUrl) {
+    if (isSvgIconUrl(resolvedIconUrl)) {
+      return (
+        <span
+          aria-hidden="true"
+          className={cn(
+            "inline-block shrink-0 bg-current",
+            stripImageFilterClasses(className)
+          )}
+          style={{
+            WebkitMaskImage: `url("${resolvedIconUrl}")`,
+            maskImage: `url("${resolvedIconUrl}")`,
+            WebkitMaskRepeat: "no-repeat",
+            maskRepeat: "no-repeat",
+            WebkitMaskPosition: "center",
+            maskPosition: "center",
+            WebkitMaskSize: "contain",
+            maskSize: "contain",
+            ...style,
+          }}
+        />
+      );
+    }
+
     return (
       <img
         alt=""