# @origamijs/zen-button

> The button element is a styled button with options of adding an icon, loading state, and size.

Latest version **0.0.1** (published 2018-10-08) · 0 weekly downloads

## Install

```sh
npm install @origamijs/zen-button
pnpm add @origamijs/zen-button
yarn add @origamijs/zen-button
bun add @origamijs/zen-button
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.1 |
| Published | 2018-10-08 |
| First published | 2018-09-28 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 1.4 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Tristan Matthias |
| Maintainers | tmatthias |

## Links

- npm: https://www.npmjs.com/package/@origamijs/zen-button
- npm.io page: https://npm.io/package/@origamijs/zen-button

## Recent versions

- 0.0.1 (latest) — 2018-10-08
- 0.0.0 — 2018-09-28

## README

# Button
The button element is a styled button with options of
adding an icon, loading state, and size.



## Properties

| Prop | Type | Description | Optional | Default |
|---|---|---|---|---|
| `color` |  `string`  |  | ✓ |  |
| `disabled` |  `true`  `false`  |  | ✓ |  |
| `hollow` |  `true`  `false`  |  | ✓ |  |
| `icon` |  `string`  `false`  |  | ✓ |  |
| `iconright` |  `true`  `false`  |  | ✓ |  |
| `loading` |  `true`  `false`  |  | ✓ |  |
| `renderComplete` |  `reference`  `Promise`  `[object Object]`  | Returns a promise which resolves after the element next renders. The promise resolves to &#x60;true&#x60; if the element rendered and &#x60;false&#x60; if the element did not render. This is useful when users (e.g. tests) need to react to the rendered state of the element after a change is made. This can also be useful in event handlers if it is desireable to wait to send an event until after rendering. If possible implement the &#x60;_didRender&#x60; method to directly respond to rendering within the rendering lifecycle. |  |  |
| `size` |  `string`  |  | ✓ |  |

## CSS Properties

| Prop | Description |
|---|---|
| `--btn-padding` | Padding for the button |
| `--btn-height` | Height of the button |
| `--btn-border-radius` | Border radius of the button |
| `--btn-bg` | Background color of the button |

---
_Source: https://npm.io/package/@origamijs/zen-button · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
