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 { LitElement, html, nothing } from 'lit';
import { property, query } from 'lit/decorators.js';
import { ifDefined } from 'lit/directives/if-defined.js';
import { EventEmitterMixin } from '../common//mixins/event-emitter.js';
import { addKeyboardFocusRing } from '../common/controllers/focus-ring.js';
import { blazorDeepImport } from '../common/decorators/blazorDeepImport.js';
import { partNameMap } from '../common/util.js';
let IgcButtonBaseComponent = class IgcButtonBaseComponent extends EventEmitterMixin(LitElement) {
    get disabled() {
        return this._disabled;
    }
    set disabled(value) {
        this._disabled = value;
        this.toggleAttribute('disabled', Boolean(this._disabled));
    }
    get form() {
        return this.__internals.form;
    }
    constructor() {
        super();
        this._kbFocus = addKeyboardFocusRing(this);
        this._disabled = false;
        this.type = 'button';
        this.__internals = this.attachInternals();
    }
    focus(options) {
        this._nativeButton.focus(options);
    }
    click() {
        this._nativeButton.click();
    }
    blur() {
        this._nativeButton.blur();
    }
    handleBlur() {
        this._kbFocus.reset();
    }
    handleClick() {
        this._kbFocus.reset();
        switch (this.type) {
            case 'submit':
                return this.form?.requestSubmit();
            case 'reset':
                return this.form?.reset();
            default:
                return;
        }
    }
    formDisabledCallback(state) {
        this._disabled = state;
        this.requestUpdate();
    }
    renderButton() {
        return html `
      <button
        part=${partNameMap({
            base: true,
            focused: this._kbFocus.focused,
        })}
        aria-label=${ifDefined(this.ariaLabel ?? nothing)}
        ?disabled=${this.disabled}
        type=${ifDefined(this.type)}
        @click=${this.handleClick}
        @blur=${this.handleBlur}
      >
        ${this.renderContent()}
      </button>
    `;
    }
    renderLinkButton() {
        return html `
      <a
        part=${partNameMap({
            base: true,
            focused: this._kbFocus.focused,
        })}
        role="button"
        aria-label=${ifDefined(this.ariaLabel ?? nothing)}
        aria-disabled=${this.disabled ? 'true' : 'false'}
        href=${ifDefined(this.href)}
        target=${ifDefined(this.target)}
        download=${ifDefined(this.download)}
        rel=${ifDefined(this.rel)}
        @blur=${this.disabled ? nothing : this.handleBlur}
      >
        ${this.renderContent()}
      </a>
    `;
    }
    render() {
        const link = this.href !== undefined;
        return link ? this.renderLinkButton() : this.renderButton();
    }
};
IgcButtonBaseComponent.formAssociated = true;
IgcButtonBaseComponent.shadowRootOptions = {
    ...LitElement.shadowRootOptions,
    delegatesFocus: 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
], IgcButtonBaseComponent);
export { IgcButtonBaseComponent };
//# sourceMappingURL=button-base.js.map