@xui/components
Version:
xUI Components for Angular
59 lines (57 loc) • 8.43 kB
JavaScript
import { booleanAttribute, ChangeDetectionStrategy, Component, computed, Inject, input } from '@angular/core';
import { RADIO_LIST_ACCESSOR } from './radio-list.types';
import * as i0 from "@angular/core";
import * as i1 from "../icon/icon";
export class XuiRadioOption {
constructor(list) {
this.list = list;
this.value = input.required();
this.color = input();
this.disabled = input(false, { transform: booleanAttribute });
this._isSelected = computed(() => this.value() == this.list.value());
this._isFocused = computed(() => this.value() == this.list._focusedValue());
this._isDisabled = computed(() => this.disabled() || this.list._disabled());
this._icon = computed(() => (this._isSelected() ? 'radio_button_checked' : 'radio_button_unchecked'));
this._hostClass = computed(() => (this.color() ? 'x-radio-option-' + this.color() : '') +
` x-radio-option-background-${this.list.color()} x-radio-option-${this.list.size()}`);
}
_click() {
if (!this._isDisabled()) {
this.list.value.set(this.value());
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XuiRadioOption, deps: [{ token: RADIO_LIST_ACCESSOR }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.0.1", type: XuiRadioOption, selector: "xui-radio-option", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "_click()" }, properties: { "class": "_hostClass()", "class.x-radio-option-focus": "_isFocused()", "class.x-radio-option-active": "_isSelected()", "class.x-radio-option-disabled": "_isDisabled()" }, classAttribute: "x-radio-option" }, ngImport: i0, template: `<xui-icon [icon]="_icon()"></xui-icon>
<div class="x-radio-option-content">
<ng-content />
<div class="x-radio-option-description">
<ng-content select="[xuiDescription]" />
</div>
</div>`, isInline: true, dependencies: [{ kind: "component", type: i1.XuiIcon, selector: "xui-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "icon"], exportAs: ["xuiIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.1", ngImport: i0, type: XuiRadioOption, decorators: [{
type: Component,
args: [{
selector: 'xui-radio-option',
changeDetection: ChangeDetectionStrategy.OnPush,
template: `<xui-icon [icon]="_icon()"></xui-icon>
<div class="x-radio-option-content">
<ng-content />
<div class="x-radio-option-description">
<ng-content select="[xuiDescription]" />
</div>
</div>`,
host: {
class: 'x-radio-option',
'[class]': '_hostClass()',
'[class.x-radio-option-focus]': '_isFocused()',
'[class.x-radio-option-active]': '_isSelected()',
'[class.x-radio-option-disabled]': '_isDisabled()',
'(click)': '_click()'
}
}]
}], ctorParameters: () => [{ type: undefined, decorators: [{
type: Inject,
args: [RADIO_LIST_ACCESSOR]
}] }] });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmFkaW8tb3B0aW9uLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vbGlicy94dWkvc3JjL3JhZGlvLWxpc3QvcmFkaW8tb3B0aW9uLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsUUFBUSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDOUcsT0FBTyxFQUFFLG1CQUFtQixFQUFxQyxNQUFNLG9CQUFvQixDQUFDOzs7QUFzQjVGLE1BQU0sT0FBTyxjQUFjO0lBZXpCLFlBQWlELElBQXVCO1FBQXZCLFNBQUksR0FBSixJQUFJLENBQW1CO1FBZHhFLFVBQUssR0FBRyxLQUFLLENBQUMsUUFBUSxFQUFrQixDQUFDO1FBQ3pDLFVBQUssR0FBRyxLQUFLLEVBQVUsQ0FBQztRQUN4QixhQUFRLEdBQUcsS0FBSyxDQUFDLEtBQUssRUFBRSxFQUFFLFNBQVMsRUFBRSxnQkFBZ0IsRUFBRSxDQUFDLENBQUM7UUFFekQsZ0JBQVcsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxJQUFJLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQztRQUNoRSxlQUFVLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDLENBQUM7UUFDdkUsZ0JBQVcsR0FBRyxRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsSUFBSSxDQUFDLFFBQVEsRUFBRSxJQUFJLElBQUksQ0FBQyxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUMsQ0FBQztRQUN2RSxVQUFLLEdBQUcsUUFBUSxDQUFDLEdBQUcsRUFBRSxDQUFDLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDLENBQUMsQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDLENBQUMsd0JBQXdCLENBQUMsQ0FBQyxDQUFDO1FBQ2pHLGVBQVUsR0FBRyxRQUFRLENBQ25CLEdBQUcsRUFBRSxDQUNILENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDLENBQUMsQ0FBQyxpQkFBaUIsR0FBRyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQyxDQUFDLEVBQUUsQ0FBQztZQUN0RCw4QkFBOEIsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsbUJBQW1CLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLEVBQUUsQ0FDdkYsQ0FBQztJQUV5RSxDQUFDO0lBRTVFLE1BQU07UUFDSixJQUFJLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxFQUFFLENBQUM7WUFDeEIsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUUsQ0FBQyxDQUFDO1FBQ3BDLENBQUM7SUFDSCxDQUFDOzhHQXJCVSxjQUFjLGtCQWVMLG1CQUFtQjtrR0FmNUIsY0FBYyw2ckJBakJmOzs7Ozs7O1dBT0Q7OzJGQVVFLGNBQWM7a0JBcEIxQixTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxrQkFBa0I7b0JBQzVCLGVBQWUsRUFBRSx1QkFBdUIsQ0FBQyxNQUFNO29CQUMvQyxRQUFRLEVBQUU7Ozs7Ozs7V0FPRDtvQkFDVCxJQUFJLEVBQUU7d0JBQ0osS0FBSyxFQUFFLGdCQUFnQjt3QkFDdkIsU0FBUyxFQUFFLGNBQWM7d0JBQ3pCLDhCQUE4QixFQUFFLGNBQWM7d0JBQzlDLCtCQUErQixFQUFFLGVBQWU7d0JBQ2hELGlDQUFpQyxFQUFFLGVBQWU7d0JBQ2xELFNBQVMsRUFBRSxVQUFVO3FCQUN0QjtpQkFDRjs7MEJBZ0JjLE1BQU07MkJBQUMsbUJBQW1CIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgYm9vbGVhbkF0dHJpYnV0ZSwgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgY29tcHV0ZWQsIEluamVjdCwgaW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFJBRElPX0xJU1RfQUNDRVNTT1IsIFJhZGlvTGlzdEFjY2Vzc29yLCBSYWRpb0xpc3RWYWx1ZSB9IGZyb20gJy4vcmFkaW8tbGlzdC50eXBlcyc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3h1aS1yYWRpby1vcHRpb24nLFxuICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcbiAgdGVtcGxhdGU6IGA8eHVpLWljb24gW2ljb25dPVwiX2ljb24oKVwiPjwveHVpLWljb24+XG4gICAgPGRpdiBjbGFzcz1cIngtcmFkaW8tb3B0aW9uLWNvbnRlbnRcIj5cbiAgICAgIDxuZy1jb250ZW50IC8+XG5cbiAgICAgIDxkaXYgY2xhc3M9XCJ4LXJhZGlvLW9wdGlvbi1kZXNjcmlwdGlvblwiPlxuICAgICAgICA8bmctY29udGVudCBzZWxlY3Q9XCJbeHVpRGVzY3JpcHRpb25dXCIgLz5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PmAsXG4gIGhvc3Q6IHtcbiAgICBjbGFzczogJ3gtcmFkaW8tb3B0aW9uJyxcbiAgICAnW2NsYXNzXSc6ICdfaG9zdENsYXNzKCknLFxuICAgICdbY2xhc3MueC1yYWRpby1vcHRpb24tZm9jdXNdJzogJ19pc0ZvY3VzZWQoKScsXG4gICAgJ1tjbGFzcy54LXJhZGlvLW9wdGlvbi1hY3RpdmVdJzogJ19pc1NlbGVjdGVkKCknLFxuICAgICdbY2xhc3MueC1yYWRpby1vcHRpb24tZGlzYWJsZWRdJzogJ19pc0Rpc2FibGVkKCknLFxuICAgICcoY2xpY2spJzogJ19jbGljaygpJ1xuICB9XG59KVxuZXhwb3J0IGNsYXNzIFh1aVJhZGlvT3B0aW9uIHtcbiAgdmFsdWUgPSBpbnB1dC5yZXF1aXJlZDxSYWRpb0xpc3RWYWx1ZT4oKTtcbiAgY29sb3IgPSBpbnB1dDxzdHJpbmc+KCk7XG4gIGRpc2FibGVkID0gaW5wdXQoZmFsc2UsIHsgdHJhbnNmb3JtOiBib29sZWFuQXR0cmlidXRlIH0pO1xuXG4gIF9pc1NlbGVjdGVkID0gY29tcHV0ZWQoKCkgPT4gdGhpcy52YWx1ZSgpID09IHRoaXMubGlzdC52YWx1ZSgpKTtcbiAgX2lzRm9jdXNlZCA9IGNvbXB1dGVkKCgpID0+IHRoaXMudmFsdWUoKSA9PSB0aGlzLmxpc3QuX2ZvY3VzZWRWYWx1ZSgpKTtcbiAgX2lzRGlzYWJsZWQgPSBjb21wdXRlZCgoKSA9PiB0aGlzLmRpc2FibGVkKCkgfHwgdGhpcy5saXN0Ll9kaXNhYmxlZCgpKTtcbiAgX2ljb24gPSBjb21wdXRlZCgoKSA9PiAodGhpcy5faXNTZWxlY3RlZCgpID8gJ3JhZGlvX2J1dHRvbl9jaGVja2VkJyA6ICdyYWRpb19idXR0b25fdW5jaGVja2VkJykpO1xuICBfaG9zdENsYXNzID0gY29tcHV0ZWQoXG4gICAgKCkgPT5cbiAgICAgICh0aGlzLmNvbG9yKCkgPyAneC1yYWRpby1vcHRpb24tJyArIHRoaXMuY29sb3IoKSA6ICcnKSArXG4gICAgICBgIHgtcmFkaW8tb3B0aW9uLWJhY2tncm91bmQtJHt0aGlzLmxpc3QuY29sb3IoKX0geC1yYWRpby1vcHRpb24tJHt0aGlzLmxpc3Quc2l6ZSgpfWBcbiAgKTtcblxuICBjb25zdHJ1Y3RvcihASW5qZWN0KFJBRElPX0xJU1RfQUNDRVNTT1IpIHByaXZhdGUgbGlzdDogUmFkaW9MaXN0QWNjZXNzb3IpIHt9XG5cbiAgX2NsaWNrKCkge1xuICAgIGlmICghdGhpcy5faXNEaXNhYmxlZCgpKSB7XG4gICAgICB0aGlzLmxpc3QudmFsdWUuc2V0KHRoaXMudmFsdWUoKSk7XG4gICAgfVxuICB9XG59XG4iXX0=