ng-devui
Version:
DevUI components based on Angular
315 lines (309 loc) • 28.5 kB
JavaScript
import * as i2$1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { forwardRef, Component, Input, HostBinding, HostListener, EventEmitter, QueryList, Output, ContentChildren, NgModule } from '@angular/core';
import * as i2 from '@angular/forms';
import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
import { __decorate, __metadata } from 'tslib';
import * as i1 from 'ng-devui/utils';
import { WithConfig } from 'ng-devui/utils';
class RadioComponent {
get name() {
return this._name;
}
set name(value) {
this._name = value;
}
get disabled() {
return this._disabled;
}
set disabled(value) {
this._disabled = value;
}
get value() {
return this.inputValue;
}
set value(value) {
this.inputValue = value;
if (value instanceof Object) {
this.id = '';
}
else {
this.id = `${this.name}-${value}`;
}
}
get hasGlowStyle() {
return this.showGlowStyle;
}
onRadioChange(event) {
event.preventDefault();
if (this.disabled) {
return;
}
this.canChange().then((change) => {
if (change) {
this._value = this.value;
this.onChange(this.value);
}
});
}
constructor(devConfigService) {
this.devConfigService = devConfigService;
this.showGlowStyle = true;
this.onChange = (_) => null;
this.onTouched = () => null;
}
registerHandleChange(fn) {
this.handleChange = fn;
}
writeValue(obj) {
this._value = obj;
}
registerOnChange(fn) {
this.onChange = fn;
}
registerOnTouched(fn) {
this.onTouched = fn;
}
handleModelChange($event, value) {
$event.stopPropagation();
this._value = value;
this.onTouched();
this.onChange(value);
}
canChange() {
let changeResult = Promise.resolve(true);
if (this.beforeChange) {
const result = this.beforeChange(this.value);
if (typeof result !== 'undefined') {
if (result.then) {
changeResult = result;
}
else if (result.subscribe) {
changeResult = result.toPromise();
}
else {
changeResult = Promise.resolve(result);
}
}
}
return changeResult;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioComponent, deps: [{ token: i1.DevConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RadioComponent, selector: "d-radio", inputs: { name: "name", disabled: "disabled", value: "value", beforeChange: "beforeChange", showGlowStyle: "showGlowStyle" }, host: { listeners: { "click": "onRadioChange($event)" }, properties: { "class.devui-glow-style": "this.hasGlowStyle" } }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => RadioComponent),
multi: true,
},
], ngImport: i0, template: "<label class=\"devui-radio\" [class.active]=\"radioInput.checked\" [class.disabled]=\"disabled\">\n <input\n #radioInput\n type=\"radio\"\n class=\"devui-radio-input\"\n [disabled]=\"disabled\"\n [name]=\"name\"\n [id]=\"id\"\n [ngModel]=\"_value\"\n (change)=\"handleModelChange($event, value)\"\n [value]=\"value\"\n />\n <span class=\"devui-radio-material\"></span>\n <span class=\"devui-radio-label\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: [".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}:host{padding-right:20px;display:block;line-height:18px}.devui-radio{cursor:pointer;color:var(--devui-text, #191919);font-size:var(--devui-font-size, 12px);font-weight:400;line-height:1.5;margin:0 auto}.devui-radio .devui-radio-material{width:16px;height:16px;display:inline-block;overflow:hidden;-webkit-user-select:none;user-select:none;vertical-align:middle;border:solid 1px var(--devui-shape-icon-fill, #c2c2c2);border-radius:var(--devui-border-radius-full, 100px);box-shadow:0 transparent;transform:translateY(-1px);transition:border var(--devui-animation-duration-base, .2s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-radio .devui-radio-label{color:var(--devui-text, #191919);font-size:var(--devui-font-size, 12px);margin-left:8px}.devui-radio .devui-radio-input{opacity:0;z-index:-1;width:0;height:0;display:none;overflow:hidden;pointer-events:none}.devui-radio.active .devui-radio-material{border-width:4px;border-color:var(--devui-brand, #0a59f7)}.devui-radio.disabled{cursor:not-allowed}.devui-radio.disabled .devui-radio-label{color:var(--devui-disabled-text, #c2c2c2)}.devui-radio.disabled .devui-radio-material{border-color:var(--devui-shape-icon-fill, #c2c2c2);background-color:var(--devui-disabled-bg, #f3f3f3)}.devui-radio.disabled.active .devui-radio-material{border-color:var(--devui-icon-fill-active-disabled, #9dbdfc)}::ng-deep :root .devui-glow-style .devui-radio .devui-radio-material{transition:box-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}::ng-deep :root .devui-glow-style .devui-radio:not(.disabled):hover .devui-radio-material,::ng-deep :root .devui-glow-style .devui-radio:not(.disabled):active .devui-radio-material{box-shadow:0 0 0 6px var(--devui-range-item-hover-bg, #cedefd)}\n"], dependencies: [{ kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] }); }
}
__decorate([
WithConfig(),
__metadata("design:type", Object)
], RadioComponent.prototype, "showGlowStyle", void 0);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioComponent, decorators: [{
type: Component,
args: [{ selector: 'd-radio', providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => RadioComponent),
multi: true,
},
], preserveWhitespaces: false, template: "<label class=\"devui-radio\" [class.active]=\"radioInput.checked\" [class.disabled]=\"disabled\">\n <input\n #radioInput\n type=\"radio\"\n class=\"devui-radio-input\"\n [disabled]=\"disabled\"\n [name]=\"name\"\n [id]=\"id\"\n [ngModel]=\"_value\"\n (change)=\"handleModelChange($event, value)\"\n [value]=\"value\"\n />\n <span class=\"devui-radio-material\"></span>\n <span class=\"devui-radio-label\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: [".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}:host{padding-right:20px;display:block;line-height:18px}.devui-radio{cursor:pointer;color:var(--devui-text, #191919);font-size:var(--devui-font-size, 12px);font-weight:400;line-height:1.5;margin:0 auto}.devui-radio .devui-radio-material{width:16px;height:16px;display:inline-block;overflow:hidden;-webkit-user-select:none;user-select:none;vertical-align:middle;border:solid 1px var(--devui-shape-icon-fill, #c2c2c2);border-radius:var(--devui-border-radius-full, 100px);box-shadow:0 transparent;transform:translateY(-1px);transition:border var(--devui-animation-duration-base, .2s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-radio .devui-radio-label{color:var(--devui-text, #191919);font-size:var(--devui-font-size, 12px);margin-left:8px}.devui-radio .devui-radio-input{opacity:0;z-index:-1;width:0;height:0;display:none;overflow:hidden;pointer-events:none}.devui-radio.active .devui-radio-material{border-width:4px;border-color:var(--devui-brand, #0a59f7)}.devui-radio.disabled{cursor:not-allowed}.devui-radio.disabled .devui-radio-label{color:var(--devui-disabled-text, #c2c2c2)}.devui-radio.disabled .devui-radio-material{border-color:var(--devui-shape-icon-fill, #c2c2c2);background-color:var(--devui-disabled-bg, #f3f3f3)}.devui-radio.disabled.active .devui-radio-material{border-color:var(--devui-icon-fill-active-disabled, #9dbdfc)}::ng-deep :root .devui-glow-style .devui-radio .devui-radio-material{transition:box-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}::ng-deep :root .devui-glow-style .devui-radio:not(.disabled):hover .devui-radio-material,::ng-deep :root .devui-glow-style .devui-radio:not(.disabled):active .devui-radio-material{box-shadow:0 0 0 6px var(--devui-range-item-hover-bg, #cedefd)}\n"] }]
}], ctorParameters: () => [{ type: i1.DevConfigService }], propDecorators: { name: [{
type: Input
}], disabled: [{
type: Input
}], value: [{
type: Input
}], beforeChange: [{
type: Input
}], showGlowStyle: [{
type: Input
}], hasGlowStyle: [{
type: HostBinding,
args: ['class.devui-glow-style']
}], onRadioChange: [{
type: HostListener,
args: ['click', ['$event']]
}] } });
class RadioGroupComponent {
/**
* @deprecated Use direction to replace.
*/
set cssStyle(direction) {
this.direction = direction;
}
get hasGlowStyle() {
return this.showGlowStyle;
}
onRadioChange(event) {
const target = event.target;
if (target.tagName.toLowerCase() === 'input') {
event.preventDefault();
if (this.disabled) {
return;
}
let value = target.value;
if (this.radios.length) {
const result = this.radios.find((item) => item.id === target.id);
value = result?.value || value;
}
this.canChange(value).then((change) => {
if (change) {
this._value = value;
this.onChange(value);
this.change.emit(value);
}
});
}
}
constructor(devConfigService) {
this.devConfigService = devConfigService;
this.showGlowStyle = true;
this.change = new EventEmitter();
this.radios = new QueryList();
}
ngAfterViewInit() {
this.radios.forEach((radio) => {
this.registerRadio(radio);
});
this.radios.changes.subscribe((newRadios) => {
newRadios.forEach((radio) => {
this.registerRadio(radio);
Promise.resolve(true).then(() => radio.writeValue(this._value));
});
});
this.radios.notifyOnChanges();
}
ngOnChanges(changes) {
if (changes && changes.name && this.radios) {
this.radios.forEach((radio) => {
radio.name = this.name;
});
}
if (changes && changes.disabled && this.radios) {
this.radios.forEach((radio) => {
radio.disabled = this.disabled;
});
}
if (changes && this.radios) {
this.radios.forEach((radio) => {
radio.disabled = this.disabled;
});
}
}
registerRadio(radio) {
radio.registerOnChange((value) => {
this.writeValue(value);
this.onChange(value);
Promise.resolve().then(() => this.onTouched());
this.change.emit(value);
});
}
canChange(value) {
let changeResult = Promise.resolve(true);
if (this.beforeChange) {
const result = this.beforeChange(value);
if (typeof result !== 'undefined') {
if (result.then) {
changeResult = result;
}
else if (result.subscribe) {
changeResult = result.toPromise();
}
else {
changeResult = Promise.resolve(result);
}
}
}
return changeResult;
}
handleChange($event, value) {
$event.stopPropagation();
this.writeValue(value);
this.onChange(value);
this.change.emit(value);
}
writeValue(value) {
this._value = value;
if (this.radios && this.radios.length > 0) {
this.radios.forEach((radio) => {
radio.writeValue(this._value);
});
}
}
registerOnChange(fn) {
this.onChange = fn;
}
registerOnTouched(fn) {
this.onTouched = fn;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioGroupComponent, deps: [{ token: i1.DevConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: RadioGroupComponent, selector: "d-radio-group", inputs: { name: "name", values: "values", cssStyle: "cssStyle", direction: "direction", disabled: "disabled", showGlowStyle: "showGlowStyle", beforeChange: "beforeChange" }, outputs: { change: "change" }, host: { listeners: { "click": "onRadioChange($event)" }, properties: { "class.devui-glow-style": "this.hasGlowStyle" } }, providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => RadioGroupComponent),
multi: true,
},
], queries: [{ propertyName: "radios", predicate: RadioComponent }], usesOnChanges: true, ngImport: i0, template: "<div class=\"devui-radio-group\">\n <ul [class.devui-radio-horizontal]=\"direction === 'row'\">\n <ng-container *ngIf=\"radios.length === 0\">\n <li *ngFor=\"let value of values\" class=\"devui-radio-list-item\">\n <label class=\"devui-radio\" [class.active]=\"value == _value\" [class.disabled]=\"disabled\">\n <input\n type=\"radio\"\n class=\"devui-radio-input\"\n [disabled]=\"disabled\"\n [name]=\"name\"\n [id]=\"name + '-' + value\"\n [value]=\"value\"\n [checked]=\"value == _value\"\n (change)=\"handleChange($event, value)\"\n />\n <span class=\"devui-radio-material\"></span>\n <span class=\"devui-radio-label\">{{ value }}</span>\n </label>\n </li>\n </ng-container>\n <ng-content select=\"d-radio\"></ng-content>\n </ul>\n</div>\n", styles: [".devui-radio-horizontal .devui-radio-list-item{display:inline-block}.devui-radio-horizontal .devui-radio-list-item:not(:last-child){padding-right:20px}.devui-radio-horizontal ::ng-deep d-radio{display:inline-block}.devui-radio-list-item{position:relative;line-height:28px}:host ::ng-deep d-radio{line-height:28px}:host.devui-glow-style .devui-radio-material{transition:box-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}:host.devui-glow-style .devui-radio-material:not(.disabled):hover .devui-radio-material,:host.devui-glow-style .devui-radio-material:not(.disabled):active .devui-radio-material{box-shadow:0 0 0 6px var(--devui-range-item-hover-bg, #cedefd)}\n", ".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}:host{padding-right:20px;display:block;line-height:18px}.devui-radio{cursor:pointer;color:var(--devui-text, #191919);font-size:var(--devui-font-size, 12px);font-weight:400;line-height:1.5;margin:0 auto}.devui-radio .devui-radio-material{width:16px;height:16px;display:inline-block;overflow:hidden;-webkit-user-select:none;user-select:none;vertical-align:middle;border:solid 1px var(--devui-shape-icon-fill, #c2c2c2);border-radius:var(--devui-border-radius-full, 100px);box-shadow:0 transparent;transform:translateY(-1px);transition:border var(--devui-animation-duration-base, .2s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-radio .devui-radio-label{color:var(--devui-text, #191919);font-size:var(--devui-font-size, 12px);margin-left:8px}.devui-radio .devui-radio-input{opacity:0;z-index:-1;width:0;height:0;display:none;overflow:hidden;pointer-events:none}.devui-radio.active .devui-radio-material{border-width:4px;border-color:var(--devui-brand, #0a59f7)}.devui-radio.disabled{cursor:not-allowed}.devui-radio.disabled .devui-radio-label{color:var(--devui-disabled-text, #c2c2c2)}.devui-radio.disabled .devui-radio-material{border-color:var(--devui-shape-icon-fill, #c2c2c2);background-color:var(--devui-disabled-bg, #f3f3f3)}.devui-radio.disabled.active .devui-radio-material{border-color:var(--devui-icon-fill-active-disabled, #9dbdfc)}::ng-deep :root .devui-glow-style .devui-radio .devui-radio-material{transition:box-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}::ng-deep :root .devui-glow-style .devui-radio:not(.disabled):hover .devui-radio-material,::ng-deep :root .devui-glow-style .devui-radio:not(.disabled):active .devui-radio-material{box-shadow:0 0 0 6px var(--devui-range-item-hover-bg, #cedefd)}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
}
__decorate([
WithConfig(),
__metadata("design:type", Object)
], RadioGroupComponent.prototype, "showGlowStyle", void 0);
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioGroupComponent, decorators: [{
type: Component,
args: [{ selector: 'd-radio-group', providers: [
{
provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => RadioGroupComponent),
multi: true,
},
], preserveWhitespaces: false, template: "<div class=\"devui-radio-group\">\n <ul [class.devui-radio-horizontal]=\"direction === 'row'\">\n <ng-container *ngIf=\"radios.length === 0\">\n <li *ngFor=\"let value of values\" class=\"devui-radio-list-item\">\n <label class=\"devui-radio\" [class.active]=\"value == _value\" [class.disabled]=\"disabled\">\n <input\n type=\"radio\"\n class=\"devui-radio-input\"\n [disabled]=\"disabled\"\n [name]=\"name\"\n [id]=\"name + '-' + value\"\n [value]=\"value\"\n [checked]=\"value == _value\"\n (change)=\"handleChange($event, value)\"\n />\n <span class=\"devui-radio-material\"></span>\n <span class=\"devui-radio-label\">{{ value }}</span>\n </label>\n </li>\n </ng-container>\n <ng-content select=\"d-radio\"></ng-content>\n </ul>\n</div>\n", styles: [".devui-radio-horizontal .devui-radio-list-item{display:inline-block}.devui-radio-horizontal .devui-radio-list-item:not(:last-child){padding-right:20px}.devui-radio-horizontal ::ng-deep d-radio{display:inline-block}.devui-radio-list-item{position:relative;line-height:28px}:host ::ng-deep d-radio{line-height:28px}:host.devui-glow-style .devui-radio-material{transition:box-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}:host.devui-glow-style .devui-radio-material:not(.disabled):hover .devui-radio-material,:host.devui-glow-style .devui-radio-material:not(.disabled):active .devui-radio-material{box-shadow:0 0 0 6px var(--devui-range-item-hover-bg, #cedefd)}\n", ".devui-font-size-base{font-size:var(--devui-font-size, 12px)}.devui-font-base{font-size:var(--devui-font-size, 12px);font-weight:var(--devui-font-content-weight, normal);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-modal-title{font-size:var(--devui-font-size-modal-title, 18px)}.devui-font-modal-title{font-size:var(--devui-font-size-modal-title, 18px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-page-title{font-size:var(--devui-font-size-page-title, 16px)}.devui-font-page-title{font-size:var(--devui-font-size-page-title, 16px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}.devui-font-size-secondary-title{font-size:var(--devui-font-size-card-title, 14px)}.devui-font-secondary-title{font-size:var(--devui-font-size-card-title, 14px);font-weight:var(--devui-font-title-weight, bold);line-height:var(--devui-line-height-base, 1.5)}:host{padding-right:20px;display:block;line-height:18px}.devui-radio{cursor:pointer;color:var(--devui-text, #191919);font-size:var(--devui-font-size, 12px);font-weight:400;line-height:1.5;margin:0 auto}.devui-radio .devui-radio-material{width:16px;height:16px;display:inline-block;overflow:hidden;-webkit-user-select:none;user-select:none;vertical-align:middle;border:solid 1px var(--devui-shape-icon-fill, #c2c2c2);border-radius:var(--devui-border-radius-full, 100px);box-shadow:0 transparent;transform:translateY(-1px);transition:border var(--devui-animation-duration-base, .2s) var(--devui-animation-ease-in-out, cubic-bezier(.5, .05, .5, .95))}.devui-radio .devui-radio-label{color:var(--devui-text, #191919);font-size:var(--devui-font-size, 12px);margin-left:8px}.devui-radio .devui-radio-input{opacity:0;z-index:-1;width:0;height:0;display:none;overflow:hidden;pointer-events:none}.devui-radio.active .devui-radio-material{border-width:4px;border-color:var(--devui-brand, #0a59f7)}.devui-radio.disabled{cursor:not-allowed}.devui-radio.disabled .devui-radio-label{color:var(--devui-disabled-text, #c2c2c2)}.devui-radio.disabled .devui-radio-material{border-color:var(--devui-shape-icon-fill, #c2c2c2);background-color:var(--devui-disabled-bg, #f3f3f3)}.devui-radio.disabled.active .devui-radio-material{border-color:var(--devui-icon-fill-active-disabled, #9dbdfc)}::ng-deep :root .devui-glow-style .devui-radio .devui-radio-material{transition:box-shadow var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}::ng-deep :root .devui-glow-style .devui-radio:not(.disabled):hover .devui-radio-material,::ng-deep :root .devui-glow-style .devui-radio:not(.disabled):active .devui-radio-material{box-shadow:0 0 0 6px var(--devui-range-item-hover-bg, #cedefd)}\n"] }]
}], ctorParameters: () => [{ type: i1.DevConfigService }], propDecorators: { name: [{
type: Input
}], values: [{
type: Input
}], cssStyle: [{
type: Input
}], direction: [{
type: Input
}], disabled: [{
type: Input
}], showGlowStyle: [{
type: Input
}], hasGlowStyle: [{
type: HostBinding,
args: ['class.devui-glow-style']
}], beforeChange: [{
type: Input
}], change: [{
type: Output
}], radios: [{
type: ContentChildren,
args: [RadioComponent]
}], onRadioChange: [{
type: HostListener,
args: ['click', ['$event']]
}] } });
class RadioModule {
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.13", ngImport: i0, type: RadioModule, declarations: [RadioGroupComponent, RadioComponent], imports: [CommonModule, FormsModule], exports: [RadioGroupComponent, RadioComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioModule, imports: [CommonModule, FormsModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: RadioModule, decorators: [{
type: NgModule,
args: [{
imports: [CommonModule, FormsModule],
exports: [RadioGroupComponent, RadioComponent],
declarations: [RadioGroupComponent, RadioComponent],
providers: [],
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { RadioComponent, RadioGroupComponent, RadioModule };
//# sourceMappingURL=ng-devui-radio.mjs.map