import { __decorate } from "tslib";
import { attr, nullableNumberConverter } from '@ni/fast-element';
import { applyMixins, DelegatesARIAButton, DesignSystem, StartEnd, Switch as FoundationSwitch } from '@ni/fast-foundation';
import { styles } from './styles';
import { template } from './template';
import { ButtonAppearance, ButtonAppearanceVariant } from './types';
/**
 * A nimble-styled toggle button control.
 */
export class ToggleButton extends FoundationSwitch {
    constructor() {
        super(...arguments);
        /**
         * @public
         * @remarks
         * HTML Attribute: appearance
         */
        this.appearance = ButtonAppearance.outline;
        /**
         * @public
         * @remarks
         * HTML Attribute: content-hidden
         */
        this.contentHidden = false;
    }
    /**
     * @internal
     */
    get resolvedTabindex() {
        const tabIndex = this.tabIndex ?? 0;
        return this.disabled ? undefined : `${tabIndex}`;
    }
}
__decorate([
    attr
], ToggleButton.prototype, "appearance", void 0);
__decorate([
    attr({ attribute: 'appearance-variant' })
], ToggleButton.prototype, "appearanceVariant", void 0);
__decorate([
    attr({ attribute: 'content-hidden', mode: 'boolean' })
], ToggleButton.prototype, "contentHidden", void 0);
__decorate([
    attr({ attribute: 'tabindex', converter: nullableNumberConverter })
], ToggleButton.prototype, "tabIndex", void 0);
applyMixins(ToggleButton, StartEnd, DelegatesARIAButton);
const nimbleToggleButton = ToggleButton.compose({
    baseName: 'toggle-button',
    template,
    styles,
    shadowOptions: {
        delegatesFocus: true
    }
});
DesignSystem.getOrCreate().withPrefix('nimble').register(nimbleToggleButton());
export const toggleButtonTag = 'nimble-toggle-button';
//# sourceMappingURL=index.js.map