import { __decorate } from "tslib";
import { attr, nullableNumberConverter } from '@ni/fast-element';
import { Button as FoundationButton, DesignSystem } from '@ni/fast-foundation';
import { styles } from './styles';
import { template } from './template';
import { ButtonAppearance, ButtonAppearanceVariant } from './types';
/**
 * A nimble-styled HTML button
 */
export class Button extends FoundationButton {
    constructor() {
        super(...arguments);
        /**
         * @public
         * @remarks
         * HTML Attribute: appearance
         */
        this.appearance = ButtonAppearance.outline;
        /**
         * @public
         * @remarks
         * HTML Attribute: content-hidden
         */
        this.contentHidden = false;
    }
}
__decorate([
    attr
], Button.prototype, "appearance", void 0);
__decorate([
    attr({ attribute: 'appearance-variant' })
], Button.prototype, "appearanceVariant", void 0);
__decorate([
    attr({ attribute: 'content-hidden', mode: 'boolean' })
], Button.prototype, "contentHidden", void 0);
__decorate([
    attr({ attribute: 'tabindex', converter: nullableNumberConverter })
], Button.prototype, "tabIndex", void 0);
/**
 * A function that returns a nimble-button registration for configuring the component with a DesignSystem.
 * Implements {@link @ni/fast-foundation#buttonTemplate}
 *
 * @public
 * @remarks
 * Generates HTML Element: \<nimble-button\>
 *
 */
const nimbleButton = Button.compose({
    baseName: 'button',
    baseClass: FoundationButton,
    template,
    styles,
    shadowOptions: {
        delegatesFocus: true
    }
});
DesignSystem.getOrCreate().withPrefix('nimble').register(nimbleButton());
export const buttonTag = 'nimble-button';
//# sourceMappingURL=index.js.map