BlockDex

Components

Registries

Free blocks

Method

BlockDex

Components

Registries

Free blocks

Method

Open API

BlockDex

Components

Registries

Free blocks

Method

Open API

Components/fysk/button

Button

fysk/button
FreeComponent

Standard button with multiple variants with built in state handling.

Install it

npx shadcn@latest add https://fysk.dev/r/button.json

Source

fysk/button.tsxfysk.dev/r/button.json · first 6 KB
1"use client"
2import * as React from "react"
3import { Slot } from "@radix-ui/react-slot"
4import { cva, type VariantProps } from "class-variance-authority"
5
6import { cn } from "@/lib/utils"
7import { useFyskConfig, type FyskIconPosition } from "@/components/fysk-provider"
8import { useFyskAnimation } from "@/components/hooks/useFyskAnimation"
9
10const buttonVariants = cva(
11 "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 rounded-lg border border-transparent bg-clip-padding text-sm font-medium focus-visible:ring-[3px] aria-invalid:ring-[3px] [&_svg:not([class*='size-'])]:size-4 inline-flex items-center justify-center whitespace-nowrap transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none shrink-0 [&_svg]:shrink-0 outline-none group/button select-none overflow-hidden active:scale-95",
12 {
13 variants: {
14 variant: {
15 default: "bg-primary text-primary-foreground hover:bg-primary/90 shadow-xs",
16 outline: "border-border bg-background hover:bg-muted hover:text-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 aria-expanded:bg-muted aria-expanded:text-foreground",
17 secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
18 ghost: "hover:bg-muted hover:text-foreground dark:hover:bg-muted/50 aria-expanded:bg-muted aria-expanded:text-foreground",
19 destructive: "bg-destructive text-destructive-foreground shadow-xs hover:bg-destructive/90",
20 link: "text-primary underline-offset-4 hover:underline",
21
22 glass: "bg-foreground/10 backdrop-blur-md border-border/50 text-foreground hover:bg-foreground/15 shadow-xs",
23 success: "bg-green-600 text-white hover:bg-green-600/90 shadow-xs",
24 warning: "bg-yellow-600 text-white hover:bg-yellow-600/90 shadow-xs",
25 info: "bg-blue-600 text-white hover:bg-blue-600/90 shadow-xs",
26
27 "success-outline": "bg-green-500/10 border border-green-500/50 text-green-700 dark:text-green-400 hover:bg-green-500/20 shadow-xs",
28// … truncated

What it pulls in

npm packages

  • @radix-ui/react-slot
  • class-variance-authority

Other registry items

  • utils
  • https://fysk.dev/r/fysk-provider.json
  • https://fysk.dev/r/fysk-hooks.json

Files it writes

  • fysk/button.tsx

Facts

Registry
fysk
Type
registry:ui
Access
Free
Files written
1
Licence
the repository states none
First indexed
2026-08-04
Last confirmed
today

Go to the source

fysk.dev ameghcoder/fysk on GitHub Raw registry item This item as JSON

More from fysk

All 18 items
Same registry, same kind — the ones you would have found next
ComponentRegistryKindAccessInstallsCommand
AvataravatarfyskComponentsFree2 deps
BadgebadgefyskComponentsFree1 dep
Empty StateemptyfyskComponentsFree2 deps
FormformfyskComponentsFree4 deps
fysk-providerfysk-providerfyskComponentsFree2 deps
InputinputfyskComponentsFree1 dep
Input OTPinput-otpfyskComponentsFreeno deps
KbdkbdfyskComponentsFree1 dep
BlockDex

Built by

Kynth Studio

Index

Components
Registries
Method
Open API

Guides

shadcn component libraries
Best shadcn registries
Free shadcn blocks

Reference

Corpus counts
Crawl health
hello@kynth.studio
Privacy
Terms

BlockDex

BlockDex

Built by

Kynth Studio

Index

Components
Registries
Method
Open API

Guides

shadcn component libraries
Best shadcn registries
Free shadcn blocks

Reference

Corpus counts
Crawl health
hello@kynth.studio
Privacy
Terms

BlockDex

BlockDex

Built by

Kynth Studio

Index

Components
Registries
Method
Open API

Guides

shadcn component libraries
Best shadcn registries
Free shadcn blocks

Reference

Corpus counts
Crawl health
hello@kynth.studio
Privacy
Terms

BlockDex