@baishuyun/ai-design 2.0.37 → 2.1.0-alpha.0

package/src/components/generate-animation.tsx

@@ -1,56 +1,56 @@
-import classNames from "classnames";
-
-export const GenerateAnimation = (props: { children?: React.ReactNode, className?: string }) => {
-  return (
-    <div className={classNames("flex items-center gap-[6px]", props.className)}>
-      <div className="flex gap-[2px] flex-shrink-0" style={{ marginRight: '6px' }}>
-        <div
-          className="w-[5px] h-[5px] rounded-full bg-[#999] flex-shrink-0"
-          style={{
-            animation: 'pulse 1.0s ease-in-out infinite',
-            animationDelay: '0s',
-            width: '5px',
-            height: '5px',
-            background: '#999',
-            marginRight: '3px',
-          }}
-        />
-        <div
-          className="w-[5px] h-[5px] rounded-full bg-[#999] flex-shrink-0"
-          style={{
-            animation: 'pulse 1.0s ease-in-out infinite',
-            width: '5px',
-            height: '5px',
-            background: '#999',
-            animationDelay: '0.2s',
-            marginRight: '3px',
-          }}
-        />
-        <div
-          className="w-[5px] h-[5px] rounded-full bg-[#999] flex-shrink-0"
-          style={{
-            animation: 'pulse 1.0s ease-in-out infinite',
-            width: '5px',
-            height: '5px',
-            marginRight: '3px',
-            background: '#999',
-            animationDelay: '0.4s',
-          }}
-        />
-      </div>
-      <span className="text-[14px] text-[#999]">{props.children || '处理中'}</span>
-      <style>{`
-        @keyframes pulse {
-          0%, 60%, 100% {
-            opacity: 0.3;
-            transform: scale(1);
-          }
-          30% {
-            opacity: 1;
-            transform: scale(1.2);
-          }
-        }
-      `}</style>
-    </div>
-  );
-};
+import classNames from "classnames";
+
+export const GenerateAnimation = (props: { children?: React.ReactNode, className?: string }) => {
+  return (
+    <div className={classNames("flex items-center gap-[6px]", props.className)}>
+      <div className="flex gap-[2px] flex-shrink-0" style={{ marginRight: '6px' }}>
+        <div
+          className="w-[5px] h-[5px] rounded-full bg-[#999] flex-shrink-0"
+          style={{
+            animation: 'pulse 1.0s ease-in-out infinite',
+            animationDelay: '0s',
+            width: '5px',
+            height: '5px',
+            background: '#999',
+            marginRight: '3px',
+          }}
+        />
+        <div
+          className="w-[5px] h-[5px] rounded-full bg-[#999] flex-shrink-0"
+          style={{
+            animation: 'pulse 1.0s ease-in-out infinite',
+            width: '5px',
+            height: '5px',
+            background: '#999',
+            animationDelay: '0.2s',
+            marginRight: '3px',
+          }}
+        />
+        <div
+          className="w-[5px] h-[5px] rounded-full bg-[#999] flex-shrink-0"
+          style={{
+            animation: 'pulse 1.0s ease-in-out infinite',
+            width: '5px',
+            height: '5px',
+            marginRight: '3px',
+            background: '#999',
+            animationDelay: '0.4s',
+          }}
+        />
+      </div>
+      <span className="text-[14px] text-[#999]">{props.children || '处理中'}</span>
+      <style>{`
+        @keyframes pulse {
+          0%, 60%, 100% {
+            opacity: 0.3;
+            transform: scale(1);
+          }
+          30% {
+            opacity: 1;
+            transform: scale(1.2);
+          }
+        }
+      `}</style>
+    </div>
+  );
+};

package/src/components/icon-btn.tsx

@@ -1,43 +1,43 @@
-import { ReactNode, forwardRef } from 'react';
-import { Button, ButtonProps } from './ui/button';
-import { cn } from '../lib/utils';
-import { transCls } from '../const/ui';
-import { BsTooltip } from './tooltip';
-
-export interface IconBtnProps extends ButtonProps {
-  icon: ReactNode;
-  rounded?: boolean;
-  tooltip?: string;
-}
-
-export const IconBtn = forwardRef<HTMLButtonElement, IconBtnProps>(
-  ({ icon, className, tooltip, size, rounded, ...rest }, ref) => {
-    const btn = (
-      <Button
-        ref={ref}
-        variant="ghost"
-        size="icon"
-        className={cn(
-          'p-2.5',
-          {
-            'rounded-full w-[26px] h-[26px] aspect-square !text-[#121111]': rounded,
-            'rounded-[4px]': !rounded,
-          },
-          'cursor-pointer',
-          'hover:!bg-[#EFF0F6]',
-          className,
-          transCls
-        )}
-        {...rest}
-      >
-        {icon}
-      </Button>
-    );
-
-    if (tooltip) {
-      return <BsTooltip content={tooltip}>{btn}</BsTooltip>;
-    }
-
-    return btn;
-  }
-);
+import { ReactNode, forwardRef } from 'react';
+import { Button, ButtonProps } from './ui/button';
+import { cn } from '../lib/utils';
+import { transCls } from '../const/ui';
+import { BsTooltip } from './tooltip';
+
+export interface IconBtnProps extends ButtonProps {
+  icon: ReactNode;
+  rounded?: boolean;
+  tooltip?: string;
+}
+
+export const IconBtn = forwardRef<HTMLButtonElement, IconBtnProps>(
+  ({ icon, className, tooltip, size, rounded, ...rest }, ref) => {
+    const btn = (
+      <Button
+        ref={ref}
+        variant="ghost"
+        size="icon"
+        className={cn(
+          'p-2.5',
+          {
+            'rounded-full w-[26px] h-[26px] aspect-square !text-[#121111]': rounded,
+            'rounded-[4px]': !rounded,
+          },
+          'cursor-pointer',
+          'hover:!bg-[#EFF0F6]',
+          className,
+          transCls
+        )}
+        {...rest}
+      >
+        {icon}
+      </Button>
+    );
+
+    if (tooltip) {
+      return <BsTooltip content={tooltip}>{btn}</BsTooltip>;
+    }
+
+    return btn;
+  }
+);

package/src/components/icon-card.tsx

@@ -1,67 +1,67 @@
-import { ReactNode } from 'react';
-import { cn } from '../lib/utils';
-import { transCls } from '../const/ui';
-
-export interface IconCardProps {
-  icon: ReactNode;
-  iconBgColor: string;
-  title: string;
-  description: string;
-  height?: number;
-  selected?: boolean;
-  badge?: string;
-  onClick: () => void;
-}
-
-export const IconCard = ({
-  icon,
-  iconBgColor,
-  title,
-  description,
-  height,
-  selected,
-  badge,
-  onClick,
-}: IconCardProps) => {
-  return (
-    <div
-      className={cn(
-        'flex flex-col p-[10px] rounded-[4px] cursor-pointer',
-        'border',
-        {
-          'bg-[#EFF0F6] border-[#EFF0F6]': selected,
-          'bg-white border-[#E0E0E0]': !selected,
-        },
-        transCls
-      )}
-      style={{ height }}
-      onClick={onClick}
-    >
-      <div className="flex items-start gap-[12px] w-full">
-        <div
-          className="shrink-0 size-[42px] rounded-[23px] flex items-center justify-center p-[7px]"
-          style={{ backgroundColor: iconBgColor }}
-        >
-          <div className="size-[28px] flex items-center justify-center">
-            {icon}
-          </div>
-        </div>
-        <div className="flex flex-col gap-[6px] min-w-0 flex-1">
-          <div className="flex items-center justify-between w-full">
-            <p className="text-[14px] font-bold text-[#030303] truncate">
-              {title}
-            </p>
-            {badge && (
-              <span className="shrink-0 bg-[#4ACCC1] text-white text-[12px] leading-[normal] px-[6px] h-[20px] rounded-[4px] flex items-center justify-center ml-[8px]">
-                {badge}
-              </span>
-            )}
-          </div>
-          <p className="text-[12px] text-[#999] w-full">
-            {description}
-          </p>
-        </div>
-      </div>
-    </div>
-  );
-};
+import { ReactNode } from 'react';
+import { cn } from '../lib/utils';
+import { transCls } from '../const/ui';
+
+export interface IconCardProps {
+  icon: ReactNode;
+  iconBgColor: string;
+  title: string;
+  description: string;
+  height?: number;
+  selected?: boolean;
+  badge?: string;
+  onClick: () => void;
+}
+
+export const IconCard = ({
+  icon,
+  iconBgColor,
+  title,
+  description,
+  height,
+  selected,
+  badge,
+  onClick,
+}: IconCardProps) => {
+  return (
+    <div
+      className={cn(
+        'flex flex-col p-[10px] rounded-[4px] cursor-pointer',
+        'border',
+        {
+          'bg-[#EFF0F6] border-[#EFF0F6]': selected,
+          'bg-white border-[#E0E0E0]': !selected,
+        },
+        transCls
+      )}
+      style={{ height }}
+      onClick={onClick}
+    >
+      <div className="flex items-start gap-[12px] w-full">
+        <div
+          className="shrink-0 size-[42px] rounded-[23px] flex items-center justify-center p-[7px]"
+          style={{ backgroundColor: iconBgColor }}
+        >
+          <div className="size-[28px] flex items-center justify-center">
+            {icon}
+          </div>
+        </div>
+        <div className="flex flex-col gap-[6px] min-w-0 flex-1">
+          <div className="flex items-center justify-between w-full">
+            <p className="text-[14px] font-bold text-[#030303] truncate">
+              {title}
+            </p>
+            {badge && (
+              <span className="shrink-0 bg-[#4ACCC1] text-white text-[12px] leading-[normal] px-[6px] h-[20px] rounded-[4px] flex items-center justify-center ml-[8px]">
+                {badge}
+              </span>
+            )}
+          </div>
+          <p className="text-[12px] text-[#999] w-full">
+            {description}
+          </p>
+        </div>
+      </div>
+    </div>
+  );
+};

package/src/components/icons/calendar-icon.tsx

@@ -1,5 +1,5 @@
-export const CalendarIcon = ({ className }: { className?: string }) => (
-  <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none" className={className}>
-  <path d="M4.396 3.383H4.576C4.846 3.383 4.95 2.993 4.95 2.723V0.569C4.95 0.299 4.815 0 4.546 0H4.366C4.096 0 3.978 0.299 3.978 0.569V2.813C3.978 2.993 4.128 3.383 4.396 3.383ZM9.322 3.383H9.5C9.77 3.383 9.89 2.993 9.89 2.723V0.569C9.89 0.299 9.783 0 9.516 0H9.335C9.066 0 8.933 0.299 8.933 0.569V2.813C8.933 2.993 9.142 3.383 9.322 3.383ZM12.147 0.971053L10.5 0.971V1.924L12.147 1.92405C12.685 1.92405 13.135 2.45405 13.135 2.99305V3.89105H0.928V2.99305C0.928 2.45505 1.378 1.92505 1.917 1.92505L3.5 1.925V0.972L2.005 0.972053C0.928 0.972053 0 2.09505 0 3.08205V11.7911C0 12.7791 0.905053 14 1.98305 14H12.2131C13.2011 14 14 12.8681 14 11.7911V3.08305C13.912 2.09605 13.224 0.973053 12.146 0.973053V0.970053L12.147 0.971053ZM13.084 11.7011C13.084 12.3291 12.7541 13.044 12.1241 13.044H1.98505C1.44705 13.044 0.959 12.3291 0.959 11.7911V4.78805H13.088V11.7001H13.086L13.084 11.7011ZM8.63004 5.94605C8.96004 5.94605 9.17804 6.34705 9.07204 6.71005L9.03904 6.80005L6.69705 11.9791C6.57005 12.2561 6.28405 12.3561 6.05705 12.2021C5.85705 12.0641 5.77005 11.7721 5.84205 11.5151L5.87705 11.4191L7.83205 7.09705H5.35005C5.12005 7.09705 4.92805 6.89505 4.88905 6.62605L4.88105 6.52205C4.88105 6.24005 5.04705 6.00505 5.26505 5.95605L5.34905 5.94705L8.63004 5.94605ZM8.5 0.972V1.924H5.43V0.972H8.502H8.5Z" fill="#666666"/>
-</svg>
-);
+export const CalendarIcon = ({ className }: { className?: string }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none" className={className}>
+  <path d="M4.396 3.383H4.576C4.846 3.383 4.95 2.993 4.95 2.723V0.569C4.95 0.299 4.815 0 4.546 0H4.366C4.096 0 3.978 0.299 3.978 0.569V2.813C3.978 2.993 4.128 3.383 4.396 3.383ZM9.322 3.383H9.5C9.77 3.383 9.89 2.993 9.89 2.723V0.569C9.89 0.299 9.783 0 9.516 0H9.335C9.066 0 8.933 0.299 8.933 0.569V2.813C8.933 2.993 9.142 3.383 9.322 3.383ZM12.147 0.971053L10.5 0.971V1.924L12.147 1.92405C12.685 1.92405 13.135 2.45405 13.135 2.99305V3.89105H0.928V2.99305C0.928 2.45505 1.378 1.92505 1.917 1.92505L3.5 1.925V0.972L2.005 0.972053C0.928 0.972053 0 2.09505 0 3.08205V11.7911C0 12.7791 0.905053 14 1.98305 14H12.2131C13.2011 14 14 12.8681 14 11.7911V3.08305C13.912 2.09605 13.224 0.973053 12.146 0.973053V0.970053L12.147 0.971053ZM13.084 11.7011C13.084 12.3291 12.7541 13.044 12.1241 13.044H1.98505C1.44705 13.044 0.959 12.3291 0.959 11.7911V4.78805H13.088V11.7001H13.086L13.084 11.7011ZM8.63004 5.94605C8.96004 5.94605 9.17804 6.34705 9.07204 6.71005L9.03904 6.80005L6.69705 11.9791C6.57005 12.2561 6.28405 12.3561 6.05705 12.2021C5.85705 12.0641 5.77005 11.7721 5.84205 11.5151L5.87705 11.4191L7.83205 7.09705H5.35005C5.12005 7.09705 4.92805 6.89505 4.88905 6.62605L4.88105 6.52205C4.88105 6.24005 5.04705 6.00505 5.26505 5.95605L5.34905 5.94705L8.63004 5.94605ZM8.5 0.972V1.924H5.43V0.972H8.502H8.5Z" fill="#666666"/>
+</svg>
+);

package/src/components/icons/clear-all-icon.tsx

@@ -1,5 +1,5 @@
-export const ClearAllIcon = ({ className }: { className?: string }) => (
-  <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none" className={className}>
-    <path d="M7 0C7.91925 -1.93718e-08 8.8295 0.18106 9.67878 0.532843C10.5281 0.884626 11.2997 1.40024 11.9497 2.05025C12.5998 2.70026 13.1154 3.47194 13.4672 4.32122C13.8189 5.17049 14 6.08075 14 7C14 7.91925 13.8189 8.8295 13.4672 9.67878C13.1154 10.5281 12.5998 11.2997 11.9497 11.9497C11.2997 12.5998 10.5281 13.1154 9.67878 13.4672C8.8295 13.8189 7.91925 14 7 14C3.13372 14 1.39103e-08 10.8658 0 7C0 3.13372 3.13372 1.39103e-08 7 0ZM10.1495 3.85C10.0301 3.7308 9.86825 3.66386 9.69953 3.66386C9.53081 3.66386 9.36898 3.7308 9.24956 3.85L7 6.10058L4.74993 3.85C4.6295 3.73566 4.46918 3.67288 4.30313 3.67503C4.13708 3.67718 3.97844 3.7441 3.86102 3.86153C3.7436 3.97895 3.67668 4.13759 3.67452 4.30364C3.67237 4.46968 3.73515 4.63001 3.84949 4.75044L6.10109 7L3.85 9.24956C3.73566 9.36999 3.67288 9.53031 3.67503 9.69636C3.67718 9.86241 3.7441 10.021 3.86153 10.1385C3.97895 10.2559 4.13759 10.3228 4.30364 10.325C4.46969 10.3271 4.63001 10.2643 4.75044 10.15L7 7.8984L9.24956 10.1495C9.37027 10.2621 9.52995 10.3234 9.69497 10.3205C9.85999 10.3177 10.0175 10.2509 10.1342 10.1342C10.2509 10.0175 10.3178 9.86008 10.3208 9.69507C10.3237 9.53005 10.2625 9.37033 10.15 9.24956L7.8984 7L10.1495 4.74993C10.2688 4.63049 10.3359 4.46856 10.3359 4.29971C10.3359 4.13086 10.2688 3.96892 10.1495 3.84949V3.85Z" fill="#666666"/>
-  </svg>
-);
+export const ClearAllIcon = ({ className }: { className?: string }) => (
+  <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 14 14" fill="none" className={className}>
+    <path d="M7 0C7.91925 -1.93718e-08 8.8295 0.18106 9.67878 0.532843C10.5281 0.884626 11.2997 1.40024 11.9497 2.05025C12.5998 2.70026 13.1154 3.47194 13.4672 4.32122C13.8189 5.17049 14 6.08075 14 7C14 7.91925 13.8189 8.8295 13.4672 9.67878C13.1154 10.5281 12.5998 11.2997 11.9497 11.9497C11.2997 12.5998 10.5281 13.1154 9.67878 13.4672C8.8295 13.8189 7.91925 14 7 14C3.13372 14 1.39103e-08 10.8658 0 7C0 3.13372 3.13372 1.39103e-08 7 0ZM10.1495 3.85C10.0301 3.7308 9.86825 3.66386 9.69953 3.66386C9.53081 3.66386 9.36898 3.7308 9.24956 3.85L7 6.10058L4.74993 3.85C4.6295 3.73566 4.46918 3.67288 4.30313 3.67503C4.13708 3.67718 3.97844 3.7441 3.86102 3.86153C3.7436 3.97895 3.67668 4.13759 3.67452 4.30364C3.67237 4.46968 3.73515 4.63001 3.84949 4.75044L6.10109 7L3.85 9.24956C3.73566 9.36999 3.67288 9.53031 3.67503 9.69636C3.67718 9.86241 3.7441 10.021 3.86153 10.1385C3.97895 10.2559 4.13759 10.3228 4.30364 10.325C4.46969 10.3271 4.63001 10.2643 4.75044 10.15L7 7.8984L9.24956 10.1495C9.37027 10.2621 9.52995 10.3234 9.69497 10.3205C9.85999 10.3177 10.0175 10.2509 10.1342 10.1342C10.2509 10.0175 10.3178 9.86008 10.3208 9.69507C10.3237 9.53005 10.2625 9.37033 10.15 9.24956L7.8984 7L10.1495 4.74993C10.2688 4.63049 10.3359 4.46856 10.3359 4.29971C10.3359 4.13086 10.2688 3.96892 10.1495 3.84949V3.85Z" fill="#666666"/>
+  </svg>
+);

package/src/components/icons/empty-agent-icon.tsx

@@ -1,94 +1,94 @@
-export const EmptyAgentIcon = () => (
-  <svg xmlns="http://www.w3.org/2000/svg" width="155" height="97" viewBox="0 0 155 97" fill="none">
-  <mask id="mask0_33687_60435" style={{maskType: 'alpha'}} maskUnits="userSpaceOnUse" x="0" y="71" width="155" height="19">
-    <rect x="0.6875" y="71.3262" width="153.628" height="17.8319" fill="white"/>
-  </mask>
-  <g mask="url(#mask0_33687_60435)">
-    <ellipse cx="77.5017" cy="85.9947" rx="76.8142" ry="14.6686" fill="url(#paint0_linear_33687_60435)"/>
-  </g>
-  <ellipse cx="123.117" cy="60.3534" rx="6.51549" ry="8.91593" fill="url(#paint1_linear_33687_60435)"/>
-  <path d="M122.891 79.2946V52.6367L123.672 79.2946H122.891Z" fill="#D5DDF4"/>
-  <path d="M123.003 67.5213L118.875 63.7448L123.003 66.2995V67.5213Z" fill="#D5DDF4"/>
-  <path d="M125.011 59.7461L123.003 61.9676V62.7451L125.011 59.7461Z" fill="#D5DDF4"/>
-  <path d="M123.016 78.6367L103.15 79.296H123.016V78.6367Z" fill="url(#paint2_linear_33687_60435)"/>
-  <ellipse cx="38.4748" cy="66.1104" rx="3.77212" ry="4.80088" transform="rotate(-4.32208 38.4748 66.1104)" fill="url(#paint3_linear_33687_60435)"/>
-  <path d="M39.065 75.831L38.1016 63.084L38.1402 75.7356L39.065 75.831Z" fill="#D5DDF4"/>
-  <path d="M38.5854 70.1526L40.4091 68.2122L38.5415 69.5727L38.5854 70.1526Z" fill="#D5DDF4"/>
-  <path d="M37.3534 66.5346L38.3862 67.5168L38.414 67.8858L37.3534 66.5346Z" fill="#D5DDF4"/>
-  <path d="M38.9297 75.1816L17.0783 77.329L38.9794 75.839L38.9297 75.1816Z" fill="url(#paint4_linear_33687_60435)"/>
-  <path d="M96.0119 69.9553L100.847 50.027C101.266 48.3002 99.9583 46.6367 98.1814 46.6367H55.7188L59.1062 69.9553H96.0119Z" fill="#90ACF8"/>
-  <path d="M96.0119 69.9553L100.847 50.027C101.266 48.3002 99.9583 46.6367 98.1814 46.6367H55.7188L59.1062 69.9553H96.0119Z" fill="#90ACF8" fill-opacity="0.2"/>
-  <rect x="76.3438" y="32.0664" width="24.0044" height="28.9571" rx="1.37168" transform="rotate(14.142 76.3438 32.0664)" fill="url(#paint5_linear_33687_60435)" fill-opacity="0.2"/>
-  <rect x="68.1953" y="38.3086" width="23.6252" height="23.6724" rx="1.37168" transform="rotate(14.142 68.1953 38.3086)" fill="#90ACF8" fill-opacity="0.2"/>
-  <g filter="url(#filter3_d_33687_60435)">
-    <path d="M56.6096 69.7845L53.8535 42.3508C53.7521 41.3412 54.5448 40.4648 55.5595 40.4648H62.7559C63.2633 40.4648 63.7446 40.6895 64.0703 41.0785L66.468 43.941C66.9893 44.5633 67.7593 44.9228 68.5711 44.9228H92.1169C93.0009 44.9228 93.7401 45.595 93.8238 46.4752L96.0078 69.4508C96.1035 70.4573 95.3119 71.3277 94.3009 71.3277H58.3156C57.435 71.3277 56.6976 70.6606 56.6096 69.7845Z" fill="#F0F4FE"/>
-  </g>
-  <path d="M56.6096 69.7845L53.8535 42.3508C53.7521 41.3412 54.5448 40.4648 55.5595 40.4648H62.7559C63.2633 40.4648 63.7446 40.6895 64.0703 41.0785L66.468 43.941C66.9893 44.5633 67.7593 44.9228 68.5711 44.9228H92.1169C93.0009 44.9228 93.7401 45.595 93.8238 46.4752L96.0078 69.4508C96.1035 70.4573 95.3119 71.3277 94.3009 71.3277H58.3156C57.435 71.3277 56.6976 70.6606 56.6096 69.7845Z" fill="#F0F4FE" fill-opacity="0.2"/>
-  <mask id="mask1_33687_60435" style={{maskType: 'alpha'}} maskUnits="userSpaceOnUse" x="53" y="40" width="44" height="32">
-    <path d="M56.6096 69.7845L53.8535 42.3508C53.7521 41.3412 54.5448 40.4648 55.5595 40.4648H62.7559C63.2633 40.4648 63.7446 40.6895 64.0703 41.0785L66.468 43.941C66.9893 44.5633 67.7593 44.9228 68.5711 44.9228H92.1169C93.0009 44.9228 93.7401 45.595 93.8238 46.4752L96.0078 69.4508C96.1035 70.4573 95.3119 71.3277 94.3009 71.3277H58.3156C57.435 71.3277 56.6976 70.6606 56.6096 69.7845Z" fill="#F0F4FE"/>
-  </mask>
-  <g mask="url(#mask1_33687_60435)">
-    <g filter="url(#filter5_f_33687_60435)">
-      <circle cx="59.322" cy="40.8084" r="15.4314" fill="#B9FAFF"/>
-    </g>
-  </g>
-  <rect x="61.7266" y="53.4961" width="18.5177" height="2.74336" rx="0.685841" fill="#CEDCF6"/>
-  <rect x="62.4062" y="60.3555" width="11.6593" height="2.74336" rx="0.685841" fill="#CEDCF6"/>
-  <path d="M59.0767 34.0097C58.2476 33.5999 56.7207 33.7515 56.7207 33.7515C56.7207 33.7515 57.5181 35.3518 58.4504 35.8866C59.2981 36.3729 60.9114 36.3533 60.9114 36.3533C60.9114 36.3533 60.1207 34.5257 59.0767 34.0097Z" fill="url(#paint6_linear_33687_60435)"/>
-  <path d="M63.2906 34.3064C63.3572 33.7574 62.9649 32.928 62.9649 32.928C62.9649 32.928 62.2156 33.698 62.0988 34.3302C61.9925 34.905 62.3271 35.8094 62.3271 35.8094C62.3271 35.8094 63.2067 34.9976 63.2906 34.3064Z" fill="url(#paint7_linear_33687_60435)"/>
-  <path d="M108.994 42.7749C110.54 41.9201 111.955 39.3643 111.955 39.3643C111.955 39.3643 108.562 38.8796 106.707 39.7606C105.02 40.5616 103.304 43.1097 103.304 43.1097C103.304 43.1097 107.048 43.851 108.994 42.7749Z" fill="url(#paint8_linear_33687_60435)"/>
-  <defs>
-    <filter id="filter3_d_33687_60435" x="53.8457" y="40.4648" width="46.285" height="34.9783" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-      <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-      <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
-      <feOffset dx="2.05752" dy="2.05752"/>
-      <feGaussianBlur stdDeviation="1.02876"/>
-      <feComposite in2="hardAlpha" operator="out"/>
-      <feColorMatrix type="matrix" values="0 0 0 0 0.564706 0 0 0 0 0.67451 0 0 0 0 0.972549 0 0 0 0.2 0"/>
-      <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_33687_60435"/>
-      <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_33687_60435" result="shape"/>
-    </filter>
-    <filter id="filter5_f_33687_60435" x="-0.00318146" y="-18.5169" width="118.651" height="118.651" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
-      <feFlood flood-opacity="0" result="BackgroundImageFix"/>
-      <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
-      <feGaussianBlur stdDeviation="21.9469" result="effect1_foregroundBlur_33687_60435"/>
-    </filter>
-    <linearGradient id="paint0_linear_33687_60435" x1="77.5017" y1="71.3262" x2="77.5017" y2="86.1595" gradientUnits="userSpaceOnUse">
-      <stop stop-color="#E6EEFF"/>
-      <stop offset="1" stop-color="white" stop-opacity="0"/>
-    </linearGradient>
-    <linearGradient id="paint1_linear_33687_60435" x1="123.117" y1="51.4375" x2="123.117" y2="69.2694" gradientUnits="userSpaceOnUse">
-      <stop stop-color="#E7EFFF"/>
-      <stop offset="1" stop-color="#F3F7FD"/>
-    </linearGradient>
-    <linearGradient id="paint2_linear_33687_60435" x1="123.016" y1="78.9663" x2="103.15" y2="78.9663" gradientUnits="userSpaceOnUse">
-      <stop stop-color="#D5DDF4"/>
-      <stop offset="1" stop-color="#EDF2FF"/>
-    </linearGradient>
-    <linearGradient id="paint3_linear_33687_60435" x1="38.4748" y1="61.3095" x2="38.4748" y2="70.9113" gradientUnits="userSpaceOnUse">
-      <stop stop-color="#E7EFFF"/>
-      <stop offset="1" stop-color="#F3F7FD"/>
-    </linearGradient>
-    <linearGradient id="paint4_linear_33687_60435" x1="38.8078" y1="75.3561" x2="17.0534" y2="77.0003" gradientUnits="userSpaceOnUse">
-      <stop stop-color="#D5DDF4"/>
-      <stop offset="1" stop-color="#EDF2FF"/>
-    </linearGradient>
-    <linearGradient id="paint5_linear_33687_60435" x1="88.346" y1="32.0664" x2="88.346" y2="61.0235" gradientUnits="userSpaceOnUse">
-      <stop stop-color="#E5FFFF"/>
-      <stop offset="1" stop-color="#90ACF8"/>
-    </linearGradient>
-    <linearGradient id="paint6_linear_33687_60435" x1="58.5152" y1="35.9539" x2="59.1557" y2="34.0174" gradientUnits="userSpaceOnUse">
-      <stop stop-color="#DBE6FF"/>
-      <stop offset="1" stop-color="#F1F5FF"/>
-    </linearGradient>
-    <linearGradient id="paint7_linear_33687_60435" x1="62.0735" y1="34.3802" x2="63.3021" y2="34.3556" gradientUnits="userSpaceOnUse">
-      <stop stop-color="#DBE6FF"/>
-      <stop offset="1" stop-color="#F1F5FF"/>
-    </linearGradient>
-    <linearGradient id="paint8_linear_33687_60435" x1="106.53" y1="39.7891" x2="108.875" y2="42.9064" gradientUnits="userSpaceOnUse">
-      <stop stop-color="#DBE6FF"/>
-      <stop offset="1" stop-color="#F1F5FF"/>
-    </linearGradient>
-  </defs>
-</svg>
+export const EmptyAgentIcon = () => (
+  <svg xmlns="http://www.w3.org/2000/svg" width="155" height="97" viewBox="0 0 155 97" fill="none">
+  <mask id="mask0_33687_60435" style={{maskType: 'alpha'}} maskUnits="userSpaceOnUse" x="0" y="71" width="155" height="19">
+    <rect x="0.6875" y="71.3262" width="153.628" height="17.8319" fill="white"/>
+  </mask>
+  <g mask="url(#mask0_33687_60435)">
+    <ellipse cx="77.5017" cy="85.9947" rx="76.8142" ry="14.6686" fill="url(#paint0_linear_33687_60435)"/>
+  </g>
+  <ellipse cx="123.117" cy="60.3534" rx="6.51549" ry="8.91593" fill="url(#paint1_linear_33687_60435)"/>
+  <path d="M122.891 79.2946V52.6367L123.672 79.2946H122.891Z" fill="#D5DDF4"/>
+  <path d="M123.003 67.5213L118.875 63.7448L123.003 66.2995V67.5213Z" fill="#D5DDF4"/>
+  <path d="M125.011 59.7461L123.003 61.9676V62.7451L125.011 59.7461Z" fill="#D5DDF4"/>
+  <path d="M123.016 78.6367L103.15 79.296H123.016V78.6367Z" fill="url(#paint2_linear_33687_60435)"/>
+  <ellipse cx="38.4748" cy="66.1104" rx="3.77212" ry="4.80088" transform="rotate(-4.32208 38.4748 66.1104)" fill="url(#paint3_linear_33687_60435)"/>
+  <path d="M39.065 75.831L38.1016 63.084L38.1402 75.7356L39.065 75.831Z" fill="#D5DDF4"/>
+  <path d="M38.5854 70.1526L40.4091 68.2122L38.5415 69.5727L38.5854 70.1526Z" fill="#D5DDF4"/>
+  <path d="M37.3534 66.5346L38.3862 67.5168L38.414 67.8858L37.3534 66.5346Z" fill="#D5DDF4"/>
+  <path d="M38.9297 75.1816L17.0783 77.329L38.9794 75.839L38.9297 75.1816Z" fill="url(#paint4_linear_33687_60435)"/>
+  <path d="M96.0119 69.9553L100.847 50.027C101.266 48.3002 99.9583 46.6367 98.1814 46.6367H55.7188L59.1062 69.9553H96.0119Z" fill="#90ACF8"/>
+  <path d="M96.0119 69.9553L100.847 50.027C101.266 48.3002 99.9583 46.6367 98.1814 46.6367H55.7188L59.1062 69.9553H96.0119Z" fill="#90ACF8" fill-opacity="0.2"/>
+  <rect x="76.3438" y="32.0664" width="24.0044" height="28.9571" rx="1.37168" transform="rotate(14.142 76.3438 32.0664)" fill="url(#paint5_linear_33687_60435)" fill-opacity="0.2"/>
+  <rect x="68.1953" y="38.3086" width="23.6252" height="23.6724" rx="1.37168" transform="rotate(14.142 68.1953 38.3086)" fill="#90ACF8" fill-opacity="0.2"/>
+  <g filter="url(#filter3_d_33687_60435)">
+    <path d="M56.6096 69.7845L53.8535 42.3508C53.7521 41.3412 54.5448 40.4648 55.5595 40.4648H62.7559C63.2633 40.4648 63.7446 40.6895 64.0703 41.0785L66.468 43.941C66.9893 44.5633 67.7593 44.9228 68.5711 44.9228H92.1169C93.0009 44.9228 93.7401 45.595 93.8238 46.4752L96.0078 69.4508C96.1035 70.4573 95.3119 71.3277 94.3009 71.3277H58.3156C57.435 71.3277 56.6976 70.6606 56.6096 69.7845Z" fill="#F0F4FE"/>
+  </g>
+  <path d="M56.6096 69.7845L53.8535 42.3508C53.7521 41.3412 54.5448 40.4648 55.5595 40.4648H62.7559C63.2633 40.4648 63.7446 40.6895 64.0703 41.0785L66.468 43.941C66.9893 44.5633 67.7593 44.9228 68.5711 44.9228H92.1169C93.0009 44.9228 93.7401 45.595 93.8238 46.4752L96.0078 69.4508C96.1035 70.4573 95.3119 71.3277 94.3009 71.3277H58.3156C57.435 71.3277 56.6976 70.6606 56.6096 69.7845Z" fill="#F0F4FE" fill-opacity="0.2"/>
+  <mask id="mask1_33687_60435" style={{maskType: 'alpha'}} maskUnits="userSpaceOnUse" x="53" y="40" width="44" height="32">
+    <path d="M56.6096 69.7845L53.8535 42.3508C53.7521 41.3412 54.5448 40.4648 55.5595 40.4648H62.7559C63.2633 40.4648 63.7446 40.6895 64.0703 41.0785L66.468 43.941C66.9893 44.5633 67.7593 44.9228 68.5711 44.9228H92.1169C93.0009 44.9228 93.7401 45.595 93.8238 46.4752L96.0078 69.4508C96.1035 70.4573 95.3119 71.3277 94.3009 71.3277H58.3156C57.435 71.3277 56.6976 70.6606 56.6096 69.7845Z" fill="#F0F4FE"/>
+  </mask>
+  <g mask="url(#mask1_33687_60435)">
+    <g filter="url(#filter5_f_33687_60435)">
+      <circle cx="59.322" cy="40.8084" r="15.4314" fill="#B9FAFF"/>
+    </g>
+  </g>
+  <rect x="61.7266" y="53.4961" width="18.5177" height="2.74336" rx="0.685841" fill="#CEDCF6"/>
+  <rect x="62.4062" y="60.3555" width="11.6593" height="2.74336" rx="0.685841" fill="#CEDCF6"/>
+  <path d="M59.0767 34.0097C58.2476 33.5999 56.7207 33.7515 56.7207 33.7515C56.7207 33.7515 57.5181 35.3518 58.4504 35.8866C59.2981 36.3729 60.9114 36.3533 60.9114 36.3533C60.9114 36.3533 60.1207 34.5257 59.0767 34.0097Z" fill="url(#paint6_linear_33687_60435)"/>
+  <path d="M63.2906 34.3064C63.3572 33.7574 62.9649 32.928 62.9649 32.928C62.9649 32.928 62.2156 33.698 62.0988 34.3302C61.9925 34.905 62.3271 35.8094 62.3271 35.8094C62.3271 35.8094 63.2067 34.9976 63.2906 34.3064Z" fill="url(#paint7_linear_33687_60435)"/>
+  <path d="M108.994 42.7749C110.54 41.9201 111.955 39.3643 111.955 39.3643C111.955 39.3643 108.562 38.8796 106.707 39.7606C105.02 40.5616 103.304 43.1097 103.304 43.1097C103.304 43.1097 107.048 43.851 108.994 42.7749Z" fill="url(#paint8_linear_33687_60435)"/>
+  <defs>
+    <filter id="filter3_d_33687_60435" x="53.8457" y="40.4648" width="46.285" height="34.9783" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix"/>
+      <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+      <feOffset dx="2.05752" dy="2.05752"/>
+      <feGaussianBlur stdDeviation="1.02876"/>
+      <feComposite in2="hardAlpha" operator="out"/>
+      <feColorMatrix type="matrix" values="0 0 0 0 0.564706 0 0 0 0 0.67451 0 0 0 0 0.972549 0 0 0 0.2 0"/>
+      <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_33687_60435"/>
+      <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_33687_60435" result="shape"/>
+    </filter>
+    <filter id="filter5_f_33687_60435" x="-0.00318146" y="-18.5169" width="118.651" height="118.651" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix"/>
+      <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape"/>
+      <feGaussianBlur stdDeviation="21.9469" result="effect1_foregroundBlur_33687_60435"/>
+    </filter>
+    <linearGradient id="paint0_linear_33687_60435" x1="77.5017" y1="71.3262" x2="77.5017" y2="86.1595" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#E6EEFF"/>
+      <stop offset="1" stop-color="white" stop-opacity="0"/>
+    </linearGradient>
+    <linearGradient id="paint1_linear_33687_60435" x1="123.117" y1="51.4375" x2="123.117" y2="69.2694" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#E7EFFF"/>
+      <stop offset="1" stop-color="#F3F7FD"/>
+    </linearGradient>
+    <linearGradient id="paint2_linear_33687_60435" x1="123.016" y1="78.9663" x2="103.15" y2="78.9663" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#D5DDF4"/>
+      <stop offset="1" stop-color="#EDF2FF"/>
+    </linearGradient>
+    <linearGradient id="paint3_linear_33687_60435" x1="38.4748" y1="61.3095" x2="38.4748" y2="70.9113" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#E7EFFF"/>
+      <stop offset="1" stop-color="#F3F7FD"/>
+    </linearGradient>
+    <linearGradient id="paint4_linear_33687_60435" x1="38.8078" y1="75.3561" x2="17.0534" y2="77.0003" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#D5DDF4"/>
+      <stop offset="1" stop-color="#EDF2FF"/>
+    </linearGradient>
+    <linearGradient id="paint5_linear_33687_60435" x1="88.346" y1="32.0664" x2="88.346" y2="61.0235" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#E5FFFF"/>
+      <stop offset="1" stop-color="#90ACF8"/>
+    </linearGradient>
+    <linearGradient id="paint6_linear_33687_60435" x1="58.5152" y1="35.9539" x2="59.1557" y2="34.0174" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#DBE6FF"/>
+      <stop offset="1" stop-color="#F1F5FF"/>
+    </linearGradient>
+    <linearGradient id="paint7_linear_33687_60435" x1="62.0735" y1="34.3802" x2="63.3021" y2="34.3556" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#DBE6FF"/>
+      <stop offset="1" stop-color="#F1F5FF"/>
+    </linearGradient>
+    <linearGradient id="paint8_linear_33687_60435" x1="106.53" y1="39.7891" x2="108.875" y2="42.9064" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#DBE6FF"/>
+      <stop offset="1" stop-color="#F1F5FF"/>
+    </linearGradient>
+  </defs>
+</svg>
 )