Feat: Show agent embed dialog #3221 (#8903)

### What problem does this PR solve?
Feat: Show agent embed dialog #3221

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/components/originui/underline-tabs.tsx

@@ -0,0 +1,40 @@
+// registry/default/components/comp-430.tsx
+
+import { cn } from '@/lib/utils';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import React from 'react';
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '../ui/tabs';
+
+export const UnderlineTabsList = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.List>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
+>(function UnderlineTabsList({ className, ...props }, ref) {
+  return (
+    <TabsList
+      ref={ref}
+      className={cn(
+        'text-foreground h-auto gap-2 rounded-none border-b bg-transparent px-0 py-1',
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+
+export const UnderlineTabsTrigger = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
+>(function UnderlineTabsTrigger({ className, ...props }, ref) {
+  return (
+    <TabsTrigger
+      ref={ref}
+      className={cn(
+        'hover:bg-accent  hover:text-foreground data-[state=active]:after:bg-primary data-[state=active]:hover:bg-accent relative after:absolute after:inset-x-0 after:bottom-0 after:-mb-1 after:h-0.5 data-[state=active]:bg-transparent data-[state=active]:shadow-none',
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+
+export { Tabs as UnderlineTabs, TabsContent as UnderlineTabsContent };