igniteui-webcomponents/components/button/button-base.js

Ignite UI for Web Components is a complete library of UI components, giving you the ability to build modern web applications using encapsulation and the concept of reusable components in a dependency-free approach.

var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { html, LitElement, nothing } from 'lit';
import { property, query } from 'lit/decorators.js';
import { ifDefined } from 'lit/directives/if-defined.js';
import { addKeyboardFocusRing } from '../common/controllers/focus-ring.js';
import { addInternalsController } from '../common/controllers/internals.js';
import { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';
import { shadowOptions } from '../common/decorators/shadow-options.js';
import { EventEmitterMixin } from '../common//mixins/event-emitter.js';
import { partMap } from '../common/part-map.js';
let IgcButtonBaseComponent = class IgcButtonBaseComponent extends EventEmitterMixin(LitElement) {
    constructor() {
        super(...arguments);
        this._internals = addInternalsController(this);
        this._focusRingManager = addKeyboardFocusRing(this);
        this._disabled = false;
        this.type = 'button';
    }
    set disabled(value) {
        this._disabled = value;
        this.toggleAttribute('disabled', Boolean(this._disabled));
    }
    get disabled() {
        return this._disabled;
    }
    get form() {
        return this._internals.form;
    }
    focus(options) {
        this._nativeButton.focus(options);
    }
    click() {
        this._nativeButton.click();
    }
    blur() {
        this._nativeButton.blur();
    }
    _handleClick() {
        if (this.type === 'submit') {
            this.form?.requestSubmit();
        }
        else if (this.type === 'reset') {
            this.form?.reset();
        }
    }
    formDisabledCallback(state) {
        this._disabled = state;
        this.requestUpdate();
    }
    renderButton() {
        return html `
      <button
        part=${partMap({ base: true, focused: this._focusRingManager.focused })}
        aria-label=${ifDefined(this.ariaLabel ?? nothing)}
        ?disabled=${this.disabled}
        type=${ifDefined(this.type)}
        @click=${this._handleClick}
      >
        ${this.renderContent()}
      </button>
    `;
    }
    renderLinkButton() {
        return html `
      <a
        part=${partMap({ base: true, focused: this._focusRingManager.focused })}
        role="button"
        aria-label=${ifDefined(this.ariaLabel ?? nothing)}
        aria-disabled=${this.disabled}
        href=${ifDefined(this.href)}
        target=${ifDefined(this.target)}
        download=${ifDefined(this.download)}
        rel=${ifDefined(this.rel)}
      >
        ${this.renderContent()}
      </a>
    `;
    }
    render() {
        const link = this.href !== undefined;
        return link ? this.renderLinkButton() : this.renderButton();
    }
};
IgcButtonBaseComponent.formAssociated = true;
__decorate([
    query('[part="base"]', true)
], IgcButtonBaseComponent.prototype, "_nativeButton", void 0);
__decorate([
    property({ reflect: true })
], IgcButtonBaseComponent.prototype, "type", void 0);
__decorate([
    property()
], IgcButtonBaseComponent.prototype, "href", void 0);
__decorate([
    property()
], IgcButtonBaseComponent.prototype, "download", void 0);
__decorate([
    property()
], IgcButtonBaseComponent.prototype, "target", void 0);
__decorate([
    property()
], IgcButtonBaseComponent.prototype, "rel", void 0);
__decorate([
    property({ type: Boolean, reflect: true })
], IgcButtonBaseComponent.prototype, "disabled", null);
IgcButtonBaseComponent = __decorate([
    blazorDeepImport,
    shadowOptions({ delegatesFocus: true })
], IgcButtonBaseComponent);
export { IgcButtonBaseComponent };
//# sourceMappingURL=button-base.js.map