@universal-material/web
Version:
Material web components
66 lines • 2.28 kB
JavaScript
import { __decorate } from "tslib";
import { property } from 'lit/decorators.js';
import { UmButtonBase } from './button-base.js';
import { styles } from './toggle-button.styles.js';
export class UmToggleButton extends UmButtonBase {
constructor() {
super(...arguments);
/**
* When true, the button will toggle between selected and unselected
* states
*/
this.toggle = false;
/**
* When true, the button will toggle between round and square shapes
*/
this.toggleShape = false;
/**
* Sets the selected state
*/
this.selected = false;
/**
* The `aria-label` of the button when the button is toggleable and selected.
*/
this.ariaLabelSelected = '';
this.hasSelectionIcon = false;
}
static { this.styles = [UmButtonBase.styles, styles]; }
handleClick(event) {
super.handleClick(event);
if (!this.toggle) {
return;
}
this.selected = !this.selected;
this.dispatchEvent(new Event('change', { bubbles: true }));
}
getAriaLabel() {
return this.selected
? this.ariaLabelSelected || super.getAriaLabel()
: super.getAriaLabel();
}
handleSelectedIconSlotChange(e) {
this.hasSelectionIcon = e.target.assignedElements({ flatten: true }).length > 0;
}
}
__decorate([
property({ type: Boolean, reflect: true })
], UmToggleButton.prototype, "toggle", void 0);
__decorate([
property({ attribute: 'toggle-shape', type: Boolean, reflect: true })
], UmToggleButton.prototype, "toggleShape", void 0);
__decorate([
property({ type: Boolean, reflect: true })
], UmToggleButton.prototype, "selected", void 0);
__decorate([
property({ reflect: true })
], UmToggleButton.prototype, "shape", void 0);
__decorate([
property({ reflect: true })
], UmToggleButton.prototype, "size", void 0);
__decorate([
property({ attribute: 'aria-label-selected' })
], UmToggleButton.prototype, "ariaLabelSelected", void 0);
__decorate([
property({ type: Boolean, attribute: 'has-selection-icon', reflect: true })
], UmToggleButton.prototype, "hasSelectionIcon", void 0);
//# sourceMappingURL=toggle-button.js.map