Vue Drip Button

A Vue.js plugin to easily integrate button in your projects.

Vue Drip Button is a simple button that give a lot of alternatives to work with, instead of using a predefined button.

Installation

Install the package from npm by running:

# install dependencies
npm i @arikardnoir/vue-drip-button

Usage

Import, register and place the component in your Vue app.

<template>
  <VueDripButton />
</template>

import VueDripButton from 'vue-drip-button'

export default {
  components: {
    VueDripButton,
  }
}

Accessibility

Apply attributes, directly on the element to apply them to the button.

<template>
  <VueDripButton
    classType="button success"
    text="New Product"
    :needSpinner="true"
    :isRequesting="true"
  />
</template>

Props

Components Property that make him cool

Name	Type	Default	Description
classType	String	button success	This prop allow to change button color,according to our terms
text	String		This prop allow you to change the button text
needSpinner	Boolean	false	With this prop you make choice if you want to use spinner on this button
isRequesting	Boolean	false	This prop make sense if you will use the Spinner, i could help your button spinner work if the two are in TRUE mode.
isDisabled	Boolean	false	This prop is for disable your button

Button Color Styles

Component classType for change the Style

classType	Type	Image
primary	String
secondary	String
warning	String
danger	String
success	String (default)
info	String
primary-outline	String
secondary-outline	String
warning-outline	String
danger-outline	String
success-outline	String
info-outline	String