import React from 'react'
import { Button } from '@/app/components/shadcn-ui/Default-Ui/button'
const BasicButtonCode = () => {
return (
<>
<div className="flex flex-wrap items-center gap-3 mt-4">
<Button>Primary</Button>
<Button variant="secondary">Secondary</Button>
<Button variant="success">Success</Button>
<Button variant="warning">Warning</Button>
<Button variant="error">Error</Button>
<Button variant="info">Info</Button>
</div>
</>
)
}
export default BasicButtonCode
import React from 'react'
import { Button } from '@/app/components/shadcn-ui/Default-Ui/button'
const OutlineButtonCode = () => {
return (
<>
<div className="flex flex-wrap items-center gap-3 mt-4">
<Button variant="outline">Primary</Button>
<Button variant="outlinesecondary">Secondary</Button>
<Button variant="outlinesuccess">Success</Button>
<Button variant="outlinewarning">Warning</Button>
<Button variant="outlineerror">Error</Button>
<Button variant="outlineinfo">Info</Button>
</div>
</>
)
}
export default OutlineButtonCode
import React from 'react'
import { Button } from '@/app/components/shadcn-ui/Default-Ui/button'
const GhostButtonCode = () => {
return (
<>
<div className="flex flex-wrap items-center gap-3 mt-4">
<Button variant="ghostprimary" >Primary</Button>
<Button variant="ghostsecondary" >Secondary</Button>
<Button variant="ghostsuccess" >Success</Button>
<Button variant="ghostwarning" >Warning</Button>
<Button variant="ghosterror" >Error</Button>
<Button variant="ghostinfo" >Info</Button>
</div>
</>
)
}
export default GhostButtonCode
import React from 'react'
import { Button } from '@/app/components/shadcn-ui/Default-Ui/button'
import { Loader2 } from 'lucide-react'
const LoadingButtonCode = () => {
return (
<>
<div className="flex flex-wrap items-center gap-3 mt-4">
<Button disabled ><Loader2 className="animate-spin" /> Please wait</Button>
<Button variant="secondary" disabled ><Loader2 className="animate-spin" /> Please wait</Button>
<Button variant="success" disabled ><Loader2 className="animate-spin" /> Please wait</Button>
<Button variant="warning" disabled ><Loader2 className="animate-spin" /> Please wait</Button>
<Button variant="error" disabled ><Loader2 className="animate-spin" /> Please wait</Button>
<Button variant="info" disabled ><Loader2 className="animate-spin" /> Please wait</Button>
</div>
</>
)
}
export default LoadingButtonCode