"use client"; import React from "react"; import { Card } from "@/components/ui/card"; import { Button } from "@/components/ui/button"; import Copy from "@/components/copy"; import { RiFacebookFill, RiGithubFill, RiGoogleFill, RiTwitterXFill, } from "@remixicon/react"; import { AlertCircle, ArrowRight, Bell, Check, ChevronRight, Download, Edit, ExternalLink, Eye, Filter, Heart, HelpCircle, Home, Info, LoaderCircle, Lock, LogIn, LogOut, Mail, Menu, MessageCircle, Moon, MoreHorizontal, Play, Plus, RefreshCw, Save, Search, Send, Settings, Share, ShoppingCart, Star, Sun, Trash, Upload, User, UserPlus, X, } from "lucide-react"; export default function ImportantButtons() { const buttons = [ { name: "primaryButton", component: PrimaryButton, code: ``, }, { name: "secondaryButton", component: SecondaryButton, code: ``, }, { name: "outlineButton", component: OutlineButton, code: ``, }, { name: "ghostButton", component: GhostButton, code: ``, }, { name: "destructiveButton", component: DestructiveButton, code: ``, }, { name: "linkButton", component: LinkButton, code: ``, }, { name: "iconButton", component: IconButton, code: ``, }, { name: "loadingButton", component: LoadingButton, code: ``, }, { name: "submitButton", component: SubmitButton, code: ``, }, { name: "resetButton", component: ResetButton, code: ``, }, { name: "loginButton", component: LoginButton, code: ``, }, { name: "logoutButton", component: LogoutButton, code: ``, }, { name: "signupButton", component: SignupButton, code: ``, }, { name: "deleteButton", component: DeleteButton, code: ``, }, { name: "editButton", component: EditButton, code: ``, }, { name: "saveButton", component: SaveButton, code: ``, }, { name: "cancelButton", component: CancelButton, code: ``, }, { name: "searchButton", component: SearchButton, code: ``, }, { name: "filterButton", component: FilterButton, code: ``, }, { name: "downloadButton", component: DownloadButton, code: ``, }, { name: "uploadButton", component: UploadButton, code: ``, }, { name: "shareButton", component: ShareButton, code: ``, }, { name: "settingsButton", component: SettingsButton, code: ``, }, { name: "helpButton", component: HelpButton, code: ``, }, { name: "infoButton", component: InfoButton, code: ``, }, { name: "alertButton", component: AlertButton, code: ``, }, { name: "menuButton", component: MenuButton, code: ``, }, { name: "cartButton", component: CartButton, code: ``, }, { name: "favoriteButton", component: FavoriteButton, code: ``, }, { name: "ratingButton", component: RatingButton, code: ``, }, { name: "sendButton", component: SendButton, code: ``, }, { name: "refreshButton", component: RefreshButton, code: ``, }, { name: "moreButton", component: MoreButton, code: ``, }, { name: "homeButton", component: HomeButton, code: ``, }, { name: "profileButton", component: ProfileButton, code: ``, }, { name: "messageButton", component: MessageButton, code: ``, }, { name: "darkModeToggle", component: DarkModeToggle, code: ``, }, { name: "showPasswordToggle", component: ShowPasswordToggle, code: ``, }, { name: "externalLinkButton", component: ExternalLinkButton, code: ``, }, { name: "nextButton", component: NextButton, code: ``, }, { name: "confirmButton", component: ConfirmButton, code: ``, }, { name: "lockButton", component: LockButton, code: ``, }, { name: "subscribeButton", component: SubscribeButton, code: ``, }, { name: "callToActionButton", component: CallToActionButton, code: ``, }, { name: "expandButton", component: ExpandButton, code: ``, }, { name: "scrollToTopButton", component: ScrollToTopButton, code: ``, }, { name: "copyButton", component: CopyButton, code: ``, }, { name: "audioControlButton", component: AudioControlButton, code: ``, }, { name: "notificationButton", component: NotificationButton, code: ``, }, { name: "LoginGoogle", component: LoginGoogle, code: ` `, }, { name: "Loginx", component: Loginx, code: ` `, }, { name: "LoginFacebook", component: LoginFacebook, code: ` `, }, { name: "LoginGithub", component: LoginGithub, code: ` `, }, ]; return (

{buttons.map(({ name, component: ButtonComponent, code }) => (

))}

); } // Button components export function PrimaryButton() { return ; } export function SecondaryButton() { return ; } export function OutlineButton() { return ; } export function GhostButton() { return ; } export function DestructiveButton() { return ; } export function LinkButton() { return ; } export function IconButton() { return ( ); } export function LoadingButton() { return ( ); } export function SubmitButton() { return ; } export function ResetButton() { return ; } export function LoginButton() { return ( ); } export function LogoutButton() { return ( ); } export function SignupButton() { return ( ); } export function DeleteButton() { return ( ); } export function EditButton() { return ( ); } export function SaveButton() { return ( ); } export function CancelButton() { return ( ); } export function SearchButton() { return ( ); } export function FilterButton() { return ( ); } export function DownloadButton() { return ( ); } export function UploadButton() { return ( ); } export function ShareButton() { return ( ); } export function SettingsButton() { return ( ); } export function HelpButton() { return ( ); } export function InfoButton() { return ( ); } export function AlertButton() { return ( ); } export function MenuButton() { return ( ); } export function CartButton() { return ( ); } export function FavoriteButton() { return ( ); } export function RatingButton() { return ( ); } export function SendButton() { return ( ); } export function RefreshButton() { return ( ); } export function MoreButton() { return ( ); } export function HomeButton() { return ( ); } export function ProfileButton() { return ( ); } export function MessageButton() { return ( ); } export function DarkModeToggle() { return ( ); } export function ShowPasswordToggle() { return ( ); } export function ExternalLinkButton() { return ( ); } export function NextButton() { return ( ); } export function ConfirmButton() { return ( ); } export function LockButton() { return ( ); } export function SubscribeButton() { return ( ); } export function CallToActionButton() { return ( ); } export function ExpandButton() { return ( ); } export function ScrollToTopButton() { return ( ); } export function CopyButton() { return ( ); } export function AudioControlButton() { return ( ); } export function NotificationButton() { return ( ); } export function LoginGoogle() { return ( ); } export function Loginx() { return ( ); } export function LoginFacebook() { return ( ); } export function LoginGithub() { return ( ); }

Button

Installation

Usage