@ng-nest/ui 21.0.9 → 21.0.11
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.
- package/fesm2022/ng-nest-ui-affix.mjs +10 -10
- package/fesm2022/ng-nest-ui-alert.mjs +10 -10
- package/fesm2022/ng-nest-ui-anchor.mjs +16 -16
- package/fesm2022/ng-nest-ui-api.mjs +7 -7
- package/fesm2022/ng-nest-ui-attachments.mjs +16 -16
- package/fesm2022/ng-nest-ui-auto-complete.mjs +14 -14
- package/fesm2022/ng-nest-ui-auto-complete.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-avatar.mjs +16 -16
- package/fesm2022/ng-nest-ui-back-top.mjs +10 -10
- package/fesm2022/ng-nest-ui-badge.mjs +10 -10
- package/fesm2022/ng-nest-ui-base-form.mjs +32 -52
- package/fesm2022/ng-nest-ui-base-form.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-bubble.mjs +16 -16
- package/fesm2022/ng-nest-ui-button.mjs +16 -16
- package/fesm2022/ng-nest-ui-calendar.mjs +10 -10
- package/fesm2022/ng-nest-ui-card.mjs +10 -10
- package/fesm2022/ng-nest-ui-carousel.mjs +16 -16
- package/fesm2022/ng-nest-ui-cascade.mjs +14 -14
- package/fesm2022/ng-nest-ui-cascade.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-checkbox.mjs +10 -10
- package/fesm2022/ng-nest-ui-collapse.mjs +16 -16
- package/fesm2022/ng-nest-ui-color-picker.mjs +17 -17
- package/fesm2022/ng-nest-ui-color-picker.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-color.mjs +10 -10
- package/fesm2022/ng-nest-ui-comment.mjs +16 -16
- package/fesm2022/ng-nest-ui-container.mjs +31 -31
- package/fesm2022/ng-nest-ui-core.mjs +20 -20
- package/fesm2022/ng-nest-ui-core.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-coversations.mjs +10 -10
- package/fesm2022/ng-nest-ui-crumb.mjs +10 -10
- package/fesm2022/ng-nest-ui-date-picker.mjs +51 -51
- package/fesm2022/ng-nest-ui-date-picker.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-description.mjs +16 -16
- package/fesm2022/ng-nest-ui-dialog.mjs +42 -40
- package/fesm2022/ng-nest-ui-dialog.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-divider.mjs +124 -0
- package/fesm2022/ng-nest-ui-divider.mjs.map +1 -0
- package/fesm2022/ng-nest-ui-doc.mjs +7 -7
- package/fesm2022/ng-nest-ui-drag.mjs +10 -10
- package/fesm2022/ng-nest-ui-drawer.mjs +31 -31
- package/fesm2022/ng-nest-ui-dropdown.mjs +13 -13
- package/fesm2022/ng-nest-ui-empty.mjs +10 -10
- package/fesm2022/ng-nest-ui-examples.mjs +7 -7
- package/fesm2022/ng-nest-ui-find.mjs +10 -10
- package/fesm2022/ng-nest-ui-find.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-form.mjs +23 -28
- package/fesm2022/ng-nest-ui-form.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-highlight.mjs +13 -13
- package/fesm2022/ng-nest-ui-i18n.mjs +13 -13
- package/fesm2022/ng-nest-ui-icon.mjs +13 -13
- package/fesm2022/ng-nest-ui-image.mjs +100 -61
- package/fesm2022/ng-nest-ui-image.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-inner.mjs +10 -10
- package/fesm2022/ng-nest-ui-input-number.mjs +11 -11
- package/fesm2022/ng-nest-ui-input-number.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-input.mjs +24 -21
- package/fesm2022/ng-nest-ui-input.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-keyword.mjs +10 -10
- package/fesm2022/ng-nest-ui-layout.mjs +16 -16
- package/fesm2022/ng-nest-ui-link.mjs +10 -10
- package/fesm2022/ng-nest-ui-list.mjs +19 -19
- package/fesm2022/ng-nest-ui-loading.mjs +10 -10
- package/fesm2022/ng-nest-ui-menu.mjs +16 -16
- package/fesm2022/ng-nest-ui-message-box.mjs +10 -10
- package/fesm2022/ng-nest-ui-message-box.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-message.mjs +10 -10
- package/fesm2022/ng-nest-ui-notification.mjs +10 -10
- package/fesm2022/ng-nest-ui-outlet.mjs +7 -7
- package/fesm2022/ng-nest-ui-page-header.mjs +10 -10
- package/fesm2022/ng-nest-ui-pagination.mjs +10 -10
- package/fesm2022/ng-nest-ui-pattern.mjs +7 -7
- package/fesm2022/ng-nest-ui-popconfirm.mjs +10 -10
- package/fesm2022/ng-nest-ui-popover.mjs +13 -13
- package/fesm2022/ng-nest-ui-portal.mjs +7 -7
- package/fesm2022/ng-nest-ui-progress.mjs +10 -10
- package/fesm2022/ng-nest-ui-prompts.mjs +10 -10
- package/fesm2022/ng-nest-ui-radio.mjs +10 -10
- package/fesm2022/ng-nest-ui-rate.mjs +10 -10
- package/fesm2022/ng-nest-ui-resizable.mjs +10 -10
- package/fesm2022/ng-nest-ui-result.mjs +10 -10
- package/fesm2022/ng-nest-ui-ripple.mjs +10 -10
- package/fesm2022/ng-nest-ui-scrollable.mjs +7 -7
- package/fesm2022/ng-nest-ui-select.mjs +15 -15
- package/fesm2022/ng-nest-ui-select.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-sender.mjs +14 -14
- package/fesm2022/ng-nest-ui-sender.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-skeleton.mjs +10 -10
- package/fesm2022/ng-nest-ui-slider-select.mjs +10 -10
- package/fesm2022/ng-nest-ui-slider.mjs +10 -10
- package/fesm2022/ng-nest-ui-statistic.mjs +16 -16
- package/fesm2022/ng-nest-ui-steps.mjs +10 -10
- package/fesm2022/ng-nest-ui-suggestion.mjs +10 -10
- package/fesm2022/ng-nest-ui-switch.mjs +10 -10
- package/fesm2022/ng-nest-ui-table-view.mjs +58 -63
- package/fesm2022/ng-nest-ui-table-view.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-table.mjs +34 -34
- package/fesm2022/ng-nest-ui-tabs.mjs +25 -25
- package/fesm2022/ng-nest-ui-tag.mjs +10 -10
- package/fesm2022/ng-nest-ui-text-retract.mjs +10 -10
- package/fesm2022/ng-nest-ui-textarea.mjs +11 -11
- package/fesm2022/ng-nest-ui-textarea.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-theme.mjs +10 -10
- package/fesm2022/ng-nest-ui-thought-chain.mjs +10 -10
- package/fesm2022/ng-nest-ui-time-ago.mjs +7 -7
- package/fesm2022/ng-nest-ui-time-picker.mjs +47 -36
- package/fesm2022/ng-nest-ui-time-picker.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-time-range.mjs +7 -7
- package/fesm2022/ng-nest-ui-timeline.mjs +10 -10
- package/fesm2022/ng-nest-ui-tooltip.mjs +13 -13
- package/fesm2022/ng-nest-ui-transfer.mjs +10 -10
- package/fesm2022/ng-nest-ui-tree-file.mjs +10 -10
- package/fesm2022/ng-nest-ui-tree-select.mjs +14 -14
- package/fesm2022/ng-nest-ui-tree-select.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-tree.mjs +19 -19
- package/fesm2022/ng-nest-ui-typography.mjs +10 -10
- package/fesm2022/ng-nest-ui-upload.mjs +19 -19
- package/fesm2022/ng-nest-ui-welcome.mjs +10 -10
- package/fesm2022/ng-nest-ui.mjs +1 -0
- package/fesm2022/ng-nest-ui.mjs.map +1 -1
- package/package.json +5 -2
- package/types/ng-nest-ui-attachments.d.ts +4 -5
- package/types/ng-nest-ui-auto-complete.d.ts +8 -9
- package/types/ng-nest-ui-base-form.d.ts +8 -9
- package/types/ng-nest-ui-cascade.d.ts +8 -9
- package/types/ng-nest-ui-checkbox.d.ts +5 -6
- package/types/ng-nest-ui-color-picker.d.ts +8 -9
- package/types/ng-nest-ui-core.d.ts +8 -1
- package/types/ng-nest-ui-coversations.d.ts +4 -5
- package/types/ng-nest-ui-date-picker.d.ts +16 -18
- package/types/ng-nest-ui-dialog.d.ts +12 -0
- package/types/ng-nest-ui-divider.d.ts +113 -0
- package/types/ng-nest-ui-find.d.ts +6 -7
- package/types/ng-nest-ui-form.d.ts +9 -10
- package/types/ng-nest-ui-image.d.ts +2 -1
- package/types/ng-nest-ui-input-number.d.ts +8 -9
- package/types/ng-nest-ui-input.d.ts +14 -10
- package/types/ng-nest-ui-list.d.ts +4 -5
- package/types/ng-nest-ui-message-box.d.ts +2 -2
- package/types/ng-nest-ui-radio.d.ts +5 -6
- package/types/ng-nest-ui-rate.d.ts +4 -5
- package/types/ng-nest-ui-select.d.ts +8 -9
- package/types/ng-nest-ui-sender.d.ts +6 -7
- package/types/ng-nest-ui-slider-select.d.ts +4 -5
- package/types/ng-nest-ui-switch.d.ts +4 -5
- package/types/ng-nest-ui-textarea.d.ts +8 -9
- package/types/ng-nest-ui-theme.d.ts +4 -5
- package/types/ng-nest-ui-time-picker.d.ts +12 -11
- package/types/ng-nest-ui-transfer.d.ts +4 -5
- package/types/ng-nest-ui-tree-select.d.ts +8 -9
- package/types/ng-nest-ui-upload.d.ts +4 -5
- package/types/ng-nest-ui.d.ts +1 -0
|
@@ -99,10 +99,10 @@ class XPopconfirmProperty extends XPropertyFunction(X_POPCONFIRM_CONFIG_NAME) {
|
|
|
99
99
|
*/
|
|
100
100
|
this.confirm = output();
|
|
101
101
|
}
|
|
102
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
103
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
102
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopconfirmProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
103
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: XPopconfirmProperty, isStandalone: true, selector: "x-popconfirm-property", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconColor: { classPropertyName: "iconColor", publicName: "iconColor", isSignal: true, isRequired: false, transformFunction: null }, cancelText: { classPropertyName: "cancelText", publicName: "cancelText", isSignal: true, isRequired: false, transformFunction: null }, confirmText: { classPropertyName: "confirmText", publicName: "confirmText", isSignal: true, isRequired: false, transformFunction: null }, confirmAsync: { classPropertyName: "confirmAsync", publicName: "confirmAsync", isSignal: true, isRequired: false, transformFunction: null }, condition: { classPropertyName: "condition", publicName: "condition", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { cancel: "cancel", confirm: "confirm" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
|
|
104
104
|
}
|
|
105
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
105
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopconfirmProperty, decorators: [{
|
|
106
106
|
type: Component,
|
|
107
107
|
args: [{ selector: `${XPopconfirmPrefix}-property`, template: '' }]
|
|
108
108
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], iconColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconColor", required: false }] }], cancelText: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelText", required: false }] }], confirmText: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmText", required: false }] }], confirmAsync: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmAsync", required: false }] }], condition: [{ type: i0.Input, args: [{ isSignal: true, alias: "condition", required: false }] }], cancel: [{ type: i0.Output, args: ["cancel"] }], confirm: [{ type: i0.Output, args: ["confirm"] }] } });
|
|
@@ -147,20 +147,20 @@ class XPopconfirmComponent extends XPopconfirmProperty {
|
|
|
147
147
|
onClick(event) {
|
|
148
148
|
this.condition() && this.onConfirm(event);
|
|
149
149
|
}
|
|
150
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
151
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
150
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopconfirmComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
151
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: XPopconfirmComponent, isStandalone: true, selector: "x-popconfirm", usesInheritance: true, ngImport: i0, template: "<div\r\n #popconfirm\r\n class=\"x-popconfirm\"\r\n x-popover\r\n [title]=\"titleTpl\"\r\n [content]=\"content()\"\r\n [footer]=\"footerTpl\"\r\n [placement]=\"placement()\"\r\n [trigger]=\"trigger()\"\r\n [width]=\"width()\"\r\n [maxWidth]=\"maxWidth()\"\r\n [minWidth]=\"minWidth()\"\r\n [condition]=\"condition()\"\r\n [(visible)]=\"visible\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n<ng-template #titleTpl>\r\n <div class=\"x-popconfirm-title\">\r\n <ng-container *xOutlet=\"title()\">\r\n @if (icon()) {\r\n <x-icon [style.color]=\"iconColor()\" [type]=\"icon()\"></x-icon>\r\n }\r\n <span>{{ title() }}</span>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #footerTpl>\r\n <div class=\"x-popconfirm-buttons\">\r\n <x-button class=\"x-popconfirm-cancel\" (click)=\"onCancel($event)\" flat plain>{{ cancelTextSignal() }}</x-button>\r\n <x-button class=\"x-popconfirm-confirm\" type=\"primary\" flat (click)=\"onConfirm($event)\" [loading]=\"loading()\">{{\r\n confirmTextSignal()\r\n }}</x-button>\r\n </div>\r\n</ng-template>\r\n", styles: [".x-popconfirm{margin:0;padding:0}.x-popconfirm{display:inline-block}.x-popconfirm-buttons{display:flex;justify-content:flex-end}.x-popconfirm-buttons>x-button:not(:first-child){margin-left:.5rem}.x-popconfirm-title{display:flex;align-items:center}.x-popconfirm-title>.x-icon{margin-right:.325rem;font-size:1rem}\n"], dependencies: [{ kind: "directive", type: XPopoverDirective, selector: "[x-popover], x-popover" }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "component", type: XIconComponent, selector: "x-icon" }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
152
152
|
}
|
|
153
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
153
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopconfirmComponent, decorators: [{
|
|
154
154
|
type: Component,
|
|
155
155
|
args: [{ selector: `${XPopconfirmPrefix}`, imports: [XPopoverDirective, XButtonComponent, XIconComponent, XOutletDirective], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n #popconfirm\r\n class=\"x-popconfirm\"\r\n x-popover\r\n [title]=\"titleTpl\"\r\n [content]=\"content()\"\r\n [footer]=\"footerTpl\"\r\n [placement]=\"placement()\"\r\n [trigger]=\"trigger()\"\r\n [width]=\"width()\"\r\n [maxWidth]=\"maxWidth()\"\r\n [minWidth]=\"minWidth()\"\r\n [condition]=\"condition()\"\r\n [(visible)]=\"visible\"\r\n (click)=\"onClick($event)\"\r\n>\r\n <ng-content></ng-content>\r\n</div>\r\n\r\n<ng-template #titleTpl>\r\n <div class=\"x-popconfirm-title\">\r\n <ng-container *xOutlet=\"title()\">\r\n @if (icon()) {\r\n <x-icon [style.color]=\"iconColor()\" [type]=\"icon()\"></x-icon>\r\n }\r\n <span>{{ title() }}</span>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #footerTpl>\r\n <div class=\"x-popconfirm-buttons\">\r\n <x-button class=\"x-popconfirm-cancel\" (click)=\"onCancel($event)\" flat plain>{{ cancelTextSignal() }}</x-button>\r\n <x-button class=\"x-popconfirm-confirm\" type=\"primary\" flat (click)=\"onConfirm($event)\" [loading]=\"loading()\">{{\r\n confirmTextSignal()\r\n }}</x-button>\r\n </div>\r\n</ng-template>\r\n", styles: [".x-popconfirm{margin:0;padding:0}.x-popconfirm{display:inline-block}.x-popconfirm-buttons{display:flex;justify-content:flex-end}.x-popconfirm-buttons>x-button:not(:first-child){margin-left:.5rem}.x-popconfirm-title{display:flex;align-items:center}.x-popconfirm-title>.x-icon{margin-right:.325rem;font-size:1rem}\n"] }]
|
|
156
156
|
}] });
|
|
157
157
|
|
|
158
158
|
class XPopconfirmModule {
|
|
159
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
160
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
161
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
159
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopconfirmModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
160
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: XPopconfirmModule, imports: [XPopconfirmComponent], exports: [XPopconfirmComponent] }); }
|
|
161
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopconfirmModule, imports: [XPopconfirmComponent] }); }
|
|
162
162
|
}
|
|
163
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
163
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopconfirmModule, decorators: [{
|
|
164
164
|
type: NgModule,
|
|
165
165
|
args: [{
|
|
166
166
|
exports: [XPopconfirmComponent],
|
|
@@ -92,10 +92,10 @@ class XPopoverProperty extends XPropertyFunction(X_POPOVER_CONFIG_NAME) {
|
|
|
92
92
|
*/
|
|
93
93
|
this.mouseLeaveDelay = input(100, { ...(ngDevMode ? { debugName: "mouseLeaveDelay" } : {}), transform: XToNumber });
|
|
94
94
|
}
|
|
95
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
96
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.
|
|
95
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopoverProperty, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
96
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "21.1.1", type: XPopoverProperty, isStandalone: true, selector: "[x-popover], x-popover", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null }, panelClass: { classPropertyName: "panelClass", publicName: "panelClass", isSignal: true, isRequired: false, transformFunction: null }, connectTo: { classPropertyName: "connectTo", publicName: "connectTo", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, visible: { classPropertyName: "visible", publicName: "visible", isSignal: true, isRequired: false, transformFunction: null }, condition: { classPropertyName: "condition", publicName: "condition", isSignal: true, isRequired: false, transformFunction: null }, mouseEnterDelay: { classPropertyName: "mouseEnterDelay", publicName: "mouseEnterDelay", isSignal: true, isRequired: false, transformFunction: null }, mouseLeaveDelay: { classPropertyName: "mouseLeaveDelay", publicName: "mouseLeaveDelay", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { visible: "visibleChange" }, usesInheritance: true, ngImport: i0 }); }
|
|
97
97
|
}
|
|
98
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
98
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopoverProperty, decorators: [{
|
|
99
99
|
type: Directive,
|
|
100
100
|
args: [{ selector: `[${XPopoverPrefix}], ${XPopoverPrefix}` }]
|
|
101
101
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], footer: [{ type: i0.Input, args: [{ isSignal: true, alias: "footer", required: false }] }], panelClass: [{ type: i0.Input, args: [{ isSignal: true, alias: "panelClass", required: false }] }], connectTo: [{ type: i0.Input, args: [{ isSignal: true, alias: "connectTo", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], visible: [{ type: i0.Input, args: [{ isSignal: true, alias: "visible", required: false }] }, { type: i0.Output, args: ["visibleChange"] }], condition: [{ type: i0.Input, args: [{ isSignal: true, alias: "condition", required: false }] }], mouseEnterDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "mouseEnterDelay", required: false }] }], mouseLeaveDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "mouseLeaveDelay", required: false }] }] } });
|
|
@@ -136,10 +136,10 @@ class XPopoverPortalComponent {
|
|
|
136
136
|
stopPropagation(event) {
|
|
137
137
|
event.stopPropagation();
|
|
138
138
|
}
|
|
139
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
140
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
139
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopoverPortalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
140
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: XPopoverPortalComponent, isStandalone: true, selector: "x-popover-portal", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, footer: { classPropertyName: "footer", publicName: "footer", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { portalHover: "portalHover" }, host: { listeners: { "mouseenter": "mouseenter()", "mouseleave": "mouseleave()" }, properties: { "animate.enter": "this.animateEnter", "animate.leave": "this.animateLeave" } }, ngImport: i0, template: "<div #popoverPortal class=\"x-popover-portal\" [ngClass]=\"classMap()\" (click)=\"stopPropagation($event)\">\r\n <div\r\n class=\"x-popover-portal-inner\"\r\n [style.width]=\"width()\"\r\n [style.minWidth]=\"minWidth()\"\r\n [style.maxWidth]=\"maxWidth()\"\r\n >\r\n @if (title()) {\r\n <div class=\"x-popover-portal-title\">\r\n <ng-container *xOutlet=\"title()\">\r\n {{ title() }}\r\n </ng-container>\r\n </div>\r\n }\r\n @if (content()) {\r\n <div class=\"x-popover-portal-content\">\r\n <ng-container *xOutlet=\"content()\">\r\n {{ content() }}\r\n </ng-container>\r\n </div>\r\n }\r\n @if (footer()) {\r\n <div class=\"x-popover-portal-footer\">\r\n <ng-container *xOutlet=\"footer()\">\r\n {{ footer() }}\r\n </ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div #popoverArrow class=\"x-popover-portal-arrow\"></div>\r\n</div>\r\n", styles: ["x-popover{display:inline-block}.x-popover-portal{margin:0;padding:0}.x-popover-portal{display:inline-flex;position:relative;justify-content:center;align-items:center}.x-popover-portal>.x-popover-portal-inner{font-size:var(--x-font-size);background-color:var(--x-background-100);color:var(--x-text);padding:var(--x-font-size);border-radius:var(--x-border-radius);box-shadow:var(--x-box-shadow)}.x-popover-portal .x-popover-portal-title{margin-bottom:calc(var(--x-font-size) - .5rem);font-weight:600;display:flex;align-items:center}.x-popover-portal .x-popover-portal-footer{margin-top:calc(var(--x-font-size) - .5rem)}.x-popover-portal .x-popover-portal-arrow,.x-popover-portal .x-popover-portal-arrow:after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.x-popover-portal-top,.x-popover-portal-top-start,.x-popover-portal-top-end{padding-bottom:.525rem}.x-popover-portal-top>.x-popover-portal-arrow,.x-popover-portal-top-start>.x-popover-portal-arrow,.x-popover-portal-top-end>.x-popover-portal-arrow{bottom:.1rem}.x-popover-portal-top .x-popover-portal-arrow:after,.x-popover-portal-top-start .x-popover-portal-arrow:after,.x-popover-portal-top-end .x-popover-portal-arrow:after{bottom:.1rem;margin-left:-.375rem}.x-popover-portal-left,.x-popover-portal-left-start,.x-popover-portal-left-end{padding-right:.525rem}.x-popover-portal-left>.x-popover-portal-arrow,.x-popover-portal-left-start>.x-popover-portal-arrow,.x-popover-portal-left-end>.x-popover-portal-arrow{right:.1rem}.x-popover-portal-left .x-popover-portal-arrow:after,.x-popover-portal-left-start .x-popover-portal-arrow:after,.x-popover-portal-left-end .x-popover-portal-arrow:after{right:.1rem;margin-top:-.375rem}.x-popover-portal-right,.x-popover-portal-right-start,.x-popover-portal-right-end{padding-left:.525rem}.x-popover-portal-right>.x-popover-portal-arrow,.x-popover-portal-right-start>.x-popover-portal-arrow,.x-popover-portal-right-end>.x-popover-portal-arrow{left:.1rem}.x-popover-portal-right .x-popover-portal-arrow:after,.x-popover-portal-right-start .x-popover-portal-arrow:after,.x-popover-portal-right-end .x-popover-portal-arrow:after{left:.1rem;margin-top:-.375rem}.x-popover-portal-bottom,.x-popover-portal-bottom-start,.x-popover-portal-bottom-end{padding-top:.525rem}.x-popover-portal-bottom .x-popover-portal-arrow,.x-popover-portal-bottom-start .x-popover-portal-arrow,.x-popover-portal-bottom-end .x-popover-portal-arrow{top:.1rem}.x-popover-portal-bottom .x-popover-portal-arrow:after,.x-popover-portal-bottom-start .x-popover-portal-arrow:after,.x-popover-portal-bottom-end .x-popover-portal-arrow:after{top:.1rem;margin-left:-.375rem}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
141
141
|
}
|
|
142
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
142
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopoverPortalComponent, decorators: [{
|
|
143
143
|
type: Component,
|
|
144
144
|
args: [{ selector: `${XPopoverPortalPrefix}`, imports: [NgClass, XOutletDirective], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #popoverPortal class=\"x-popover-portal\" [ngClass]=\"classMap()\" (click)=\"stopPropagation($event)\">\r\n <div\r\n class=\"x-popover-portal-inner\"\r\n [style.width]=\"width()\"\r\n [style.minWidth]=\"minWidth()\"\r\n [style.maxWidth]=\"maxWidth()\"\r\n >\r\n @if (title()) {\r\n <div class=\"x-popover-portal-title\">\r\n <ng-container *xOutlet=\"title()\">\r\n {{ title() }}\r\n </ng-container>\r\n </div>\r\n }\r\n @if (content()) {\r\n <div class=\"x-popover-portal-content\">\r\n <ng-container *xOutlet=\"content()\">\r\n {{ content() }}\r\n </ng-container>\r\n </div>\r\n }\r\n @if (footer()) {\r\n <div class=\"x-popover-portal-footer\">\r\n <ng-container *xOutlet=\"footer()\">\r\n {{ footer() }}\r\n </ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div #popoverArrow class=\"x-popover-portal-arrow\"></div>\r\n</div>\r\n", styles: ["x-popover{display:inline-block}.x-popover-portal{margin:0;padding:0}.x-popover-portal{display:inline-flex;position:relative;justify-content:center;align-items:center}.x-popover-portal>.x-popover-portal-inner{font-size:var(--x-font-size);background-color:var(--x-background-100);color:var(--x-text);padding:var(--x-font-size);border-radius:var(--x-border-radius);box-shadow:var(--x-box-shadow)}.x-popover-portal .x-popover-portal-title{margin-bottom:calc(var(--x-font-size) - .5rem);font-weight:600;display:flex;align-items:center}.x-popover-portal .x-popover-portal-footer{margin-top:calc(var(--x-font-size) - .5rem)}.x-popover-portal .x-popover-portal-arrow,.x-popover-portal .x-popover-portal-arrow:after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}.x-popover-portal-top,.x-popover-portal-top-start,.x-popover-portal-top-end{padding-bottom:.525rem}.x-popover-portal-top>.x-popover-portal-arrow,.x-popover-portal-top-start>.x-popover-portal-arrow,.x-popover-portal-top-end>.x-popover-portal-arrow{bottom:.1rem}.x-popover-portal-top .x-popover-portal-arrow:after,.x-popover-portal-top-start .x-popover-portal-arrow:after,.x-popover-portal-top-end .x-popover-portal-arrow:after{bottom:.1rem;margin-left:-.375rem}.x-popover-portal-left,.x-popover-portal-left-start,.x-popover-portal-left-end{padding-right:.525rem}.x-popover-portal-left>.x-popover-portal-arrow,.x-popover-portal-left-start>.x-popover-portal-arrow,.x-popover-portal-left-end>.x-popover-portal-arrow{right:.1rem}.x-popover-portal-left .x-popover-portal-arrow:after,.x-popover-portal-left-start .x-popover-portal-arrow:after,.x-popover-portal-left-end .x-popover-portal-arrow:after{right:.1rem;margin-top:-.375rem}.x-popover-portal-right,.x-popover-portal-right-start,.x-popover-portal-right-end{padding-left:.525rem}.x-popover-portal-right>.x-popover-portal-arrow,.x-popover-portal-right-start>.x-popover-portal-arrow,.x-popover-portal-right-end>.x-popover-portal-arrow{left:.1rem}.x-popover-portal-right .x-popover-portal-arrow:after,.x-popover-portal-right-start .x-popover-portal-arrow:after,.x-popover-portal-right-end .x-popover-portal-arrow:after{left:.1rem;margin-top:-.375rem}.x-popover-portal-bottom,.x-popover-portal-bottom-start,.x-popover-portal-bottom-end{padding-top:.525rem}.x-popover-portal-bottom .x-popover-portal-arrow,.x-popover-portal-bottom-start .x-popover-portal-arrow,.x-popover-portal-bottom-end .x-popover-portal-arrow{top:.1rem}.x-popover-portal-bottom .x-popover-portal-arrow:after,.x-popover-portal-bottom-start .x-popover-portal-arrow:after,.x-popover-portal-bottom-end .x-popover-portal-arrow:after{top:.1rem;margin-left:-.375rem}\n"] }]
|
|
145
145
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], footer: [{ type: i0.Input, args: [{ isSignal: true, alias: "footer", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], trigger: [{ type: i0.Input, args: [{ isSignal: true, alias: "trigger", required: false }] }], placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], portalHover: [{ type: i0.Output, args: ["portalHover"] }], mouseenter: [{
|
|
@@ -307,10 +307,10 @@ class XPopoverDirective extends XPopoverProperty {
|
|
|
307
307
|
}
|
|
308
308
|
});
|
|
309
309
|
}
|
|
310
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
311
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.
|
|
310
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopoverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
311
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.1", type: XPopoverDirective, isStandalone: true, selector: "[x-popover], x-popover", host: { listeners: { "click": "click()", "mouseenter": "mouseenter()", "mouseleave": "mouseleave()", "focus": "focus()", "blur": "blur()" }, properties: { "class.x-popover-show": "this._show" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
|
|
312
312
|
}
|
|
313
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
313
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopoverDirective, decorators: [{
|
|
314
314
|
type: Directive,
|
|
315
315
|
args: [{ selector: `[${XPopoverPrefix}], ${XPopoverPrefix}` }]
|
|
316
316
|
}], ctorParameters: () => [], propDecorators: { _show: [{
|
|
@@ -334,11 +334,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImpor
|
|
|
334
334
|
}] } });
|
|
335
335
|
|
|
336
336
|
class XPopoverModule {
|
|
337
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
338
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
339
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
337
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
338
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: XPopoverModule, imports: [XPopoverDirective], exports: [XPopoverDirective] }); }
|
|
339
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopoverModule }); }
|
|
340
340
|
}
|
|
341
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
341
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPopoverModule, decorators: [{
|
|
342
342
|
type: NgModule,
|
|
343
343
|
args: [{
|
|
344
344
|
exports: [XPopoverDirective],
|
|
@@ -5,11 +5,11 @@ import { Overlay } from '@angular/cdk/overlay';
|
|
|
5
5
|
import { TemplatePortal, ComponentPortal } from '@angular/cdk/portal';
|
|
6
6
|
|
|
7
7
|
class XPortalModule {
|
|
8
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
9
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
10
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
8
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPortalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
9
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: XPortalModule }); }
|
|
10
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPortalModule }); }
|
|
11
11
|
}
|
|
12
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
12
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPortalModule, decorators: [{
|
|
13
13
|
type: NgModule,
|
|
14
14
|
args: [{
|
|
15
15
|
imports: [],
|
|
@@ -217,10 +217,10 @@ class XPortalService {
|
|
|
217
217
|
placement.forEach((place) => result.push(XPortalPlacement[place]));
|
|
218
218
|
return result;
|
|
219
219
|
}
|
|
220
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
221
|
-
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.
|
|
220
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPortalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
221
|
+
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPortalService, providedIn: 'root' }); }
|
|
222
222
|
}
|
|
223
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
223
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPortalService, decorators: [{
|
|
224
224
|
type: Injectable,
|
|
225
225
|
args: [{ providedIn: 'root' }]
|
|
226
226
|
}] });
|
|
@@ -114,10 +114,10 @@ class XProgressProperty extends XPropertyFunction(X_PROGRESS_CONFIG_NAME) {
|
|
|
114
114
|
*/
|
|
115
115
|
this.subsection = input(false, { ...(ngDevMode ? { debugName: "subsection" } : {}), transform: XToBoolean });
|
|
116
116
|
}
|
|
117
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
118
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
117
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XProgressProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
118
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: XProgressProperty, isStandalone: true, selector: "x-progress-property", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, percent: { classPropertyName: "percent", publicName: "percent", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, infoTpl: { classPropertyName: "infoTpl", publicName: "infoTpl", isSignal: true, isRequired: false, transformFunction: null }, info: { classPropertyName: "info", publicName: "info", isSignal: true, isRequired: false, transformFunction: null }, infoWidth: { classPropertyName: "infoWidth", publicName: "infoWidth", isSignal: true, isRequired: false, transformFunction: null }, inside: { classPropertyName: "inside", publicName: "inside", isSignal: true, isRequired: false, transformFunction: null }, format: { classPropertyName: "format", publicName: "format", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, railColor: { classPropertyName: "railColor", publicName: "railColor", isSignal: true, isRequired: false, transformFunction: null }, gradient: { classPropertyName: "gradient", publicName: "gradient", isSignal: true, isRequired: false, transformFunction: null }, steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: false, transformFunction: null }, stepWidth: { classPropertyName: "stepWidth", publicName: "stepWidth", isSignal: true, isRequired: false, transformFunction: null }, stepFlex: { classPropertyName: "stepFlex", publicName: "stepFlex", isSignal: true, isRequired: false, transformFunction: null }, thickness: { classPropertyName: "thickness", publicName: "thickness", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, notchAngle: { classPropertyName: "notchAngle", publicName: "notchAngle", isSignal: true, isRequired: false, transformFunction: null }, subsection: { classPropertyName: "subsection", publicName: "subsection", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
|
|
119
119
|
}
|
|
120
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
120
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XProgressProperty, decorators: [{
|
|
121
121
|
type: Component,
|
|
122
122
|
args: [{ selector: `${XProgressPrefix}-property`, template: '' }]
|
|
123
123
|
}], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], percent: [{ type: i0.Input, args: [{ isSignal: true, alias: "percent", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], infoTpl: [{ type: i0.Input, args: [{ isSignal: true, alias: "infoTpl", required: false }] }], info: [{ type: i0.Input, args: [{ isSignal: true, alias: "info", required: false }] }], infoWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "infoWidth", required: false }] }], inside: [{ type: i0.Input, args: [{ isSignal: true, alias: "inside", required: false }] }], format: [{ type: i0.Input, args: [{ isSignal: true, alias: "format", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], railColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "railColor", required: false }] }], gradient: [{ type: i0.Input, args: [{ isSignal: true, alias: "gradient", required: false }] }], steps: [{ type: i0.Input, args: [{ isSignal: true, alias: "steps", required: false }] }], stepWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepWidth", required: false }] }], stepFlex: [{ type: i0.Input, args: [{ isSignal: true, alias: "stepFlex", required: false }] }], thickness: [{ type: i0.Input, args: [{ isSignal: true, alias: "thickness", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], notchAngle: [{ type: i0.Input, args: [{ isSignal: true, alias: "notchAngle", required: false }] }], subsection: [{ type: i0.Input, args: [{ isSignal: true, alias: "subsection", required: false }] }] } });
|
|
@@ -347,20 +347,20 @@ class XProgressComponent extends XProgressProperty {
|
|
|
347
347
|
}
|
|
348
348
|
return '';
|
|
349
349
|
}
|
|
350
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
351
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
350
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XProgressComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
351
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: XProgressComponent, isStandalone: true, selector: "x-progress", usesInheritance: true, ngImport: i0, template: "<div\r\n class=\"x-progress\"\r\n [ngClass]=\"classMap()\"\r\n [class.x-progress-steps]=\"stepsArray().length > 0\"\r\n [class.x-progress-steps-flex]=\"stepFlex()\"\r\n>\r\n @switch (type()) {\r\n @case ('circle') {\r\n <ng-container *ngTemplateOutlet=\"circleTpl\"> </ng-container>\r\n }\r\n @case ('dashboard') {\r\n <ng-container *ngTemplateOutlet=\"dashboardTpl\"> </ng-container>\r\n }\r\n @default {\r\n <ng-container *ngTemplateOutlet=\"lineTpl\"> </ng-container>\r\n }\r\n }\r\n</div>\r\n\r\n<ng-template #lineTpl>\r\n @if (stepsArray().length === 0) {\r\n <ng-container *ngTemplateOutlet=\"trackTpl\"></ng-container>\r\n }\r\n @if (stepsArray().length > 0) {\r\n <ng-container *ngTemplateOutlet=\"stepsTpl\"></ng-container>\r\n }\r\n @if (info() && !inside()) {\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #circleTpl>\r\n <div class=\"x-progress-ring\" [style.width]=\"size()\" [style.height]=\"size()\">\r\n <div\r\n class=\"x-progress-ring-rail\"\r\n [style.border-width]=\"thickness()\"\r\n [style.border-color]=\"currentRailColor()\"\r\n ></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"circleClipPath()\"\r\n [style.border-color]=\"currentColor()\"\r\n [style.border-width]=\"thickness()\"\r\n ></div>\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dashboardTpl>\r\n <div class=\"x-progress-ring\" [style.width]=\"size()\" [style.height]=\"size()\">\r\n <div\r\n class=\"x-progress-ring-rail\"\r\n [style.clip-path]=\"dashboardRailClipPath()\"\r\n [style.border-color]=\"currentRailColor()\"\r\n [style.border-width]=\"thickness()\"\r\n ></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"dashboardClipPath()\"\r\n [style.border-color]=\"currentColor()\"\r\n [style.border-width]=\"thickness()\"\r\n ></div>\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #trackTpl>\r\n <div class=\"x-progress-track\">\r\n <div\r\n class=\"x-progress-rail\"\r\n [class.x-progress-mask]=\"subsection()\"\r\n [style.background-color]=\"currentRailColor()\"\r\n [style.background-image]=\"subsection() ? subLinearGradient() : 'none'\"\r\n >\r\n <div\r\n class=\"x-progress-bg\"\r\n [style.width.%]=\"percent()\"\r\n [style.background-color]=\"currentColor()\"\r\n [style.background-image]=\"linearGradient()\"\r\n [style.height]=\"height()\"\r\n [style.line-height]=\"height()\"\r\n >\r\n @if (info() && inside()) {\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n }\r\n </div>\r\n @if (subsection()) {\r\n <div\r\n class=\"x-progress-bg-mask\"\r\n [style.width.%]=\"maskWidth()\"\r\n [style.height]=\"height()\"\r\n [style.line-height]=\"height()\"\r\n ></div>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #stepsTpl>\r\n @for (step of stepsArray(); track i; let i = $index) {\r\n <div\r\n class=\"x-progress-step\"\r\n [class.x-progress-step-active]=\"step\"\r\n [style.background-color]=\"step ? currentColor() : currentRailColor()\"\r\n [style.width]=\"stepWidth()\"\r\n [style.flex]=\"stepFlex() ? 1 : 'none'\"\r\n [style.height]=\"height()\"\r\n [style.line-height]=\"height()\"\r\n ></div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #textTpl>\r\n <span class=\"x-progress-text\" [style.width]=\"infoWidth()\">\r\n @if (infoTpl()) {\r\n <ng-container *ngTemplateOutlet=\"infoTpl()!; context: { $status: status(), $percent: percent() }\"> </ng-container>\r\n } @else {\r\n @switch (status()) {\r\n @case ('success') {\r\n <x-icon type=\"fto-check-circle\"></x-icon>\r\n }\r\n @case ('exception') {\r\n <x-icon type=\"fto-x-circle\"></x-icon>\r\n }\r\n @case ('warning') {\r\n <x-icon type=\"fto-help-circle\"></x-icon>\r\n }\r\n @default {\r\n @if (format()) {\r\n {{ format()!(percent()) }}\r\n } @else {\r\n {{ percent() }}%\r\n }\r\n }\r\n }\r\n }\r\n </span>\r\n</ng-template>\r\n", styles: ["@keyframes x-progress-active{0%{width:0;opacity:.1}20%{width:0;opacity:.5}to{width:100%;opacity:0}}x-progress{display:initial}.x-progress{margin:0;padding:0}.x-progress{display:inline-flex;align-items:center;width:100%}.x-progress-track{flex:1;display:inline-flex;align-items:center}.x-progress-rail{position:relative;display:inline-flex;width:100%;overflow:hidden;vertical-align:middle;background-color:var(--x-border-100);border-radius:var(--x-border-radius)}.x-progress-bg{position:relative;background-color:var(--x-primary);transition:width .3s cubic-bezier(.08,.82,.17,1) 0s;border-radius:var(--x-border-radius);text-align:right;color:#fff}.x-progress-bg>span{margin:0 .325rem}.x-progress-circle,.x-progress-dashboard,.x-progress-steps:not(.x-progress-steps-flex){width:initial}.x-progress-ring{position:relative;display:inline-flex;align-items:center;justify-content:center}.x-progress-ring-rail{position:absolute;width:100%;height:100%;border-style:solid;border-color:var(--x-border-100);border-radius:100%}.x-progress-ring-bg{position:absolute;width:100%;height:100%;border-style:solid;border-color:var(--x-primary);border-radius:100%;transition:clip-path .3s cubic-bezier(.08,.82,.17,1) 0s}.x-progress-ring .x-progress-text{margin-left:0;justify-content:center;font-size:var(--x-font-size-large)}.x-progress-mask .x-progress-bg{background:transparent}.x-progress-bg-mask{transition:width .3s cubic-bezier(.08,.82,.17,1) 0s;background-color:var(--x-border-100);border-top-right-radius:var(--x-border-radius);border-bottom-right-radius:var(--x-border-radius)}.x-progress-step{background-color:var(--x-border-100);border-radius:var(--x-border-radius)}.x-progress-step:not(:first-child){margin-left:.125rem}.x-progress-step-active{background-color:var(--x-primary)}.x-progress-text{margin-left:.5rem;display:inline-flex;align-items:center;white-space:nowrap}.x-progress-text x-icon{font-size:1.25rem}.x-progress-active .x-progress-bg:before{position:absolute;inset:0;background:var(--x-background-100);border-radius:var(--x-border-radius);opacity:0;animation:x-progress-active 2s cubic-bezier(.23,1,.32,1) infinite;content:\"\"}.x-progress-exception .x-progress-text{color:var(--x-danger)}.x-progress-exception .x-progress-bg,.x-progress-exception .x-progress-step-active{background-color:var(--x-danger)}.x-progress-exception .x-progress-ring-bg{border-color:var(--x-danger)}.x-progress-success .x-progress-text{color:var(--x-success)}.x-progress-success .x-progress-bg,.x-progress-success .x-progress-step-active{background-color:var(--x-success)}.x-progress-success .x-progress-ring-bg{border-color:var(--x-success)}.x-progress-warning .x-progress-text{color:var(--x-warning)}.x-progress-warning .x-progress-bg,.x-progress-warning .x-progress-step-active{background-color:var(--x-warning)}.x-progress-warning .x-progress-ring-bg{border-color:var(--x-warning)}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: XIconComponent, selector: "x-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
352
352
|
}
|
|
353
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
353
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XProgressComponent, decorators: [{
|
|
354
354
|
type: Component,
|
|
355
355
|
args: [{ selector: `${XProgressPrefix}`, imports: [NgClass, NgTemplateOutlet, FormsModule, XIconComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n class=\"x-progress\"\r\n [ngClass]=\"classMap()\"\r\n [class.x-progress-steps]=\"stepsArray().length > 0\"\r\n [class.x-progress-steps-flex]=\"stepFlex()\"\r\n>\r\n @switch (type()) {\r\n @case ('circle') {\r\n <ng-container *ngTemplateOutlet=\"circleTpl\"> </ng-container>\r\n }\r\n @case ('dashboard') {\r\n <ng-container *ngTemplateOutlet=\"dashboardTpl\"> </ng-container>\r\n }\r\n @default {\r\n <ng-container *ngTemplateOutlet=\"lineTpl\"> </ng-container>\r\n }\r\n }\r\n</div>\r\n\r\n<ng-template #lineTpl>\r\n @if (stepsArray().length === 0) {\r\n <ng-container *ngTemplateOutlet=\"trackTpl\"></ng-container>\r\n }\r\n @if (stepsArray().length > 0) {\r\n <ng-container *ngTemplateOutlet=\"stepsTpl\"></ng-container>\r\n }\r\n @if (info() && !inside()) {\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #circleTpl>\r\n <div class=\"x-progress-ring\" [style.width]=\"size()\" [style.height]=\"size()\">\r\n <div\r\n class=\"x-progress-ring-rail\"\r\n [style.border-width]=\"thickness()\"\r\n [style.border-color]=\"currentRailColor()\"\r\n ></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"circleClipPath()\"\r\n [style.border-color]=\"currentColor()\"\r\n [style.border-width]=\"thickness()\"\r\n ></div>\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dashboardTpl>\r\n <div class=\"x-progress-ring\" [style.width]=\"size()\" [style.height]=\"size()\">\r\n <div\r\n class=\"x-progress-ring-rail\"\r\n [style.clip-path]=\"dashboardRailClipPath()\"\r\n [style.border-color]=\"currentRailColor()\"\r\n [style.border-width]=\"thickness()\"\r\n ></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"dashboardClipPath()\"\r\n [style.border-color]=\"currentColor()\"\r\n [style.border-width]=\"thickness()\"\r\n ></div>\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #trackTpl>\r\n <div class=\"x-progress-track\">\r\n <div\r\n class=\"x-progress-rail\"\r\n [class.x-progress-mask]=\"subsection()\"\r\n [style.background-color]=\"currentRailColor()\"\r\n [style.background-image]=\"subsection() ? subLinearGradient() : 'none'\"\r\n >\r\n <div\r\n class=\"x-progress-bg\"\r\n [style.width.%]=\"percent()\"\r\n [style.background-color]=\"currentColor()\"\r\n [style.background-image]=\"linearGradient()\"\r\n [style.height]=\"height()\"\r\n [style.line-height]=\"height()\"\r\n >\r\n @if (info() && inside()) {\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n }\r\n </div>\r\n @if (subsection()) {\r\n <div\r\n class=\"x-progress-bg-mask\"\r\n [style.width.%]=\"maskWidth()\"\r\n [style.height]=\"height()\"\r\n [style.line-height]=\"height()\"\r\n ></div>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #stepsTpl>\r\n @for (step of stepsArray(); track i; let i = $index) {\r\n <div\r\n class=\"x-progress-step\"\r\n [class.x-progress-step-active]=\"step\"\r\n [style.background-color]=\"step ? currentColor() : currentRailColor()\"\r\n [style.width]=\"stepWidth()\"\r\n [style.flex]=\"stepFlex() ? 1 : 'none'\"\r\n [style.height]=\"height()\"\r\n [style.line-height]=\"height()\"\r\n ></div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #textTpl>\r\n <span class=\"x-progress-text\" [style.width]=\"infoWidth()\">\r\n @if (infoTpl()) {\r\n <ng-container *ngTemplateOutlet=\"infoTpl()!; context: { $status: status(), $percent: percent() }\"> </ng-container>\r\n } @else {\r\n @switch (status()) {\r\n @case ('success') {\r\n <x-icon type=\"fto-check-circle\"></x-icon>\r\n }\r\n @case ('exception') {\r\n <x-icon type=\"fto-x-circle\"></x-icon>\r\n }\r\n @case ('warning') {\r\n <x-icon type=\"fto-help-circle\"></x-icon>\r\n }\r\n @default {\r\n @if (format()) {\r\n {{ format()!(percent()) }}\r\n } @else {\r\n {{ percent() }}%\r\n }\r\n }\r\n }\r\n }\r\n </span>\r\n</ng-template>\r\n", styles: ["@keyframes x-progress-active{0%{width:0;opacity:.1}20%{width:0;opacity:.5}to{width:100%;opacity:0}}x-progress{display:initial}.x-progress{margin:0;padding:0}.x-progress{display:inline-flex;align-items:center;width:100%}.x-progress-track{flex:1;display:inline-flex;align-items:center}.x-progress-rail{position:relative;display:inline-flex;width:100%;overflow:hidden;vertical-align:middle;background-color:var(--x-border-100);border-radius:var(--x-border-radius)}.x-progress-bg{position:relative;background-color:var(--x-primary);transition:width .3s cubic-bezier(.08,.82,.17,1) 0s;border-radius:var(--x-border-radius);text-align:right;color:#fff}.x-progress-bg>span{margin:0 .325rem}.x-progress-circle,.x-progress-dashboard,.x-progress-steps:not(.x-progress-steps-flex){width:initial}.x-progress-ring{position:relative;display:inline-flex;align-items:center;justify-content:center}.x-progress-ring-rail{position:absolute;width:100%;height:100%;border-style:solid;border-color:var(--x-border-100);border-radius:100%}.x-progress-ring-bg{position:absolute;width:100%;height:100%;border-style:solid;border-color:var(--x-primary);border-radius:100%;transition:clip-path .3s cubic-bezier(.08,.82,.17,1) 0s}.x-progress-ring .x-progress-text{margin-left:0;justify-content:center;font-size:var(--x-font-size-large)}.x-progress-mask .x-progress-bg{background:transparent}.x-progress-bg-mask{transition:width .3s cubic-bezier(.08,.82,.17,1) 0s;background-color:var(--x-border-100);border-top-right-radius:var(--x-border-radius);border-bottom-right-radius:var(--x-border-radius)}.x-progress-step{background-color:var(--x-border-100);border-radius:var(--x-border-radius)}.x-progress-step:not(:first-child){margin-left:.125rem}.x-progress-step-active{background-color:var(--x-primary)}.x-progress-text{margin-left:.5rem;display:inline-flex;align-items:center;white-space:nowrap}.x-progress-text x-icon{font-size:1.25rem}.x-progress-active .x-progress-bg:before{position:absolute;inset:0;background:var(--x-background-100);border-radius:var(--x-border-radius);opacity:0;animation:x-progress-active 2s cubic-bezier(.23,1,.32,1) infinite;content:\"\"}.x-progress-exception .x-progress-text{color:var(--x-danger)}.x-progress-exception .x-progress-bg,.x-progress-exception .x-progress-step-active{background-color:var(--x-danger)}.x-progress-exception .x-progress-ring-bg{border-color:var(--x-danger)}.x-progress-success .x-progress-text{color:var(--x-success)}.x-progress-success .x-progress-bg,.x-progress-success .x-progress-step-active{background-color:var(--x-success)}.x-progress-success .x-progress-ring-bg{border-color:var(--x-success)}.x-progress-warning .x-progress-text{color:var(--x-warning)}.x-progress-warning .x-progress-bg,.x-progress-warning .x-progress-step-active{background-color:var(--x-warning)}.x-progress-warning .x-progress-ring-bg{border-color:var(--x-warning)}\n"] }]
|
|
356
356
|
}] });
|
|
357
357
|
|
|
358
358
|
class XProgressModule {
|
|
359
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
360
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
361
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
359
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
360
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: XProgressModule, imports: [XProgressComponent], exports: [XProgressComponent] }); }
|
|
361
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XProgressModule, imports: [XProgressComponent] }); }
|
|
362
362
|
}
|
|
363
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
363
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XProgressModule, decorators: [{
|
|
364
364
|
type: NgModule,
|
|
365
365
|
args: [{
|
|
366
366
|
exports: [XProgressComponent],
|
|
@@ -44,10 +44,10 @@ class XPromptsProperty extends XPropertyFunction(X_PROPMTS_CONFIG_NAME) {
|
|
|
44
44
|
*/
|
|
45
45
|
this.itemClick = output();
|
|
46
46
|
}
|
|
47
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
48
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
47
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPromptsProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
48
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: XPromptsProperty, isStandalone: true, selector: "x-prompts-property", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, wrap: { classPropertyName: "wrap", publicName: "wrap", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
|
|
49
49
|
}
|
|
50
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
50
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPromptsProperty, decorators: [{
|
|
51
51
|
type: Component,
|
|
52
52
|
args: [{ selector: `${XPromptsPrefix}-property`, template: '' }]
|
|
53
53
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], vertical: [{ type: i0.Input, args: [{ isSignal: true, alias: "vertical", required: false }] }], wrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "wrap", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
|
|
@@ -74,20 +74,20 @@ class XPromptsComponent extends XPromptsProperty {
|
|
|
74
74
|
this.nodes.set(x);
|
|
75
75
|
});
|
|
76
76
|
}
|
|
77
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
78
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
77
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPromptsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
78
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: XPromptsComponent, isStandalone: true, selector: "x-prompts", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"x-prompts\" [class.x-prompts-vertical]=\"vertical()\" [class.x-prompts-wrap]=\"wrap()\">\r\n <div class=\"x-prompts-title\">\r\n <ng-container *xOutlet=\"title()\">{{ title() }}</ng-container>\r\n </div>\r\n <div class=\"x-prompts-list\">\r\n @for (item of nodes(); track item.id) {\r\n <div class=\"x-prompts-item\" [class.x-disabled]=\"item.disabled\" [style]=\"item.style\" (click)=\"onItemClick(item)\">\r\n @if (item.icon) {\r\n <div class=\"x-prompts-item-icon\">\r\n <x-icon [type]=\"item.icon\" [style]=\"item.iconStyle\"></x-icon>\r\n </div>\r\n }\r\n <div class=\"x-prompts-item-content\">\r\n @if (item.label) {\r\n <div class=\"x-prompts-item-label\" [class.x-prompts-item-only-label]=\"item.label && !item.description\">\r\n {{ item.label }}\r\n </div>\r\n }\r\n @if (item.description) {\r\n <div\r\n class=\"x-prompts-item-description\"\r\n [class.x-prompts-item-only-description]=\"!item.label && item.description\"\r\n >\r\n {{ item.description }}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: [".x-prompts{margin:0;padding:0}.x-prompts{width:100%}.x-prompts-title{color:var(--x-text-400);margin-bottom:.5rem}.x-prompts-list{display:flex;gap:.5rem;overflow-x:auto;scrollbar-width:none;list-style:none;padding-inline-start:0;margin-block:0;align-items:stretch}.x-prompts-vertical .x-prompts-list{flex-direction:column;align-items:flex-start}.x-prompts-wrap .x-prompts-list{flex-wrap:wrap}.x-prompts-item{flex:none;min-width:10rem;display:inline-flex;gap:.5rem;padding:.5rem 1rem;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius);transition:all var(--x-animation-duration-base);cursor:pointer}.x-prompts-item:hover:not(.x-disabled){background-color:var(--x-background-a200)}.x-prompts-item.x-disabled{cursor:default;background-color:var(--x-background-a300)}.x-prompts-item-content{flex:1;display:flex;flex-direction:column;gap:.25rem}.x-prompts-item-label{margin:0;font-weight:600}.x-prompts-item-description{color:var(--x-text-400)}.x-prompts-item-only-label{font-weight:500}.x-prompts-item-only-description{color:currentColor}\n"], dependencies: [{ kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { kind: "component", type: XIconComponent, selector: "x-icon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
79
79
|
}
|
|
80
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
80
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPromptsComponent, decorators: [{
|
|
81
81
|
type: Component,
|
|
82
82
|
args: [{ selector: 'x-prompts', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [XOutletDirective, XIconComponent], template: "<div class=\"x-prompts\" [class.x-prompts-vertical]=\"vertical()\" [class.x-prompts-wrap]=\"wrap()\">\r\n <div class=\"x-prompts-title\">\r\n <ng-container *xOutlet=\"title()\">{{ title() }}</ng-container>\r\n </div>\r\n <div class=\"x-prompts-list\">\r\n @for (item of nodes(); track item.id) {\r\n <div class=\"x-prompts-item\" [class.x-disabled]=\"item.disabled\" [style]=\"item.style\" (click)=\"onItemClick(item)\">\r\n @if (item.icon) {\r\n <div class=\"x-prompts-item-icon\">\r\n <x-icon [type]=\"item.icon\" [style]=\"item.iconStyle\"></x-icon>\r\n </div>\r\n }\r\n <div class=\"x-prompts-item-content\">\r\n @if (item.label) {\r\n <div class=\"x-prompts-item-label\" [class.x-prompts-item-only-label]=\"item.label && !item.description\">\r\n {{ item.label }}\r\n </div>\r\n }\r\n @if (item.description) {\r\n <div\r\n class=\"x-prompts-item-description\"\r\n [class.x-prompts-item-only-description]=\"!item.label && item.description\"\r\n >\r\n {{ item.description }}\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: [".x-prompts{margin:0;padding:0}.x-prompts{width:100%}.x-prompts-title{color:var(--x-text-400);margin-bottom:.5rem}.x-prompts-list{display:flex;gap:.5rem;overflow-x:auto;scrollbar-width:none;list-style:none;padding-inline-start:0;margin-block:0;align-items:stretch}.x-prompts-vertical .x-prompts-list{flex-direction:column;align-items:flex-start}.x-prompts-wrap .x-prompts-list{flex-wrap:wrap}.x-prompts-item{flex:none;min-width:10rem;display:inline-flex;gap:.5rem;padding:.5rem 1rem;border:var(--x-border-width) var(--x-border-style) var(--x-border);border-radius:var(--x-border-radius);transition:all var(--x-animation-duration-base);cursor:pointer}.x-prompts-item:hover:not(.x-disabled){background-color:var(--x-background-a200)}.x-prompts-item.x-disabled{cursor:default;background-color:var(--x-background-a300)}.x-prompts-item-content{flex:1;display:flex;flex-direction:column;gap:.25rem}.x-prompts-item-label{margin:0;font-weight:600}.x-prompts-item-description{color:var(--x-text-400)}.x-prompts-item-only-label{font-weight:500}.x-prompts-item-only-description{color:currentColor}\n"] }]
|
|
83
83
|
}] });
|
|
84
84
|
|
|
85
85
|
class XPromptsModule {
|
|
86
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
87
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
88
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
86
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPromptsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
87
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: XPromptsModule, imports: [XPromptsComponent], exports: [XPromptsComponent] }); }
|
|
88
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPromptsModule, imports: [XPromptsComponent] }); }
|
|
89
89
|
}
|
|
90
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
90
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XPromptsModule, decorators: [{
|
|
91
91
|
type: NgModule,
|
|
92
92
|
args: [{
|
|
93
93
|
exports: [XPromptsComponent],
|
|
@@ -118,10 +118,10 @@ class XRadioProperty extends XFormControlFunction(X_RADIO_CONFIG_NAME) {
|
|
|
118
118
|
*/
|
|
119
119
|
this.after = input(...(ngDevMode ? [undefined, { debugName: "after" }] : []));
|
|
120
120
|
}
|
|
121
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
122
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.
|
|
121
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XRadioProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
122
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: XRadioProperty, isStandalone: true, selector: "x-radio-property", inputs: { data: { classPropertyName: "data", publicName: "data", isSignal: true, isRequired: false, transformFunction: null }, button: { classPropertyName: "button", publicName: "button", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, tag: { classPropertyName: "tag", publicName: "tag", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, tagBordered: { classPropertyName: "tagBordered", publicName: "tagBordered", isSignal: true, isRequired: false, transformFunction: null }, tagDark: { classPropertyName: "tagDark", publicName: "tagDark", isSignal: true, isRequired: false, transformFunction: null }, allowCancel: { classPropertyName: "allowCancel", publicName: "allowCancel", isSignal: true, isRequired: false, transformFunction: null }, vertical: { classPropertyName: "vertical", publicName: "vertical", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelWidth: { classPropertyName: "labelWidth", publicName: "labelWidth", isSignal: true, isRequired: false, transformFunction: null }, labelAlign: { classPropertyName: "labelAlign", publicName: "labelAlign", isSignal: true, isRequired: false, transformFunction: null }, justify: { classPropertyName: "justify", publicName: "justify", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, direction: { classPropertyName: "direction", publicName: "direction", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, before: { classPropertyName: "before", publicName: "before", isSignal: true, isRequired: false, transformFunction: null }, after: { classPropertyName: "after", publicName: "after", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
|
|
123
123
|
}
|
|
124
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XRadioProperty, decorators: [{
|
|
125
125
|
type: Component,
|
|
126
126
|
args: [{ selector: `${XRadioPrefix}-property`, template: '' }]
|
|
127
127
|
}], propDecorators: { data: [{ type: i0.Input, args: [{ isSignal: true, alias: "data", required: false }] }], button: [{ type: i0.Input, args: [{ isSignal: true, alias: "button", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }], tag: [{ type: i0.Input, args: [{ isSignal: true, alias: "tag", required: false }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], tagBordered: [{ type: i0.Input, args: [{ isSignal: true, alias: "tagBordered", required: false }] }], tagDark: [{ type: i0.Input, args: [{ isSignal: true, alias: "tagDark", required: false }] }], allowCancel: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowCancel", required: false }] }], vertical: [{ type: i0.Input, args: [{ isSignal: true, alias: "vertical", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelWidth", required: false }] }], labelAlign: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelAlign", required: false }] }], justify: [{ type: i0.Input, args: [{ isSignal: true, alias: "justify", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], direction: [{ type: i0.Input, args: [{ isSignal: true, alias: "direction", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], before: [{ type: i0.Input, args: [{ isSignal: true, alias: "before", required: false }] }], after: [{ type: i0.Input, args: [{ isSignal: true, alias: "after", required: false }] }] } });
|
|
@@ -184,20 +184,20 @@ class XRadioComponent extends XRadioProperty {
|
|
|
184
184
|
this.nodes.set(x);
|
|
185
185
|
});
|
|
186
186
|
}
|
|
187
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
188
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: XRadioComponent, isStandalone: true, selector: "x-radio", providers: [XValueAccessor(XRadioComponent)], viewQueries: [{ propertyName: "radio", first: true, predicate: ["radio"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n #radio\r\n class=\"x-radio\"\r\n [ngClass]=\"classMap()\"\r\n [class.x-flex]=\"justify() || align() || direction()\"\r\n [class.x-disabled]=\"disabledComputed()\"\r\n [class.x-required]=\"requiredIsEmpty()\"\r\n [class.x-invalid]=\"invalid()\"\r\n [class.x-radio-button]=\"button()\"\r\n [class.x-radio-icon]=\"icon()\"\r\n [class.x-radio-vertical]=\"vertical()\"\r\n [class.x-radio-after]=\"after()\"\r\n [class.x-radio-before]=\"before()\"\r\n [class.x-radio-after-template]=\"afterIsTemplate()\"\r\n [class.x-radio-before-template]=\"beforeIsTemplate()\"\r\n>\r\n @if (label()) {\r\n <label\r\n [class.x-radio-label-required]=\"requiredComputed()\"\r\n [style.width]=\"labelWidth()\"\r\n [ngClass]=\"labelMapSignal()\"\r\n *xOutlet=\"label()\"\r\n >\r\n {{ label() }}\r\n </label>\r\n }\r\n <div class=\"x-radio-row\">\r\n @if (before()) {\r\n <div class=\"x-radio-row-before\">\r\n <ng-container *xOutlet=\"before()\">{{ before() }}</ng-container>\r\n </div>\r\n }\r\n <div class=\"x-radio-row-list\">\r\n @switch (radioType()) {\r\n @case ('initial') {\r\n @for (item of nodes(); track item.id) {\r\n <div\r\n class=\"x-radio-row-item\"\r\n [class.x-checked]=\"item.id === value()\"\r\n [class.x-disabled]=\"disabledComputed() || item.disabled\"\r\n (click)=\"radioClick($event, item)\"\r\n >\r\n <span class=\"x-radio-box\"></span>\r\n <span class=\"x-radio-label\">{{ item.label }}</span>\r\n </div>\r\n }\r\n }\r\n @case ('button') {\r\n <x-buttons boxShadow=\"false\">\r\n @for (item of nodes(); track item.id) {\r\n <x-button\r\n [icon]=\"item.icon!\"\r\n [size]=\"size()\"\r\n [type]=\"type()\"\r\n [activated]=\"item.id === value()\"\r\n [disabled]=\"disabledComputed() || item.disabled!\"\r\n attrType=\"button\"\r\n (click)=\"radioClick($event, item)\"\r\n plain\r\n >{{ item.label }}</x-button\r\n >\r\n }\r\n </x-buttons>\r\n }\r\n @case ('icon') {\r\n <x-buttons boxShadow=\"false\">\r\n @for (item of nodes(); track item.id) {\r\n <x-button\r\n [icon]=\"item.icon!\"\r\n [size]=\"size()\"\r\n [type]=\"type()\"\r\n [activated]=\"item.id === value()\"\r\n [disabled]=\"disabledComputed() || item.disabled!\"\r\n attrType=\"button\"\r\n (click)=\"radioClick($event, item)\"\r\n plain\r\n >{{ item.label }}</x-button\r\n >\r\n }\r\n </x-buttons>\r\n }\r\n @case ('tag') {\r\n @for (item of nodes(); track item.id) {\r\n <x-tag\r\n checked\r\n manual\r\n [type]=\"type()\"\r\n [size]=\"size()\"\r\n [bordered]=\"tagBordered()\"\r\n [dark]=\"tagDark()\"\r\n [disabled]=\"disabledComputed() || item.disabled!\"\r\n [selected]=\"value() === item.id\"\r\n (click)=\"radioClick($event, item)\"\r\n >{{ item.label }}</x-tag\r\n >\r\n }\r\n }\r\n }\r\n </div>\r\n @if (after()) {\r\n <div class=\"x-radio-row-after\">\r\n <ng-container *xOutlet=\"after()\">{{ after() }}</ng-container>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: [".x-radio{margin:0;padding:0}.x-radio{width:100%}.x-radio.x-flex{display:flex}.x-radio.x-justify-start{justify-content:flex-start}.x-radio.x-justify-center{justify-content:center}.x-radio.x-justify-end{justify-content:flex-end}.x-radio.x-justify-space-between{justify-content:space-between}.x-radio.x-justify-space-around{justify-content:space-around}.x-radio.x-align-start{align-items:flex-start}.x-radio.x-align-center{align-items:center}.x-radio.x-align-end{align-items:flex-end}.x-radio.x-direction-column{flex-direction:column}.x-radio.x-direction-column-reverse{flex-direction:column-reverse}.x-radio.x-direction-row{flex-direction:row}.x-radio.x-direction-row-reverse{flex-direction:row-reverse}.x-radio>label{display:inline-block;white-space:nowrap;height:var(--x-height-medium);line-height:var(--x-height-medium);position:relative;color:var(--x-text-300);font-weight:500}.x-radio>label.x-text-align-start{text-align:start}.x-radio>label.x-text-align-center{text-align:center}.x-radio>label.x-text-align-end{text-align:end}.x-radio-row{flex:1;display:flex;align-items:center;flex-wrap:wrap;height:var(--x-height-medium);line-height:var(--x-height-medium)}.x-radio-row .x-radio-row-before,.x-radio-row .x-radio-row-after{border-radius:var(--x-border-radius);background-color:var(--x-background-a200);padding:0 var(--x-padding-medium);height:var(--x-height-medium);line-height:var(--x-height-medium)}.x-radio-row-list{position:relative;display:inline-flex;align-items:center}.x-radio-row-list x-tag:not(:first-child){margin-left:var(--x-font-size)}.x-radio-row-item{position:relative;display:inline-flex;align-items:center;white-space:nowrap;outline:none;margin-right:var(--x-font-size);font-size:var(--x-font-size);cursor:pointer;transition:all .3s}.x-radio-row-item:hover{color:var(--x-primary)}.x-radio-row-item:hover .x-radio-box{border-color:var(--x-primary)}.x-radio-row-item:last-child{margin-right:0}.x-radio-row-item.x-checked .x-radio-box{border-color:var(--x-primary);border-width:.375rem}.x-radio-row-item.x-disabled{color:var(--x-text-400);cursor:not-allowed}.x-radio-row-item.x-disabled .x-radio-box{border-color:var(--x-border-a900);background-color:var(--x-border-300)}.x-radio-row-item.x-disabled .x-radio-box:after{background-color:var(--x-text-400)}.x-radio-button .x-radio-row-before,.x-radio-icon .x-radio-row-before{margin-right:0}.x-radio-button .x-radio-row-after,.x-radio-icon .x-radio-row-after{margin-left:0}.x-radio-vertical .x-radio-row-list{flex-direction:column;align-items:flex-start}.x-radio-vertical .x-radio-row-list x-tag{margin-left:0}.x-radio-vertical .x-radio-row-list x-tag:not(:first-child){margin-top:.25rem}.x-radio-vertical .x-radio-row-item{margin-right:0}.x-radio-vertical .x-radio-row-item:not(:first-child){margin-top:.25rem}.x-radio-box{border:var(--x-border-width) solid var(--x-border);border-radius:100%;width:calc(var(--x-height-medium) - .875rem);height:calc(var(--x-height-medium) - .875rem);background-color:var(--x-background-a100);position:relative;box-sizing:border-box;transition:all .2s;display:inline-flex;align-items:center;justify-content:center}.x-radio-box:hover{border-color:var(--x-primary)}.x-radio-label{margin-left:.325rem}.x-radio-label-required:before{display:inline-block;margin-right:.25rem;color:var(--x-danger);line-height:1;font-size:var(--x-font-size-small);content:\"*\"}.x-radio-before:not(.x-radio-before-template,.x-radio-button,.x-radio-icon) .x-radio-row-before{margin-right:var(--x-padding-medium)}.x-radio-before.x-radio-button .x-buttons:not(.x-buttons-space)>x-button:first-child .x-button,.x-radio-before.x-radio-icon .x-buttons:not(.x-buttons-space)>x-button:first-child .x-button{border-top-left-radius:0;border-bottom-left-radius:0}.x-radio-before.x-radio-button .x-radio-row-before,.x-radio-before.x-radio-icon .x-radio-row-before{margin-right:0;border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.x-radio-before-template .x-radio-row-before{display:contents}.x-radio-before-template .x-radio-row-list{margin-left:var(--x-padding-medium)}.x-radio-before-template.x-radio-button .x-radio-row-list,.x-radio-before-template.x-radio-icon .x-radio-row-list,.x-radio-before-template.x-radio-button .x-radio-row-list .x-button,.x-radio-before-template.x-radio-icon .x-radio-row-list .x-button{margin-left:0}.x-radio-before-template.x-radio-button .x-radio-row-before input,.x-radio-before-template.x-radio-button .x-radio-row-before .x-button,.x-radio-before-template.x-radio-icon .x-radio-row-before input,.x-radio-before-template.x-radio-icon .x-radio-row-before .x-button{border-top-right-radius:0;border-bottom-right-radius:0}.x-radio-after:not(.x-radio-before-template,.x-radio-button,.x-radio-icon) .x-radio-row-after{margin-left:var(--x-padding-medium)}.x-radio-after.x-radio-button .x-buttons:not(.x-buttons-space)>x-button:last-child .x-button,.x-radio-after.x-radio-icon .x-buttons:not(.x-buttons-space)>x-button:last-child .x-button{border-top-right-radius:0;border-bottom-right-radius:0}.x-radio-after.x-radio-button .x-radio-row-after,.x-radio-after.x-radio-icon .x-radio-row-after{margin-left:0;border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.x-radio-after-template .x-radio-row-after{display:contents}.x-radio-after-template .x-radio-row-list{margin-right:var(--x-padding-medium)}.x-radio-after-template.x-radio-button .x-radio-row-list,.x-radio-after-template.x-radio-icon .x-radio-row-list,.x-radio-after-template.x-radio-button .x-radio-row-list .x-button,.x-radio-after-template.x-radio-icon .x-radio-row-list .x-button{margin-right:0}.x-radio-after-template.x-radio-button .x-radio-row-after input,.x-radio-after-template.x-radio-button .x-radio-row-after .x-button,.x-radio-after-template.x-radio-icon .x-radio-row-after input,.x-radio-after-template.x-radio-icon .x-radio-row-after .x-button{border-top-left-radius:0;border-bottom-left-radius:0}.x-radio.x-disabled .x-radio-item{color:var(--x-text-400);cursor:not-allowed}.x-radio.x-disabled .x-radio-item .x-radio-box{border-color:var(--x-border-a900);background-color:var(--x-border-300)}.x-radio.x-disabled .x-radio-item .x-radio-box:after{background-color:var(--x-text-400)}.x-radio.x-invalid>label,.x-radio.x-required>label{color:var(--x-danger)}.x-radio.x-direction-row>label{padding:0 .5rem 0 0}.x-radio.x-direction-row-reverse>label{padding:0 0 0 .5rem}.x-radio.x-direction-column,.x-radio.x-direction-column-reverse{align-items:inherit}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "component", type: XButtonsComponent, selector: "x-buttons" }, { kind: "component", type: XTagComponent, selector: "x-tag" }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
187
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XRadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
188
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.1", type: XRadioComponent, isStandalone: true, selector: "x-radio", providers: [XValueAccessor(XRadioComponent)], viewQueries: [{ propertyName: "radio", first: true, predicate: ["radio"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n #radio\r\n class=\"x-radio\"\r\n [ngClass]=\"classMap()\"\r\n [class.x-flex]=\"justify() || align() || direction()\"\r\n [class.x-disabled]=\"disabledComputed()\"\r\n [class.x-required]=\"requiredIsEmpty()\"\r\n [class.x-invalid]=\"invalid()\"\r\n [class.x-radio-button]=\"button()\"\r\n [class.x-radio-icon]=\"icon()\"\r\n [class.x-radio-vertical]=\"vertical()\"\r\n [class.x-radio-after]=\"after()\"\r\n [class.x-radio-before]=\"before()\"\r\n [class.x-radio-after-template]=\"afterIsTemplate()\"\r\n [class.x-radio-before-template]=\"beforeIsTemplate()\"\r\n>\r\n @if (label()) {\r\n <label\r\n [class.x-radio-label-required]=\"requiredComputed()\"\r\n [style.width]=\"labelWidth()\"\r\n [ngClass]=\"labelMapSignal()\"\r\n *xOutlet=\"label()\"\r\n >\r\n {{ label() }}\r\n </label>\r\n }\r\n <div class=\"x-radio-row\">\r\n @if (before()) {\r\n <div class=\"x-radio-row-before\">\r\n <ng-container *xOutlet=\"before()\">{{ before() }}</ng-container>\r\n </div>\r\n }\r\n <div class=\"x-radio-row-list\">\r\n @switch (radioType()) {\r\n @case ('initial') {\r\n @for (item of nodes(); track item.id) {\r\n <div\r\n class=\"x-radio-row-item\"\r\n [class.x-checked]=\"item.id === value()\"\r\n [class.x-disabled]=\"disabledComputed() || item.disabled\"\r\n (click)=\"radioClick($event, item)\"\r\n >\r\n <span class=\"x-radio-box\"></span>\r\n <span class=\"x-radio-label\">{{ item.label }}</span>\r\n </div>\r\n }\r\n }\r\n @case ('button') {\r\n <x-buttons boxShadow=\"false\">\r\n @for (item of nodes(); track item.id) {\r\n <x-button\r\n [icon]=\"item.icon!\"\r\n [size]=\"size()\"\r\n [type]=\"type()\"\r\n [activated]=\"item.id === value()\"\r\n [disabled]=\"disabledComputed() || item.disabled!\"\r\n attrType=\"button\"\r\n (click)=\"radioClick($event, item)\"\r\n plain\r\n >{{ item.label }}</x-button\r\n >\r\n }\r\n </x-buttons>\r\n }\r\n @case ('icon') {\r\n <x-buttons boxShadow=\"false\">\r\n @for (item of nodes(); track item.id) {\r\n <x-button\r\n [icon]=\"item.icon!\"\r\n [size]=\"size()\"\r\n [type]=\"type()\"\r\n [activated]=\"item.id === value()\"\r\n [disabled]=\"disabledComputed() || item.disabled!\"\r\n attrType=\"button\"\r\n (click)=\"radioClick($event, item)\"\r\n plain\r\n >{{ item.label }}</x-button\r\n >\r\n }\r\n </x-buttons>\r\n }\r\n @case ('tag') {\r\n @for (item of nodes(); track item.id) {\r\n <x-tag\r\n checked\r\n manual\r\n [type]=\"type()\"\r\n [size]=\"size()\"\r\n [bordered]=\"tagBordered()\"\r\n [dark]=\"tagDark()\"\r\n [disabled]=\"disabledComputed() || item.disabled!\"\r\n [selected]=\"value() === item.id\"\r\n (click)=\"radioClick($event, item)\"\r\n >{{ item.label }}</x-tag\r\n >\r\n }\r\n }\r\n }\r\n </div>\r\n @if (after()) {\r\n <div class=\"x-radio-row-after\">\r\n <ng-container *xOutlet=\"after()\">{{ after() }}</ng-container>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: [".x-radio{margin:0;padding:0}.x-radio{width:100%}.x-radio.x-flex{display:flex}.x-radio.x-justify-start{justify-content:flex-start}.x-radio.x-justify-center{justify-content:center}.x-radio.x-justify-end{justify-content:flex-end}.x-radio.x-justify-space-between{justify-content:space-between}.x-radio.x-justify-space-around{justify-content:space-around}.x-radio.x-align-start{align-items:flex-start}.x-radio.x-align-center{align-items:center}.x-radio.x-align-end{align-items:flex-end}.x-radio.x-direction-column{flex-direction:column}.x-radio.x-direction-column-reverse{flex-direction:column-reverse}.x-radio.x-direction-row{flex-direction:row}.x-radio.x-direction-row-reverse{flex-direction:row-reverse}.x-radio>label{display:inline-block;white-space:nowrap;height:var(--x-height-medium);line-height:var(--x-height-medium);position:relative;color:var(--x-text-300);font-weight:500}.x-radio>label.x-text-align-start{text-align:start}.x-radio>label.x-text-align-center{text-align:center}.x-radio>label.x-text-align-end{text-align:end}.x-radio-row{flex:1;display:flex;align-items:center;flex-wrap:wrap;height:var(--x-height-medium);line-height:var(--x-height-medium)}.x-radio-row .x-radio-row-before,.x-radio-row .x-radio-row-after{border-radius:var(--x-border-radius);background-color:var(--x-background-a200);padding:0 var(--x-padding-medium);height:var(--x-height-medium);line-height:var(--x-height-medium)}.x-radio-row-list{position:relative;display:inline-flex;align-items:center}.x-radio-row-list x-tag:not(:first-child){margin-left:var(--x-font-size)}.x-radio-row-item{position:relative;display:inline-flex;align-items:center;white-space:nowrap;outline:none;margin-right:var(--x-font-size);font-size:var(--x-font-size);cursor:pointer;transition:all .3s}.x-radio-row-item:hover{color:var(--x-primary)}.x-radio-row-item:hover .x-radio-box{border-color:var(--x-primary)}.x-radio-row-item:last-child{margin-right:0}.x-radio-row-item.x-checked .x-radio-box{border-color:var(--x-primary);border-width:.375rem}.x-radio-row-item.x-disabled{color:var(--x-text-400);cursor:not-allowed}.x-radio-row-item.x-disabled .x-radio-box{border-color:var(--x-border-a900);background-color:var(--x-border-300)}.x-radio-row-item.x-disabled .x-radio-box:after{background-color:var(--x-text-400)}.x-radio-button .x-radio-row-before,.x-radio-icon .x-radio-row-before{margin-right:0}.x-radio-button .x-radio-row-after,.x-radio-icon .x-radio-row-after{margin-left:0}.x-radio-vertical .x-radio-row-list{flex-direction:column;align-items:flex-start}.x-radio-vertical .x-radio-row-list x-tag{margin-left:0}.x-radio-vertical .x-radio-row-list x-tag:not(:first-child){margin-top:.25rem}.x-radio-vertical .x-radio-row-item{margin-right:0}.x-radio-vertical .x-radio-row-item:not(:first-child){margin-top:.25rem}.x-radio-box{border:var(--x-border-width) solid var(--x-border);border-radius:100%;width:calc(var(--x-height-medium) - .875rem);height:calc(var(--x-height-medium) - .875rem);background-color:var(--x-background-a100);position:relative;box-sizing:border-box;transition:all .2s;display:inline-flex;align-items:center;justify-content:center}.x-radio-box:hover{border-color:var(--x-primary)}.x-radio-label{margin-left:.325rem}.x-radio-label-required:before{display:inline-block;margin-right:.25rem;color:var(--x-danger);line-height:1;font-size:var(--x-font-size-small);content:\"*\"}.x-radio-before:not(.x-radio-before-template,.x-radio-button,.x-radio-icon) .x-radio-row-before{margin-right:var(--x-padding-medium)}.x-radio-before.x-radio-button .x-buttons:not(.x-buttons-space)>x-button:first-child .x-button,.x-radio-before.x-radio-icon .x-buttons:not(.x-buttons-space)>x-button:first-child .x-button{border-top-left-radius:0;border-bottom-left-radius:0}.x-radio-before.x-radio-button .x-radio-row-before,.x-radio-before.x-radio-icon .x-radio-row-before{margin-right:0;border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.x-radio-before-template .x-radio-row-before{display:contents}.x-radio-before-template .x-radio-row-list{margin-left:var(--x-padding-medium)}.x-radio-before-template.x-radio-button .x-radio-row-list,.x-radio-before-template.x-radio-icon .x-radio-row-list,.x-radio-before-template.x-radio-button .x-radio-row-list .x-button,.x-radio-before-template.x-radio-icon .x-radio-row-list .x-button{margin-left:0}.x-radio-before-template.x-radio-button .x-radio-row-before input,.x-radio-before-template.x-radio-button .x-radio-row-before .x-button,.x-radio-before-template.x-radio-icon .x-radio-row-before input,.x-radio-before-template.x-radio-icon .x-radio-row-before .x-button{border-top-right-radius:0;border-bottom-right-radius:0}.x-radio-after:not(.x-radio-before-template,.x-radio-button,.x-radio-icon) .x-radio-row-after{margin-left:var(--x-padding-medium)}.x-radio-after.x-radio-button .x-buttons:not(.x-buttons-space)>x-button:last-child .x-button,.x-radio-after.x-radio-icon .x-buttons:not(.x-buttons-space)>x-button:last-child .x-button{border-top-right-radius:0;border-bottom-right-radius:0}.x-radio-after.x-radio-button .x-radio-row-after,.x-radio-after.x-radio-icon .x-radio-row-after{margin-left:0;border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.x-radio-after-template .x-radio-row-after{display:contents}.x-radio-after-template .x-radio-row-list{margin-right:var(--x-padding-medium)}.x-radio-after-template.x-radio-button .x-radio-row-list,.x-radio-after-template.x-radio-icon .x-radio-row-list,.x-radio-after-template.x-radio-button .x-radio-row-list .x-button,.x-radio-after-template.x-radio-icon .x-radio-row-list .x-button{margin-right:0}.x-radio-after-template.x-radio-button .x-radio-row-after input,.x-radio-after-template.x-radio-button .x-radio-row-after .x-button,.x-radio-after-template.x-radio-icon .x-radio-row-after input,.x-radio-after-template.x-radio-icon .x-radio-row-after .x-button{border-top-left-radius:0;border-bottom-left-radius:0}.x-radio.x-disabled .x-radio-item{color:var(--x-text-400);cursor:not-allowed}.x-radio.x-disabled .x-radio-item .x-radio-box{border-color:var(--x-border-a900);background-color:var(--x-border-300)}.x-radio.x-disabled .x-radio-item .x-radio-box:after{background-color:var(--x-text-400)}.x-radio.x-invalid>label,.x-radio.x-required>label{color:var(--x-danger)}.x-radio.x-direction-row>label{padding:0 .5rem 0 0}.x-radio.x-direction-row-reverse>label{padding:0 0 0 .5rem}.x-radio.x-direction-column,.x-radio.x-direction-column-reverse{align-items:inherit}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: XButtonComponent, selector: "x-button" }, { kind: "component", type: XButtonsComponent, selector: "x-buttons" }, { kind: "component", type: XTagComponent, selector: "x-tag" }, { kind: "directive", type: XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
189
189
|
}
|
|
190
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
190
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XRadioComponent, decorators: [{
|
|
191
191
|
type: Component,
|
|
192
192
|
args: [{ selector: `${XRadioPrefix}`, imports: [NgClass, FormsModule, XButtonComponent, XButtonsComponent, XTagComponent, XOutletDirective], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [XValueAccessor(XRadioComponent)], template: "<div\r\n #radio\r\n class=\"x-radio\"\r\n [ngClass]=\"classMap()\"\r\n [class.x-flex]=\"justify() || align() || direction()\"\r\n [class.x-disabled]=\"disabledComputed()\"\r\n [class.x-required]=\"requiredIsEmpty()\"\r\n [class.x-invalid]=\"invalid()\"\r\n [class.x-radio-button]=\"button()\"\r\n [class.x-radio-icon]=\"icon()\"\r\n [class.x-radio-vertical]=\"vertical()\"\r\n [class.x-radio-after]=\"after()\"\r\n [class.x-radio-before]=\"before()\"\r\n [class.x-radio-after-template]=\"afterIsTemplate()\"\r\n [class.x-radio-before-template]=\"beforeIsTemplate()\"\r\n>\r\n @if (label()) {\r\n <label\r\n [class.x-radio-label-required]=\"requiredComputed()\"\r\n [style.width]=\"labelWidth()\"\r\n [ngClass]=\"labelMapSignal()\"\r\n *xOutlet=\"label()\"\r\n >\r\n {{ label() }}\r\n </label>\r\n }\r\n <div class=\"x-radio-row\">\r\n @if (before()) {\r\n <div class=\"x-radio-row-before\">\r\n <ng-container *xOutlet=\"before()\">{{ before() }}</ng-container>\r\n </div>\r\n }\r\n <div class=\"x-radio-row-list\">\r\n @switch (radioType()) {\r\n @case ('initial') {\r\n @for (item of nodes(); track item.id) {\r\n <div\r\n class=\"x-radio-row-item\"\r\n [class.x-checked]=\"item.id === value()\"\r\n [class.x-disabled]=\"disabledComputed() || item.disabled\"\r\n (click)=\"radioClick($event, item)\"\r\n >\r\n <span class=\"x-radio-box\"></span>\r\n <span class=\"x-radio-label\">{{ item.label }}</span>\r\n </div>\r\n }\r\n }\r\n @case ('button') {\r\n <x-buttons boxShadow=\"false\">\r\n @for (item of nodes(); track item.id) {\r\n <x-button\r\n [icon]=\"item.icon!\"\r\n [size]=\"size()\"\r\n [type]=\"type()\"\r\n [activated]=\"item.id === value()\"\r\n [disabled]=\"disabledComputed() || item.disabled!\"\r\n attrType=\"button\"\r\n (click)=\"radioClick($event, item)\"\r\n plain\r\n >{{ item.label }}</x-button\r\n >\r\n }\r\n </x-buttons>\r\n }\r\n @case ('icon') {\r\n <x-buttons boxShadow=\"false\">\r\n @for (item of nodes(); track item.id) {\r\n <x-button\r\n [icon]=\"item.icon!\"\r\n [size]=\"size()\"\r\n [type]=\"type()\"\r\n [activated]=\"item.id === value()\"\r\n [disabled]=\"disabledComputed() || item.disabled!\"\r\n attrType=\"button\"\r\n (click)=\"radioClick($event, item)\"\r\n plain\r\n >{{ item.label }}</x-button\r\n >\r\n }\r\n </x-buttons>\r\n }\r\n @case ('tag') {\r\n @for (item of nodes(); track item.id) {\r\n <x-tag\r\n checked\r\n manual\r\n [type]=\"type()\"\r\n [size]=\"size()\"\r\n [bordered]=\"tagBordered()\"\r\n [dark]=\"tagDark()\"\r\n [disabled]=\"disabledComputed() || item.disabled!\"\r\n [selected]=\"value() === item.id\"\r\n (click)=\"radioClick($event, item)\"\r\n >{{ item.label }}</x-tag\r\n >\r\n }\r\n }\r\n }\r\n </div>\r\n @if (after()) {\r\n <div class=\"x-radio-row-after\">\r\n <ng-container *xOutlet=\"after()\">{{ after() }}</ng-container>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: [".x-radio{margin:0;padding:0}.x-radio{width:100%}.x-radio.x-flex{display:flex}.x-radio.x-justify-start{justify-content:flex-start}.x-radio.x-justify-center{justify-content:center}.x-radio.x-justify-end{justify-content:flex-end}.x-radio.x-justify-space-between{justify-content:space-between}.x-radio.x-justify-space-around{justify-content:space-around}.x-radio.x-align-start{align-items:flex-start}.x-radio.x-align-center{align-items:center}.x-radio.x-align-end{align-items:flex-end}.x-radio.x-direction-column{flex-direction:column}.x-radio.x-direction-column-reverse{flex-direction:column-reverse}.x-radio.x-direction-row{flex-direction:row}.x-radio.x-direction-row-reverse{flex-direction:row-reverse}.x-radio>label{display:inline-block;white-space:nowrap;height:var(--x-height-medium);line-height:var(--x-height-medium);position:relative;color:var(--x-text-300);font-weight:500}.x-radio>label.x-text-align-start{text-align:start}.x-radio>label.x-text-align-center{text-align:center}.x-radio>label.x-text-align-end{text-align:end}.x-radio-row{flex:1;display:flex;align-items:center;flex-wrap:wrap;height:var(--x-height-medium);line-height:var(--x-height-medium)}.x-radio-row .x-radio-row-before,.x-radio-row .x-radio-row-after{border-radius:var(--x-border-radius);background-color:var(--x-background-a200);padding:0 var(--x-padding-medium);height:var(--x-height-medium);line-height:var(--x-height-medium)}.x-radio-row-list{position:relative;display:inline-flex;align-items:center}.x-radio-row-list x-tag:not(:first-child){margin-left:var(--x-font-size)}.x-radio-row-item{position:relative;display:inline-flex;align-items:center;white-space:nowrap;outline:none;margin-right:var(--x-font-size);font-size:var(--x-font-size);cursor:pointer;transition:all .3s}.x-radio-row-item:hover{color:var(--x-primary)}.x-radio-row-item:hover .x-radio-box{border-color:var(--x-primary)}.x-radio-row-item:last-child{margin-right:0}.x-radio-row-item.x-checked .x-radio-box{border-color:var(--x-primary);border-width:.375rem}.x-radio-row-item.x-disabled{color:var(--x-text-400);cursor:not-allowed}.x-radio-row-item.x-disabled .x-radio-box{border-color:var(--x-border-a900);background-color:var(--x-border-300)}.x-radio-row-item.x-disabled .x-radio-box:after{background-color:var(--x-text-400)}.x-radio-button .x-radio-row-before,.x-radio-icon .x-radio-row-before{margin-right:0}.x-radio-button .x-radio-row-after,.x-radio-icon .x-radio-row-after{margin-left:0}.x-radio-vertical .x-radio-row-list{flex-direction:column;align-items:flex-start}.x-radio-vertical .x-radio-row-list x-tag{margin-left:0}.x-radio-vertical .x-radio-row-list x-tag:not(:first-child){margin-top:.25rem}.x-radio-vertical .x-radio-row-item{margin-right:0}.x-radio-vertical .x-radio-row-item:not(:first-child){margin-top:.25rem}.x-radio-box{border:var(--x-border-width) solid var(--x-border);border-radius:100%;width:calc(var(--x-height-medium) - .875rem);height:calc(var(--x-height-medium) - .875rem);background-color:var(--x-background-a100);position:relative;box-sizing:border-box;transition:all .2s;display:inline-flex;align-items:center;justify-content:center}.x-radio-box:hover{border-color:var(--x-primary)}.x-radio-label{margin-left:.325rem}.x-radio-label-required:before{display:inline-block;margin-right:.25rem;color:var(--x-danger);line-height:1;font-size:var(--x-font-size-small);content:\"*\"}.x-radio-before:not(.x-radio-before-template,.x-radio-button,.x-radio-icon) .x-radio-row-before{margin-right:var(--x-padding-medium)}.x-radio-before.x-radio-button .x-buttons:not(.x-buttons-space)>x-button:first-child .x-button,.x-radio-before.x-radio-icon .x-buttons:not(.x-buttons-space)>x-button:first-child .x-button{border-top-left-radius:0;border-bottom-left-radius:0}.x-radio-before.x-radio-button .x-radio-row-before,.x-radio-before.x-radio-icon .x-radio-row-before{margin-right:0;border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.x-radio-before-template .x-radio-row-before{display:contents}.x-radio-before-template .x-radio-row-list{margin-left:var(--x-padding-medium)}.x-radio-before-template.x-radio-button .x-radio-row-list,.x-radio-before-template.x-radio-icon .x-radio-row-list,.x-radio-before-template.x-radio-button .x-radio-row-list .x-button,.x-radio-before-template.x-radio-icon .x-radio-row-list .x-button{margin-left:0}.x-radio-before-template.x-radio-button .x-radio-row-before input,.x-radio-before-template.x-radio-button .x-radio-row-before .x-button,.x-radio-before-template.x-radio-icon .x-radio-row-before input,.x-radio-before-template.x-radio-icon .x-radio-row-before .x-button{border-top-right-radius:0;border-bottom-right-radius:0}.x-radio-after:not(.x-radio-before-template,.x-radio-button,.x-radio-icon) .x-radio-row-after{margin-left:var(--x-padding-medium)}.x-radio-after.x-radio-button .x-buttons:not(.x-buttons-space)>x-button:last-child .x-button,.x-radio-after.x-radio-icon .x-buttons:not(.x-buttons-space)>x-button:last-child .x-button{border-top-right-radius:0;border-bottom-right-radius:0}.x-radio-after.x-radio-button .x-radio-row-after,.x-radio-after.x-radio-icon .x-radio-row-after{margin-left:0;border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.x-radio-after-template .x-radio-row-after{display:contents}.x-radio-after-template .x-radio-row-list{margin-right:var(--x-padding-medium)}.x-radio-after-template.x-radio-button .x-radio-row-list,.x-radio-after-template.x-radio-icon .x-radio-row-list,.x-radio-after-template.x-radio-button .x-radio-row-list .x-button,.x-radio-after-template.x-radio-icon .x-radio-row-list .x-button{margin-right:0}.x-radio-after-template.x-radio-button .x-radio-row-after input,.x-radio-after-template.x-radio-button .x-radio-row-after .x-button,.x-radio-after-template.x-radio-icon .x-radio-row-after input,.x-radio-after-template.x-radio-icon .x-radio-row-after .x-button{border-top-left-radius:0;border-bottom-left-radius:0}.x-radio.x-disabled .x-radio-item{color:var(--x-text-400);cursor:not-allowed}.x-radio.x-disabled .x-radio-item .x-radio-box{border-color:var(--x-border-a900);background-color:var(--x-border-300)}.x-radio.x-disabled .x-radio-item .x-radio-box:after{background-color:var(--x-text-400)}.x-radio.x-invalid>label,.x-radio.x-required>label{color:var(--x-danger)}.x-radio.x-direction-row>label{padding:0 .5rem 0 0}.x-radio.x-direction-row-reverse>label{padding:0 0 0 .5rem}.x-radio.x-direction-column,.x-radio.x-direction-column-reverse{align-items:inherit}\n"] }]
|
|
193
193
|
}], propDecorators: { radio: [{ type: i0.ViewChild, args: ['radio', { ...{ read: (ElementRef) }, isSignal: true }] }] } });
|
|
194
194
|
|
|
195
195
|
class XRadioModule {
|
|
196
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
197
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.
|
|
198
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.
|
|
196
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XRadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
197
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: XRadioModule, imports: [XRadioComponent], exports: [XRadioComponent] }); }
|
|
198
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XRadioModule, imports: [XRadioComponent] }); }
|
|
199
199
|
}
|
|
200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
200
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XRadioModule, decorators: [{
|
|
201
201
|
type: NgModule,
|
|
202
202
|
args: [{
|
|
203
203
|
exports: [XRadioComponent],
|