| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253 |
- 'use client';
- import { Button } from '@/components/ui/button';
- import { Separator } from '@/components/ui/separator';
- import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip';
- import { cn } from '@/lib/utils';
- import { BookmarkIcon, type LucideProps } from 'lucide-react';
- import type { ComponentProps, HTMLAttributes } from 'react';
- export type CheckpointProps = HTMLAttributes<HTMLDivElement>;
- export const Checkpoint = ({ className, children, ...props }: CheckpointProps) => (
- <div
- className={cn('flex items-center gap-0.5 text-muted-foreground overflow-hidden', className)}
- {...props}
- >
- {children}
- <Separator />
- </div>
- );
- export type CheckpointIconProps = LucideProps;
- export const CheckpointIcon = ({ className, children, ...props }: CheckpointIconProps) =>
- children ?? <BookmarkIcon className={cn('size-4 shrink-0', className)} {...props} />;
- export type CheckpointTriggerProps = ComponentProps<typeof Button> & {
- tooltip?: string;
- };
- export const CheckpointTrigger = ({
- children,
- variant = 'ghost',
- size = 'sm',
- tooltip,
- ...props
- }: CheckpointTriggerProps) =>
- tooltip ? (
- <Tooltip>
- <TooltipTrigger asChild>
- <Button size={size} type="button" variant={variant} {...props}>
- {children}
- </Button>
- </TooltipTrigger>
- <TooltipContent align="start" side="bottom">
- {tooltip}
- </TooltipContent>
- </Tooltip>
- ) : (
- <Button size={size} type="button" variant={variant} {...props}>
- {children}
- </Button>
- );
|