1.3.0 • Published 2 years ago

@monstera/ui-components-button v1.3.0

Weekly downloads
-
License
ISC
Repository
github
Last release
2 years ago

Button

Buttons can be used for actions in a app, from submitting forms to menus or applying filters

Installation guide

yarn add @monstera/ui-components-button
# or
npm install @monstera/ui-components-button

Usage

Basic

import React from "react";
import {Button} from "@monstera/ui-components";

const MyApp = () => (
    <div>
        <Button size="medium">Login</Button>
        <Button type="secondary" size="medium">Signup</Button>
    </div>
)

Button with icon

import React from "react";
import { Edit } from 'react-feather'
import {Button} from "@monstera/ui-components";

const EditIcon = () => <Edit strokeWidth={2} size={18}/>

const MyApp = () => (
    <Button label="Edit profile" Icon={EditIcon} />
)

Props

NameTypeDefault ValueAvailable valuesDescription
typestringprimaryprimary secondary tertiaryApplies styling according to styleguide
labelstring''-The label of the button
sizestringmediumlarge medium smallDefines the size of the button according to styleguide
disabledboolfalsetrue falseDisables button when value is true
fullWidthboolfalsetrue falseButton takes the width of the container when value is true
onClickfunctionnull-Callback function for click event
classNamestring''customComponent can accept custom styling
iconsvg''any svgSVG Icon for the button