@ng-nest/ui 20.1.0 → 20.1.1
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/auto-complete/index.d.ts +3 -3
- package/avatar/index.d.ts +64 -2
- package/bubble/index.d.ts +170 -0
- package/calendar/index.d.ts +2 -1
- package/cascade/index.d.ts +3 -3
- package/checkbox/index.d.ts +1 -1
- package/color-picker/index.d.ts +3 -3
- package/core/index.d.ts +16 -4
- package/date-picker/index.d.ts +4 -4
- package/dropdown/index.d.ts +4 -4
- 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-auto-complete.mjs +13 -13
- package/fesm2022/ng-nest-ui-avatar.mjs +28 -16
- package/fesm2022/ng-nest-ui-avatar.mjs.map +1 -1
- 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 +7 -7
- package/fesm2022/ng-nest-ui-bubble.mjs +350 -0
- package/fesm2022/ng-nest-ui-bubble.mjs.map +1 -0
- 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 +13 -13
- 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 +16 -16
- 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 +21 -18
- package/fesm2022/ng-nest-ui-core.mjs.map +1 -1
- package/fesm2022/ng-nest-ui-crumb.mjs +10 -10
- package/fesm2022/ng-nest-ui-date-picker.mjs +49 -49
- package/fesm2022/ng-nest-ui-description.mjs +16 -16
- package/fesm2022/ng-nest-ui-dialog.mjs +40 -40
- 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-form.mjs +16 -16
- 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 +19 -19
- package/fesm2022/ng-nest-ui-inner.mjs +10 -10
- package/fesm2022/ng-nest-ui-input-number.mjs +10 -10
- package/fesm2022/ng-nest-ui-input.mjs +18 -18
- 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 +16 -11
- package/fesm2022/ng-nest-ui-loading.mjs.map +1 -1
- 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.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-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 +13 -13
- 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-switch.mjs +10 -10
- package/fesm2022/ng-nest-ui-table-view.mjs +58 -58
- 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 +10 -10
- package/fesm2022/ng-nest-ui-theme.mjs +10 -10
- package/fesm2022/ng-nest-ui-time-ago.mjs +7 -7
- package/fesm2022/ng-nest-ui-time-picker.mjs +16 -16
- 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 +13 -13
- 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 +13 -13
- package/fesm2022/ng-nest-ui.mjs +1 -0
- package/fesm2022/ng-nest-ui.mjs.map +1 -1
- package/index.d.ts +1 -0
- package/loading/index.d.ts +6 -1
- package/message-box/index.d.ts +5 -4
- package/package.json +47 -43
- package/radio/index.d.ts +1 -1
- package/select/index.d.ts +3 -3
- package/steps/index.d.ts +2 -1
- package/time-picker/index.d.ts +3 -3
- package/tree-select/index.d.ts +3 -3
|
@@ -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 }] : [{ transform: XToNumber }]));
|
|
94
94
|
}
|
|
95
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
96
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.
|
|
95
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPopoverProperty, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
96
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.0", 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: "20.
|
|
98
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPopoverProperty, decorators: [{
|
|
99
99
|
type: Directive,
|
|
100
100
|
args: [{ selector: `[${XPopoverPrefix}], ${XPopoverPrefix}` }]
|
|
101
101
|
}] });
|
|
@@ -135,10 +135,10 @@ class XPopoverPortalComponent {
|
|
|
135
135
|
stopPropagation(event) {
|
|
136
136
|
event.stopPropagation();
|
|
137
137
|
}
|
|
138
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
139
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
138
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPopoverPortalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
139
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.0", 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: { "@x-fade-animation": "this.animation" } }, 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"] }], animations: [XFadeAnimation], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
140
140
|
}
|
|
141
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
141
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPopoverPortalComponent, decorators: [{
|
|
142
142
|
type: Component,
|
|
143
143
|
args: [{ selector: `${XPopoverPortalPrefix}`, imports: [NgClass, XOutletDirective], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [XFadeAnimation], 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"] }]
|
|
144
144
|
}], propDecorators: { mouseenter: [{
|
|
@@ -303,10 +303,10 @@ class XPopoverDirective extends XPopoverProperty {
|
|
|
303
303
|
}
|
|
304
304
|
});
|
|
305
305
|
}
|
|
306
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
307
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.
|
|
306
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPopoverDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
307
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.0", 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 }); }
|
|
308
308
|
}
|
|
309
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
309
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPopoverDirective, decorators: [{
|
|
310
310
|
type: Directive,
|
|
311
311
|
args: [{ selector: `[${XPopoverPrefix}], ${XPopoverPrefix}` }]
|
|
312
312
|
}], ctorParameters: () => [], propDecorators: { _show: [{
|
|
@@ -330,11 +330,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImpor
|
|
|
330
330
|
}] } });
|
|
331
331
|
|
|
332
332
|
class XPopoverModule {
|
|
333
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
334
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.
|
|
335
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.
|
|
333
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPopoverModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
334
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: XPopoverModule, imports: [XPopoverDirective], exports: [XPopoverDirective] }); }
|
|
335
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPopoverModule }); }
|
|
336
336
|
}
|
|
337
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
337
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPopoverModule, decorators: [{
|
|
338
338
|
type: NgModule,
|
|
339
339
|
args: [{
|
|
340
340
|
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: "20.
|
|
9
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.
|
|
10
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.
|
|
8
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPortalModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
9
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: XPortalModule }); }
|
|
10
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPortalModule }); }
|
|
11
11
|
}
|
|
12
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
12
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", 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: "20.
|
|
221
|
-
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.
|
|
220
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPortalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
221
|
+
/** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPortalService, providedIn: 'root' }); }
|
|
222
222
|
}
|
|
223
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
223
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XPortalService, decorators: [{
|
|
224
224
|
type: Injectable,
|
|
225
225
|
args: [{ providedIn: 'root' }]
|
|
226
226
|
}] });
|
|
@@ -104,10 +104,10 @@ class XProgressProperty extends XPropertyFunction(X_PROGRESS_CONFIG_NAME) {
|
|
|
104
104
|
*/
|
|
105
105
|
this.subsection = input(false, ...(ngDevMode ? [{ debugName: "subsection", transform: XToBoolean }] : [{ transform: XToBoolean }]));
|
|
106
106
|
}
|
|
107
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
108
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.
|
|
107
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XProgressProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
108
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.0", 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 }, 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 }, 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 }); }
|
|
109
109
|
}
|
|
110
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
110
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XProgressProperty, decorators: [{
|
|
111
111
|
type: Component,
|
|
112
112
|
args: [{ selector: `${XProgressPrefix}-property`, template: '' }]
|
|
113
113
|
}] });
|
|
@@ -321,20 +321,20 @@ class XProgressComponent extends XProgressProperty {
|
|
|
321
321
|
}
|
|
322
322
|
return '';
|
|
323
323
|
}
|
|
324
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
325
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
324
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XProgressComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
325
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.0", 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 class=\"x-progress-ring-rail\" [style.border-width]=\"thickness()\"></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"circleClipPath()\"\r\n [style.background-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-width]=\"thickness()\"\r\n ></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"dashboardClipPath()\"\r\n [style.background-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-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]=\"currentColor()\"\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 @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 </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 }); }
|
|
326
326
|
}
|
|
327
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
327
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XProgressComponent, decorators: [{
|
|
328
328
|
type: Component,
|
|
329
329
|
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 class=\"x-progress-ring-rail\" [style.border-width]=\"thickness()\"></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"circleClipPath()\"\r\n [style.background-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-width]=\"thickness()\"\r\n ></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"dashboardClipPath()\"\r\n [style.background-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-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]=\"currentColor()\"\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 @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 </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"] }]
|
|
330
330
|
}] });
|
|
331
331
|
|
|
332
332
|
class XProgressModule {
|
|
333
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
334
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.
|
|
335
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.
|
|
333
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XProgressModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
334
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: XProgressModule, imports: [XProgressComponent], exports: [XProgressComponent] }); }
|
|
335
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XProgressModule, imports: [XProgressComponent] }); }
|
|
336
336
|
}
|
|
337
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
337
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XProgressModule, decorators: [{
|
|
338
338
|
type: NgModule,
|
|
339
339
|
args: [{
|
|
340
340
|
exports: [XProgressComponent],
|
|
@@ -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: "20.
|
|
122
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.
|
|
121
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRadioProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
122
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.0", 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: "20.
|
|
124
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRadioProperty, decorators: [{
|
|
125
125
|
type: Component,
|
|
126
126
|
args: [{ selector: `${XRadioPrefix}-property`, template: '' }]
|
|
127
127
|
}] });
|
|
@@ -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: "20.
|
|
188
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", 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: "20.3.0", ngImport: i0, type: XRadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
188
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.0", 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: "20.
|
|
190
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", 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
|
}] });
|
|
194
194
|
|
|
195
195
|
class XRadioModule {
|
|
196
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
197
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.
|
|
198
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.
|
|
196
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRadioModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
197
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: XRadioModule, imports: [XRadioComponent], exports: [XRadioComponent] }); }
|
|
198
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRadioModule, imports: [XRadioComponent] }); }
|
|
199
199
|
}
|
|
200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
200
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRadioModule, decorators: [{
|
|
201
201
|
type: NgModule,
|
|
202
202
|
args: [{
|
|
203
203
|
exports: [XRadioComponent],
|
|
@@ -80,10 +80,10 @@ class XRateProperty extends XFormControlFunction(X_RATE_CONFIG_NAME) {
|
|
|
80
80
|
*/
|
|
81
81
|
this.required = input(false, ...(ngDevMode ? [{ debugName: "required", transform: XToBoolean }] : [{ transform: XToBoolean }]));
|
|
82
82
|
}
|
|
83
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
84
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.
|
|
83
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRateProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
84
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.0", type: XRateProperty, isStandalone: true, selector: "x-rate-property", inputs: { count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, half: { classPropertyName: "half", publicName: "half", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, customTemp: { classPropertyName: "customTemp", publicName: "customTemp", 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 } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
|
|
85
85
|
}
|
|
86
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
86
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRateProperty, decorators: [{
|
|
87
87
|
type: Component,
|
|
88
88
|
args: [{ selector: `${XRatePrefix}-property`, template: '' }]
|
|
89
89
|
}] });
|
|
@@ -170,20 +170,20 @@ class XRateComponent extends XRateProperty {
|
|
|
170
170
|
this.onChange(this.value());
|
|
171
171
|
}
|
|
172
172
|
formControlChanges() { }
|
|
173
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
174
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.
|
|
173
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRateComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
174
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.0", type: XRateComponent, isStandalone: true, selector: "x-rate", providers: [XValueAccessor(XRateComponent)], viewQueries: [{ propertyName: "rate", first: true, predicate: ["rate"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<div\r\n #rate\r\n class=\"x-rate\"\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>\r\n @if (label()) {\r\n <label [class.x-rate-label-required]=\"requiredComputed()\" [style.width]=\"labelWidth()\" [ngClass]=\"labelMapSignal()\">{{\r\n label()\r\n }}</label>\r\n }\r\n <div class=\"x-rate-icons\" (mouseleave)=\"leaveRates()\">\r\n @for (rate of rates(); track rate; let i = $index) {\r\n <div\r\n class=\"x-rate-icon\"\r\n [class.activated]=\"rate <= hoverActivated()\"\r\n [class.half-activated]=\"rate <= hoverHalfActivated()\"\r\n [style.color]=\"rate <= hoverActivated() ? getColor() : ''\"\r\n >\r\n @if (half()) {\r\n <div\r\n class=\"x-rate-half\"\r\n [style.color]=\"rate <= hoverHalfActivated() ? getColor() : ''\"\r\n (mouseenter)=\"rateHalfHover(rate, $event)\"\r\n (click)=\"rateHalfClick(rate, $event)\"\r\n >\r\n @if (customTemp()) {\r\n <ng-container *ngTemplateOutlet=\"customTemp()!\"></ng-container>\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n }\r\n </div>\r\n }\r\n <div class=\"x-rate-back\" (mouseenter)=\"rateHover(rate, $event)\" (click)=\"rateClick(rate, $event)\">\r\n @if (customTemp()) {\r\n <ng-container *ngTemplateOutlet=\"customTemp()!\"></ng-container>\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n\r\n<ng-template #iconTpl>\r\n <x-icon type=\"adf-star\"></x-icon>\r\n</ng-template>\r\n", styles: [".x-rate{margin:0;padding:0}.x-rate{width:100%}.x-rate.x-flex{display:flex}.x-rate.x-justify-start{justify-content:flex-start}.x-rate.x-justify-center{justify-content:center}.x-rate.x-justify-end{justify-content:flex-end}.x-rate.x-justify-space-between{justify-content:space-between}.x-rate.x-justify-space-around{justify-content:space-around}.x-rate.x-align-start{align-items:flex-start}.x-rate.x-align-center{align-items:center}.x-rate.x-align-end{align-items:flex-end}.x-rate.x-direction-column{flex-direction:column}.x-rate.x-direction-column-reverse{flex-direction:column-reverse}.x-rate.x-direction-row{flex-direction:row}.x-rate.x-direction-row-reverse{flex-direction:row-reverse}.x-rate>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-rate>label.x-text-align-start{text-align:start}.x-rate>label.x-text-align-center{text-align:center}.x-rate>label.x-text-align-end{text-align:end}.x-rate-icons{display:inline-flex;align-items:center;height:var(--x-height-medium);cursor:pointer}.x-rate-icon{margin:0 .2rem;display:flex;align-items:center;position:relative;color:var(--x-info);transition:transform var(--x-animation-duration-base),color var(--x-animation-duration-base);font-size:calc(var(--x-font-size-big) + .125rem)}.x-rate-icon .x-icon{vertical-align:0}.x-rate-icon:hover{transform:scale(1.1)}.x-rate-icon.activated,.x-rate-icon.half-activated .x-rate-half{color:var(--x-warning)}.x-rate-half{position:absolute;top:0;left:0;width:50%;height:100%;overflow:hidden;display:flex;align-items:center}.x-rate-half:hover{opacity:1}.x-rate-back{display:flex;align-items:center}.x-rate-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-rate.x-invalid>label,.x-rate.x-required>label{color:var(--x-danger)}.x-rate.x-disabled .x-rate-icons{cursor:not-allowed;opacity:.8}.x-rate.x-direction-row>label{padding:0 .5rem 0 0}.x-rate.x-direction-row-reverse>label{padding:0 0 0 .5rem}.x-rate.x-direction-column,.x-rate.x-direction-column-reverse{align-items:inherit}\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 }); }
|
|
175
175
|
}
|
|
176
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
176
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRateComponent, decorators: [{
|
|
177
177
|
type: Component,
|
|
178
178
|
args: [{ selector: `${XRatePrefix}`, imports: [NgClass, NgTemplateOutlet, FormsModule, XIconComponent], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [XValueAccessor(XRateComponent)], template: "<div\r\n #rate\r\n class=\"x-rate\"\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>\r\n @if (label()) {\r\n <label [class.x-rate-label-required]=\"requiredComputed()\" [style.width]=\"labelWidth()\" [ngClass]=\"labelMapSignal()\">{{\r\n label()\r\n }}</label>\r\n }\r\n <div class=\"x-rate-icons\" (mouseleave)=\"leaveRates()\">\r\n @for (rate of rates(); track rate; let i = $index) {\r\n <div\r\n class=\"x-rate-icon\"\r\n [class.activated]=\"rate <= hoverActivated()\"\r\n [class.half-activated]=\"rate <= hoverHalfActivated()\"\r\n [style.color]=\"rate <= hoverActivated() ? getColor() : ''\"\r\n >\r\n @if (half()) {\r\n <div\r\n class=\"x-rate-half\"\r\n [style.color]=\"rate <= hoverHalfActivated() ? getColor() : ''\"\r\n (mouseenter)=\"rateHalfHover(rate, $event)\"\r\n (click)=\"rateHalfClick(rate, $event)\"\r\n >\r\n @if (customTemp()) {\r\n <ng-container *ngTemplateOutlet=\"customTemp()!\"></ng-container>\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n }\r\n </div>\r\n }\r\n <div class=\"x-rate-back\" (mouseenter)=\"rateHover(rate, $event)\" (click)=\"rateClick(rate, $event)\">\r\n @if (customTemp()) {\r\n <ng-container *ngTemplateOutlet=\"customTemp()!\"></ng-container>\r\n } @else {\r\n <ng-container *ngTemplateOutlet=\"iconTpl\"></ng-container>\r\n }\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n\r\n<ng-template #iconTpl>\r\n <x-icon type=\"adf-star\"></x-icon>\r\n</ng-template>\r\n", styles: [".x-rate{margin:0;padding:0}.x-rate{width:100%}.x-rate.x-flex{display:flex}.x-rate.x-justify-start{justify-content:flex-start}.x-rate.x-justify-center{justify-content:center}.x-rate.x-justify-end{justify-content:flex-end}.x-rate.x-justify-space-between{justify-content:space-between}.x-rate.x-justify-space-around{justify-content:space-around}.x-rate.x-align-start{align-items:flex-start}.x-rate.x-align-center{align-items:center}.x-rate.x-align-end{align-items:flex-end}.x-rate.x-direction-column{flex-direction:column}.x-rate.x-direction-column-reverse{flex-direction:column-reverse}.x-rate.x-direction-row{flex-direction:row}.x-rate.x-direction-row-reverse{flex-direction:row-reverse}.x-rate>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-rate>label.x-text-align-start{text-align:start}.x-rate>label.x-text-align-center{text-align:center}.x-rate>label.x-text-align-end{text-align:end}.x-rate-icons{display:inline-flex;align-items:center;height:var(--x-height-medium);cursor:pointer}.x-rate-icon{margin:0 .2rem;display:flex;align-items:center;position:relative;color:var(--x-info);transition:transform var(--x-animation-duration-base),color var(--x-animation-duration-base);font-size:calc(var(--x-font-size-big) + .125rem)}.x-rate-icon .x-icon{vertical-align:0}.x-rate-icon:hover{transform:scale(1.1)}.x-rate-icon.activated,.x-rate-icon.half-activated .x-rate-half{color:var(--x-warning)}.x-rate-half{position:absolute;top:0;left:0;width:50%;height:100%;overflow:hidden;display:flex;align-items:center}.x-rate-half:hover{opacity:1}.x-rate-back{display:flex;align-items:center}.x-rate-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-rate.x-invalid>label,.x-rate.x-required>label{color:var(--x-danger)}.x-rate.x-disabled .x-rate-icons{cursor:not-allowed;opacity:.8}.x-rate.x-direction-row>label{padding:0 .5rem 0 0}.x-rate.x-direction-row-reverse>label{padding:0 0 0 .5rem}.x-rate.x-direction-column,.x-rate.x-direction-column-reverse{align-items:inherit}\n"] }]
|
|
179
179
|
}] });
|
|
180
180
|
|
|
181
181
|
class XRateModule {
|
|
182
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
183
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.
|
|
184
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.
|
|
182
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRateModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
183
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: XRateModule, imports: [XRateComponent], exports: [XRateComponent] }); }
|
|
184
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRateModule, imports: [XRateComponent] }); }
|
|
185
185
|
}
|
|
186
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
186
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XRateModule, decorators: [{
|
|
187
187
|
type: NgModule,
|
|
188
188
|
args: [{
|
|
189
189
|
exports: [XRateComponent],
|
|
@@ -57,10 +57,10 @@ class XResizableProperty extends XProperty {
|
|
|
57
57
|
*/
|
|
58
58
|
this.resizeEnd = output();
|
|
59
59
|
}
|
|
60
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
61
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.
|
|
60
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XResizableProperty, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
61
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "20.3.0", type: XResizableProperty, isStandalone: true, selector: "[xResizable]", inputs: { xResizable: { classPropertyName: "xResizable", publicName: "xResizable", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, ghost: { classPropertyName: "ghost", publicName: "ghost", isSignal: true, isRequired: false, transformFunction: null }, offsetLeft: { classPropertyName: "offsetLeft", publicName: "offsetLeft", isSignal: true, isRequired: false, transformFunction: null }, offsetTop: { classPropertyName: "offsetTop", publicName: "offsetTop", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { resizeBegin: "resizeBegin", resizing: "resizing", resizeEnd: "resizeEnd" }, usesInheritance: true, ngImport: i0 }); }
|
|
62
62
|
}
|
|
63
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
63
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XResizableProperty, decorators: [{
|
|
64
64
|
type: Directive,
|
|
65
65
|
args: [{ selector: '[xResizable]' }]
|
|
66
66
|
}] });
|
|
@@ -306,10 +306,10 @@ class XResizableDirective extends XResizableProperty {
|
|
|
306
306
|
this.mouseUpSub = undefined;
|
|
307
307
|
}
|
|
308
308
|
}
|
|
309
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
310
|
-
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.
|
|
309
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XResizableDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
310
|
+
/** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.0", type: XResizableDirective, isStandalone: true, selector: "[xResizable]", host: { listeners: { "mousedown": "mousedown($event)" }, properties: { "class": "this.className", "class.x-resizable-disabled": "this.getDisabled" } }, usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
|
|
311
311
|
}
|
|
312
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
312
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XResizableDirective, decorators: [{
|
|
313
313
|
type: Directive,
|
|
314
314
|
args: [{ selector: '[xResizable]' }]
|
|
315
315
|
}], propDecorators: { className: [{
|
|
@@ -324,11 +324,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImpor
|
|
|
324
324
|
}] } });
|
|
325
325
|
|
|
326
326
|
class XResizableModule {
|
|
327
|
-
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.
|
|
328
|
-
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.
|
|
329
|
-
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.
|
|
327
|
+
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XResizableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
328
|
+
/** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.0", ngImport: i0, type: XResizableModule, imports: [XResizableDirective], exports: [XResizableDirective] }); }
|
|
329
|
+
/** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XResizableModule }); }
|
|
330
330
|
}
|
|
331
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.
|
|
331
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.0", ngImport: i0, type: XResizableModule, decorators: [{
|
|
332
332
|
type: NgModule,
|
|
333
333
|
args: [{
|
|
334
334
|
imports: [XResizableDirective],
|