@universal-material/web/button/fab.js

Material web components

import { __decorate } from "tslib";
import { html, nothing } from 'lit';
import { customElement, property } from 'lit/decorators.js';
import { UmButtonBase } from './button-base.js';
import { styles } from './fab.styles.js';
let UmFab = class UmFab extends UmButtonBase {
    constructor() {
        super(...arguments);
        /**
         * The FAB color variant to render.
         */
        this.color = 'primary';
        /**
         * The size of the FAB.
         */
        this.size = 'medium';
        /**
         * The text to display the FAB.
         */
        this.label = null;
        /**
         * Lowers the FAB's elevation.
         */
        this.lowered = false;
    }
    static { this.styles = [UmButtonBase.styles, styles]; }
    get extended() {
        return !!this.label;
    }
    renderContent() {
        const labelTag = html `<span>${this.label}</span>`;
        return html `
      <span class="icon" aria-hidden="true"><slot></slot></span>
      ${this.label ? labelTag : nothing}
    `;
    }
};
__decorate([
    property({ reflect: true })
], UmFab.prototype, "color", void 0);
__decorate([
    property({ reflect: true })
], UmFab.prototype, "size", void 0);
__decorate([
    property({ reflect: true })
], UmFab.prototype, "label", void 0);
__decorate([
    property({ type: Boolean, reflect: true })
], UmFab.prototype, "lowered", void 0);
__decorate([
    property({ type: Boolean, reflect: true })
], UmFab.prototype, "extended", null);
UmFab = __decorate([
    customElement('u-fab')
], UmFab);
export { UmFab };
//# sourceMappingURL=fab.js.map