Using example content. Send a POST request with { a: string, b: string, language: string } to get a diff.
import* as React from "react" import{ Slot } from '@radix-ui/react-slot'; import { cva, type VariantProps } from 'class-variance-authority'; import * as React from 'react'; import { cn } from '#app/utils/misc.ts';"@/lib/utils"const buttonVariants = cva( 'inline-flex items-center justify-centergap-2whitespace-nowrap rounded-md text-sm font-mediumring-offset-backgroundtransition-colors focus-visible:outline-none focus-visible:ring-1focus-visible:ring-2focus-visible:ring-ringfocus-visible:ring-offset-2disabled:pointer-events-none disabled:opacity-50[&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0', { variants: { variant: { default: 'bg-primary text-primary-foreground shadow hover:bg-primary/90', destructive:'bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90', outline: 'border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground', secondary: 'bg-secondary text-secondary-foreground shadow-sm hover:brightness-95 transition-allhover:bg-secondary/80', ghost: 'hover:bg-accent hover:text-accent-foreground', link: 'text-primary underline-offset-4 hover:underline', }, size: { default: 'h-9h-10px-3px-4py-2', line: 'h-8 px-3 w-full justify-start', sm: 'h-8h-9px-3rounded-mdtext-xspx-3', lg: 'h-10h-11rounded-mdpx-8', icon: 'h-9h-10w-9w-10', }, }, defaultVariants: { variant: 'default', size: 'default', }, }, ); export typeinterfaceButtonProps = Omit<extendsReact.ButtonHTMLAttributes, 'type'> & VariantProps & ( | { asChild: true; } | { asChild?: false; type: 'button' | 'submit' | 'reset'; boolean} ); const Button =React.forwardRef(({ className, variant, size, asChild = false, ...props }: ButtonPropsref) => { const Comp = asChild ? Slot : 'button'; return(className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props}/>;)};)