@agentuity/workbench 0.0.87 → 0.0.88

package/src/components/ai-elements/controls.tsx

@@ -1,18 +0,0 @@
-'use client';
-
-import { cn } from '../../lib/utils';
-import { Controls as ControlsPrimitive } from '@xyflow/react';
-import type { ComponentProps } from 'react';
-
-export type ControlsProps = ComponentProps<typeof ControlsPrimitive>;
-
-export const Controls = ({ className, ...props }: ControlsProps) => (
-	<ControlsPrimitive
-		className={cn(
-			'gap-px overflow-hidden rounded-md border bg-card p-1 shadow-none!',
-			'[&>button]:rounded-md [&>button]:border-none! [&>button]:bg-transparent! [&>button]:hover:bg-secondary!',
-			className
-		)}
-		{...props}
-	/>
-);

package/src/components/ai-elements/edge.tsx

@@ -1,131 +0,0 @@
-import {
-	BaseEdge,
-	type EdgeProps,
-	getBezierPath,
-	getSimpleBezierPath,
-	type InternalNode,
-	type Node,
-	Position,
-	useInternalNode,
-} from '@xyflow/react';
-
-const Temporary = ({
-	id,
-	sourceX,
-	sourceY,
-	targetX,
-	targetY,
-	sourcePosition,
-	targetPosition,
-}: EdgeProps) => {
-	const [edgePath] = getSimpleBezierPath({
-		sourceX,
-		sourceY,
-		sourcePosition,
-		targetX,
-		targetY,
-		targetPosition,
-	});
-
-	return (
-		<BaseEdge
-			className="stroke-1 stroke-ring"
-			id={id}
-			path={edgePath}
-			style={{
-				strokeDasharray: '5, 5',
-			}}
-		/>
-	);
-};
-
-const getHandleCoordsByPosition = (node: InternalNode<Node>, handlePosition: Position) => {
-	// Choose the handle type based on position - Left is for target, Right is for source
-	const handleType = handlePosition === Position.Left ? 'target' : 'source';
-
-	const handle = node.internals.handleBounds?.[handleType]?.find(
-		(h) => h.position === handlePosition
-	);
-
-	if (!handle) {
-		return [0, 0] as const;
-	}
-
-	let offsetX = handle.width / 2;
-	let offsetY = handle.height / 2;
-
-	// this is a tiny detail to make the markerEnd of an edge visible.
-	// The handle position that gets calculated has the origin top-left, so depending which side we are using, we add a little offset
-	// when the handlePosition is Position.Right for example, we need to add an offset as big as the handle itself in order to get the correct position
-	switch (handlePosition) {
-		case Position.Left:
-			offsetX = 0;
-			break;
-		case Position.Right:
-			offsetX = handle.width;
-			break;
-		case Position.Top:
-			offsetY = 0;
-			break;
-		case Position.Bottom:
-			offsetY = handle.height;
-			break;
-		default:
-			throw new Error(`Invalid handle position: ${handlePosition}`);
-	}
-
-	const x = node.internals.positionAbsolute.x + handle.x + offsetX;
-	const y = node.internals.positionAbsolute.y + handle.y + offsetY;
-
-	return [x, y] as const;
-};
-
-const getEdgeParams = (source: InternalNode<Node>, target: InternalNode<Node>) => {
-	const sourcePos = Position.Right;
-	const [sx, sy] = getHandleCoordsByPosition(source, sourcePos);
-	const targetPos = Position.Left;
-	const [tx, ty] = getHandleCoordsByPosition(target, targetPos);
-
-	return {
-		sx,
-		sy,
-		tx,
-		ty,
-		sourcePos,
-		targetPos,
-	};
-};
-
-const Animated = ({ id, source, target, markerEnd, style }: EdgeProps) => {
-	const sourceNode = useInternalNode(source);
-	const targetNode = useInternalNode(target);
-
-	if (!(sourceNode && targetNode)) {
-		return null;
-	}
-
-	const { sx, sy, tx, ty, sourcePos, targetPos } = getEdgeParams(sourceNode, targetNode);
-
-	const [edgePath] = getBezierPath({
-		sourceX: sx,
-		sourceY: sy,
-		sourcePosition: sourcePos,
-		targetX: tx,
-		targetY: ty,
-		targetPosition: targetPos,
-	});
-
-	return (
-		<>
-			<BaseEdge id={id} markerEnd={markerEnd} path={edgePath} style={style} />
-			<circle fill="var(--primary)" r="4">
-				<animateMotion dur="2s" path={edgePath} repeatCount="indefinite" />
-			</circle>
-		</>
-	);
-};
-
-export const Edge = {
-	Temporary,
-	Animated,
-};

package/src/components/ai-elements/image.tsx

@@ -1,16 +0,0 @@
-import { cn } from '../../lib/utils';
-import type { Experimental_GeneratedImage } from 'ai';
-
-export type ImageProps = Experimental_GeneratedImage & {
-	className?: string;
-	alt?: string;
-};
-
-export const Image = ({ base64, uint8Array, mediaType, ...props }: ImageProps) => (
-	<img
-		{...props}
-		alt={props.alt}
-		className={cn('h-auto max-w-full overflow-hidden rounded-md', props.className)}
-		src={`data:${mediaType};base64,${base64}`}
-	/>
-);

package/src/components/ai-elements/inline-citation.tsx

@@ -1,246 +0,0 @@
-'use client';
-
-import { Badge } from '../ui/badge';
-import { Carousel, type CarouselApi, CarouselContent, CarouselItem } from '../ui/carousel';
-import { HoverCard, HoverCardContent, HoverCardTrigger } from '../ui/hover-card';
-import { cn } from '../../lib/utils';
-import { ArrowLeftIcon, ArrowRightIcon } from 'lucide-react';
-import {
-	type ComponentProps,
-	createContext,
-	useCallback,
-	useContext,
-	useEffect,
-	useState,
-} from 'react';
-
-export type InlineCitationProps = ComponentProps<'span'>;
-
-export const InlineCitation = ({ className, ...props }: InlineCitationProps) => (
-	<span className={cn('group inline items-center gap-1', className)} {...props} />
-);
-
-export type InlineCitationTextProps = ComponentProps<'span'>;
-
-export const InlineCitationText = ({ className, ...props }: InlineCitationTextProps) => (
-	<span className={cn('transition-colors group-hover:bg-accent', className)} {...props} />
-);
-
-export type InlineCitationCardProps = ComponentProps<typeof HoverCard>;
-
-export const InlineCitationCard = (props: InlineCitationCardProps) => (
-	<HoverCard closeDelay={0} openDelay={0} {...props} />
-);
-
-export type InlineCitationCardTriggerProps = ComponentProps<typeof Badge> & {
-	sources: string[];
-};
-
-export const InlineCitationCardTrigger = ({
-	sources,
-	className,
-	...props
-}: InlineCitationCardTriggerProps) => (
-	<HoverCardTrigger asChild>
-		<Badge className={cn('ml-1 rounded-full', className)} variant="secondary" {...props}>
-			{sources[0] ? (
-				<>
-					{new URL(sources[0]).hostname} {sources.length > 1 && `+${sources.length - 1}`}
-				</>
-			) : (
-				'unknown'
-			)}
-		</Badge>
-	</HoverCardTrigger>
-);
-
-export type InlineCitationCardBodyProps = ComponentProps<'div'>;
-
-export const InlineCitationCardBody = ({ className, ...props }: InlineCitationCardBodyProps) => (
-	<HoverCardContent className={cn('relative w-80 p-0', className)} {...props} />
-);
-
-const CarouselApiContext = createContext<CarouselApi | undefined>(undefined);
-
-const useCarouselApi = () => {
-	const context = useContext(CarouselApiContext);
-	return context;
-};
-
-export type InlineCitationCarouselProps = ComponentProps<typeof Carousel>;
-
-export const InlineCitationCarousel = ({
-	className,
-	children,
-	...props
-}: InlineCitationCarouselProps) => {
-	const [api, setApi] = useState<CarouselApi>();
-
-	return (
-		<CarouselApiContext.Provider value={api}>
-			<Carousel className={cn('w-full', className)} setApi={setApi} {...props}>
-				{children}
-			</Carousel>
-		</CarouselApiContext.Provider>
-	);
-};
-
-export type InlineCitationCarouselContentProps = ComponentProps<'div'>;
-
-export const InlineCitationCarouselContent = (props: InlineCitationCarouselContentProps) => (
-	<CarouselContent {...props} />
-);
-
-export type InlineCitationCarouselItemProps = ComponentProps<'div'>;
-
-export const InlineCitationCarouselItem = ({
-	className,
-	...props
-}: InlineCitationCarouselItemProps) => (
-	<CarouselItem className={cn('w-full space-y-2 p-4 pl-8', className)} {...props} />
-);
-
-export type InlineCitationCarouselHeaderProps = ComponentProps<'div'>;
-
-export const InlineCitationCarouselHeader = ({
-	className,
-	...props
-}: InlineCitationCarouselHeaderProps) => (
-	<div
-		className={cn(
-			'flex items-center justify-between gap-2 rounded-t-md bg-secondary p-2',
-			className
-		)}
-		{...props}
-	/>
-);
-
-export type InlineCitationCarouselIndexProps = ComponentProps<'div'>;
-
-export const InlineCitationCarouselIndex = ({
-	children,
-	className,
-	...props
-}: InlineCitationCarouselIndexProps) => {
-	const api = useCarouselApi();
-	const [current, setCurrent] = useState(0);
-	const [count, setCount] = useState(0);
-
-	useEffect(() => {
-		if (!api) {
-			return;
-		}
-
-		setCount(api.scrollSnapList().length);
-		setCurrent(api.selectedScrollSnap() + 1);
-
-		api.on('select', () => {
-			setCurrent(api.selectedScrollSnap() + 1);
-		});
-	}, [api]);
-
-	return (
-		<div
-			className={cn(
-				'flex flex-1 items-center justify-end px-3 py-1 text-muted-foreground text-xs',
-				className
-			)}
-			{...props}
-		>
-			{children ?? `${current}/${count}`}
-		</div>
-	);
-};
-
-export type InlineCitationCarouselPrevProps = ComponentProps<'button'>;
-
-export const InlineCitationCarouselPrev = ({
-	className,
-	...props
-}: InlineCitationCarouselPrevProps) => {
-	const api = useCarouselApi();
-
-	const handleClick = useCallback(() => {
-		if (api) {
-			api.scrollPrev();
-		}
-	}, [api]);
-
-	return (
-		<button
-			aria-label="Previous"
-			className={cn('shrink-0', className)}
-			onClick={handleClick}
-			type="button"
-			{...props}
-		>
-			<ArrowLeftIcon className="size-4 text-muted-foreground" />
-		</button>
-	);
-};
-
-export type InlineCitationCarouselNextProps = ComponentProps<'button'>;
-
-export const InlineCitationCarouselNext = ({
-	className,
-	...props
-}: InlineCitationCarouselNextProps) => {
-	const api = useCarouselApi();
-
-	const handleClick = useCallback(() => {
-		if (api) {
-			api.scrollNext();
-		}
-	}, [api]);
-
-	return (
-		<button
-			aria-label="Next"
-			className={cn('shrink-0', className)}
-			onClick={handleClick}
-			type="button"
-			{...props}
-		>
-			<ArrowRightIcon className="size-4 text-muted-foreground" />
-		</button>
-	);
-};
-
-export type InlineCitationSourceProps = ComponentProps<'div'> & {
-	title?: string;
-	url?: string;
-	description?: string;
-};
-
-export const InlineCitationSource = ({
-	title,
-	url,
-	description,
-	className,
-	children,
-	...props
-}: InlineCitationSourceProps) => (
-	<div className={cn('space-y-1', className)} {...props}>
-		{title && <h4 className="truncate font-medium text-sm leading-tight">{title}</h4>}
-		{url && <p className="truncate break-all text-muted-foreground text-xs">{url}</p>}
-		{description && (
-			<p className="line-clamp-3 text-muted-foreground text-sm leading-relaxed">{description}</p>
-		)}
-		{children}
-	</div>
-);
-
-export type InlineCitationQuoteProps = ComponentProps<'blockquote'>;
-
-export const InlineCitationQuote = ({
-	children,
-	className,
-	...props
-}: InlineCitationQuoteProps) => (
-	<blockquote
-		className={cn('border-muted border-l-2 pl-3 text-muted-foreground text-sm italic', className)}
-		{...props}
-	>
-		{children}
-	</blockquote>
-);

package/src/components/ai-elements/loader.tsx

@@ -1,88 +0,0 @@
-import { cn } from '../../lib/utils';
-import type { HTMLAttributes } from 'react';
-
-type LoaderIconProps = {
-	size?: number;
-};
-
-const LoaderIcon = ({ size = 16 }: LoaderIconProps) => (
-	<svg
-		height={size}
-		strokeLinejoin="round"
-		style={{ color: 'currentcolor' }}
-		viewBox="0 0 16 16"
-		width={size}
-	>
-		<title>Loader</title>
-		<g clipPath="url(#clip0_2393_1490)">
-			<path d="M8 0V4" stroke="currentColor" strokeWidth="1.5" />
-			<path d="M8 16V12" opacity="0.5" stroke="currentColor" strokeWidth="1.5" />
-			<path
-				d="M3.29773 1.52783L5.64887 4.7639"
-				opacity="0.9"
-				stroke="currentColor"
-				strokeWidth="1.5"
-			/>
-			<path
-				d="M12.7023 1.52783L10.3511 4.7639"
-				opacity="0.1"
-				stroke="currentColor"
-				strokeWidth="1.5"
-			/>
-			<path
-				d="M12.7023 14.472L10.3511 11.236"
-				opacity="0.4"
-				stroke="currentColor"
-				strokeWidth="1.5"
-			/>
-			<path
-				d="M3.29773 14.472L5.64887 11.236"
-				opacity="0.6"
-				stroke="currentColor"
-				strokeWidth="1.5"
-			/>
-			<path
-				d="M15.6085 5.52783L11.8043 6.7639"
-				opacity="0.2"
-				stroke="currentColor"
-				strokeWidth="1.5"
-			/>
-			<path
-				d="M0.391602 10.472L4.19583 9.23598"
-				opacity="0.7"
-				stroke="currentColor"
-				strokeWidth="1.5"
-			/>
-			<path
-				d="M15.6085 10.4722L11.8043 9.2361"
-				opacity="0.3"
-				stroke="currentColor"
-				strokeWidth="1.5"
-			/>
-			<path
-				d="M0.391602 5.52783L4.19583 6.7639"
-				opacity="0.8"
-				stroke="currentColor"
-				strokeWidth="1.5"
-			/>
-		</g>
-		<defs>
-			<clipPath id="clip0_2393_1490">
-				<rect fill="white" height="16" width="16" />
-			</clipPath>
-		</defs>
-	</svg>
-);
-
-export type LoaderProps = HTMLAttributes<HTMLDivElement> & {
-	size?: number;
-};
-
-export const Loader = ({ className, size = 16, ...props }: LoaderProps) => (
-	<div
-		className={cn('inline-flex animate-spin items-center justify-center', className)}
-		{...props}
-	>
-		<LoaderIcon size={size} />
-	</div>
-);

package/src/components/ai-elements/node.tsx

@@ -1,66 +0,0 @@
-import {
-	Card,
-	CardAction,
-	CardContent,
-	CardDescription,
-	CardFooter,
-	CardHeader,
-	CardTitle,
-} from '../ui/card';
-import { cn } from '../../lib/utils';
-import { Handle, Position } from '@xyflow/react';
-import type { ComponentProps } from 'react';
-
-export type NodeProps = ComponentProps<typeof Card> & {
-	handles: {
-		target: boolean;
-		source: boolean;
-	};
-};
-
-export const Node = ({ handles, className, ...props }: NodeProps) => (
-	<Card
-		className={cn(
-			'node-container relative size-full h-auto w-sm gap-0 rounded-md p-0',
-			className
-		)}
-		{...props}
-	>
-		{handles.target && <Handle position={Position.Left} type="target" />}
-		{handles.source && <Handle position={Position.Right} type="source" />}
-		{props.children}
-	</Card>
-);
-
-export type NodeHeaderProps = ComponentProps<typeof CardHeader>;
-
-export const NodeHeader = ({ className, ...props }: NodeHeaderProps) => (
-	<CardHeader
-		className={cn('gap-0.5 rounded-t-md border-b bg-secondary p-3!', className)}
-		{...props}
-	/>
-);
-
-export type NodeTitleProps = ComponentProps<typeof CardTitle>;
-
-export const NodeTitle = (props: NodeTitleProps) => <CardTitle {...props} />;
-
-export type NodeDescriptionProps = ComponentProps<typeof CardDescription>;
-
-export const NodeDescription = (props: NodeDescriptionProps) => <CardDescription {...props} />;
-
-export type NodeActionProps = ComponentProps<typeof CardAction>;
-
-export const NodeAction = (props: NodeActionProps) => <CardAction {...props} />;
-
-export type NodeContentProps = ComponentProps<typeof CardContent>;
-
-export const NodeContent = ({ className, ...props }: NodeContentProps) => (
-	<CardContent className={cn('p-3', className)} {...props} />
-);
-
-export type NodeFooterProps = ComponentProps<typeof CardFooter>;
-
-export const NodeFooter = ({ className, ...props }: NodeFooterProps) => (
-	<CardFooter className={cn('rounded-b-md border-t bg-secondary p-3!', className)} {...props} />
-);