diff --git a/src/lib/inline/CSFAutorefresh.tsx b/src/lib/inline/CSFAutorefresh.tsx index 036d4ac3..09309d1f 100644 --- a/src/lib/inline/CSFAutorefresh.tsx +++ b/src/lib/inline/CSFAutorefresh.tsx @@ -4,7 +4,9 @@ import type React from 'react'; import { type SVGProps, useEffect, useRef, useState } from 'react'; import { cn } from '~lib/utils'; import { MaterialSymbolsAvgTimeOutlineRounded } from '~popup/components/Icons'; -import { Badge, Button, Switch } from '~popup/components/Shadcn'; +import { Badge } from '~popup/ui/badge'; +import { Button } from '~popup/ui/button'; +import { Switch } from '~popup/ui/switch'; export function MaterialSymbolsUpdate(props: SVGProps) { return ( diff --git a/src/lib/inline/CSFBargainButtons.tsx b/src/lib/inline/CSFBargainButtons.tsx index 04b5d6d2..7c21f866 100644 --- a/src/lib/inline/CSFBargainButtons.tsx +++ b/src/lib/inline/CSFBargainButtons.tsx @@ -1,6 +1,7 @@ import type React from 'react'; import { useState } from 'react'; -import { Button, MultiplierInput } from '~popup/components/Shadcn'; +import { Button } from '~popup/ui/button'; +import { MultiplierInput } from '~popup/ui/input'; type PricingData = { buff_name: string; diff --git a/src/lib/inline/CSFMenuControl.tsx b/src/lib/inline/CSFMenuControl.tsx index 8e55f6f8..fc7aac1f 100644 --- a/src/lib/inline/CSFMenuControl.tsx +++ b/src/lib/inline/CSFMenuControl.tsx @@ -2,7 +2,7 @@ import { AnimatePresence, motion } from 'framer-motion'; import type React from 'react'; import { type SVGProps, useState } from 'react'; import { cn } from '~lib/utils'; -import { Button } from '~popup/components/Shadcn'; +import { Button } from '~popup/ui/button'; export function BxBxsChevronLeft(props: SVGProps) { return ( diff --git a/src/lib/inline/CSFQuickMenu.tsx b/src/lib/inline/CSFQuickMenu.tsx index be183428..9bec08ea 100644 --- a/src/lib/inline/CSFQuickMenu.tsx +++ b/src/lib/inline/CSFQuickMenu.tsx @@ -1,6 +1,6 @@ import type { SVGProps } from 'react'; import type React from 'react'; -import { Button } from '~popup/components/Shadcn'; +import { Button } from '~popup/ui/button'; type QuickMenuButtonProps = { label: string; diff --git a/src/lib/inline/CSFThemeToggle.tsx b/src/lib/inline/CSFThemeToggle.tsx index 1b40d1db..09d0ab9c 100644 --- a/src/lib/inline/CSFThemeToggle.tsx +++ b/src/lib/inline/CSFThemeToggle.tsx @@ -2,7 +2,7 @@ import { AnimatePresence, motion } from 'framer-motion'; import type React from 'react'; import { type SVGProps, useEffect, useRef, useState } from 'react'; import { cn } from '~lib/utils'; -import { Button } from '~popup/components/Shadcn'; +import { Button } from '~popup/ui/button'; export function LucidePalette(props: SVGProps) { return ( diff --git a/src/lib/inline/LiveFilter.tsx b/src/lib/inline/LiveFilter.tsx index d24b1e52..23bef3c3 100644 --- a/src/lib/inline/LiveFilter.tsx +++ b/src/lib/inline/LiveFilter.tsx @@ -4,7 +4,8 @@ import { useEffect, useState } from 'react'; import { DEFAULT_FILTER, type SPFilter } from '~lib/util/storage'; import { cn } from '~lib/utils'; import { CarbonFilterReset, MaterialSymbolsCloseSmallOutlineRounded, MaterialSymbolsFilterAlt } from '~popup/components/Icons'; -import { Button, Label } from '~popup/components/Shadcn'; +import { Button } from '~popup/ui/button'; +import { Label } from '~popup/ui/label'; interface TypeCheckboxProps { label: string; diff --git a/src/lib/inline/SpBuffContainer.tsx b/src/lib/inline/SpBuffContainer.tsx index 75d8c89b..0644f13c 100644 --- a/src/lib/inline/SpBuffContainer.tsx +++ b/src/lib/inline/SpBuffContainer.tsx @@ -1,8 +1,9 @@ -import type React from 'react'; import { AvailableMarketSources, ICON_ARROWUP, ICON_BUFF, ICON_EXCLAMATION, MarketSource } from '~lib/util/globals'; import { cn } from '~lib/utils'; import { MaterialSymbolsCloseSmallOutlineRounded } from '~popup/components/Icons'; -import { Badge, Button, Popover, PopoverClose, PopoverContent, PopoverTrigger } from '~popup/components/Shadcn'; +import { Badge } from '~popup/ui/badge'; +import { Button } from '~popup/ui/button'; +import { Popover, PopoverClose, PopoverContent, PopoverTrigger } from '~popup/ui/popover'; type BuffItem = { source: MarketSource; diff --git a/src/popup/components/SettingsAltMarket.tsx b/src/popup/components/SettingsAltMarket.tsx index 9c316b9c..15365bc8 100644 --- a/src/popup/components/SettingsAltMarket.tsx +++ b/src/popup/components/SettingsAltMarket.tsx @@ -2,9 +2,10 @@ import { useStorage } from '@plasmohq/storage/hook'; import { useEffect, useState } from 'react'; import { MarketSource } from '~lib/util/globals'; import { MaterialSymbolsHelpOutline } from '~popup/components/Icons'; +import { Label } from '~popup/ui/label'; +import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '~popup/ui/select'; import type { SourceInfo } from './SettingsSource'; import { SettingsTooltip } from './SettingsTooltip'; -import { Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from './Shadcn'; type SelectProps = { prefix: string; diff --git a/src/popup/components/SettingsCard.tsx b/src/popup/components/SettingsCard.tsx index 5c129803..a8bbe048 100644 --- a/src/popup/components/SettingsCard.tsx +++ b/src/popup/components/SettingsCard.tsx @@ -1,6 +1,6 @@ import type { ReactNode } from 'react'; import { cn } from '~lib/utils'; -import { Card, CardContent } from './Shadcn'; +import { Card, CardContent } from '~popup/ui/card'; export const SettingsCard = ({ children, className }: { children: ReactNode; className?: string }) => { return ( diff --git a/src/popup/components/SettingsCheckbox.tsx b/src/popup/components/SettingsCheckbox.tsx index eb0b57f8..7aecbfb6 100644 --- a/src/popup/components/SettingsCheckbox.tsx +++ b/src/popup/components/SettingsCheckbox.tsx @@ -3,8 +3,10 @@ import type { IconProps } from '@radix-ui/react-icons/dist/types'; import type { ReactElement, SVGProps } from 'react'; import { cn, toast } from '~lib/utils'; import { MaterialSymbolsHelpOutline } from '~popup/components/Icons'; +import { Badge } from '~popup/ui/badge'; +import { Checkbox } from '~popup/ui/checkbox'; +import { Label } from '~popup/ui/label'; import { SettingsTooltip } from './SettingsTooltip'; -import { Badge, Checkbox, Label } from './Shadcn'; type CheckboxProps = { id: string; diff --git a/src/popup/components/SettingsColorPicker.tsx b/src/popup/components/SettingsColorPicker.tsx index a53c0c75..16b4e313 100644 --- a/src/popup/components/SettingsColorPicker.tsx +++ b/src/popup/components/SettingsColorPicker.tsx @@ -1,8 +1,11 @@ import { useStorage } from '@plasmohq/storage/hook'; import { useEffect, useState } from 'react'; import { HexColorPicker } from 'react-colorful'; +import { Button } from '~popup/ui/button'; +import { Card, CardContent } from '~popup/ui/card'; +import { Label } from '~popup/ui/label'; +import { Popover, PopoverColorPicker, PopoverTrigger } from '~popup/ui/popover'; import { IcOutlineColorLens, MaterialSymbolsRefresh } from './Icons'; -import { Button, Card, CardContent, Label, Popover, PopoverColorPicker, PopoverTrigger } from './Shadcn'; const SingleColorPicker = ({ text, initColor, setStoreValue }: { text: string; initColor: string; setStoreValue: (newColor: string) => void }) => { const [color, setColor] = useState(initColor); diff --git a/src/popup/components/SettingsEnable.tsx b/src/popup/components/SettingsEnable.tsx index c323027e..09ca9f94 100644 --- a/src/popup/components/SettingsEnable.tsx +++ b/src/popup/components/SettingsEnable.tsx @@ -1,5 +1,6 @@ import { useStorage } from '@plasmohq/storage/hook'; -import { EnableSwitch, Label } from './Shadcn'; +import { Label } from '~popup/ui/label'; +import { EnableSwitch } from '~popup/ui/switch'; export const SettingsEnable = ({ id }: { id: string }) => { const [checked, setChecked] = useStorage(id); diff --git a/src/popup/components/SettingsOCO.tsx b/src/popup/components/SettingsOCO.tsx deleted file mode 100644 index db764177..00000000 --- a/src/popup/components/SettingsOCO.tsx +++ /dev/null @@ -1,69 +0,0 @@ -import { useStorage } from '@plasmohq/storage/hook'; -import { useState } from 'react'; -import { z } from 'zod'; -import { DISCORD_URL, ocoKeyRegex } from '~lib/util/globals'; -import { cn } from '~lib/utils'; -import { MaterialSymbolsHelpOutline } from '~popup/components/Icons'; -import { Input, Label, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './Shadcn'; - -export const SettingsOCO = () => { - const [value, setValue] = useStorage('sp-ocoapikey', ''); - const [status, setStatus] = useState<'idle' | 'success' | 'error'>('idle'); - - const keySchema = z.string().regex(ocoKeyRegex, 'Invalid API key format'); - - const isFirefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1; - - const handleChange = (event: React.ChangeEvent) => { - const value = event.target.value; - - if (value.length === 0) { - setStatus('idle'); - } else { - const parseResult = keySchema.safeParse(value); - if (parseResult.success === false) { - setStatus('error'); - } else { - setStatus('success'); - } - } - setValue(value); - }; - - return ( -
-
- - - - - - - -

- Enter your API-key for the OneClickBuy-feature. Leave empty to disable. A valid key can be generated on the{' '} - window.open(DISCORD_URL)}> - BetterFloat Discord server - - . Unavailable on Firefox. -

- - - -
-
- - {status === 'error' &&

Invalid API key format

} -
-
- ); -}; diff --git a/src/popup/components/SettingsSelect.tsx b/src/popup/components/SettingsSelect.tsx index 37472049..edf0bde9 100644 --- a/src/popup/components/SettingsSelect.tsx +++ b/src/popup/components/SettingsSelect.tsx @@ -2,8 +2,9 @@ import { useStorage } from '@plasmohq/storage/hook'; import type { IconProps } from '@radix-ui/react-icons/dist/types'; import { type ReactElement, useEffect, useState } from 'react'; import { MaterialSymbolsHelpOutline } from '~popup/components/Icons'; +import { Label } from '~popup/ui/label'; +import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '~popup/ui/select'; import { SettingsTooltip } from './SettingsTooltip'; -import { Label, Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from './Shadcn'; type SelectProps = { id: string; diff --git a/src/popup/components/SettingsSource.tsx b/src/popup/components/SettingsSource.tsx index afd6c113..3fa9cc79 100644 --- a/src/popup/components/SettingsSource.tsx +++ b/src/popup/components/SettingsSource.tsx @@ -7,12 +7,15 @@ import { useStorage } from '@plasmohq/storage/hook'; import type { SVGProps } from 'react'; import { MarketSource } from '~lib/util/globals'; import { cn } from '~lib/utils'; +import { Badge } from '~popup/ui/badge'; +import { Button } from '~popup/ui/button'; +import { Card, CardContent } from '~popup/ui/card'; +import { Label } from '~popup/ui/label'; import { MaterialSymbolsHelpOutline } from './Icons'; import { SettingsAltMarket } from './SettingsAltMarket'; import { SettingsCheckbox } from './SettingsCheckbox'; import { SettingsSelect } from './SettingsSelect'; import { SettingsTooltip } from './SettingsTooltip'; -import { Badge, Button, Card, CardContent, Label } from './Shadcn'; export function MaterialSymbolsLightStorefrontOutline(props: SVGProps) { return ( diff --git a/src/popup/components/SettingsTextbox.tsx b/src/popup/components/SettingsTextbox.tsx index 8ba9fec9..831b46d9 100644 --- a/src/popup/components/SettingsTextbox.tsx +++ b/src/popup/components/SettingsTextbox.tsx @@ -2,8 +2,9 @@ import { useStorage } from '@plasmohq/storage/hook'; import type { IconProps } from '@radix-ui/react-icons/dist/types'; import type { ReactElement } from 'react'; import { MaterialSymbolsHelpOutline } from '~popup/components/Icons'; +import { Input } from '~popup/ui/input'; +import { Label } from '~popup/ui/label'; import { SettingsTooltip } from './SettingsTooltip'; -import { Input, Label } from './Shadcn'; type TextboxProps = { id: string; diff --git a/src/popup/components/SettingsTooltip.tsx b/src/popup/components/SettingsTooltip.tsx index c92582f8..e97b2639 100644 --- a/src/popup/components/SettingsTooltip.tsx +++ b/src/popup/components/SettingsTooltip.tsx @@ -1,4 +1,4 @@ -import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from './Shadcn'; +import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '~popup/ui/tooltip'; export const SettingsTooltip = ({ text, diff --git a/src/popup/components/Shadcn.tsx b/src/popup/components/Shadcn.tsx deleted file mode 100644 index 3807c8e7..00000000 --- a/src/popup/components/Shadcn.tsx +++ /dev/null @@ -1,662 +0,0 @@ -'use client'; - -import * as AccordionPrimitive from '@radix-ui/react-accordion'; -import * as AvatarPrimitive from '@radix-ui/react-avatar'; -import * as CheckboxPrimitive from '@radix-ui/react-checkbox'; -import { Cross2Icon } from '@radix-ui/react-icons'; -import { CaretSortIcon, CheckIcon, ChevronDownIcon, ChevronUpIcon, DividerHorizontalIcon } from '@radix-ui/react-icons'; -import * as LabelPrimitive from '@radix-ui/react-label'; -import * as PopoverPrimitive from '@radix-ui/react-popover'; -import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area'; -import * as SelectPrimitive from '@radix-ui/react-select'; -import { Slot } from '@radix-ui/react-slot'; -import * as SwitchPrimitives from '@radix-ui/react-switch'; -import * as TabsPrimitive from '@radix-ui/react-tabs'; -import * as ToastPrimitives from '@radix-ui/react-toast'; -import * as TooltipPrimitive from '@radix-ui/react-tooltip'; -import { type VariantProps, cva } from 'class-variance-authority'; -import * as React from 'react'; - -import { cn } from '~lib/utils'; - -const labelVariants = cva('text-sm font-normal leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70'); - -const Label = React.forwardRef, React.ComponentPropsWithoutRef & VariantProps>( - ({ className, ...props }, ref) => -); -Label.displayName = LabelPrimitive.Root.displayName; - -const Input = React.forwardRef(({ className, type, ...props }, ref) => { - return ( - - ); -}); -Input.displayName = 'Input'; - -const buttonVariants = cva( - 'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50', - { - variants: { - variant: { - default: 'bg-primary text-primary-foreground hover:bg-primary/90', - destructive: 'bg-destructive text-destructive-foreground hover:bg-destructive/90', - outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground', - secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80', - light: 'bg-[#1e2025] text-white hover:bg-neutral-700 hover:text-neutral-foreground', - ghost: 'hover:bg-accent hover:text-accent-foreground', - link: 'text-primary underline-offset-4 hover:underline', - invisible: 'hover:bg-neutral-700 hover:text-accent-foreground', - }, - size: { - default: 'h-10 px-4 py-2', - sm: 'h-9 rounded-md px-3', - lg: 'h-11 rounded-md px-8', - icon: 'h-10 w-10', - }, - }, - defaultVariants: { - variant: 'default', - size: 'default', - }, - } -); - -const MultiplierInput = React.forwardRef(({ className, ...props }, ref) => { - return ( -
- - -
- ); -}); - -export interface ButtonProps extends React.ButtonHTMLAttributes, VariantProps { - asChild?: boolean; -} - -const Button = React.forwardRef(({ className, variant, size, asChild = false, ...props }, ref) => { - const Comp = asChild ? Slot : 'button'; - return ; -}); -Button.displayName = 'Button'; - -const Card = React.forwardRef>(({ className, ...props }, ref) => ( -
-)); -Card.displayName = 'Card'; - -const CardHeader = React.forwardRef>(({ className, ...props }, ref) => ( -
-)); -CardHeader.displayName = 'CardHeader'; - -const CardTitle = React.forwardRef>(({ className, ...props }, ref) => ( -

-)); -CardTitle.displayName = 'CardTitle'; - -const CardDescription = React.forwardRef>(({ className, ...props }, ref) => ( -

-)); -CardDescription.displayName = 'CardDescription'; - -const CardContent = React.forwardRef>(({ className, ...props }, ref) =>

); -CardContent.displayName = 'CardContent'; - -const CardFooter = React.forwardRef>(({ className, ...props }, ref) => ( -
-)); -CardFooter.displayName = 'CardFooter'; - -const Tabs = TabsPrimitive.Root; - -const TabsList = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -TabsList.displayName = TabsPrimitive.List.displayName; - -const TabsTrigger = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -TabsTrigger.displayName = TabsPrimitive.Trigger.displayName; - -const TabsContent = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -TabsContent.displayName = TabsPrimitive.Content.displayName; - -const Avatar = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -Avatar.displayName = AvatarPrimitive.Root.displayName; - -const AvatarImage = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -AvatarImage.displayName = AvatarPrimitive.Image.displayName; - -const AvatarFallback = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName; - -const Switch = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - - - -)); -Switch.displayName = SwitchPrimitives.Root.displayName; - -const EnableSwitch = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - - - -)); -EnableSwitch.displayName = SwitchPrimitives.Root.displayName; - -const Checkbox = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - - - {props.checked === 'indeterminate' && } - {props.checked === true && } - - -)); -Checkbox.displayName = CheckboxPrimitive.Root.displayName; - -const Select = SelectPrimitive.Root; - -const SelectGroup = SelectPrimitive.Group; - -const SelectValue = SelectPrimitive.Value; - -const SelectTrigger = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, children, ...props }, ref) => ( - span]:line-clamp-1', - className - )} - {...props} - > - {children} - - - - -)); -SelectTrigger.displayName = SelectPrimitive.Trigger.displayName; - -const SelectScrollUpButton = React.forwardRef, React.ComponentPropsWithoutRef>( - ({ className, ...props }, ref) => ( - - - - ) -); -SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName; - -const SelectScrollDownButton = React.forwardRef, React.ComponentPropsWithoutRef>( - ({ className, ...props }, ref) => ( - - - - ) -); -SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName; - -const SelectContent = React.forwardRef, React.ComponentPropsWithoutRef>( - ({ className, children, position = 'popper', onEscapeKeyDown, ...props }, ref) => ( - - - - - {children} - - - - - ) -); -SelectContent.displayName = SelectPrimitive.Content.displayName; - -const SelectLabel = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -SelectLabel.displayName = SelectPrimitive.Label.displayName; - -const SelectItem = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, children, ...props }, ref) => ( - - - - - - - {children} - -)); -SelectItem.displayName = SelectPrimitive.Item.displayName; - -const SelectSeparator = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); - -SelectSeparator.displayName = SelectPrimitive.Separator.displayName; - -const TooltipProvider = TooltipPrimitive.Provider; - -const Tooltip = TooltipPrimitive.Root; - -const TooltipTrigger = TooltipPrimitive.Trigger; - -const TooltipContent = React.forwardRef, React.ComponentPropsWithoutRef>( - ({ className, sideOffset = 4, ...props }, ref) => ( - - ) -); -TooltipContent.displayName = TooltipPrimitive.Content.displayName; - -const ScrollArea = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, children, ...props }, ref) => ( - - {children} - - - -)); -ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName; - -const ScrollBar = React.forwardRef, React.ComponentPropsWithoutRef>( - ({ className, orientation = 'vertical', ...props }, ref) => ( - - - - ) -); -ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName; - -const Popover = PopoverPrimitive.Root; - -const PopoverTrigger = PopoverPrimitive.Trigger; - -const PopoverAnchor = PopoverPrimitive.Anchor; - -const PopoverClose = PopoverPrimitive.Close; - -interface PopoverProps extends React.ComponentPropsWithoutRef { - portal?: HTMLElement; -} - -const PopoverContent = React.forwardRef, PopoverProps>(({ className, align = 'center', sideOffset = 4, portal = document.body, ...props }, ref) => ( - - - -)); -PopoverContent.displayName = PopoverPrimitive.Content.displayName; - -const PopoverColorPicker = React.forwardRef, React.ComponentPropsWithoutRef>( - ({ className, align = 'center', sideOffset = 4, ...props }, ref) => ( - - - - ) -); -PopoverColorPicker.displayName = PopoverPrimitive.Content.displayName; - -const Accordion = AccordionPrimitive.Root; - -const AccordionItem = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -AccordionItem.displayName = 'AccordionItem'; - -const AccordionTrigger = React.forwardRef, React.ComponentPropsWithoutRef>( - ({ className, children, ...props }, ref) => ( - - svg]:rotate-180', className)} - {...props} - > - {children} - - - - ) -); -AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName; - -const AccordionContent = React.forwardRef, React.ComponentPropsWithoutRef>( - ({ className, children, ...props }, ref) => ( - -
{children}
- - ) -); -AccordionContent.displayName = AccordionPrimitive.Content.displayName; - -const badgeVariants = cva('inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2', { - variants: { - variant: { - default: 'border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80', - secondary: 'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80', - destructive: 'border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80', - outline: 'text-foreground', - }, - }, - defaultVariants: { - variant: 'default', - }, -}); - -export interface BadgeProps extends React.HTMLAttributes, VariantProps {} - -function Badge({ className, variant, ...props }: BadgeProps) { - return
; -} - -const alertVariants = cva('relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7', { - variants: { - variant: { - default: 'bg-background text-foreground', - destructive: 'border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive', - }, - }, - defaultVariants: { - variant: 'default', - }, -}); - -const Alert = React.forwardRef & VariantProps>(({ className, variant, ...props }, ref) => ( -
-)); -Alert.displayName = 'Alert'; - -const AlertTitle = React.forwardRef>(({ className, ...props }, ref) => ( -
-)); -AlertTitle.displayName = 'AlertTitle'; - -const AlertDescription = React.forwardRef>(({ className, ...props }, ref) => ( -
-)); -AlertDescription.displayName = 'AlertDescription'; - -const ToastProvider = ToastPrimitives.Provider; - -const ToastViewport = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -ToastViewport.displayName = ToastPrimitives.Viewport.displayName; - -const toastVariants = cva( - 'group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md border border-green-600/60 p-4 pr-6 shadow-lg transition-all data-[swipe=cancel]:translate-y-0 data-[swipe=end]:translate-y-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-y-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-top-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full', - { - variants: { - variant: { - default: 'border bg-background text-foreground', - destructive: 'destructive group border-destructive bg-destructive text-destructive-foreground', - }, - }, - defaultVariants: { - variant: 'default', - }, - } -); - -const Toast = React.forwardRef, React.ComponentPropsWithoutRef & VariantProps>( - ({ className, variant, ...props }, ref) => { - return ; - } -); -Toast.displayName = ToastPrimitives.Root.displayName; - -const ToastAction = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -ToastAction.displayName = ToastPrimitives.Action.displayName; - -const ToastClose = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - - - -)); -ToastClose.displayName = ToastPrimitives.Close.displayName; - -const ToastTitle = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -ToastTitle.displayName = ToastPrimitives.Title.displayName; - -const ToastDescription = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => ( - -)); -ToastDescription.displayName = ToastPrimitives.Description.displayName; - -type ToastProps = React.ComponentPropsWithoutRef; - -type ToastActionElement = React.ReactElement; - -export interface InputProps extends React.InputHTMLAttributes {} - -const FloatingInput = React.forwardRef(({ className, ...props }, ref) => { - return ; -}); -FloatingInput.displayName = 'FloatingInput'; - -const FloatingLabel = React.forwardRef, React.ComponentPropsWithoutRef>(({ className, ...props }, ref) => { - return ( -