Components
Button
Perform your actions on click of a button.
Usage
<template>
<NXW-Button> Click Me! </NXW-Button>
</template>
Props
ari-label
string
|
undefined
Default
undefined
color
object
Default
<template>
<NXW-Button
:color="{
bg: 'bg-primary-900 dark:bg-primary-900',
text: 'dark:text-white text-black',
border: 'dark:border-white border-black',
hover: 'hover:bg-secondary-800 dark:hover:bg-secondary-800',
iconHover: 'hover:text-secondary-800 dark:hover:text-secondary-800',
loadingCircle: '#27272a',
loadingCircleDark: '#27272a',
loadingCircleProgress: '#10b981',
loadingCircleProgressDark: '#10b981',
loadingCircleCutout: 'before:bg-primary-900 dark:before:bg-primary-900',
}"
/>
</template>
dense
boolean
Default
false
disabled
boolean
Default
false
grow
object
|
boolean
Default
<template>
<NXW-Button :grow="{ delay: 'delay-10', scale: 'hover:scale-105' }" />
</template>
height
string
Default
"" (empty string)
icon
boolean
Default
false
link
string
|
undefined
Default
undefined
loading
boolean
Default
false
rounded
boolean
|
string
Default
rounded-md
shadow
boolean
|
string
Default
shadow-md
target
string
Default
_self
transition
object
|
boolean
Default
<template>
<NXW-Button :transition="{ duration: 'duration-300', ease: 'ease-in-out' }" />
</template>
type
button
|
submit
|
reset
Default
button
width
string
Default
w-fit