jcb-button-bar
v1.1.1
Published
bar of buttons
Downloads
1
Readme
Install
npm install jcb-button-barUsage example
<!DOCTYPE html>
<body>
<jcb-button-bar id="bar" style="width: 500px;">
<jcb-button-bar-item style="flex-grow: 1;">
<div slot="text">poids</div>
<!--div slot="icon">xxx</div-->
</jcb-button-bar-item>
<jcb-button-bar-item style="flex-grow: 1;">
<div slot="text">masse grasse</div>
</jcb-button-bar-item>
<jcb-button-bar-item style="flex-grow: 1;">
<div slot="text">marche</div>
</jcb-button-bar-item>
<jcb-button-bar-item style="flex-grow: 1;" disabled>
<div slot="text">escaliers</div>
</jcb-button-bar-item>
<jcb-button-bar-item style="flex-grow: 1;">
<div slot="text">intensité</div>
</jcb-button-bar-item>
</jcb-button-bar>
</body>
<script type="module">
import 'jcb-button-bar'
const bar = document.getElementById('bar')
bar.addEventListener('select', event => {
console.log('value', event.target.value)
})
</script>API references
jcb-button-bar
Properties
| Name | Type | Default | Description |
| ---------------- |:-------------:|:----------:| --------------------------------------------------------------|
| xxx | Boolean | false | Indicates that button is disabled |
Events
| Name | Description | Value |
| ---------------------- |---------------------------------------------| ------------------------|
| select | Emitted whenever a button is selected | null |