rd-outer-component 0.1.5 → 0.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -103,7 +103,7 @@ CustomRadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
|
|
|
103
103
|
useExisting: forwardRef(() => CustomRadioComponent),
|
|
104
104
|
multi: true,
|
|
105
105
|
},
|
|
106
|
-
], ngImport: i0, template: "<div\n class=\"rd-form-item-radio\"\n [ngClass]=\"{\n 'rd-form-item-radio-disabled': disabled,\n 'rd-form-item-radio-vertical': direction === 'vertical',\n large: size === 'large',\n }\"\n>\n <div class=\"rd-form-item-radio-label\" *ngIf=\"label\">\n {{ label }}\n </div>\n\n <div\n [ngClass]=\"{\n 'rd-radio-group-horizontal': direction === 'horizontal',\n 'rd-radio-group-vertical': direction === 'vertical',\n }\"\n class=\"rd-custom-radio-group\"\n >\n <label\n *ngFor=\"let option of options\"\n class=\"rd-radio-item\"\n [class.rd-radio-item-selected]=\"isOptionSelected(option.value)\"\n [class.rd-radio-item-disabled]=\"disabled || option.disabled\"\n [class.rd-radio-item-large]=\"size === 'large'\"\n [class.rd-radio-item-small]=\"size === 'small'\"\n (click)=\"handleRadioClick(option.value)\"\n >\n <div\n [style.width.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n [style.height.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n >\n <span\n class=\"rd-custom-radio\"\n [class.rd-custom-radio-selected]=\"isOptionSelected(option.value)\"\n [class.rd-custom-radio-disabled]=\"disabled || option.disabled\"\n >\n <span class=\"rd-custom-radio-inner\"></span>\n </span>\n </div>\n <span class=\"rd-radio-text\" [innerHtml]=\"option.label\"> </span>\n </label>\n </div>\n</div>\n", styles: ["::ng-deep .rd-form-item-check .ant-radio-group{display:flex;margin-top:11px}::ng-deep .rd-form-item-check .ant-radio-group label{flex:1;color:var(--rd-copy-primary);font-size:14px;font-weight:500}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked .ant-radio-inner:after{background-color:var(--rd-control-input-selected)}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked:after{border-color:var(--rd-control-border-selected)}:host .rd-form-item-check{position:relative;background-color:var(--rd-bg-panel);width:100%}:host .rd-form-item-check-label{font-size:14px;font-weight:500;color:var(--rd-copy-secondary)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
106
|
+
], ngImport: i0, template: "<div\n class=\"rd-form-item-radio\"\n [ngClass]=\"{\n 'rd-form-item-radio-disabled': disabled,\n 'rd-form-item-radio-vertical': direction === 'vertical',\n large: size === 'large',\n }\"\n>\n <div class=\"rd-form-item-radio-label\" *ngIf=\"label\">\n {{ label }}\n </div>\n\n <div\n [ngClass]=\"{\n 'rd-radio-group-horizontal': direction === 'horizontal',\n 'rd-radio-group-vertical': direction === 'vertical',\n }\"\n class=\"rd-custom-radio-group\"\n >\n <label\n *ngFor=\"let option of options\"\n class=\"rd-radio-item\"\n [class.rd-radio-item-selected]=\"isOptionSelected(option.value)\"\n [class.rd-radio-item-disabled]=\"disabled || option.disabled\"\n [class.rd-radio-item-large]=\"size === 'large'\"\n [class.rd-radio-item-small]=\"size === 'small'\"\n (click)=\"handleRadioClick(option.value)\"\n >\n <div\n [style.width.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n [style.height.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n >\n <span\n class=\"rd-custom-radio\"\n [class.rd-custom-radio-selected]=\"isOptionSelected(option.value)\"\n [class.rd-custom-radio-disabled]=\"disabled || option.disabled\"\n >\n <span class=\"rd-custom-radio-inner\"></span>\n </span>\n </div>\n <span class=\"rd-radio-text\" [innerHtml]=\"option.label\"> </span>\n </label>\n </div>\n</div>\n", styles: ["::ng-deep .rd-form-item-check .ant-radio-group{display:flex;margin-top:11px}::ng-deep .rd-form-item-check .ant-radio-group label{flex:1;color:var(--rd-copy-primary);font-size:14px;font-weight:500}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked .ant-radio-inner:after{background-color:var(--rd-control-input-selected)}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked:after{border-color:var(--rd-control-border-selected)}:host .rd-form-item-check{position:relative;background-color:var(--rd-bg-panel);width:100%}:host .rd-form-item-check-label{font-size:14px;font-weight:500;color:var(--rd-copy-secondary)}:host .rd-form-item-radio{position:relative;background-color:transparent;width:100%}:host .rd-form-item-radio-disabled{opacity:.5;pointer-events:none}:host .rd-form-item-radio-vertical .rd-radio-group-vertical{flex-direction:column;gap:12px}:host .rd-form-item-radio-label{font-size:14px;font-weight:500;color:var(--rd-copy-primary);margin-bottom:12px}:host .large .rd-custom-radio{width:24px!important;height:24px!important;margin-right:16px!important}:host .large .rd-custom-radio-inner{width:11.2px!important;height:11.2px!important}::ng-deep .rd-form-item-radio .rd-custom-radio-group{display:flex}::ng-deep .rd-form-item-radio .rd-custom-radio-group.rd-radio-group-horizontal{flex-direction:row;gap:24px}::ng-deep .rd-form-item-radio .rd-custom-radio-group.rd-radio-group-vertical{flex-direction:column;gap:12px}::ng-deep .rd-form-item-radio .rd-radio-item{display:flex;align-items:flex-start;cursor:pointer;-webkit-user-select:auto;user-select:auto}::ng-deep .rd-form-item-radio .rd-radio-item:hover .rd-custom-radio:not(.rd-custom-radio-disabled){border-color:var(--rd-control-border-hover)}::ng-deep .rd-form-item-radio .rd-radio-item:hover .rd-custom-radio-selected:not(.rd-custom-radio-disabled){border-color:var(--rd-control-border-hover-selected);background:var(--rd-control-input-hover-selected)}::ng-deep .rd-form-item-radio .rd-radio-item-disabled{cursor:not-allowed;opacity:.5}::ng-deep .rd-form-item-radio .rd-custom-radio{position:relative;display:inline-block;width:16px;height:16px;border:1px solid var(--rd-control-border-empty);background-color:var(--rd-control-input-empty);border-radius:50%;transition:all .3s ease;margin-right:8px}::ng-deep .rd-form-item-radio .rd-custom-radio-inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:7.2px;height:7.2px;background-color:var(--rd-copy-inverse);mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgOSA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC43OTk4MDUgNC44MDA3OEwzLjU5OTggOC4wMDA3OEw3Ljk5OTggMC44MDA3ODEiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgOSA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC43OTk4MDUgNC44MDA3OEwzLjU5OTggOC4wMDA3OEw3Ljk5OTggMC44MDA3ODEiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain;transition:transform .3s cubic-bezier(.78,.14,.15,.86)}.rd-radio-item-large ::ng-deep .rd-form-item-radio .rd-custom-radio{width:22px;height:22px}.rd-radio-item-large ::ng-deep .rd-form-item-radio .rd-custom-radio-inner{width:10px;height:10px}.rd-radio-item-small ::ng-deep .rd-form-item-radio .rd-custom-radio{width:14px;height:14px}.rd-radio-item-small ::ng-deep .rd-form-item-radio .rd-custom-radio-inner{width:6px;height:6px}::ng-deep .rd-form-item-radio .rd-custom-radio-selected{border-color:transparent!important;background:var(--rd-control-input-selected)}::ng-deep .rd-form-item-radio .rd-custom-radio-selected .rd-custom-radio-inner{transform:translate(-50%,-50%) scale(1)}::ng-deep .rd-form-item-radio .rd-custom-radio-disabled{border-color:var(--rd-control-border-disable)!important;background-color:var(--rd-control-input-disable)!important;cursor:not-allowed}::ng-deep .rd-form-item-radio .rd-custom-radio-disabled.rd-custom-radio-selected{background-color:var(--rd-control-input-disable)!important}::ng-deep .rd-form-item-radio .rd-radio-text{font-weight:400;font-size:14px;line-height:22px;color:var(--rd-copy-primary)}.rd-radio-item-disabled ::ng-deep .rd-form-item-radio .rd-radio-text{color:var(--rd-copy-disable)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
107
107
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomRadioComponent, decorators: [{
|
|
108
108
|
type: Component,
|
|
109
109
|
args: [{ selector: 'app-rd-radio', providers: [
|
|
@@ -112,7 +112,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
112
112
|
useExisting: forwardRef(() => CustomRadioComponent),
|
|
113
113
|
multi: true,
|
|
114
114
|
},
|
|
115
|
-
], template: "<div\n class=\"rd-form-item-radio\"\n [ngClass]=\"{\n 'rd-form-item-radio-disabled': disabled,\n 'rd-form-item-radio-vertical': direction === 'vertical',\n large: size === 'large',\n }\"\n>\n <div class=\"rd-form-item-radio-label\" *ngIf=\"label\">\n {{ label }}\n </div>\n\n <div\n [ngClass]=\"{\n 'rd-radio-group-horizontal': direction === 'horizontal',\n 'rd-radio-group-vertical': direction === 'vertical',\n }\"\n class=\"rd-custom-radio-group\"\n >\n <label\n *ngFor=\"let option of options\"\n class=\"rd-radio-item\"\n [class.rd-radio-item-selected]=\"isOptionSelected(option.value)\"\n [class.rd-radio-item-disabled]=\"disabled || option.disabled\"\n [class.rd-radio-item-large]=\"size === 'large'\"\n [class.rd-radio-item-small]=\"size === 'small'\"\n (click)=\"handleRadioClick(option.value)\"\n >\n <div\n [style.width.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n [style.height.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n >\n <span\n class=\"rd-custom-radio\"\n [class.rd-custom-radio-selected]=\"isOptionSelected(option.value)\"\n [class.rd-custom-radio-disabled]=\"disabled || option.disabled\"\n >\n <span class=\"rd-custom-radio-inner\"></span>\n </span>\n </div>\n <span class=\"rd-radio-text\" [innerHtml]=\"option.label\"> </span>\n </label>\n </div>\n</div>\n", styles: ["::ng-deep .rd-form-item-check .ant-radio-group{display:flex;margin-top:11px}::ng-deep .rd-form-item-check .ant-radio-group label{flex:1;color:var(--rd-copy-primary);font-size:14px;font-weight:500}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked .ant-radio-inner:after{background-color:var(--rd-control-input-selected)}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked:after{border-color:var(--rd-control-border-selected)}:host .rd-form-item-check{position:relative;background-color:var(--rd-bg-panel);width:100%}:host .rd-form-item-check-label{font-size:14px;font-weight:500;color:var(--rd-copy-secondary)}\n"] }]
|
|
115
|
+
], template: "<div\n class=\"rd-form-item-radio\"\n [ngClass]=\"{\n 'rd-form-item-radio-disabled': disabled,\n 'rd-form-item-radio-vertical': direction === 'vertical',\n large: size === 'large',\n }\"\n>\n <div class=\"rd-form-item-radio-label\" *ngIf=\"label\">\n {{ label }}\n </div>\n\n <div\n [ngClass]=\"{\n 'rd-radio-group-horizontal': direction === 'horizontal',\n 'rd-radio-group-vertical': direction === 'vertical',\n }\"\n class=\"rd-custom-radio-group\"\n >\n <label\n *ngFor=\"let option of options\"\n class=\"rd-radio-item\"\n [class.rd-radio-item-selected]=\"isOptionSelected(option.value)\"\n [class.rd-radio-item-disabled]=\"disabled || option.disabled\"\n [class.rd-radio-item-large]=\"size === 'large'\"\n [class.rd-radio-item-small]=\"size === 'small'\"\n (click)=\"handleRadioClick(option.value)\"\n >\n <div\n [style.width.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n [style.height.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n >\n <span\n class=\"rd-custom-radio\"\n [class.rd-custom-radio-selected]=\"isOptionSelected(option.value)\"\n [class.rd-custom-radio-disabled]=\"disabled || option.disabled\"\n >\n <span class=\"rd-custom-radio-inner\"></span>\n </span>\n </div>\n <span class=\"rd-radio-text\" [innerHtml]=\"option.label\"> </span>\n </label>\n </div>\n</div>\n", styles: ["::ng-deep .rd-form-item-check .ant-radio-group{display:flex;margin-top:11px}::ng-deep .rd-form-item-check .ant-radio-group label{flex:1;color:var(--rd-copy-primary);font-size:14px;font-weight:500}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked .ant-radio-inner:after{background-color:var(--rd-control-input-selected)}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked:after{border-color:var(--rd-control-border-selected)}:host .rd-form-item-check{position:relative;background-color:var(--rd-bg-panel);width:100%}:host .rd-form-item-check-label{font-size:14px;font-weight:500;color:var(--rd-copy-secondary)}:host .rd-form-item-radio{position:relative;background-color:transparent;width:100%}:host .rd-form-item-radio-disabled{opacity:.5;pointer-events:none}:host .rd-form-item-radio-vertical .rd-radio-group-vertical{flex-direction:column;gap:12px}:host .rd-form-item-radio-label{font-size:14px;font-weight:500;color:var(--rd-copy-primary);margin-bottom:12px}:host .large .rd-custom-radio{width:24px!important;height:24px!important;margin-right:16px!important}:host .large .rd-custom-radio-inner{width:11.2px!important;height:11.2px!important}::ng-deep .rd-form-item-radio .rd-custom-radio-group{display:flex}::ng-deep .rd-form-item-radio .rd-custom-radio-group.rd-radio-group-horizontal{flex-direction:row;gap:24px}::ng-deep .rd-form-item-radio .rd-custom-radio-group.rd-radio-group-vertical{flex-direction:column;gap:12px}::ng-deep .rd-form-item-radio .rd-radio-item{display:flex;align-items:flex-start;cursor:pointer;-webkit-user-select:auto;user-select:auto}::ng-deep .rd-form-item-radio .rd-radio-item:hover .rd-custom-radio:not(.rd-custom-radio-disabled){border-color:var(--rd-control-border-hover)}::ng-deep .rd-form-item-radio .rd-radio-item:hover .rd-custom-radio-selected:not(.rd-custom-radio-disabled){border-color:var(--rd-control-border-hover-selected);background:var(--rd-control-input-hover-selected)}::ng-deep .rd-form-item-radio .rd-radio-item-disabled{cursor:not-allowed;opacity:.5}::ng-deep .rd-form-item-radio .rd-custom-radio{position:relative;display:inline-block;width:16px;height:16px;border:1px solid var(--rd-control-border-empty);background-color:var(--rd-control-input-empty);border-radius:50%;transition:all .3s ease;margin-right:8px}::ng-deep .rd-form-item-radio .rd-custom-radio-inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:7.2px;height:7.2px;background-color:var(--rd-copy-inverse);mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgOSA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC43OTk4MDUgNC44MDA3OEwzLjU5OTggOC4wMDA3OEw3Ljk5OTggMC44MDA3ODEiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgOSA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC43OTk4MDUgNC44MDA3OEwzLjU5OTggOC4wMDA3OEw3Ljk5OTggMC44MDA3ODEiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain;transition:transform .3s cubic-bezier(.78,.14,.15,.86)}.rd-radio-item-large ::ng-deep .rd-form-item-radio .rd-custom-radio{width:22px;height:22px}.rd-radio-item-large ::ng-deep .rd-form-item-radio .rd-custom-radio-inner{width:10px;height:10px}.rd-radio-item-small ::ng-deep .rd-form-item-radio .rd-custom-radio{width:14px;height:14px}.rd-radio-item-small ::ng-deep .rd-form-item-radio .rd-custom-radio-inner{width:6px;height:6px}::ng-deep .rd-form-item-radio .rd-custom-radio-selected{border-color:transparent!important;background:var(--rd-control-input-selected)}::ng-deep .rd-form-item-radio .rd-custom-radio-selected .rd-custom-radio-inner{transform:translate(-50%,-50%) scale(1)}::ng-deep .rd-form-item-radio .rd-custom-radio-disabled{border-color:var(--rd-control-border-disable)!important;background-color:var(--rd-control-input-disable)!important;cursor:not-allowed}::ng-deep .rd-form-item-radio .rd-custom-radio-disabled.rd-custom-radio-selected{background-color:var(--rd-control-input-disable)!important}::ng-deep .rd-form-item-radio .rd-radio-text{font-weight:400;font-size:14px;line-height:22px;color:var(--rd-copy-primary)}.rd-radio-item-disabled ::ng-deep .rd-form-item-radio .rd-radio-text{color:var(--rd-copy-disable)!important}\n"] }]
|
|
116
116
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
|
|
117
117
|
type: Input
|
|
118
118
|
}], name: [{
|
|
@@ -1330,7 +1330,7 @@ CustomRadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", v
|
|
|
1330
1330
|
useExisting: forwardRef(() => CustomRadioComponent),
|
|
1331
1331
|
multi: true,
|
|
1332
1332
|
},
|
|
1333
|
-
], ngImport: i0, template: "<div\n class=\"rd-form-item-radio\"\n [ngClass]=\"{\n 'rd-form-item-radio-disabled': disabled,\n 'rd-form-item-radio-vertical': direction === 'vertical',\n large: size === 'large',\n }\"\n>\n <div class=\"rd-form-item-radio-label\" *ngIf=\"label\">\n {{ label }}\n </div>\n\n <div\n [ngClass]=\"{\n 'rd-radio-group-horizontal': direction === 'horizontal',\n 'rd-radio-group-vertical': direction === 'vertical',\n }\"\n class=\"rd-custom-radio-group\"\n >\n <label\n *ngFor=\"let option of options\"\n class=\"rd-radio-item\"\n [class.rd-radio-item-selected]=\"isOptionSelected(option.value)\"\n [class.rd-radio-item-disabled]=\"disabled || option.disabled\"\n [class.rd-radio-item-large]=\"size === 'large'\"\n [class.rd-radio-item-small]=\"size === 'small'\"\n (click)=\"handleRadioClick(option.value)\"\n >\n <div\n [style.width.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n [style.height.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n >\n <span\n class=\"rd-custom-radio\"\n [class.rd-custom-radio-selected]=\"isOptionSelected(option.value)\"\n [class.rd-custom-radio-disabled]=\"disabled || option.disabled\"\n >\n <span class=\"rd-custom-radio-inner\"></span>\n </span>\n </div>\n <span class=\"rd-radio-text\" [innerHtml]=\"option.label\"> </span>\n </label>\n </div>\n</div>\n", styles: ["::ng-deep .rd-form-item-check .ant-radio-group{display:flex;margin-top:11px}::ng-deep .rd-form-item-check .ant-radio-group label{flex:1;color:var(--rd-copy-primary);font-size:14px;font-weight:500}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked .ant-radio-inner:after{background-color:var(--rd-control-input-selected)}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked:after{border-color:var(--rd-control-border-selected)}:host .rd-form-item-check{position:relative;background-color:var(--rd-bg-panel);width:100%}:host .rd-form-item-check-label{font-size:14px;font-weight:500;color:var(--rd-copy-secondary)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
1333
|
+
], ngImport: i0, template: "<div\n class=\"rd-form-item-radio\"\n [ngClass]=\"{\n 'rd-form-item-radio-disabled': disabled,\n 'rd-form-item-radio-vertical': direction === 'vertical',\n large: size === 'large',\n }\"\n>\n <div class=\"rd-form-item-radio-label\" *ngIf=\"label\">\n {{ label }}\n </div>\n\n <div\n [ngClass]=\"{\n 'rd-radio-group-horizontal': direction === 'horizontal',\n 'rd-radio-group-vertical': direction === 'vertical',\n }\"\n class=\"rd-custom-radio-group\"\n >\n <label\n *ngFor=\"let option of options\"\n class=\"rd-radio-item\"\n [class.rd-radio-item-selected]=\"isOptionSelected(option.value)\"\n [class.rd-radio-item-disabled]=\"disabled || option.disabled\"\n [class.rd-radio-item-large]=\"size === 'large'\"\n [class.rd-radio-item-small]=\"size === 'small'\"\n (click)=\"handleRadioClick(option.value)\"\n >\n <div\n [style.width.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n [style.height.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n >\n <span\n class=\"rd-custom-radio\"\n [class.rd-custom-radio-selected]=\"isOptionSelected(option.value)\"\n [class.rd-custom-radio-disabled]=\"disabled || option.disabled\"\n >\n <span class=\"rd-custom-radio-inner\"></span>\n </span>\n </div>\n <span class=\"rd-radio-text\" [innerHtml]=\"option.label\"> </span>\n </label>\n </div>\n</div>\n", styles: ["::ng-deep .rd-form-item-check .ant-radio-group{display:flex;margin-top:11px}::ng-deep .rd-form-item-check .ant-radio-group label{flex:1;color:var(--rd-copy-primary);font-size:14px;font-weight:500}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked .ant-radio-inner:after{background-color:var(--rd-control-input-selected)}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked:after{border-color:var(--rd-control-border-selected)}:host .rd-form-item-check{position:relative;background-color:var(--rd-bg-panel);width:100%}:host .rd-form-item-check-label{font-size:14px;font-weight:500;color:var(--rd-copy-secondary)}:host .rd-form-item-radio{position:relative;background-color:transparent;width:100%}:host .rd-form-item-radio-disabled{opacity:.5;pointer-events:none}:host .rd-form-item-radio-vertical .rd-radio-group-vertical{flex-direction:column;gap:12px}:host .rd-form-item-radio-label{font-size:14px;font-weight:500;color:var(--rd-copy-primary);margin-bottom:12px}:host .large .rd-custom-radio{width:24px!important;height:24px!important;margin-right:16px!important}:host .large .rd-custom-radio-inner{width:11.2px!important;height:11.2px!important}::ng-deep .rd-form-item-radio .rd-custom-radio-group{display:flex}::ng-deep .rd-form-item-radio .rd-custom-radio-group.rd-radio-group-horizontal{flex-direction:row;gap:24px}::ng-deep .rd-form-item-radio .rd-custom-radio-group.rd-radio-group-vertical{flex-direction:column;gap:12px}::ng-deep .rd-form-item-radio .rd-radio-item{display:flex;align-items:flex-start;cursor:pointer;-webkit-user-select:auto;user-select:auto}::ng-deep .rd-form-item-radio .rd-radio-item:hover .rd-custom-radio:not(.rd-custom-radio-disabled){border-color:var(--rd-control-border-hover)}::ng-deep .rd-form-item-radio .rd-radio-item:hover .rd-custom-radio-selected:not(.rd-custom-radio-disabled){border-color:var(--rd-control-border-hover-selected);background:var(--rd-control-input-hover-selected)}::ng-deep .rd-form-item-radio .rd-radio-item-disabled{cursor:not-allowed;opacity:.5}::ng-deep .rd-form-item-radio .rd-custom-radio{position:relative;display:inline-block;width:16px;height:16px;border:1px solid var(--rd-control-border-empty);background-color:var(--rd-control-input-empty);border-radius:50%;transition:all .3s ease;margin-right:8px}::ng-deep .rd-form-item-radio .rd-custom-radio-inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:7.2px;height:7.2px;background-color:var(--rd-copy-inverse);mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgOSA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC43OTk4MDUgNC44MDA3OEwzLjU5OTggOC4wMDA3OEw3Ljk5OTggMC44MDA3ODEiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgOSA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC43OTk4MDUgNC44MDA3OEwzLjU5OTggOC4wMDA3OEw3Ljk5OTggMC44MDA3ODEiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain;transition:transform .3s cubic-bezier(.78,.14,.15,.86)}.rd-radio-item-large ::ng-deep .rd-form-item-radio .rd-custom-radio{width:22px;height:22px}.rd-radio-item-large ::ng-deep .rd-form-item-radio .rd-custom-radio-inner{width:10px;height:10px}.rd-radio-item-small ::ng-deep .rd-form-item-radio .rd-custom-radio{width:14px;height:14px}.rd-radio-item-small ::ng-deep .rd-form-item-radio .rd-custom-radio-inner{width:6px;height:6px}::ng-deep .rd-form-item-radio .rd-custom-radio-selected{border-color:transparent!important;background:var(--rd-control-input-selected)}::ng-deep .rd-form-item-radio .rd-custom-radio-selected .rd-custom-radio-inner{transform:translate(-50%,-50%) scale(1)}::ng-deep .rd-form-item-radio .rd-custom-radio-disabled{border-color:var(--rd-control-border-disable)!important;background-color:var(--rd-control-input-disable)!important;cursor:not-allowed}::ng-deep .rd-form-item-radio .rd-custom-radio-disabled.rd-custom-radio-selected{background-color:var(--rd-control-input-disable)!important}::ng-deep .rd-form-item-radio .rd-radio-text{font-weight:400;font-size:14px;line-height:22px;color:var(--rd-copy-primary)}.rd-radio-item-disabled ::ng-deep .rd-form-item-radio .rd-radio-text{color:var(--rd-copy-disable)!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
|
|
1334
1334
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: CustomRadioComponent, decorators: [{
|
|
1335
1335
|
type: Component,
|
|
1336
1336
|
args: [{ selector: 'app-rd-radio', providers: [
|
|
@@ -1339,7 +1339,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
|
|
|
1339
1339
|
useExisting: forwardRef(() => CustomRadioComponent),
|
|
1340
1340
|
multi: true,
|
|
1341
1341
|
},
|
|
1342
|
-
], template: "<div\n class=\"rd-form-item-radio\"\n [ngClass]=\"{\n 'rd-form-item-radio-disabled': disabled,\n 'rd-form-item-radio-vertical': direction === 'vertical',\n large: size === 'large',\n }\"\n>\n <div class=\"rd-form-item-radio-label\" *ngIf=\"label\">\n {{ label }}\n </div>\n\n <div\n [ngClass]=\"{\n 'rd-radio-group-horizontal': direction === 'horizontal',\n 'rd-radio-group-vertical': direction === 'vertical',\n }\"\n class=\"rd-custom-radio-group\"\n >\n <label\n *ngFor=\"let option of options\"\n class=\"rd-radio-item\"\n [class.rd-radio-item-selected]=\"isOptionSelected(option.value)\"\n [class.rd-radio-item-disabled]=\"disabled || option.disabled\"\n [class.rd-radio-item-large]=\"size === 'large'\"\n [class.rd-radio-item-small]=\"size === 'small'\"\n (click)=\"handleRadioClick(option.value)\"\n >\n <div\n [style.width.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n [style.height.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n >\n <span\n class=\"rd-custom-radio\"\n [class.rd-custom-radio-selected]=\"isOptionSelected(option.value)\"\n [class.rd-custom-radio-disabled]=\"disabled || option.disabled\"\n >\n <span class=\"rd-custom-radio-inner\"></span>\n </span>\n </div>\n <span class=\"rd-radio-text\" [innerHtml]=\"option.label\"> </span>\n </label>\n </div>\n</div>\n", styles: ["::ng-deep .rd-form-item-check .ant-radio-group{display:flex;margin-top:11px}::ng-deep .rd-form-item-check .ant-radio-group label{flex:1;color:var(--rd-copy-primary);font-size:14px;font-weight:500}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked .ant-radio-inner:after{background-color:var(--rd-control-input-selected)}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked:after{border-color:var(--rd-control-border-selected)}:host .rd-form-item-check{position:relative;background-color:var(--rd-bg-panel);width:100%}:host .rd-form-item-check-label{font-size:14px;font-weight:500;color:var(--rd-copy-secondary)}\n"] }]
|
|
1342
|
+
], template: "<div\n class=\"rd-form-item-radio\"\n [ngClass]=\"{\n 'rd-form-item-radio-disabled': disabled,\n 'rd-form-item-radio-vertical': direction === 'vertical',\n large: size === 'large',\n }\"\n>\n <div class=\"rd-form-item-radio-label\" *ngIf=\"label\">\n {{ label }}\n </div>\n\n <div\n [ngClass]=\"{\n 'rd-radio-group-horizontal': direction === 'horizontal',\n 'rd-radio-group-vertical': direction === 'vertical',\n }\"\n class=\"rd-custom-radio-group\"\n >\n <label\n *ngFor=\"let option of options\"\n class=\"rd-radio-item\"\n [class.rd-radio-item-selected]=\"isOptionSelected(option.value)\"\n [class.rd-radio-item-disabled]=\"disabled || option.disabled\"\n [class.rd-radio-item-large]=\"size === 'large'\"\n [class.rd-radio-item-small]=\"size === 'small'\"\n (click)=\"handleRadioClick(option.value)\"\n >\n <div\n [style.width.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n [style.height.px]=\"size === 'large' ? 40 : size === 'small' ? 20 : 24\"\n >\n <span\n class=\"rd-custom-radio\"\n [class.rd-custom-radio-selected]=\"isOptionSelected(option.value)\"\n [class.rd-custom-radio-disabled]=\"disabled || option.disabled\"\n >\n <span class=\"rd-custom-radio-inner\"></span>\n </span>\n </div>\n <span class=\"rd-radio-text\" [innerHtml]=\"option.label\"> </span>\n </label>\n </div>\n</div>\n", styles: ["::ng-deep .rd-form-item-check .ant-radio-group{display:flex;margin-top:11px}::ng-deep .rd-form-item-check .ant-radio-group label{flex:1;color:var(--rd-copy-primary);font-size:14px;font-weight:500}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked .ant-radio-inner:after{background-color:var(--rd-control-input-selected)}::ng-deep .rd-form-item-check .ant-radio-group .ant-radio-checked:after{border-color:var(--rd-control-border-selected)}:host .rd-form-item-check{position:relative;background-color:var(--rd-bg-panel);width:100%}:host .rd-form-item-check-label{font-size:14px;font-weight:500;color:var(--rd-copy-secondary)}:host .rd-form-item-radio{position:relative;background-color:transparent;width:100%}:host .rd-form-item-radio-disabled{opacity:.5;pointer-events:none}:host .rd-form-item-radio-vertical .rd-radio-group-vertical{flex-direction:column;gap:12px}:host .rd-form-item-radio-label{font-size:14px;font-weight:500;color:var(--rd-copy-primary);margin-bottom:12px}:host .large .rd-custom-radio{width:24px!important;height:24px!important;margin-right:16px!important}:host .large .rd-custom-radio-inner{width:11.2px!important;height:11.2px!important}::ng-deep .rd-form-item-radio .rd-custom-radio-group{display:flex}::ng-deep .rd-form-item-radio .rd-custom-radio-group.rd-radio-group-horizontal{flex-direction:row;gap:24px}::ng-deep .rd-form-item-radio .rd-custom-radio-group.rd-radio-group-vertical{flex-direction:column;gap:12px}::ng-deep .rd-form-item-radio .rd-radio-item{display:flex;align-items:flex-start;cursor:pointer;-webkit-user-select:auto;user-select:auto}::ng-deep .rd-form-item-radio .rd-radio-item:hover .rd-custom-radio:not(.rd-custom-radio-disabled){border-color:var(--rd-control-border-hover)}::ng-deep .rd-form-item-radio .rd-radio-item:hover .rd-custom-radio-selected:not(.rd-custom-radio-disabled){border-color:var(--rd-control-border-hover-selected);background:var(--rd-control-input-hover-selected)}::ng-deep .rd-form-item-radio .rd-radio-item-disabled{cursor:not-allowed;opacity:.5}::ng-deep .rd-form-item-radio .rd-custom-radio{position:relative;display:inline-block;width:16px;height:16px;border:1px solid var(--rd-control-border-empty);background-color:var(--rd-control-input-empty);border-radius:50%;transition:all .3s ease;margin-right:8px}::ng-deep .rd-form-item-radio .rd-custom-radio-inner{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);width:7.2px;height:7.2px;background-color:var(--rd-copy-inverse);mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgOSA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC43OTk4MDUgNC44MDA3OEwzLjU5OTggOC4wMDA3OEw3Ljk5OTggMC44MDA3ODEiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iOSIgaGVpZ2h0PSI5IiB2aWV3Qm94PSIwIDAgOSA5IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMC43OTk4MDUgNC44MDA3OEwzLjU5OTggOC4wMDA3OEw3Ljk5OTggMC44MDA3ODEiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMS42IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain;transition:transform .3s cubic-bezier(.78,.14,.15,.86)}.rd-radio-item-large ::ng-deep .rd-form-item-radio .rd-custom-radio{width:22px;height:22px}.rd-radio-item-large ::ng-deep .rd-form-item-radio .rd-custom-radio-inner{width:10px;height:10px}.rd-radio-item-small ::ng-deep .rd-form-item-radio .rd-custom-radio{width:14px;height:14px}.rd-radio-item-small ::ng-deep .rd-form-item-radio .rd-custom-radio-inner{width:6px;height:6px}::ng-deep .rd-form-item-radio .rd-custom-radio-selected{border-color:transparent!important;background:var(--rd-control-input-selected)}::ng-deep .rd-form-item-radio .rd-custom-radio-selected .rd-custom-radio-inner{transform:translate(-50%,-50%) scale(1)}::ng-deep .rd-form-item-radio .rd-custom-radio-disabled{border-color:var(--rd-control-border-disable)!important;background-color:var(--rd-control-input-disable)!important;cursor:not-allowed}::ng-deep .rd-form-item-radio .rd-custom-radio-disabled.rd-custom-radio-selected{background-color:var(--rd-control-input-disable)!important}::ng-deep .rd-form-item-radio .rd-radio-text{font-weight:400;font-size:14px;line-height:22px;color:var(--rd-copy-primary)}.rd-radio-item-disabled ::ng-deep .rd-form-item-radio .rd-radio-text{color:var(--rd-copy-disable)!important}\n"] }]
|
|
1343
1343
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { label: [{
|
|
1344
1344
|
type: Input
|
|
1345
1345
|
}], name: [{
|