xui
Version:
xUI Components for Angular
79 lines • 8.72 kB
JavaScript
import { __decorate, __metadata } from "tslib";
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, HostListener, Inject, Input, ViewChild } from '@angular/core';
import { InputBoolean } from '../utils';
import { SELECT_ACCESSOR } from './select.types';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "../decagram/decagram.component";
export class OptionComponent {
get isSelected() {
return this.select.value == this.value;
}
get styles() {
const ret = {
'x-select-option': true,
'x-select-option-selected': this.isSelected,
'x-select-option-disabled': this.disabled
};
ret[`x-select-option-${this.select.color}`] = true;
return ret;
}
get viewValue() {
return (this.contentRef.nativeElement.textContent || '').trim();
}
constructor(select, cdr) {
this.select = select;
this.cdr = cdr;
this.value = null;
this.disabled = false;
}
ngOnInit() {
this.select.onChange$.subscribe(() => this.cdr.markForCheck());
}
ngAfterViewInit() {
if (this.isSelected) {
this.select.viewValue = this.viewValue;
}
}
click() {
if (!this.disabled) {
this.select.value = this.value;
this.select.viewValue = this.viewValue;
this.select.close();
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: OptionComponent, deps: [{ token: SELECT_ACCESSOR }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.1", type: OptionComponent, selector: "xui-option", inputs: { value: "value", disabled: "disabled" }, host: { listeners: { "click": "click()" } }, viewQueries: [{ propertyName: "contentRef", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: `<div [ngClass]="styles">
<span #content><ng-content></ng-content></span>
<xui-decagram *ngIf="isSelected" type="circle">check</xui-decagram>
</div>`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.DecagramComponent, selector: "xui-decagram", inputs: ["iconSize", "type", "color"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
__decorate([
InputBoolean(),
__metadata("design:type", Object)
], OptionComponent.prototype, "disabled", void 0);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.1", ngImport: i0, type: OptionComponent, decorators: [{
type: Component,
args: [{
selector: 'xui-option',
changeDetection: ChangeDetectionStrategy.OnPush,
template: `<div [ngClass]="styles">
<span #content><ng-content></ng-content></span>
<xui-decagram *ngIf="isSelected" type="circle">check</xui-decagram>
</div>`
}]
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
type: Inject,
args: [SELECT_ACCESSOR]
}] }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { value: [{
type: Input
}], disabled: [{
type: Input
}], contentRef: [{
type: ViewChild,
args: ['content']
}], click: [{
type: HostListener,
args: ['click']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib3B0aW9uLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMveHVpL3NyYy9zZWxlY3Qvb3B0aW9uLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUVMLHVCQUF1QixFQUN2QixpQkFBaUIsRUFDakIsU0FBUyxFQUNULFVBQVUsRUFDVixZQUFZLEVBQ1osTUFBTSxFQUNOLEtBQUssRUFFTCxTQUFTLEVBQ1YsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLFVBQVUsQ0FBQztBQUV4QyxPQUFPLEVBQUUsZUFBZSxFQUErQixNQUFNLGdCQUFnQixDQUFDOzs7O0FBVTlFLE1BQU0sT0FBTyxlQUFlO0lBUTFCLElBQUksVUFBVTtRQUNaLE9BQU8sSUFBSSxDQUFDLE1BQU0sQ0FBQyxLQUFLLElBQUksSUFBSSxDQUFDLEtBQUssQ0FBQztJQUN6QyxDQUFDO0lBRUQsSUFBSSxNQUFNO1FBQ1IsTUFBTSxHQUFHLEdBQWlDO1lBQ3hDLGlCQUFpQixFQUFFLElBQUk7WUFDdkIsMEJBQTBCLEVBQUUsSUFBSSxDQUFDLFVBQVU7WUFDM0MsMEJBQTBCLEVBQUUsSUFBSSxDQUFDLFFBQVE7U0FDMUMsQ0FBQztRQUVGLEdBQUcsQ0FBQyxtQkFBbUIsSUFBSSxDQUFDLE1BQU0sQ0FBQyxLQUFLLEVBQUUsQ0FBQyxHQUFHLElBQUksQ0FBQztRQUNuRCxPQUFPLEdBQUcsQ0FBQztJQUNiLENBQUM7SUFFRCxJQUFJLFNBQVM7UUFDWCxPQUFPLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsV0FBVyxJQUFJLEVBQUUsQ0FBQyxDQUFDLElBQUksRUFBRSxDQUFDO0lBQ2xFLENBQUM7SUFFRCxZQUE2QyxNQUFzQixFQUFVLEdBQXNCO1FBQXRELFdBQU0sR0FBTixNQUFNLENBQWdCO1FBQVUsUUFBRyxHQUFILEdBQUcsQ0FBbUI7UUF4QjFGLFVBQUssR0FBZ0IsSUFBSSxDQUFDO1FBQ1YsYUFBUSxHQUFHLEtBQUssQ0FBQztJQXVCNEQsQ0FBQztJQUV2RyxRQUFRO1FBQ04sSUFBSSxDQUFDLE1BQU0sQ0FBQyxTQUFTLENBQUMsU0FBUyxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsWUFBWSxFQUFFLENBQUMsQ0FBQztJQUNqRSxDQUFDO0lBRUQsZUFBZTtRQUNiLElBQUksSUFBSSxDQUFDLFVBQVUsRUFBRTtZQUNuQixJQUFJLENBQUMsTUFBTSxDQUFDLFNBQVMsR0FBRyxJQUFJLENBQUMsU0FBUyxDQUFDO1NBQ3hDO0lBQ0gsQ0FBQztJQUdELEtBQUs7UUFDSCxJQUFJLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRTtZQUNsQixJQUFJLENBQUMsTUFBTSxDQUFDLEtBQUssR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDO1lBQy9CLElBQUksQ0FBQyxNQUFNLENBQUMsU0FBUyxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUM7WUFDdkMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxLQUFLLEVBQUUsQ0FBQztTQUNyQjtJQUNILENBQUM7OEdBOUNVLGVBQWUsa0JBMkJOLGVBQWU7a0dBM0J4QixlQUFlLHdQQUxoQjs7O1NBR0g7O0FBTWtCO0lBQWYsWUFBWSxFQUFFOztpREFBa0I7MkZBSi9CLGVBQWU7a0JBUjNCLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLFlBQVk7b0JBQ3RCLGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNO29CQUMvQyxRQUFRLEVBQUU7OztTQUdIO2lCQUNSOzswQkE0QmMsTUFBTTsyQkFBQyxlQUFlOzRFQXhCMUIsS0FBSztzQkFBYixLQUFLO2dCQUNtQixRQUFRO3NCQUFoQyxLQUFLO2dCQUVnQixVQUFVO3NCQUEvQixTQUFTO3VCQUFDLFNBQVM7Z0JBa0NwQixLQUFLO3NCQURKLFlBQVk7dUJBQUMsT0FBTyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG4gIEFmdGVyVmlld0luaXQsXG4gIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICBDaGFuZ2VEZXRlY3RvclJlZixcbiAgQ29tcG9uZW50LFxuICBFbGVtZW50UmVmLFxuICBIb3N0TGlzdGVuZXIsXG4gIEluamVjdCxcbiAgSW5wdXQsXG4gIE9uSW5pdCxcbiAgVmlld0NoaWxkXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSW5wdXRCb29sZWFuIH0gZnJvbSAnLi4vdXRpbHMnO1xuaW1wb3J0IHsgQm9vbGVhbklucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY2RrL2NvZXJjaW9uJztcbmltcG9ydCB7IFNFTEVDVF9BQ0NFU1NPUiwgU2VsZWN0QWNjZXNzb3IsIFNlbGVjdFZhbHVlIH0gZnJvbSAnLi9zZWxlY3QudHlwZXMnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd4dWktb3B0aW9uJyxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHRlbXBsYXRlOiBgPGRpdiBbbmdDbGFzc109XCJzdHlsZXNcIj5cbiAgICA8c3BhbiAjY29udGVudD48bmctY29udGVudD48L25nLWNvbnRlbnQ+PC9zcGFuPlxuICAgIDx4dWktZGVjYWdyYW0gKm5nSWY9XCJpc1NlbGVjdGVkXCIgdHlwZT1cImNpcmNsZVwiPmNoZWNrPC94dWktZGVjYWdyYW0+XG4gIDwvZGl2PmBcbn0pXG5leHBvcnQgY2xhc3MgT3B0aW9uQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBBZnRlclZpZXdJbml0IHtcbiAgc3RhdGljIG5nQWNjZXB0SW5wdXRUeXBlX2Rpc2FibGVkOiBCb29sZWFuSW5wdXQ7XG5cbiAgQElucHV0KCkgdmFsdWU6IFNlbGVjdFZhbHVlID0gbnVsbDtcbiAgQElucHV0KCkgQElucHV0Qm9vbGVhbigpIGRpc2FibGVkID0gZmFsc2U7XG5cbiAgQFZpZXdDaGlsZCgnY29udGVudCcpIGNvbnRlbnRSZWYhOiBFbGVtZW50UmVmO1xuXG4gIGdldCBpc1NlbGVjdGVkKCkge1xuICAgIHJldHVybiB0aGlzLnNlbGVjdC52YWx1ZSA9PSB0aGlzLnZhbHVlO1xuICB9XG5cbiAgZ2V0IHN0eWxlcygpIHtcbiAgICBjb25zdCByZXQ6IHsgW2tsYXNzOiBzdHJpbmddOiBib29sZWFuIH0gPSB7XG4gICAgICAneC1zZWxlY3Qtb3B0aW9uJzogdHJ1ZSxcbiAgICAgICd4LXNlbGVjdC1vcHRpb24tc2VsZWN0ZWQnOiB0aGlzLmlzU2VsZWN0ZWQsXG4gICAgICAneC1zZWxlY3Qtb3B0aW9uLWRpc2FibGVkJzogdGhpcy5kaXNhYmxlZFxuICAgIH07XG5cbiAgICByZXRbYHgtc2VsZWN0LW9wdGlvbi0ke3RoaXMuc2VsZWN0LmNvbG9yfWBdID0gdHJ1ZTtcbiAgICByZXR1cm4gcmV0O1xuICB9XG5cbiAgZ2V0IHZpZXdWYWx1ZSgpOiBzdHJpbmcge1xuICAgIHJldHVybiAodGhpcy5jb250ZW50UmVmLm5hdGl2ZUVsZW1lbnQudGV4dENvbnRlbnQgfHwgJycpLnRyaW0oKTtcbiAgfVxuXG4gIGNvbnN0cnVjdG9yKEBJbmplY3QoU0VMRUNUX0FDQ0VTU09SKSBwcml2YXRlIHNlbGVjdDogU2VsZWN0QWNjZXNzb3IsIHByaXZhdGUgY2RyOiBDaGFuZ2VEZXRlY3RvclJlZikge31cblxuICBuZ09uSW5pdCgpIHtcbiAgICB0aGlzLnNlbGVjdC5vbkNoYW5nZSQuc3Vic2NyaWJlKCgpID0+IHRoaXMuY2RyLm1hcmtGb3JDaGVjaygpKTtcbiAgfVxuXG4gIG5nQWZ0ZXJWaWV3SW5pdCgpIHtcbiAgICBpZiAodGhpcy5pc1NlbGVjdGVkKSB7XG4gICAgICB0aGlzLnNlbGVjdC52aWV3VmFsdWUgPSB0aGlzLnZpZXdWYWx1ZTtcbiAgICB9XG4gIH1cblxuICBASG9zdExpc3RlbmVyKCdjbGljaycpXG4gIGNsaWNrKCkge1xuICAgIGlmICghdGhpcy5kaXNhYmxlZCkge1xuICAgICAgdGhpcy5zZWxlY3QudmFsdWUgPSB0aGlzLnZhbHVlO1xuICAgICAgdGhpcy5zZWxlY3Qudmlld1ZhbHVlID0gdGhpcy52aWV3VmFsdWU7XG4gICAgICB0aGlzLnNlbGVjdC5jbG9zZSgpO1xuICAgIH1cbiAgfVxufVxuIl19