kwikui
Version:
KwikID's UI Component Library in Angular
92 lines • 13.4 kB
JavaScript
import { Component, EventEmitter, Input, Output } from "@angular/core";
import { isEmptyValue, isNotEmptyValue } from "kwikid-toolkit";
import { throwErrorMessage } from "../../../helpers/kwikui.common.helpers";
import { DEFAULT_VALUES, VALIDATE_KEY_VALUES } from "./button.constants";
import { isValidKeyValue } from "./button.validation";
import * as i0 from "@angular/core";
import * as i1 from "@taiga-ui/core";
import * as i2 from "@angular/common";
export class KwikUIButtonComponent {
constructor() {
this.appearance = DEFAULT_VALUES.appearance;
this.class = DEFAULT_VALUES.class;
this.disabled = DEFAULT_VALUES.disabled;
this.icon = DEFAULT_VALUES.icon;
this.iconRight = DEFAULT_VALUES.iconRight;
this.id = DEFAULT_VALUES.id;
this.label = DEFAULT_VALUES.label;
this.shape = DEFAULT_VALUES.shape;
this.showLoader = DEFAULT_VALUES.showLoader;
this.size = DEFAULT_VALUES.size;
this.styles = DEFAULT_VALUES.styles;
this.type = DEFAULT_VALUES.type;
this.pseudoHover = DEFAULT_VALUES.pseudoHover;
this.onClick = new EventEmitter();
this.showIconButton = false;
}
ngOnInit() {
this.evaluateShowIconButton();
}
ngOnChanges(changes) {
for (const change of Object.entries(changes)) {
const key = change[0];
const value = change[1].currentValue;
this.validateInputProperty(key, value);
}
this.evaluateShowIconButton();
}
validateInputProperty(key, value) {
if (VALIDATE_KEY_VALUES[key] && !isValidKeyValue(key, value)) {
this[key] = DEFAULT_VALUES[key];
throwErrorMessage("kwikui-button", this.id, key, value, DEFAULT_VALUES[key]);
}
}
handleOnClick(e) {
this.onClick.emit(e);
}
evaluateShowIconButton() {
this.showIconButton =
isEmptyValue(this.label) &&
isEmptyValue(this.iconRight) &&
isNotEmptyValue(this.icon);
}
}
/** @nocollapse */ KwikUIButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: KwikUIButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
/** @nocollapse */ KwikUIButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: KwikUIButtonComponent, selector: "kwikui-button", inputs: { appearance: "appearance", class: "class", disabled: "disabled", icon: "icon", iconRight: "iconRight", id: "id", label: "label", shape: "shape", showLoader: "showLoader", size: "size", styles: "styles", type: "type", pseudoHover: "pseudoHover" }, outputs: { onClick: "onClick" }, usesOnChanges: true, ngImport: i0, template: "<button\n *ngIf=\"!showIconButton; else iconButtonTemplate\"\n tuiButton\n [appearance]=\"appearance\"\n [class]=\"class\"\n [disabled]=\"disabled\"\n [icon]=\"icon\"\n [iconRight]=\"iconRight\"\n [id]=\"id\"\n [nativeId]=\"id\"\n [shape]=\"shape\"\n [showLoader]=\"showLoader\"\n [size]=\"size\"\n [style]=\"styles\"\n [type]=\"type\"\n [pseudoHover]=\"pseudoHover\"\n (click)=\"handleOnClick($event)\"\n>\n {{ label }}\n</button>\n\n<ng-template #iconButtonTemplate>\n <button\n tuiIconButton\n [appearance]=\"appearance\"\n [class]=\"class\"\n [disabled]=\"disabled\"\n [icon]=\"icon\"\n [id]=\"id\"\n [nativeId]=\"id\"\n [shape]=\"shape\"\n [showLoader]=\"showLoader\"\n [size]=\"size\"\n [style]=\"styles\"\n [type]=\"type\"\n [pseudoHover]=\"pseudoHover\"\n (click)=\"handleOnClick($event)\"\n ></button>\n</ng-template>\n", styles: [".w-100{width:100%}button{margin:0}.view-button-underline:hover{background:none;text-decoration:underline;-webkit-text-decoration-color:var(--tui-primary);text-decoration-color:var(--tui-primary)}\n"], components: [{ type: i1.TuiButtonComponent, selector: "button[tuiButton], button[tuiIconButton], a[tuiButton], a[tuiIconButton]", inputs: ["appearance", "disabled", "icon", "iconRight", "shape", "showLoader", "size"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: KwikUIButtonComponent, decorators: [{
type: Component,
args: [{
selector: "kwikui-button",
templateUrl: "./button.component.html",
styleUrls: ["./button.component.scss"]
}]
}], ctorParameters: function () { return []; }, propDecorators: { appearance: [{
type: Input
}], class: [{
type: Input
}], disabled: [{
type: Input
}], icon: [{
type: Input
}], iconRight: [{
type: Input
}], id: [{
type: Input
}], label: [{
type: Input
}], shape: [{
type: Input
}], showLoader: [{
type: Input
}], size: [{
type: Input
}], styles: [{
type: Input
}], type: [{
type: Input
}], pseudoHover: [{
type: Input
}], onClick: [{
type: Output
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2t3aWt1aS9zcmMvbGliL2NvbXBvbmVudHMvY29yZS9idXR0b24vYnV0dG9uLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2t3aWt1aS9zcmMvbGliL2NvbXBvbmVudHMvY29yZS9idXR0b24vYnV0dG9uLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFDTCxTQUFTLEVBQ1QsWUFBWSxFQUNaLEtBQUssRUFHTCxNQUFNLEVBRVAsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLFlBQVksRUFBRSxlQUFlLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUMvRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUMzRSxPQUFPLEVBQUUsY0FBYyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFPekUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7O0FBT3RELE1BQU0sT0FBTyxxQkFBcUI7SUErQmhDO1FBOUJTLGVBQVUsR0FBNEIsY0FBYyxDQUFDLFVBQVUsQ0FBQztRQUVoRSxVQUFLLEdBQVcsY0FBYyxDQUFDLEtBQUssQ0FBQztRQUVyQyxhQUFRLEdBQVksY0FBYyxDQUFDLFFBQVEsQ0FBQztRQUU1QyxTQUFJLEdBQVcsY0FBYyxDQUFDLElBQUksQ0FBQztRQUVuQyxjQUFTLEdBQVcsY0FBYyxDQUFDLFNBQVMsQ0FBQztRQUU3QyxPQUFFLEdBQVcsY0FBYyxDQUFDLEVBQUUsQ0FBQztRQUUvQixVQUFLLEdBQVcsY0FBYyxDQUFDLEtBQUssQ0FBQztRQUVyQyxVQUFLLEdBQXVCLGNBQWMsQ0FBQyxLQUFLLENBQUM7UUFFakQsZUFBVSxHQUFZLGNBQWMsQ0FBQyxVQUFVLENBQUM7UUFFaEQsU0FBSSxHQUFzQixjQUFjLENBQUMsSUFBSSxDQUFDO1FBRTlDLFdBQU0sR0FBVyxjQUFjLENBQUMsTUFBTSxDQUFDO1FBRXZDLFNBQUksR0FBc0IsY0FBYyxDQUFDLElBQUksQ0FBQztRQUU5QyxnQkFBVyxHQUFZLGNBQWMsQ0FBQyxXQUFXLENBQUM7UUFFakQsWUFBTyxHQUFHLElBQUksWUFBWSxFQUFPLENBQUM7UUFFNUMsbUJBQWMsR0FBRyxLQUFLLENBQUM7SUFFUixDQUFDO0lBRWhCLFFBQVE7UUFDTixJQUFJLENBQUMsc0JBQXNCLEVBQUUsQ0FBQztJQUNoQyxDQUFDO0lBRUQsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLEtBQUssTUFBTSxNQUFNLElBQUksTUFBTSxDQUFDLE9BQU8sQ0FBQyxPQUFPLENBQUMsRUFBRTtZQUM1QyxNQUFNLEdBQUcsR0FBVyxNQUFNLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDOUIsTUFBTSxLQUFLLEdBQVEsTUFBTSxDQUFDLENBQUMsQ0FBQyxDQUFDLFlBQVksQ0FBQztZQUMxQyxJQUFJLENBQUMscUJBQXFCLENBQUMsR0FBRyxFQUFFLEtBQUssQ0FBQyxDQUFDO1NBQ3hDO1FBRUQsSUFBSSxDQUFDLHNCQUFzQixFQUFFLENBQUM7SUFDaEMsQ0FBQztJQUVPLHFCQUFxQixDQUFDLEdBQVcsRUFBRSxLQUFVO1FBQ25ELElBQUksbUJBQW1CLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxlQUFlLENBQUMsR0FBRyxFQUFFLEtBQUssQ0FBQyxFQUFFO1lBQzVELElBQUksQ0FBQyxHQUFHLENBQUMsR0FBRyxjQUFjLENBQUMsR0FBRyxDQUFDLENBQUM7WUFDaEMsaUJBQWlCLENBQ2YsZUFBZSxFQUNmLElBQUksQ0FBQyxFQUFFLEVBQ1AsR0FBRyxFQUNILEtBQUssRUFDTCxjQUFjLENBQUMsR0FBRyxDQUFDLENBQ3BCLENBQUM7U0FDSDtJQUNILENBQUM7SUFFRCxhQUFhLENBQUMsQ0FBTTtRQUNsQixJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUMsQ0FBQztJQUN2QixDQUFDO0lBRU8sc0JBQXNCO1FBQzVCLElBQUksQ0FBQyxjQUFjO1lBQ2pCLFlBQVksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDO2dCQUN4QixZQUFZLENBQUMsSUFBSSxDQUFDLFNBQVMsQ0FBQztnQkFDNUIsZUFBZSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUMvQixDQUFDOztzSUFyRVUscUJBQXFCOzBIQUFyQixxQkFBcUIsMldDekJsQywyM0JBdUNBOzRGRGRhLHFCQUFxQjtrQkFMakMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsZUFBZTtvQkFDekIsV0FBVyxFQUFFLHlCQUF5QjtvQkFDdEMsU0FBUyxFQUFFLENBQUMseUJBQXlCLENBQUM7aUJBQ3ZDOzBFQUVVLFVBQVU7c0JBQWxCLEtBQUs7Z0JBRUcsS0FBSztzQkFBYixLQUFLO2dCQUVHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBRUcsSUFBSTtzQkFBWixLQUFLO2dCQUVHLFNBQVM7c0JBQWpCLEtBQUs7Z0JBRUcsRUFBRTtzQkFBVixLQUFLO2dCQUVHLEtBQUs7c0JBQWIsS0FBSztnQkFFRyxLQUFLO3NCQUFiLEtBQUs7Z0JBRUcsVUFBVTtzQkFBbEIsS0FBSztnQkFFRyxJQUFJO3NCQUFaLEtBQUs7Z0JBRUcsTUFBTTtzQkFBZCxLQUFLO2dCQUVHLElBQUk7c0JBQVosS0FBSztnQkFFRyxXQUFXO3NCQUFuQixLQUFLO2dCQUVJLE9BQU87c0JBQWhCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICBDb21wb25lbnQsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE9uQ2hhbmdlcyxcbiAgT25Jbml0LFxuICBPdXRwdXQsXG4gIFNpbXBsZUNoYW5nZXNcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IGlzRW1wdHlWYWx1ZSwgaXNOb3RFbXB0eVZhbHVlIH0gZnJvbSBcImt3aWtpZC10b29sa2l0XCI7XG5pbXBvcnQgeyB0aHJvd0Vycm9yTWVzc2FnZSB9IGZyb20gXCIuLi8uLi8uLi9oZWxwZXJzL2t3aWt1aS5jb21tb24uaGVscGVyc1wiO1xuaW1wb3J0IHsgREVGQVVMVF9WQUxVRVMsIFZBTElEQVRFX0tFWV9WQUxVRVMgfSBmcm9tIFwiLi9idXR0b24uY29uc3RhbnRzXCI7XG5pbXBvcnQge1xuICBUS3dpa1VJQnV0dG9uQXBwZWFyYW5jZSxcbiAgVEt3aWtVSUJ1dHRvblNoYXBlLFxuICBUS3dpa1VJQnV0dG9uU2l6ZSxcbiAgVEt3aWtVSUJ1dHRvblR5cGVcbn0gZnJvbSBcIi4vYnV0dG9uLmRlZmluaXRpb25zXCI7XG5pbXBvcnQgeyBpc1ZhbGlkS2V5VmFsdWUgfSBmcm9tIFwiLi9idXR0b24udmFsaWRhdGlvblwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwia3dpa3VpLWJ1dHRvblwiLFxuICB0ZW1wbGF0ZVVybDogXCIuL2J1dHRvbi5jb21wb25lbnQuaHRtbFwiLFxuICBzdHlsZVVybHM6IFtcIi4vYnV0dG9uLmNvbXBvbmVudC5zY3NzXCJdXG59KVxuZXhwb3J0IGNsYXNzIEt3aWtVSUJ1dHRvbkNvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgT25DaGFuZ2VzIHtcbiAgQElucHV0KCkgYXBwZWFyYW5jZTogVEt3aWtVSUJ1dHRvbkFwcGVhcmFuY2UgPSBERUZBVUxUX1ZBTFVFUy5hcHBlYXJhbmNlO1xuXG4gIEBJbnB1dCgpIGNsYXNzOiBzdHJpbmcgPSBERUZBVUxUX1ZBTFVFUy5jbGFzcztcblxuICBASW5wdXQoKSBkaXNhYmxlZDogYm9vbGVhbiA9IERFRkFVTFRfVkFMVUVTLmRpc2FibGVkO1xuXG4gIEBJbnB1dCgpIGljb246IHN0cmluZyA9IERFRkFVTFRfVkFMVUVTLmljb247XG5cbiAgQElucHV0KCkgaWNvblJpZ2h0OiBzdHJpbmcgPSBERUZBVUxUX1ZBTFVFUy5pY29uUmlnaHQ7XG5cbiAgQElucHV0KCkgaWQ6IHN0cmluZyA9IERFRkFVTFRfVkFMVUVTLmlkO1xuXG4gIEBJbnB1dCgpIGxhYmVsOiBzdHJpbmcgPSBERUZBVUxUX1ZBTFVFUy5sYWJlbDtcblxuICBASW5wdXQoKSBzaGFwZTogVEt3aWtVSUJ1dHRvblNoYXBlID0gREVGQVVMVF9WQUxVRVMuc2hhcGU7XG5cbiAgQElucHV0KCkgc2hvd0xvYWRlcjogYm9vbGVhbiA9IERFRkFVTFRfVkFMVUVTLnNob3dMb2FkZXI7XG5cbiAgQElucHV0KCkgc2l6ZTogVEt3aWtVSUJ1dHRvblNpemUgPSBERUZBVUxUX1ZBTFVFUy5zaXplO1xuXG4gIEBJbnB1dCgpIHN0eWxlczogc3RyaW5nID0gREVGQVVMVF9WQUxVRVMuc3R5bGVzO1xuXG4gIEBJbnB1dCgpIHR5cGU6IFRLd2lrVUlCdXR0b25UeXBlID0gREVGQVVMVF9WQUxVRVMudHlwZTtcblxuICBASW5wdXQoKSBwc2V1ZG9Ib3ZlcjogYm9vbGVhbiA9IERFRkFVTFRfVkFMVUVTLnBzZXVkb0hvdmVyO1xuXG4gIEBPdXRwdXQoKSBvbkNsaWNrID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XG5cbiAgc2hvd0ljb25CdXR0b24gPSBmYWxzZTtcblxuICBjb25zdHJ1Y3RvcigpIHt9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgdGhpcy5ldmFsdWF0ZVNob3dJY29uQnV0dG9uKCk7XG4gIH1cblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKSB7XG4gICAgZm9yIChjb25zdCBjaGFuZ2Ugb2YgT2JqZWN0LmVudHJpZXMoY2hhbmdlcykpIHtcbiAgICAgIGNvbnN0IGtleTogc3RyaW5nID0gY2hhbmdlWzBdO1xuICAgICAgY29uc3QgdmFsdWU6IGFueSA9IGNoYW5nZVsxXS5jdXJyZW50VmFsdWU7XG4gICAgICB0aGlzLnZhbGlkYXRlSW5wdXRQcm9wZXJ0eShrZXksIHZhbHVlKTtcbiAgICB9XG5cbiAgICB0aGlzLmV2YWx1YXRlU2hvd0ljb25CdXR0b24oKTtcbiAgfVxuXG4gIHByaXZhdGUgdmFsaWRhdGVJbnB1dFByb3BlcnR5KGtleTogc3RyaW5nLCB2YWx1ZTogYW55KTogdm9pZCB7XG4gICAgaWYgKFZBTElEQVRFX0tFWV9WQUxVRVNba2V5XSAmJiAhaXNWYWxpZEtleVZhbHVlKGtleSwgdmFsdWUpKSB7XG4gICAgICB0aGlzW2tleV0gPSBERUZBVUxUX1ZBTFVFU1trZXldO1xuICAgICAgdGhyb3dFcnJvck1lc3NhZ2UoXG4gICAgICAgIFwia3dpa3VpLWJ1dHRvblwiLFxuICAgICAgICB0aGlzLmlkLFxuICAgICAgICBrZXksXG4gICAgICAgIHZhbHVlLFxuICAgICAgICBERUZBVUxUX1ZBTFVFU1trZXldXG4gICAgICApO1xuICAgIH1cbiAgfVxuXG4gIGhhbmRsZU9uQ2xpY2soZTogYW55KSB7XG4gICAgdGhpcy5vbkNsaWNrLmVtaXQoZSk7XG4gIH1cblxuICBwcml2YXRlIGV2YWx1YXRlU2hvd0ljb25CdXR0b24oKTogdm9pZCB7XG4gICAgdGhpcy5zaG93SWNvbkJ1dHRvbiA9XG4gICAgICBpc0VtcHR5VmFsdWUodGhpcy5sYWJlbCkgJiZcbiAgICAgIGlzRW1wdHlWYWx1ZSh0aGlzLmljb25SaWdodCkgJiZcbiAgICAgIGlzTm90RW1wdHlWYWx1ZSh0aGlzLmljb24pO1xuICB9XG59XG4iLCI8YnV0dG9uXG4gICpuZ0lmPVwiIXNob3dJY29uQnV0dG9uOyBlbHNlIGljb25CdXR0b25UZW1wbGF0ZVwiXG4gIHR1aUJ1dHRvblxuICBbYXBwZWFyYW5jZV09XCJhcHBlYXJhbmNlXCJcbiAgW2NsYXNzXT1cImNsYXNzXCJcbiAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgW2ljb25dPVwiaWNvblwiXG4gIFtpY29uUmlnaHRdPVwiaWNvblJpZ2h0XCJcbiAgW2lkXT1cImlkXCJcbiAgW25hdGl2ZUlkXT1cImlkXCJcbiAgW3NoYXBlXT1cInNoYXBlXCJcbiAgW3Nob3dMb2FkZXJdPVwic2hvd0xvYWRlclwiXG4gIFtzaXplXT1cInNpemVcIlxuICBbc3R5bGVdPVwic3R5bGVzXCJcbiAgW3R5cGVdPVwidHlwZVwiXG4gIFtwc2V1ZG9Ib3Zlcl09XCJwc2V1ZG9Ib3ZlclwiXG4gIChjbGljayk9XCJoYW5kbGVPbkNsaWNrKCRldmVudClcIlxuPlxuICB7eyBsYWJlbCB9fVxuPC9idXR0b24+XG5cbjxuZy10ZW1wbGF0ZSAjaWNvbkJ1dHRvblRlbXBsYXRlPlxuICA8YnV0dG9uXG4gICAgdHVpSWNvbkJ1dHRvblxuICAgIFthcHBlYXJhbmNlXT1cImFwcGVhcmFuY2VcIlxuICAgIFtjbGFzc109XCJjbGFzc1wiXG4gICAgW2Rpc2FibGVkXT1cImRpc2FibGVkXCJcbiAgICBbaWNvbl09XCJpY29uXCJcbiAgICBbaWRdPVwiaWRcIlxuICAgIFtuYXRpdmVJZF09XCJpZFwiXG4gICAgW3NoYXBlXT1cInNoYXBlXCJcbiAgICBbc2hvd0xvYWRlcl09XCJzaG93TG9hZGVyXCJcbiAgICBbc2l6ZV09XCJzaXplXCJcbiAgICBbc3R5bGVdPVwic3R5bGVzXCJcbiAgICBbdHlwZV09XCJ0eXBlXCJcbiAgICBbcHNldWRvSG92ZXJdPVwicHNldWRvSG92ZXJcIlxuICAgIChjbGljayk9XCJoYW5kbGVPbkNsaWNrKCRldmVudClcIlxuICA+PC9idXR0b24+XG48L25nLXRlbXBsYXRlPlxuIl19