New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More
Socket
Sign inDemoInstall
Socket

boundless-button

Package Overview
Dependencies
Maintainers
1
Versions
11
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

boundless-button

A control with "pressed" state support.

  • 1.0.0-beta.3
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
2
decreased by-81.82%
Maintainers
1
Weekly downloads
 
Created
Source

THIS IS AN AUTOGENERATED FILE. EDIT INDEX.JS INSTEAD.

Button

A control with "pressed" state support.

Button has two modes of operation:

  1. stateless (like a normal <button>)

    <Button onPressed={doSomething}>foo</Button>
    

    Note that instead of onClick, Button uses onPressed. This is because the component also listens for keyboard Enter events, so onClick only tells half the story. You can still bind to that particular React event though if there's a need to tell the difference between clicks and Enter presses.

  2. stateful (like a toggle, e.g. bold-mode in a rich text editor)

    "stateful" mode is triggered by passing a boolean to pressed. This enables the button to act like a controlled component. The onUnpressed event callback will also now be fired when appropriate.

    <Button
        pressed={true}
        onPressed={doSomething}
        onUnpressed={doSomethingElse}>
        foo
    </Button>
    

Props

Note: only top-level props are in the README, for the full list check out the website.

Required Props

There are no required props.

Optional Props

<tr>
    <td>children</td>
    <td><pre><code>any renderable</code></pre></td>
    <td><pre><code class="language-js">null</code></pre></td>
    <td></td>
</tr>

<tr>
    <td>component</td>
    <td><pre><code>string or function</code></pre></td>
    <td><pre><code class="language-js">'button'</code></pre></td>
    <td>Any valid HTML tag name or a React component factory, anything that can be passed as the first argument to `React.createElement`</td>
</tr>

<tr>
    <td>onClick</td>
    <td><pre><code>function</code></pre></td>
    <td><pre><code class="language-js">noop</code></pre></td>
    <td></td>
</tr>

<tr>
    <td>onPressed</td>
    <td><pre><code>function</code></pre></td>
    <td><pre><code class="language-js">noop</code></pre></td>
    <td>called when the element becomes "pressed" or triggered by the user (mouse or keyboard); backing data must be updated to persist the state change; this function will still be called if `props.pressed` is not passed</td>
</tr>

<tr>
    <td>onUnpressed</td>
    <td><pre><code>function</code></pre></td>
    <td><pre><code class="language-js">noop</code></pre></td>
    <td>called when the element becomes "unpressed"; backing data must be updated to persist the state change</td>
</tr>

<tr>
    <td>pressed</td>
    <td><pre><code>bool</code></pre></td>
    <td><pre><code class="language-js">undefined</code></pre></td>
    <td>enables "pressed" support and adds the `aria-pressed` attribute to the `.b-button` node; essentially a "stateful" button (see the "unpressed/pressed" example demo above)</td>
</tr>
NameTypeDefault ValueDescription

Keywords

FAQs

Package last updated on 25 Jan 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc