JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 134
  • Score
    100M100P100Q89261F
  • License MIT

devseed UI Kit Button

Package Exports

  • @devseed-ui/button

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@devseed-ui/button) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Button

Example

import { Button } from '@devseed-ui/button';
    <Button
        theme={theme.main}
        variation='base-raised-semidark'
        size='medium'
        className='button-class'
        title='sample button'
        onClick={(event) => {/* Something to handle the click event */}}
    >
    Click Me
    </Button>

Output HTML

  <button class="sc-bdVaJa rCuob button-class" title="sample button" type="button">
      <span>
          Click Me
      </span>
  </button>

Properties

Prop Type Description Default
variant 'default', 'primary', 'info', 'danger', 'dark' Sets the style variant of the button. 'default'
size 'xsmall', 'small', 'normal', 'large' Sets the size variant of the button. 'normal'
children node The content that will appear inside of the <Button /> component. null
onClick function The event handler function for the 'onclick' event. Receives the associated event object as the first argument.
className string Adds a className to the class attribute. ''
value string Sets the HTML value attribute.
disabled boolean Disabled the button false
as HTML Tag or React Element Determines the root element. For example, Link or a tags can be supplied to replace button from being the DOM element that wraps the component. button
href string If a href is supplied it willl change the as value, such that the component renders inside of an a tag instead of inside of a button tag.

Any other properties will be spread on the input element.