No Preview

Sorry, but you either have no stories or none are selected somehow.

If the problem persists, check the browser console, or the terminal you've run Storybook from.

created:4/19/2020
,
updated:1/12/2021

Starter

This example demonstrates documenting a hypothetical Button component that supports variants, icons, text, and padding

Component

import { VariantButton } from 'component-controls-stories';

Overview

In the Playground, you can view the source code, apply zoom or background...

Controls

Name
Description
Default
Controls
text

button label of text

string
-
variant

variant kind

primaryaccentdisabledsuccesswarningerror
primary
fontSize

font size for the Button label

number
18
icon

icon kind

nonesearchleft-arrowright-arrowdown-arrowup-arrow
-
iconSide

on which side of the label should the icon be placed

leftright
left
iconSize

icon size

smallmediumlarge
small
padding

padding variants

smallmediumlarge
medium
isPrimary

boolean switch for primary variant @deprecated since version 1.0

boolean
false

External dependencies

package
imports
peer
SearchIconArrowUpIconArrowRightIconArrowLeftIconArrowDownIcon
ReactFC

Component JSX