npm - @ng-nest/ui - Versions diffs - 13.0.4 → 13.0.8 - Mend

@ng-nest/ui 13.0.4 → 13.0.8

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.

Files changed (167) hide show

package/alert/alert.component.d.ts +2 -1
package/core/config/config.d.ts +7 -1
package/core/interfaces/layout.type.d.ts +1 -1
package/dialog/{dialog-container.component.d.ts → dialog-portal.component.d.ts} +3 -3
package/dialog/{dialog-container.directives.d.ts → dialog-portal.directives.d.ts} +0 -0
package/dialog/dialog-ref.d.ts +3 -3
package/dialog/dialog.module.d.ts +3 -3
package/dialog/dialog.property.d.ts +3 -3
package/dialog/public-api.d.ts +2 -2
package/drawer/drawer-container.component.d.ts +3 -13
package/drawer/drawer-portal.component.d.ts +18 -0
package/drawer/{drawer-container.directives.d.ts → drawer-portal.directives.d.ts} +0 -0
package/drawer/drawer-ref.d.ts +3 -3
package/drawer/drawer.component.d.ts +10 -3
package/drawer/drawer.module.d.ts +9 -8
package/drawer/drawer.property.d.ts +16 -2
package/drawer/examples/en_US/default/container/README.md +6 -0
package/drawer/examples/zh_CN/default/container/README.md +6 -0
package/drawer/public-api.d.ts +3 -2
package/esm2020/alert/alert.component.mjs +9 -4
package/esm2020/auto-complete/auto-complete.module.mjs +2 -3
package/esm2020/cascade/cascade.module.mjs +2 -3
package/esm2020/color-picker/color-picker.module.mjs +2 -3
package/esm2020/core/config/config.mjs +1 -1
package/esm2020/core/interfaces/layout.type.mjs +1 -1
package/esm2020/date-picker/date-picker.module.mjs +2 -3
package/esm2020/dialog/dialog-portal.component.mjs +52 -0
package/esm2020/dialog/{dialog-container.directives.mjs → dialog-portal.directives.mjs} +7 -7
package/esm2020/dialog/dialog-ref.mjs +1 -1
package/esm2020/dialog/dialog.component.mjs +5 -5
package/esm2020/dialog/dialog.module.mjs +7 -7
package/esm2020/dialog/dialog.property.mjs +2 -2
package/esm2020/dialog/dialog.service.mjs +3 -3
package/esm2020/dialog/public-api.mjs +3 -3
package/esm2020/drawer/drawer-container.component.mjs +16 -39
package/esm2020/drawer/drawer-portal.component.mjs +52 -0
package/esm2020/drawer/{drawer-container.directives.mjs → drawer-portal.directives.mjs} +5 -5
package/esm2020/drawer/drawer-ref.mjs +1 -1
package/esm2020/drawer/drawer.component.mjs +54 -18
package/esm2020/drawer/drawer.module.mjs +23 -6
package/esm2020/drawer/drawer.property.mjs +19 -1
package/esm2020/drawer/drawer.service.mjs +4 -4
package/esm2020/drawer/public-api.mjs +4 -3
package/esm2020/dropdown/dropdown.module.mjs +2 -3
package/esm2020/find/find.component.mjs +13 -4
package/esm2020/find/find.property.mjs +18 -2
package/esm2020/menu/menu.component.mjs +3 -3
package/esm2020/menu/menu.property.mjs +7 -2
package/esm2020/message/message-ref.mjs +12 -0
package/esm2020/message/message.component.mjs +3 -3
package/esm2020/message/message.property.mjs +1 -1
package/esm2020/message/message.service.mjs +34 -13
package/esm2020/message/public-api.mjs +2 -1
package/esm2020/popconfirm/popconfirm.component.mjs +26 -5
package/esm2020/popconfirm/popconfirm.property.mjs +10 -3
package/esm2020/popover/popover.directive.mjs +8 -2
package/esm2020/popover/popover.module.mjs +2 -3
package/esm2020/popover/popover.property.mjs +7 -2
package/esm2020/select/select.module.mjs +2 -3
package/esm2020/table/table-body.component.mjs +4 -4
package/esm2020/table/table.component.mjs +3 -3
package/esm2020/table/table.property.mjs +7 -3
package/esm2020/time-picker/time-picker.module.mjs +2 -3
package/esm2020/tooltip/tooltip.directive.mjs +12 -4
package/esm2020/tooltip/tooltip.module.mjs +2 -3
package/esm2020/tooltip/tooltip.property.mjs +18 -2
package/esm2020/tree/tree-node.component.mjs +3 -3
package/esm2020/tree/tree.property.mjs +8 -2
package/fesm2015/ng-nest-ui-alert.mjs +8 -3
package/fesm2015/ng-nest-ui-alert.mjs.map +1 -1
package/fesm2015/ng-nest-ui-auto-complete.mjs +1 -2
package/fesm2015/ng-nest-ui-auto-complete.mjs.map +1 -1
package/fesm2015/ng-nest-ui-cascade.mjs +1 -2
package/fesm2015/ng-nest-ui-cascade.mjs.map +1 -1
package/fesm2015/ng-nest-ui-color-picker.mjs +1 -2
package/fesm2015/ng-nest-ui-color-picker.mjs.map +1 -1
package/fesm2015/ng-nest-ui-core.mjs.map +1 -1
package/fesm2015/ng-nest-ui-date-picker.mjs +1 -2
package/fesm2015/ng-nest-ui-date-picker.mjs.map +1 -1
package/fesm2015/ng-nest-ui-dialog.mjs +22 -22
package/fesm2015/ng-nest-ui-dialog.mjs.map +1 -1
package/fesm2015/ng-nest-ui-drawer.mjs +129 -32
package/fesm2015/ng-nest-ui-drawer.mjs.map +1 -1
package/fesm2015/ng-nest-ui-dropdown.mjs +1 -2
package/fesm2015/ng-nest-ui-dropdown.mjs.map +1 -1
package/fesm2015/ng-nest-ui-find.mjs +29 -4
package/fesm2015/ng-nest-ui-find.mjs.map +1 -1
package/fesm2015/ng-nest-ui-menu.mjs +8 -3
package/fesm2015/ng-nest-ui-menu.mjs.map +1 -1
package/fesm2015/ng-nest-ui-message.mjs +48 -15
package/fesm2015/ng-nest-ui-message.mjs.map +1 -1
package/fesm2015/ng-nest-ui-popconfirm.mjs +34 -6
package/fesm2015/ng-nest-ui-popconfirm.mjs.map +1 -1
package/fesm2015/ng-nest-ui-popover.mjs +14 -4
package/fesm2015/ng-nest-ui-popover.mjs.map +1 -1
package/fesm2015/ng-nest-ui-select.mjs +1 -2
package/fesm2015/ng-nest-ui-select.mjs.map +1 -1
package/fesm2015/ng-nest-ui-table.mjs +11 -7
package/fesm2015/ng-nest-ui-table.mjs.map +1 -1
package/fesm2015/ng-nest-ui-time-picker.mjs +1 -2
package/fesm2015/ng-nest-ui-time-picker.mjs.map +1 -1
package/fesm2015/ng-nest-ui-tooltip.mjs +29 -6
package/fesm2015/ng-nest-ui-tooltip.mjs.map +1 -1
package/fesm2015/ng-nest-ui-tree.mjs +9 -3
package/fesm2015/ng-nest-ui-tree.mjs.map +1 -1
package/fesm2020/ng-nest-ui-alert.mjs +8 -3
package/fesm2020/ng-nest-ui-alert.mjs.map +1 -1
package/fesm2020/ng-nest-ui-auto-complete.mjs +1 -2
package/fesm2020/ng-nest-ui-auto-complete.mjs.map +1 -1
package/fesm2020/ng-nest-ui-cascade.mjs +1 -2
package/fesm2020/ng-nest-ui-cascade.mjs.map +1 -1
package/fesm2020/ng-nest-ui-color-picker.mjs +1 -2
package/fesm2020/ng-nest-ui-color-picker.mjs.map +1 -1
package/fesm2020/ng-nest-ui-core.mjs.map +1 -1
package/fesm2020/ng-nest-ui-date-picker.mjs +1 -2
package/fesm2020/ng-nest-ui-date-picker.mjs.map +1 -1
package/fesm2020/ng-nest-ui-dialog.mjs +22 -22
package/fesm2020/ng-nest-ui-dialog.mjs.map +1 -1
package/fesm2020/ng-nest-ui-drawer.mjs +127 -32
package/fesm2020/ng-nest-ui-drawer.mjs.map +1 -1
package/fesm2020/ng-nest-ui-dropdown.mjs +1 -2
package/fesm2020/ng-nest-ui-dropdown.mjs.map +1 -1
package/fesm2020/ng-nest-ui-find.mjs +29 -4
package/fesm2020/ng-nest-ui-find.mjs.map +1 -1
package/fesm2020/ng-nest-ui-menu.mjs +8 -3
package/fesm2020/ng-nest-ui-menu.mjs.map +1 -1
package/fesm2020/ng-nest-ui-message.mjs +47 -15
package/fesm2020/ng-nest-ui-message.mjs.map +1 -1
package/fesm2020/ng-nest-ui-popconfirm.mjs +34 -6
package/fesm2020/ng-nest-ui-popconfirm.mjs.map +1 -1
package/fesm2020/ng-nest-ui-popover.mjs +14 -4
package/fesm2020/ng-nest-ui-popover.mjs.map +1 -1
package/fesm2020/ng-nest-ui-select.mjs +1 -2
package/fesm2020/ng-nest-ui-select.mjs.map +1 -1
package/fesm2020/ng-nest-ui-table.mjs +11 -7
package/fesm2020/ng-nest-ui-table.mjs.map +1 -1
package/fesm2020/ng-nest-ui-time-picker.mjs +1 -2
package/fesm2020/ng-nest-ui-time-picker.mjs.map +1 -1
package/fesm2020/ng-nest-ui-tooltip.mjs +29 -6
package/fesm2020/ng-nest-ui-tooltip.mjs.map +1 -1
package/fesm2020/ng-nest-ui-tree.mjs +9 -3
package/fesm2020/ng-nest-ui-tree.mjs.map +1 -1
package/find/find.property.d.ts +31 -1
package/menu/menu.property.d.ts +8 -3
package/message/examples/en_US/default/loading/README.md +6 -0
package/message/examples/zh_CN/default/loading/README.md +6 -0
package/message/message-ref.d.ts +8 -0
package/message/message.component.d.ts +3 -3
package/message/message.property.d.ts +23 -3
package/message/message.service.d.ts +4 -1
package/message/public-api.d.ts +1 -0
package/package.json +7 -7
package/popconfirm/examples/en_US/default/async-close/README.md +6 -0
package/popconfirm/examples/en_US/default/condition/README.md +6 -0
package/popconfirm/examples/zh_CN/default/async-close/README.md +6 -0
package/popconfirm/examples/zh_CN/default/condition/README.md +6 -0
package/popconfirm/popconfirm.component.d.ts +6 -2
package/popconfirm/popconfirm.property.d.ts +13 -2
package/popover/popover.property.d.ts +6 -1
package/steps/examples/zh_CN/default/node-status/README.md +1 -1
package/table/examples/en_US/default/rowclass/README.md +6 -0
package/table/examples/zh_CN/default/rowclass/README.md +6 -0
package/table/table.property.d.ts +23 -2
package/tooltip/tooltip.directive.d.ts +1 -0
package/tooltip/tooltip.property.d.ts +11 -1
package/tree/tree.property.d.ts +6 -1
package/esm2020/dialog/dialog-container.component.mjs +0 -52

package/fesm2015/ng-nest-ui-menu.mjs CHANGED Viewed

@@ -61,13 +61,16 @@ class XMenuProperty extends XProperty {
     }
 }
 /** @nocollapse */ /** @nocollapse */ XMenuProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XMenuProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ /** @nocollapse */ XMenuProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: XMenuProperty, selector: "ng-component", inputs: { data: "data", layout: "layout", size: "size", collapsed: "collapsed", trigger: "trigger", nodeTpl: "nodeTpl", expandedAll: "expandedAll", expandedLevel: "expandedLevel", activatedId: "activatedId", target: "target", portalMinWidth: "portalMinWidth" }, outputs: { nodeClick: "nodeClick", activatedIdChange: "activatedIdChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ /** @nocollapse */ XMenuProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: XMenuProperty, selector: "ng-component", inputs: { data: "data", layout: "layout", size: "size", width: "width", collapsed: "collapsed", trigger: "trigger", nodeTpl: "nodeTpl", expandedAll: "expandedAll", expandedLevel: "expandedLevel", activatedId: "activatedId", target: "target", portalMinWidth: "portalMinWidth" }, outputs: { nodeClick: "nodeClick", activatedIdChange: "activatedIdChange" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XDataConvert()
 ], XMenuProperty.prototype, "data", void 0);
 __decorate([
     XWithConfig(X_CONFIG_NAME, 'medium')
 ], XMenuProperty.prototype, "size", void 0);
+__decorate([
+    XWithConfig(X_CONFIG_NAME, '12rem')
+], XMenuProperty.prototype, "width", void 0);
 __decorate([
     XInputBoolean()
 ], XMenuProperty.prototype, "collapsed", void 0);
@@ -89,6 +92,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImpor
                 type: Input
             }], size: [{
                 type: Input
+            }], width: [{
+                type: Input
             }], collapsed: [{
                 type: Input
             }], trigger: [{
@@ -335,10 +340,10 @@ class XMenuComponent extends XMenuProperty {
     }
 }
 /** @nocollapse */ /** @nocollapse */ XMenuComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XMenuComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: DOCUMENT }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ /** @nocollapse */ XMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: XMenuComponent, selector: "x-menu", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #menu class=\"x-menu\" [ngClass]=\"classMap\">\r\n  <div class=\"x-menu-nodes\" *ngIf=\"layout === 'column'\">\r\n    <ng-container *ngFor=\"let node of nodes; trackBy: trackByNode\">\r\n      <ng-container *ngTemplateOutlet=\"nodeColumnTpl; context: { $node: node, $children: true }\"></ng-container>\r\n    </ng-container>\r\n  </div>\r\n  <x-slider\r\n    *ngIf=\"layout === 'row'\"\r\n    [data]=\"nodes\"\r\n    [size]=\"size\"\r\n    [nodeTpl]=\"nodeRowTpl\"\r\n    [nodeJustify]=\"'center'\"\r\n    [activatedIndex]=\"rootIndex\"\r\n    (indexChange)=\"rootIndexChange($event)\"\r\n  ></x-slider>\r\n</div>\r\n\r\n<ng-template #nodeTpl let-node=\"$node\">\r\n  <x-dropdown\r\n    *ngIf=\"node.level === 0 && collapsed\"\r\n    [disabled]=\"!node.leaf\"\r\n    [data]=\"node.children\"\r\n    [trigger]=\"trigger\"\r\n    placement=\"right-start\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    [portalMinWidth]=\"portalMinWidth\"\r\n    children\r\n  >\r\n    <x-menu-node [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n  </x-dropdown>\r\n  <x-menu-node *ngIf=\"!collapsed\" [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n</ng-template>\r\n\r\n<ng-template #nodeRowTpl let-node=\"$node\">\r\n  <x-dropdown\r\n    [disabled]=\"!node.leaf\"\r\n    [data]=\"node.children\"\r\n    [trigger]=\"trigger\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    [portalMinWidth]=\"portalMinWidth\"\r\n    children\r\n  >\r\n    <div class=\"x-menu-node\" [ngClass]=\"nodeClassMap\">\r\n      <ng-container *ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n    </div>\r\n  </x-dropdown>\r\n</ng-template>\r\n\r\n<ng-template #nodeColumnTpl let-node=\"$node\">\r\n  <div\r\n    class=\"x-menu-node\"\r\n    [class.x-activated]=\"activated?.id === node.id\"\r\n    [class.x-menu-category]=\"node.categoryNode\"\r\n    [ngClass]=\"nodeClassMap\"\r\n    (click)=\"onToggle($event, node)\"\r\n    [style.padding-left.rem]=\"(node.level + 1) * 0.875\"\r\n  >\r\n    <ng-container *ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n  </div>\r\n  <div class=\"x-menu-nodes\" *ngIf=\"node.childrenLoaded || (node.leaf && node.open)\" [hidden]=\"!node.open\">\r\n    <ng-container *ngFor=\"let child of node.children; trackBy: trackByNode\">\r\n      <ng-container *ngTemplateOutlet=\"nodeColumnTpl; context: { $node: child }\"></ng-container>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-menu{display:block}.x-menu{margin:0;padding:0}.x-menu-icon.x-icon{font-size:1rem;transition:opacity var(--x-animation-duration-base)}.x-menu-arrow.x-icon{transition:opacity var(--x-animation-duration-base)}.x-menu-arrow.x-icon.is-open{transform:rotate(180deg)}.x-menu-node.x-size-big{padding:0 calc(var(--x-padding-big) + .25rem);height:calc(var(--x-height-big) + .75rem);line-height:calc(var(--x-height-big) + .75rem)}.x-menu-node.x-size-big.x-menu-category{height:calc(calc(var(--x-height-big) + .75rem) * 1.5)}.x-menu-node.x-size-large{padding:0 calc(var(--x-padding-large) + .25rem);height:calc(var(--x-height-large) + .75rem);line-height:calc(var(--x-height-large) + .75rem)}.x-menu-node.x-size-large.x-menu-category{height:calc(calc(var(--x-height-large) + .75rem) * 1.5)}.x-menu-node.x-size-medium{padding:0 calc(var(--x-padding-medium) + .25rem);height:calc(var(--x-height-medium) + .75rem);line-height:calc(var(--x-height-medium) + .75rem)}.x-menu-node.x-size-medium.x-menu-category{height:calc(calc(var(--x-height-medium) + .75rem) * 1.5)}.x-menu-node.x-size-small{padding:0 var(--x-padding-small);height:calc(var(--x-height-small) + .5rem);line-height:calc(var(--x-height-small) + .5rem)}.x-menu-node.x-size-small.x-menu-category{height:calc(calc(var(--x-height-small) + .5rem) * 1.5)}.x-menu-node.x-size-mini{padding:0 var(--x-padding-mini);height:calc(var(--x-height-mini) + .5rem);line-height:calc(var(--x-height-mini) + .5rem)}.x-menu-node.x-size-mini.x-menu-category{height:calc(calc(var(--x-height-mini) + .5rem) * 1.5)}.x-menu x-slider .x-slider-scroll>ul>li.x-slider-highlight{background-color:inherit;border-radius:0;border:none;border-bottom:.125rem solid var(--x-primary)}.x-menu x-slider .x-slider-scroll>ul>li>x-link{padding:0!important;height:inherit!important;line-height:inherit!important}.x-menu-column{width:12rem;transition:var(--x-animation-duration-base)}.x-menu-row .x-menu-text{margin-left:.25rem}.x-menu-nodes .x-menu-node{cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:width var(--x-animation-duration-base),background-color var(--x-animation-duration-base);border-right:.125rem solid var(--x-border);position:relative;-webkit-user-select:none;user-select:none;padding-right:.875rem}.x-menu-nodes .x-menu-node .x-menu-text{flex:1;margin:0 .25rem;transition:background-color var(--x-animation-duration-base),opacity var(--x-animation-duration-base);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-menu-nodes .x-menu-node:hover{color:var(--x-primary);background-color:var(--x-background-a100)}.x-menu-nodes .x-menu-node x-menu-node{flex:1;display:flex;align-items:center;justify-content:space-between;overflow:hidden}.x-menu-nodes .x-menu-node x-menu-node>a{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-decoration:none}.x-menu-nodes .x-menu-node.x-activated{color:var(--x-primary);background-color:var(--x-background-a100)}.x-menu-nodes .x-menu-node.x-activated:after{content:\"\";position:absolute;height:100%;right:-.125rem;top:0;border-right:.125rem solid var(--x-primary)}.x-menu-nodes .x-menu-node.x-menu-category{cursor:inherit;color:var(--x-text-400)}.x-menu-nodes .x-menu-node.x-menu-category:hover{background-color:transparent}.x-menu-nodes .x-menu-node.x-menu-category>x-menu-node{border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border-300)}.x-menu-collapsed.x-menu-column{width:3rem}.x-menu-collapsed .x-menu-nodes x-dropdown,.x-menu-collapsed .x-menu-nodes .x-dropdown{display:flex;flex:1}.x-menu-collapsed .x-menu-nodes .x-menu-node{padding-left:0!important;padding-right:0}.x-menu-collapsed .x-menu-nodes .x-menu-node x-menu-node{padding-left:.875rem}.x-menu-collapsed .x-menu-nodes .x-menu-node .x-menu-text{opacity:0;width:0}.x-menu-collapsed .x-menu-nodes .x-menu-nodes{display:none}.x-menu-collapsed .x-menu-arrow.x-icon{opacity:0;width:0}\n"], components: [{ type: i2$1.XSliderComponent, selector: "x-slider" }, { type: i3.XDropdownComponent, selector: "x-dropdown" }, { type: XMenuNodeComponent, selector: "x-menu-node", inputs: ["menu"] }], directives: [{ type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+/** @nocollapse */ /** @nocollapse */ XMenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: XMenuComponent, selector: "x-menu", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div #menu class=\"x-menu\" [ngClass]=\"classMap\" [style.width]=\"layout === 'column' ? width : ''\">\r\n  <div class=\"x-menu-nodes\" *ngIf=\"layout === 'column'\">\r\n    <ng-container *ngFor=\"let node of nodes; trackBy: trackByNode\">\r\n      <ng-container *ngTemplateOutlet=\"nodeColumnTpl; context: { $node: node, $children: true }\"></ng-container>\r\n    </ng-container>\r\n  </div>\r\n  <x-slider\r\n    *ngIf=\"layout === 'row'\"\r\n    [data]=\"nodes\"\r\n    [size]=\"size\"\r\n    [nodeTpl]=\"nodeRowTpl\"\r\n    [nodeJustify]=\"'center'\"\r\n    [activatedIndex]=\"rootIndex\"\r\n    (indexChange)=\"rootIndexChange($event)\"\r\n  ></x-slider>\r\n</div>\r\n\r\n<ng-template #nodeTpl let-node=\"$node\">\r\n  <x-dropdown\r\n    *ngIf=\"node.level === 0 && collapsed\"\r\n    [disabled]=\"!node.leaf\"\r\n    [data]=\"node.children\"\r\n    [trigger]=\"trigger\"\r\n    placement=\"right-start\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    [portalMinWidth]=\"portalMinWidth\"\r\n    children\r\n  >\r\n    <x-menu-node [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n  </x-dropdown>\r\n  <x-menu-node *ngIf=\"!collapsed\" [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n</ng-template>\r\n\r\n<ng-template #nodeRowTpl let-node=\"$node\">\r\n  <x-dropdown\r\n    [disabled]=\"!node.leaf\"\r\n    [data]=\"node.children\"\r\n    [trigger]=\"trigger\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    [portalMinWidth]=\"portalMinWidth\"\r\n    children\r\n  >\r\n    <div class=\"x-menu-node\" [ngClass]=\"nodeClassMap\">\r\n      <ng-container *ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n    </div>\r\n  </x-dropdown>\r\n</ng-template>\r\n\r\n<ng-template #nodeColumnTpl let-node=\"$node\">\r\n  <div\r\n    class=\"x-menu-node\"\r\n    [class.x-activated]=\"activated?.id === node.id\"\r\n    [class.x-menu-category]=\"node.categoryNode\"\r\n    [ngClass]=\"nodeClassMap\"\r\n    (click)=\"onToggle($event, node)\"\r\n    [style.padding-left.rem]=\"(node.level + 1) * 0.875\"\r\n  >\r\n    <ng-container *ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n  </div>\r\n  <div class=\"x-menu-nodes\" *ngIf=\"node.childrenLoaded || (node.leaf && node.open)\" [hidden]=\"!node.open\">\r\n    <ng-container *ngFor=\"let child of node.children; trackBy: trackByNode\">\r\n      <ng-container *ngTemplateOutlet=\"nodeColumnTpl; context: { $node: child }\"></ng-container>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-menu{display:block}.x-menu{margin:0;padding:0}.x-menu-icon.x-icon{font-size:1rem;transition:opacity var(--x-animation-duration-base)}.x-menu-arrow.x-icon{transition:opacity var(--x-animation-duration-base)}.x-menu-arrow.x-icon.is-open{transform:rotate(180deg)}.x-menu-node.x-size-big{padding:0 calc(var(--x-padding-big) + .25rem);height:calc(var(--x-height-big) + .75rem);line-height:calc(var(--x-height-big) + .75rem)}.x-menu-node.x-size-big.x-menu-category{height:calc(calc(var(--x-height-big) + .75rem) * 1.5)}.x-menu-node.x-size-large{padding:0 calc(var(--x-padding-large) + .25rem);height:calc(var(--x-height-large) + .75rem);line-height:calc(var(--x-height-large) + .75rem)}.x-menu-node.x-size-large.x-menu-category{height:calc(calc(var(--x-height-large) + .75rem) * 1.5)}.x-menu-node.x-size-medium{padding:0 calc(var(--x-padding-medium) + .25rem);height:calc(var(--x-height-medium) + .75rem);line-height:calc(var(--x-height-medium) + .75rem)}.x-menu-node.x-size-medium.x-menu-category{height:calc(calc(var(--x-height-medium) + .75rem) * 1.5)}.x-menu-node.x-size-small{padding:0 var(--x-padding-small);height:calc(var(--x-height-small) + .5rem);line-height:calc(var(--x-height-small) + .5rem)}.x-menu-node.x-size-small.x-menu-category{height:calc(calc(var(--x-height-small) + .5rem) * 1.5)}.x-menu-node.x-size-mini{padding:0 var(--x-padding-mini);height:calc(var(--x-height-mini) + .5rem);line-height:calc(var(--x-height-mini) + .5rem)}.x-menu-node.x-size-mini.x-menu-category{height:calc(calc(var(--x-height-mini) + .5rem) * 1.5)}.x-menu x-slider .x-slider-scroll>ul>li.x-slider-highlight{background-color:inherit;border-radius:0;border:none;border-bottom:.125rem solid var(--x-primary)}.x-menu x-slider .x-slider-scroll>ul>li>x-link{padding:0!important;height:inherit!important;line-height:inherit!important}.x-menu-column{width:16rem;transition:var(--x-animation-duration-base)}.x-menu-row .x-menu-text{margin-left:.25rem}.x-menu-nodes .x-menu-node{cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:width var(--x-animation-duration-base),background-color var(--x-animation-duration-base);border-right:.125rem solid var(--x-border);position:relative;-webkit-user-select:none;user-select:none;padding-right:.875rem}.x-menu-nodes .x-menu-node .x-menu-text{flex:1;margin:0 .25rem;transition:background-color var(--x-animation-duration-base),opacity var(--x-animation-duration-base);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-menu-nodes .x-menu-node:hover{color:var(--x-primary);background-color:var(--x-background-a100)}.x-menu-nodes .x-menu-node x-menu-node{flex:1;display:flex;align-items:center;justify-content:space-between;overflow:hidden}.x-menu-nodes .x-menu-node x-menu-node>a{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-decoration:none}.x-menu-nodes .x-menu-node.x-activated{color:var(--x-primary);background-color:var(--x-background-a100)}.x-menu-nodes .x-menu-node.x-activated:after{content:\"\";position:absolute;height:100%;right:-.125rem;top:0;border-right:.125rem solid var(--x-primary)}.x-menu-nodes .x-menu-node.x-menu-category{cursor:inherit;color:var(--x-text-400)}.x-menu-nodes .x-menu-node.x-menu-category:hover{background-color:transparent}.x-menu-nodes .x-menu-node.x-menu-category>x-menu-node{border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border-300)}.x-menu-collapsed.x-menu-column{width:3rem}.x-menu-collapsed .x-menu-nodes x-dropdown,.x-menu-collapsed .x-menu-nodes .x-dropdown{display:flex;flex:1}.x-menu-collapsed .x-menu-nodes .x-menu-node{padding-left:0!important;padding-right:0}.x-menu-collapsed .x-menu-nodes .x-menu-node x-menu-node{padding-left:.875rem}.x-menu-collapsed .x-menu-nodes .x-menu-node .x-menu-text{opacity:0;width:0}.x-menu-collapsed .x-menu-nodes .x-menu-nodes{display:none}.x-menu-collapsed .x-menu-arrow.x-icon{opacity:0;width:0}\n"], components: [{ type: i2$1.XSliderComponent, selector: "x-slider" }, { type: i3.XDropdownComponent, selector: "x-dropdown" }, { type: XMenuNodeComponent, selector: "x-menu-node", inputs: ["menu"] }], directives: [{ type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: `${XMenuPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #menu class=\"x-menu\" [ngClass]=\"classMap\">\r\n  <div class=\"x-menu-nodes\" *ngIf=\"layout === 'column'\">\r\n    <ng-container *ngFor=\"let node of nodes; trackBy: trackByNode\">\r\n      <ng-container *ngTemplateOutlet=\"nodeColumnTpl; context: { $node: node, $children: true }\"></ng-container>\r\n    </ng-container>\r\n  </div>\r\n  <x-slider\r\n    *ngIf=\"layout === 'row'\"\r\n    [data]=\"nodes\"\r\n    [size]=\"size\"\r\n    [nodeTpl]=\"nodeRowTpl\"\r\n    [nodeJustify]=\"'center'\"\r\n    [activatedIndex]=\"rootIndex\"\r\n    (indexChange)=\"rootIndexChange($event)\"\r\n  ></x-slider>\r\n</div>\r\n\r\n<ng-template #nodeTpl let-node=\"$node\">\r\n  <x-dropdown\r\n    *ngIf=\"node.level === 0 && collapsed\"\r\n    [disabled]=\"!node.leaf\"\r\n    [data]=\"node.children\"\r\n    [trigger]=\"trigger\"\r\n    placement=\"right-start\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    [portalMinWidth]=\"portalMinWidth\"\r\n    children\r\n  >\r\n    <x-menu-node [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n  </x-dropdown>\r\n  <x-menu-node *ngIf=\"!collapsed\" [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n</ng-template>\r\n\r\n<ng-template #nodeRowTpl let-node=\"$node\">\r\n  <x-dropdown\r\n    [disabled]=\"!node.leaf\"\r\n    [data]=\"node.children\"\r\n    [trigger]=\"trigger\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    [portalMinWidth]=\"portalMinWidth\"\r\n    children\r\n  >\r\n    <div class=\"x-menu-node\" [ngClass]=\"nodeClassMap\">\r\n      <ng-container *ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n    </div>\r\n  </x-dropdown>\r\n</ng-template>\r\n\r\n<ng-template #nodeColumnTpl let-node=\"$node\">\r\n  <div\r\n    class=\"x-menu-node\"\r\n    [class.x-activated]=\"activated?.id === node.id\"\r\n    [class.x-menu-category]=\"node.categoryNode\"\r\n    [ngClass]=\"nodeClassMap\"\r\n    (click)=\"onToggle($event, node)\"\r\n    [style.padding-left.rem]=\"(node.level + 1) * 0.875\"\r\n  >\r\n    <ng-container *ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n  </div>\r\n  <div class=\"x-menu-nodes\" *ngIf=\"node.childrenLoaded || (node.leaf && node.open)\" [hidden]=\"!node.open\">\r\n    <ng-container *ngFor=\"let child of node.children; trackBy: trackByNode\">\r\n      <ng-container *ngTemplateOutlet=\"nodeColumnTpl; context: { $node: child }\"></ng-container>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-menu{display:block}.x-menu{margin:0;padding:0}.x-menu-icon.x-icon{font-size:1rem;transition:opacity var(--x-animation-duration-base)}.x-menu-arrow.x-icon{transition:opacity var(--x-animation-duration-base)}.x-menu-arrow.x-icon.is-open{transform:rotate(180deg)}.x-menu-node.x-size-big{padding:0 calc(var(--x-padding-big) + .25rem);height:calc(var(--x-height-big) + .75rem);line-height:calc(var(--x-height-big) + .75rem)}.x-menu-node.x-size-big.x-menu-category{height:calc(calc(var(--x-height-big) + .75rem) * 1.5)}.x-menu-node.x-size-large{padding:0 calc(var(--x-padding-large) + .25rem);height:calc(var(--x-height-large) + .75rem);line-height:calc(var(--x-height-large) + .75rem)}.x-menu-node.x-size-large.x-menu-category{height:calc(calc(var(--x-height-large) + .75rem) * 1.5)}.x-menu-node.x-size-medium{padding:0 calc(var(--x-padding-medium) + .25rem);height:calc(var(--x-height-medium) + .75rem);line-height:calc(var(--x-height-medium) + .75rem)}.x-menu-node.x-size-medium.x-menu-category{height:calc(calc(var(--x-height-medium) + .75rem) * 1.5)}.x-menu-node.x-size-small{padding:0 var(--x-padding-small);height:calc(var(--x-height-small) + .5rem);line-height:calc(var(--x-height-small) + .5rem)}.x-menu-node.x-size-small.x-menu-category{height:calc(calc(var(--x-height-small) + .5rem) * 1.5)}.x-menu-node.x-size-mini{padding:0 var(--x-padding-mini);height:calc(var(--x-height-mini) + .5rem);line-height:calc(var(--x-height-mini) + .5rem)}.x-menu-node.x-size-mini.x-menu-category{height:calc(calc(var(--x-height-mini) + .5rem) * 1.5)}.x-menu x-slider .x-slider-scroll>ul>li.x-slider-highlight{background-color:inherit;border-radius:0;border:none;border-bottom:.125rem solid var(--x-primary)}.x-menu x-slider .x-slider-scroll>ul>li>x-link{padding:0!important;height:inherit!important;line-height:inherit!important}.x-menu-column{width:12rem;transition:var(--x-animation-duration-base)}.x-menu-row .x-menu-text{margin-left:.25rem}.x-menu-nodes .x-menu-node{cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:width var(--x-animation-duration-base),background-color var(--x-animation-duration-base);border-right:.125rem solid var(--x-border);position:relative;-webkit-user-select:none;user-select:none;padding-right:.875rem}.x-menu-nodes .x-menu-node .x-menu-text{flex:1;margin:0 .25rem;transition:background-color var(--x-animation-duration-base),opacity var(--x-animation-duration-base);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-menu-nodes .x-menu-node:hover{color:var(--x-primary);background-color:var(--x-background-a100)}.x-menu-nodes .x-menu-node x-menu-node{flex:1;display:flex;align-items:center;justify-content:space-between;overflow:hidden}.x-menu-nodes .x-menu-node x-menu-node>a{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-decoration:none}.x-menu-nodes .x-menu-node.x-activated{color:var(--x-primary);background-color:var(--x-background-a100)}.x-menu-nodes .x-menu-node.x-activated:after{content:\"\";position:absolute;height:100%;right:-.125rem;top:0;border-right:.125rem solid var(--x-primary)}.x-menu-nodes .x-menu-node.x-menu-category{cursor:inherit;color:var(--x-text-400)}.x-menu-nodes .x-menu-node.x-menu-category:hover{background-color:transparent}.x-menu-nodes .x-menu-node.x-menu-category>x-menu-node{border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border-300)}.x-menu-collapsed.x-menu-column{width:3rem}.x-menu-collapsed .x-menu-nodes x-dropdown,.x-menu-collapsed .x-menu-nodes .x-dropdown{display:flex;flex:1}.x-menu-collapsed .x-menu-nodes .x-menu-node{padding-left:0!important;padding-right:0}.x-menu-collapsed .x-menu-nodes .x-menu-node x-menu-node{padding-left:.875rem}.x-menu-collapsed .x-menu-nodes .x-menu-node .x-menu-text{opacity:0;width:0}.x-menu-collapsed .x-menu-nodes .x-menu-nodes{display:none}.x-menu-collapsed .x-menu-arrow.x-icon{opacity:0;width:0}\n"] }]
+            args: [{ selector: `${XMenuPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #menu class=\"x-menu\" [ngClass]=\"classMap\" [style.width]=\"layout === 'column' ? width : ''\">\r\n  <div class=\"x-menu-nodes\" *ngIf=\"layout === 'column'\">\r\n    <ng-container *ngFor=\"let node of nodes; trackBy: trackByNode\">\r\n      <ng-container *ngTemplateOutlet=\"nodeColumnTpl; context: { $node: node, $children: true }\"></ng-container>\r\n    </ng-container>\r\n  </div>\r\n  <x-slider\r\n    *ngIf=\"layout === 'row'\"\r\n    [data]=\"nodes\"\r\n    [size]=\"size\"\r\n    [nodeTpl]=\"nodeRowTpl\"\r\n    [nodeJustify]=\"'center'\"\r\n    [activatedIndex]=\"rootIndex\"\r\n    (indexChange)=\"rootIndexChange($event)\"\r\n  ></x-slider>\r\n</div>\r\n\r\n<ng-template #nodeTpl let-node=\"$node\">\r\n  <x-dropdown\r\n    *ngIf=\"node.level === 0 && collapsed\"\r\n    [disabled]=\"!node.leaf\"\r\n    [data]=\"node.children\"\r\n    [trigger]=\"trigger\"\r\n    placement=\"right-start\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    [portalMinWidth]=\"portalMinWidth\"\r\n    children\r\n  >\r\n    <x-menu-node [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n  </x-dropdown>\r\n  <x-menu-node *ngIf=\"!collapsed\" [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n</ng-template>\r\n\r\n<ng-template #nodeRowTpl let-node=\"$node\">\r\n  <x-dropdown\r\n    [disabled]=\"!node.leaf\"\r\n    [data]=\"node.children\"\r\n    [trigger]=\"trigger\"\r\n    (nodeClick)=\"onNodeClick($event)\"\r\n    [portalMinWidth]=\"portalMinWidth\"\r\n    children\r\n  >\r\n    <div class=\"x-menu-node\" [ngClass]=\"nodeClassMap\">\r\n      <ng-container *ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n    </div>\r\n  </x-dropdown>\r\n</ng-template>\r\n\r\n<ng-template #nodeColumnTpl let-node=\"$node\">\r\n  <div\r\n    class=\"x-menu-node\"\r\n    [class.x-activated]=\"activated?.id === node.id\"\r\n    [class.x-menu-category]=\"node.categoryNode\"\r\n    [ngClass]=\"nodeClassMap\"\r\n    (click)=\"onToggle($event, node)\"\r\n    [style.padding-left.rem]=\"(node.level + 1) * 0.875\"\r\n  >\r\n    <ng-container *ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n  </div>\r\n  <div class=\"x-menu-nodes\" *ngIf=\"node.childrenLoaded || (node.leaf && node.open)\" [hidden]=\"!node.open\">\r\n    <ng-container *ngFor=\"let child of node.children; trackBy: trackByNode\">\r\n      <ng-container *ngTemplateOutlet=\"nodeColumnTpl; context: { $node: child }\"></ng-container>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n", styles: ["x-menu{display:block}.x-menu{margin:0;padding:0}.x-menu-icon.x-icon{font-size:1rem;transition:opacity var(--x-animation-duration-base)}.x-menu-arrow.x-icon{transition:opacity var(--x-animation-duration-base)}.x-menu-arrow.x-icon.is-open{transform:rotate(180deg)}.x-menu-node.x-size-big{padding:0 calc(var(--x-padding-big) + .25rem);height:calc(var(--x-height-big) + .75rem);line-height:calc(var(--x-height-big) + .75rem)}.x-menu-node.x-size-big.x-menu-category{height:calc(calc(var(--x-height-big) + .75rem) * 1.5)}.x-menu-node.x-size-large{padding:0 calc(var(--x-padding-large) + .25rem);height:calc(var(--x-height-large) + .75rem);line-height:calc(var(--x-height-large) + .75rem)}.x-menu-node.x-size-large.x-menu-category{height:calc(calc(var(--x-height-large) + .75rem) * 1.5)}.x-menu-node.x-size-medium{padding:0 calc(var(--x-padding-medium) + .25rem);height:calc(var(--x-height-medium) + .75rem);line-height:calc(var(--x-height-medium) + .75rem)}.x-menu-node.x-size-medium.x-menu-category{height:calc(calc(var(--x-height-medium) + .75rem) * 1.5)}.x-menu-node.x-size-small{padding:0 var(--x-padding-small);height:calc(var(--x-height-small) + .5rem);line-height:calc(var(--x-height-small) + .5rem)}.x-menu-node.x-size-small.x-menu-category{height:calc(calc(var(--x-height-small) + .5rem) * 1.5)}.x-menu-node.x-size-mini{padding:0 var(--x-padding-mini);height:calc(var(--x-height-mini) + .5rem);line-height:calc(var(--x-height-mini) + .5rem)}.x-menu-node.x-size-mini.x-menu-category{height:calc(calc(var(--x-height-mini) + .5rem) * 1.5)}.x-menu x-slider .x-slider-scroll>ul>li.x-slider-highlight{background-color:inherit;border-radius:0;border:none;border-bottom:.125rem solid var(--x-primary)}.x-menu x-slider .x-slider-scroll>ul>li>x-link{padding:0!important;height:inherit!important;line-height:inherit!important}.x-menu-column{width:16rem;transition:var(--x-animation-duration-base)}.x-menu-row .x-menu-text{margin-left:.25rem}.x-menu-nodes .x-menu-node{cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:width var(--x-animation-duration-base),background-color var(--x-animation-duration-base);border-right:.125rem solid var(--x-border);position:relative;-webkit-user-select:none;user-select:none;padding-right:.875rem}.x-menu-nodes .x-menu-node .x-menu-text{flex:1;margin:0 .25rem;transition:background-color var(--x-animation-duration-base),opacity var(--x-animation-duration-base);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.x-menu-nodes .x-menu-node:hover{color:var(--x-primary);background-color:var(--x-background-a100)}.x-menu-nodes .x-menu-node x-menu-node{flex:1;display:flex;align-items:center;justify-content:space-between;overflow:hidden}.x-menu-nodes .x-menu-node x-menu-node>a{width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-decoration:none}.x-menu-nodes .x-menu-node.x-activated{color:var(--x-primary);background-color:var(--x-background-a100)}.x-menu-nodes .x-menu-node.x-activated:after{content:\"\";position:absolute;height:100%;right:-.125rem;top:0;border-right:.125rem solid var(--x-primary)}.x-menu-nodes .x-menu-node.x-menu-category{cursor:inherit;color:var(--x-text-400)}.x-menu-nodes .x-menu-node.x-menu-category:hover{background-color:transparent}.x-menu-nodes .x-menu-node.x-menu-category>x-menu-node{border-bottom:var(--x-border-width) var(--x-border-style) var(--x-border-300)}.x-menu-collapsed.x-menu-column{width:3rem}.x-menu-collapsed .x-menu-nodes x-dropdown,.x-menu-collapsed .x-menu-nodes .x-dropdown{display:flex;flex:1}.x-menu-collapsed .x-menu-nodes .x-menu-node{padding-left:0!important;padding-right:0}.x-menu-collapsed .x-menu-nodes .x-menu-node x-menu-node{padding-left:.875rem}.x-menu-collapsed .x-menu-nodes .x-menu-node .x-menu-text{opacity:0;width:0}.x-menu-collapsed .x-menu-nodes .x-menu-nodes{display:none}.x-menu-collapsed .x-menu-arrow.x-icon{opacity:0;width:0}\n"] }]
         }], ctorParameters: function () {
         return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
                         type: Inject,

package/fesm2015/ng-nest-ui-menu.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ng-nest-ui-menu.mjs","sources":["../../../../lib/ng-nest/ui/menu/menu.property.ts","../../../../lib/ng-nest/ui/menu/menu-node.component.ts","../../../../lib/ng-nest/ui/menu/menu-node.component.html","../../../../lib/ng-nest/ui/menu/menu.component.ts","../../../../lib/ng-nest/ui/menu/menu.component.html","../../../../lib/ng-nest/ui/menu/menu.module.ts","../../../../lib/ng-nest/ui/menu/ng-nest-ui-menu.ts"],"sourcesContent":["import {\r\n XParentIdentityProperty,\r\n XData,\r\n XSize,\r\n XProperty,\r\n XDataConvert,\r\n XInputNumber,\r\n XNumber,\r\n XInputBoolean,\r\n XBoolean,\r\n XWithConfig,\r\n XTrigger\r\n} from '@ng-nest/ui/core';\r\nimport { TemplateRef, Input, Output, EventEmitter, Component } from '@angular/core';\r\n\r\n/*\r\n Menu\r\n * @selector x-menu\r\n * @decorator component\r\n /\r\nexport const XMenuPrefix = 'x-menu';\r\nconst X_CONFIG_NAME = 'menu';\r\n\r\n/\r\n Menu Property\r\n /\r\n@Component({ template: '' })\r\nexport class XMenuProperty extends XProperty {\r\n /\r\n @zh_CN 节点数据\r\n * @en_US Node data\r\n /\r\n @Input() @XDataConvert() data: XData<XMenuNode> = [];\r\n /\r\n @zh_CN 布局方向\r\n * @en_US Layout direction\r\n /\r\n @Input() layout: XMenuLayout = 'row';\r\n /\r\n @zh_CN 尺寸\r\n * @en_US Size\r\n /\r\n @Input() @XWithConfig<XSize>(X_CONFIG_NAME, 'medium') size?: XSize;\r\n /\r\n @zh_CN 缩起菜单\r\n * @en_US Shrink menu\r\n /\r\n @Input() @XInputBoolean() collapsed: XBoolean = false;\r\n /\r\n @zh_CN 触发方式，只针对横向布局\r\n * @en_US Trigger mode, only for horizontal layout\r\n /\r\n @Input() @XWithConfig<XMenuTrigger>(X_CONFIG_NAME, 'hover') trigger?: XMenuTrigger;\r\n /\r\n @zh_CN 节点模板\r\n * @en_US Node template\r\n /\r\n @Input() nodeTpl?: TemplateRef<any>;\r\n /\r\n @zh_CN 展开的所有层级，只对 layout 布局为 'column' 的生效\r\n * @en_US All expanded levels are only effective for the layout of'column'\r\n /\r\n @Input() @XInputBoolean() expandedAll?: XBoolean;\r\n /\r\n @zh_CN 默认展开的层级，只对 layout 布局为 'column' 的生效\r\n * @en_US The level expanded by default is only valid for the layout of'column'\r\n /\r\n @Input() @XInputNumber() expandedLevel: XNumber = -1;\r\n /\r\n @zh_CN 当前激活的节点 id\r\n * @en_US Currently active node id\r\n /\r\n @Input() activatedId: any;\r\n /\r\n @zh_CN 滚动容器\r\n * @en_US Rolling container\r\n /\r\n @Input() target?: string \| HTMLElement;\r\n /\r\n @zh_CN 弹框的最小宽度\r\n * @en_US Portal min-width\r\n /\r\n @Input() portalMinWidth?: string \| number;\r\n /\r\n @zh_CN 节点点击的事件\r\n * @en_US Node click event\r\n /\r\n @Output() nodeClick = new EventEmitter<XMenuNode>();\r\n /\r\n @zh_CN 节点点击的事件\r\n * @en_US Node click event\r\n /\r\n @Output() activatedIdChange = new EventEmitter<any>();\r\n}\r\n\r\n/\r\n @zh_CN MenuNode 节点数据\r\n * @en_US MenuNode node data\r\n /\r\nexport interface XMenuNode extends XParentIdentityProperty<XMenuNode> {\r\n /\r\n @zh_CN 图标\r\n * @en_US Icon\r\n /\r\n icon?: string;\r\n /\r\n @zh_CN 展开\r\n * @en_US Unfold\r\n /\r\n open?: boolean;\r\n /\r\n @zh_CN 子节点已加载过\r\n * @en_US Child node has been loaded\r\n /\r\n childrenLoaded?: boolean;\r\n /\r\n @zh_CN 分类显示，设置值后节点显示成分类样式\r\n * @en_US Category display, after setting the value, the node is displayed in a category style\r\n /\r\n category?: string;\r\n /\r\n @zh_CN 分类节点，通过内部计算\r\n * @en_US Classification node, through internal calculation\r\n /\r\n categoryNode?: boolean;\r\n /\r\n @zh_CN 检查更新\r\n * @en_US Check for updates\r\n /\r\n change?: Function;\r\n /\r\n @zh_CN 路由\r\n * @en_US Router\r\n /\r\n routerLink?: string \| any[];\r\n}\r\n\r\n/\r\n @zh_CN 布局方式\r\n * @en_US Layout\r\n /\r\nexport type XMenuLayout = 'row' \| 'column';\r\n\r\n/\r\n @zh_CN 触发方式\r\n * @en_US Trigger method\r\n /\r\nexport type XMenuTrigger = XTrigger;\r\n\r\n/\r\n Menu Node\r\n * @selector x-menu-node\r\n * @decorator component\r\n /\r\nexport const XMenuNodePrefix = 'x-menu-node';\r\n\r\n/\r\n Menu Node Property\r\n /\r\n@Component({ template: '' })\r\nexport class XMenuNodeProperty extends XProperty {\r\n /\r\n @zh_CN 节点数据\r\n * @en_US Node data\r\n /\r\n @Input() node!: XMenuNode;\r\n}\r\n","import { Component, ViewEncapsulation, ChangeDetectionStrategy, ChangeDetectorRef, ElementRef, Input } from '@angular/core';\r\nimport { XMenuNodeProperty, XMenuNodePrefix } from './menu.property';\r\nimport { XConfigService } from '@ng-nest/ui/core';\r\n\r\n@Component({\r\n selector: `${XMenuNodePrefix}`,\r\n templateUrl: './menu-node.component.html',\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class XMenuNodeComponent extends XMenuNodeProperty {\r\n @Input() menu: any;\r\n constructor(\r\n // @Host() @Optional() public menu: XMenuComponent,\r\n public cdr: ChangeDetectorRef,\r\n public elementRef: ElementRef,\r\n public configService: XConfigService\r\n ) {\r\n super();\r\n }\r\n ngOnInit() {\r\n if (this.menu?.activatedId == this.node.id) {\r\n this.menu.activatedElementRef = this.elementRef;\r\n }\r\n this.node.change = () => {\r\n this.cdr.detectChanges();\r\n };\r\n }\r\n}\r\n","<a ngIf=\"node.routerLink && !node.leaf; else menuTpl\" [routerLink]=\"node.routerLink\">\r\n <ng-container ngTemplateOutlet=\"menuTpl\"></ng-container>\r\n</a>\r\n\r\n<ng-template #menuTpl>\r\n <x-icon class=\"x-menu-icon\" ngIf=\"node.icon\" [type]=\"node.icon\"></x-icon>\r\n <span class=\"x-menu-text\" ngIf=\"node.label\">{{ node.label }}</span>\r\n <x-icon class=\"x-menu-arrow\" ngIf=\"node.leaf\" [class.is-open]=\"node.open\" type=\"fto-chevron-down\"></x-icon>\r\n</ng-template>\r\n","import {\r\n Component,\r\n OnInit,\r\n ViewEncapsulation,\r\n Renderer2,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n ChangeDetectionStrategy,\r\n SimpleChanges,\r\n OnChanges,\r\n OnDestroy,\r\n AfterViewInit,\r\n Inject\r\n} from '@angular/core';\r\nimport { XMenuPrefix, XMenuNode, XMenuProperty } from './menu.property';\r\nimport { XClassMap, XIsChange, XIsEmpty, XSetData, groupBy, XConfigService } from '@ng-nest/ui/core';\r\nimport { Subject } from 'rxjs';\r\nimport { DOCUMENT } from '@angular/common';\r\n\r\n@Component({\r\n selector: `${XMenuPrefix}`,\r\n templateUrl: './menu.component.html',\r\n styleUrls: ['./menu.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class XMenuComponent extends XMenuProperty implements OnInit, OnChanges, OnDestroy, AfterViewInit {\r\n showCategory = false;\r\n get scroll(): HTMLElement {\r\n return this._target;\r\n }\r\n nodeClassMap: XClassMap = {};\r\n datas: XMenuNode[] = [];\r\n nodes: XMenuNode[] = [];\r\n rootIndex: number = 0;\r\n activated!: XMenuNode;\r\n activatedElementRef!: ElementRef;\r\n expanded: any[] = [];\r\n private _unSubject = new Subject<void>();\r\n private _target!: HTMLElement;\r\n\r\n constructor(\r\n public renderer: Renderer2,\r\n public elementRef: ElementRef,\r\n public cdr: ChangeDetectorRef,\r\n @Inject(DOCUMENT) public doc: any,\r\n public configService: XConfigService\r\n ) {\r\n super();\r\n }\r\n\r\n ngOnInit() {\r\n this.setClassMap();\r\n }\r\n\r\n ngOnChanges(changes: SimpleChanges) {\r\n const { data, activatedId, collapsed, target } = changes;\r\n XIsChange(data) && this.setData();\r\n XIsChange(activatedId) && this.setActivatedNode(this.datas);\r\n XIsChange(collapsed) && this.setClassMap();\r\n if (XIsChange(target)) {\r\n this._target = typeof this.target === 'string' ? this.doc.querySelector(this.target) : this.target;\r\n }\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this._unSubject.next();\r\n this._unSubject.unsubscribe();\r\n }\r\n\r\n ngAfterViewInit() {\r\n if (this.activatedElementRef && this.scroll) {\r\n const nodeRect: DOMRect = this.activatedElementRef.nativeElement.getBoundingClientRect();\r\n const scrollRect: DOMRect = this.scroll.getBoundingClientRect();\r\n let scrollTop = nodeRect.top - scrollRect.top - scrollRect.height;\r\n if (scrollTop > 0) {\r\n let offset = 0;\r\n while (offset < scrollRect.height / 2) {\r\n offset = offset + nodeRect.height;\r\n }\r\n this.scroll.scrollTop = scrollTop + offset;\r\n }\r\n }\r\n }\r\n\r\n onNodeClick(node: XMenuNode) {\r\n if (!this.collapsed) {\r\n this.rootIndex = this.nodes.indexOf(this.getRoot(node));\r\n this.activatedId = node.id;\r\n this.activated = node;\r\n this.nodeClick.emit(node);\r\n this.activatedIdChange.emit(node.id);\r\n this.cdr.detectChanges();\r\n } else {\r\n this.onToggle(null, node, true);\r\n }\r\n }\r\n\r\n rootIndexChange(index: number) {\r\n this.rootIndex = index;\r\n let node = this.nodes[index];\r\n this.activatedId = node.id;\r\n this.activated = node;\r\n this.nodeClick.emit(node);\r\n this.activatedIdChange.emit(node.id);\r\n this.cdr.detectChanges();\r\n }\r\n\r\n onToggle(event: Event \| null, node: XMenuNode, isDropdown = false) {\r\n if ((this.collapsed && !isDropdown) \|\| node.categoryNode) return;\r\n if (!node.leaf) {\r\n this.activated = node;\r\n } else {\r\n event?.stopPropagation();\r\n node.open = !node.open;\r\n if (node.open && !node.childrenLoaded) {\r\n node.childrenLoaded = true;\r\n }\r\n }\r\n this.nodeClick.emit(node);\r\n node.change && node.change();\r\n this.cdr.detectChanges();\r\n }\r\n\r\n setClassMap() {\r\n this.classMap[`${XMenuPrefix}-${this.layout}`] = this.layout ? true : false;\r\n this.classMap[`${XMenuPrefix}-collapsed`] = Boolean(this.collapsed);\r\n this.nodeClassMap[`x-size-${this.size}`] = this.size ? true : false;\r\n this.cdr.detectChanges();\r\n }\r\n\r\n private setData() {\r\n XSetData<XMenuNode>(this.data, this._unSubject).subscribe((x) => {\r\n this.setDataChange(x);\r\n });\r\n }\r\n\r\n private setDataChange(value: XMenuNode[]) {\r\n !XIsEmpty(this.activatedId) && this.setActivatedNode(value);\r\n let handlerDatas: XMenuNode[] = [];\r\n const getChildren = (node: XMenuNode, level: number) => {\r\n node.level = level;\r\n node.children = value.filter((y) => y.pid === node.id);\r\n node.leaf = node.children?.length > 0;\r\n if (node.leaf) {\r\n node.open = Boolean(this.expandedAll) \|\| level <= this.expandedLevel \|\| this.expanded.indexOf(node.id) >= 0;\r\n node.childrenLoaded = node.open;\r\n node.children.map((y) => getChildren(y, level + 1));\r\n node.children = this.setCategory(node.children);\r\n }\r\n handlerDatas = [...handlerDatas, node];\r\n return node;\r\n };\r\n\r\n this.nodes = this.setCategory(value.filter((x) => XIsEmpty(x.pid))).map((x) => getChildren(x, 0));\r\n this.datas = handlerDatas;\r\n this.cdr.detectChanges();\r\n }\r\n\r\n private getRoot(value: XMenuNode) {\r\n let root = value;\r\n const getParent = (node: XMenuNode) => {\r\n const parent = this.datas.find((x) => node.pid === x.id) as XMenuNode;\r\n if (XIsEmpty(parent?.pid)) root = parent;\r\n else getParent(parent);\r\n };\r\n if (!XIsEmpty(value.pid)) getParent(value);\r\n return root;\r\n }\r\n\r\n setCategory(nodes: XMenuNode[]) {\r\n const group = groupBy(nodes as XMenuNode[], 'category');\r\n for (let list of group) {\r\n const first = list[0];\r\n if (first.category) {\r\n list.unshift({\r\n id: `${first.pid}__${first.category}`,\r\n pid: first.pid,\r\n label: first.category,\r\n level: first.level,\r\n categoryNode: true\r\n });\r\n }\r\n }\r\n let con: XMenuNode[] = [];\r\n group.map((x) => {\r\n con = con.concat(x);\r\n });\r\n return con;\r\n }\r\n\r\n setActivatedNode(nodes: XMenuNode[]) {\r\n this.activated = nodes.find((x) => x.id == this.activatedId) as XMenuNode;\r\n this.rootIndex = nodes.findIndex((x) => x.id == this.activatedId && !x.pid);\r\n if (this.activated) {\r\n this.setParentOpen(nodes, this.activated);\r\n }\r\n }\r\n\r\n setParentOpen(nodes: XMenuNode[], node: XMenuNode) {\r\n const getParent = (child: XMenuNode) => {\r\n if (XIsEmpty(child.pid)) return;\r\n const parent = nodes.find((x) => x.id === child.pid) as XMenuNode;\r\n if (!XIsEmpty(parent)) {\r\n this.expanded = [...this.expanded, parent.id];\r\n getParent(parent);\r\n }\r\n };\r\n getParent(node);\r\n }\r\n\r\n trackByNode(_index: number, item: XMenuNode) {\r\n return item.id;\r\n }\r\n}\r\n","<div #menu class=\"x-menu\" [ngClass]=\"classMap\">\r\n <div class=\"x-menu-nodes\" ngIf=\"layout === 'column'\">\r\n <ng-container ngFor=\"let node of nodes; trackBy: trackByNode\">\r\n <ng-container ngTemplateOutlet=\"nodeColumnTpl; context: { $node: node, $children: true }\"></ng-container>\r\n </ng-container>\r\n </div>\r\n <x-slider\r\n ngIf=\"layout === 'row'\"\r\n [data]=\"nodes\"\r\n [size]=\"size\"\r\n [nodeTpl]=\"nodeRowTpl\"\r\n [nodeJustify]=\"'center'\"\r\n [activatedIndex]=\"rootIndex\"\r\n (indexChange)=\"rootIndexChange($event)\"\r\n ></x-slider>\r\n</div>\r\n\r\n<ng-template #nodeTpl let-node=\"$node\">\r\n <x-dropdown\r\n ngIf=\"node.level === 0 && collapsed\"\r\n [disabled]=\"!node.leaf\"\r\n [data]=\"node.children\"\r\n [trigger]=\"trigger\"\r\n placement=\"right-start\"\r\n (nodeClick)=\"onNodeClick($event)\"\r\n [portalMinWidth]=\"portalMinWidth\"\r\n children\r\n >\r\n <x-menu-node [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n </x-dropdown>\r\n <x-menu-node ngIf=\"!collapsed\" [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n</ng-template>\r\n\r\n<ng-template #nodeRowTpl let-node=\"$node\">\r\n <x-dropdown\r\n [disabled]=\"!node.leaf\"\r\n [data]=\"node.children\"\r\n [trigger]=\"trigger\"\r\n (nodeClick)=\"onNodeClick($event)\"\r\n [portalMinWidth]=\"portalMinWidth\"\r\n children\r\n >\r\n <div class=\"x-menu-node\" [ngClass]=\"nodeClassMap\">\r\n <ng-container ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n </div>\r\n </x-dropdown>\r\n</ng-template>\r\n\r\n<ng-template #nodeColumnTpl let-node=\"$node\">\r\n <div\r\n class=\"x-menu-node\"\r\n [class.x-activated]=\"activated?.id === node.id\"\r\n [class.x-menu-category]=\"node.categoryNode\"\r\n [ngClass]=\"nodeClassMap\"\r\n (click)=\"onToggle($event, node)\"\r\n [style.padding-left.rem]=\"(node.level + 1) 0.875\"\r\n >\r\n <ng-container ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n </div>\r\n <div class=\"x-menu-nodes\" ngIf=\"node.childrenLoaded \|\| (node.leaf && node.open)\" [hidden]=\"!node.open\">\r\n <ng-container ngFor=\"let child of node.children; trackBy: trackByNode\">\r\n <ng-container ngTemplateOutlet=\"nodeColumnTpl; context: { $node: child }\"></ng-container>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XMenuComponent } from './menu.component';\r\nimport { XMenuNodeComponent } from './menu-node.component';\r\nimport { XDropdownModule } from '@ng-nest/ui/dropdown';\r\nimport { XSliderModule } from '@ng-nest/ui/slider';\r\nimport { XIconModule } from '@ng-nest/ui/icon';\r\nimport { XMenuProperty, XMenuNodeProperty } from './menu.property';\r\nimport { RouterModule } from '@angular/router';\r\n\r\n@NgModule({\r\n declarations: [XMenuComponent, XMenuNodeComponent, XMenuProperty, XMenuNodeProperty],\r\n exports: [XMenuComponent, XMenuNodeComponent],\r\n imports: [CommonModule, RouterModule, XDropdownModule, XSliderModule, XIconModule]\r\n})\r\nexport class XMenuModule {}\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"ng-nest-ui-menu.mjs","sources":["../../../../lib/ng-nest/ui/menu/menu.property.ts","../../../../lib/ng-nest/ui/menu/menu-node.component.ts","../../../../lib/ng-nest/ui/menu/menu-node.component.html","../../../../lib/ng-nest/ui/menu/menu.component.ts","../../../../lib/ng-nest/ui/menu/menu.component.html","../../../../lib/ng-nest/ui/menu/menu.module.ts","../../../../lib/ng-nest/ui/menu/ng-nest-ui-menu.ts"],"sourcesContent":["import {\r\n XParentIdentityProperty,\r\n XData,\r\n XSize,\r\n XProperty,\r\n XDataConvert,\r\n XInputNumber,\r\n XNumber,\r\n XInputBoolean,\r\n XBoolean,\r\n XWithConfig,\r\n XTrigger\r\n} from '@ng-nest/ui/core';\r\nimport { TemplateRef, Input, Output, EventEmitter, Component } from '@angular/core';\r\n\r\n/*\r\n Menu\r\n * @selector x-menu\r\n * @decorator component\r\n /\r\nexport const XMenuPrefix = 'x-menu';\r\nconst X_CONFIG_NAME = 'menu';\r\n\r\n/\r\n Menu Property\r\n /\r\n@Component({ template: '' })\r\nexport class XMenuProperty extends XProperty {\r\n /\r\n @zh_CN 节点数据\r\n * @en_US Node data\r\n /\r\n @Input() @XDataConvert() data: XData<XMenuNode> = [];\r\n /\r\n @zh_CN 布局方向\r\n * @en_US Layout direction\r\n /\r\n @Input() layout: XMenuLayout = 'row';\r\n /\r\n @zh_CN 尺寸\r\n * @en_US Size\r\n /\r\n @Input() @XWithConfig<XSize>(X_CONFIG_NAME, 'medium') size!: XSize;\r\n /\r\n @zh_CN 宽度，只有布局 layout 为 'column' 生效\r\n * @en_US Width, only layout layout is the 'column'\r\n /\r\n @Input() @XWithConfig<string>(X_CONFIG_NAME, '12rem') width!: string;\r\n /\r\n @zh_CN 缩起菜单\r\n * @en_US Shrink menu\r\n /\r\n @Input() @XInputBoolean() collapsed: XBoolean = false;\r\n /\r\n @zh_CN 触发方式，只针对横向布局\r\n * @en_US Trigger mode, only for horizontal layout\r\n /\r\n @Input() @XWithConfig<XMenuTrigger>(X_CONFIG_NAME, 'hover') trigger!: XMenuTrigger;\r\n /\r\n @zh_CN 节点模板\r\n * @en_US Node template\r\n /\r\n @Input() nodeTpl?: TemplateRef<any>;\r\n /\r\n @zh_CN 展开的所有层级，只对 layout 布局为 'column' 的生效\r\n * @en_US All expanded levels are only effective for the layout of'column'\r\n /\r\n @Input() @XInputBoolean() expandedAll?: XBoolean;\r\n /\r\n @zh_CN 默认展开的层级，只对 layout 布局为 'column' 的生效\r\n * @en_US The level expanded by default is only valid for the layout of'column'\r\n /\r\n @Input() @XInputNumber() expandedLevel: XNumber = -1;\r\n /\r\n @zh_CN 当前激活的节点 id\r\n * @en_US Currently active node id\r\n /\r\n @Input() activatedId: any;\r\n /\r\n @zh_CN 滚动容器\r\n * @en_US Rolling container\r\n /\r\n @Input() target?: string \| HTMLElement;\r\n /\r\n @zh_CN 弹框的最小宽度\r\n * @en_US Portal min-width\r\n /\r\n @Input() portalMinWidth?: string \| number;\r\n /\r\n @zh_CN 节点点击的事件\r\n * @en_US Node click event\r\n /\r\n @Output() nodeClick = new EventEmitter<XMenuNode>();\r\n /\r\n @zh_CN 节点点击的事件\r\n * @en_US Node click event\r\n /\r\n @Output() activatedIdChange = new EventEmitter<any>();\r\n}\r\n\r\n/\r\n @zh_CN MenuNode 节点数据\r\n * @en_US MenuNode node data\r\n /\r\nexport interface XMenuNode extends XParentIdentityProperty<XMenuNode> {\r\n /\r\n @zh_CN 图标\r\n * @en_US Icon\r\n /\r\n icon?: string;\r\n /\r\n @zh_CN 展开\r\n * @en_US Unfold\r\n /\r\n open?: boolean;\r\n /\r\n @zh_CN 子节点已加载过\r\n * @en_US Child node has been loaded\r\n /\r\n childrenLoaded?: boolean;\r\n /\r\n @zh_CN 分类显示，设置值后节点显示成分类样式\r\n * @en_US Category display, after setting the value, the node is displayed in a category style\r\n /\r\n category?: string;\r\n /\r\n @zh_CN 分类节点，通过内部计算\r\n * @en_US Classification node, through internal calculation\r\n /\r\n categoryNode?: boolean;\r\n /\r\n @zh_CN 检查更新\r\n * @en_US Check for updates\r\n /\r\n change?: Function;\r\n /\r\n @zh_CN 路由\r\n * @en_US Router\r\n /\r\n routerLink?: string \| any[];\r\n}\r\n\r\n/\r\n @zh_CN 布局方式\r\n * @en_US Layout\r\n /\r\nexport type XMenuLayout = 'row' \| 'column';\r\n\r\n/\r\n @zh_CN 触发方式\r\n * @en_US Trigger method\r\n /\r\nexport type XMenuTrigger = XTrigger;\r\n\r\n/\r\n Menu Node\r\n * @selector x-menu-node\r\n * @decorator component\r\n /\r\nexport const XMenuNodePrefix = 'x-menu-node';\r\n\r\n/\r\n Menu Node Property\r\n /\r\n@Component({ template: '' })\r\nexport class XMenuNodeProperty extends XProperty {\r\n /\r\n @zh_CN 节点数据\r\n * @en_US Node data\r\n /\r\n @Input() node!: XMenuNode;\r\n}\r\n","import { Component, ViewEncapsulation, ChangeDetectionStrategy, ChangeDetectorRef, ElementRef, Input } from '@angular/core';\r\nimport { XMenuNodeProperty, XMenuNodePrefix } from './menu.property';\r\nimport { XConfigService } from '@ng-nest/ui/core';\r\n\r\n@Component({\r\n selector: `${XMenuNodePrefix}`,\r\n templateUrl: './menu-node.component.html',\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class XMenuNodeComponent extends XMenuNodeProperty {\r\n @Input() menu: any;\r\n constructor(\r\n // @Host() @Optional() public menu: XMenuComponent,\r\n public cdr: ChangeDetectorRef,\r\n public elementRef: ElementRef,\r\n public configService: XConfigService\r\n ) {\r\n super();\r\n }\r\n ngOnInit() {\r\n if (this.menu?.activatedId == this.node.id) {\r\n this.menu.activatedElementRef = this.elementRef;\r\n }\r\n this.node.change = () => {\r\n this.cdr.detectChanges();\r\n };\r\n }\r\n}\r\n","<a ngIf=\"node.routerLink && !node.leaf; else menuTpl\" [routerLink]=\"node.routerLink\">\r\n <ng-container ngTemplateOutlet=\"menuTpl\"></ng-container>\r\n</a>\r\n\r\n<ng-template #menuTpl>\r\n <x-icon class=\"x-menu-icon\" ngIf=\"node.icon\" [type]=\"node.icon\"></x-icon>\r\n <span class=\"x-menu-text\" ngIf=\"node.label\">{{ node.label }}</span>\r\n <x-icon class=\"x-menu-arrow\" ngIf=\"node.leaf\" [class.is-open]=\"node.open\" type=\"fto-chevron-down\"></x-icon>\r\n</ng-template>\r\n","import {\r\n Component,\r\n OnInit,\r\n ViewEncapsulation,\r\n Renderer2,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n ChangeDetectionStrategy,\r\n SimpleChanges,\r\n OnChanges,\r\n OnDestroy,\r\n AfterViewInit,\r\n Inject\r\n} from '@angular/core';\r\nimport { XMenuPrefix, XMenuNode, XMenuProperty } from './menu.property';\r\nimport { XClassMap, XIsChange, XIsEmpty, XSetData, groupBy, XConfigService } from '@ng-nest/ui/core';\r\nimport { Subject } from 'rxjs';\r\nimport { DOCUMENT } from '@angular/common';\r\n\r\n@Component({\r\n selector: `${XMenuPrefix}`,\r\n templateUrl: './menu.component.html',\r\n styleUrls: ['./menu.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class XMenuComponent extends XMenuProperty implements OnInit, OnChanges, OnDestroy, AfterViewInit {\r\n showCategory = false;\r\n get scroll(): HTMLElement {\r\n return this._target;\r\n }\r\n nodeClassMap: XClassMap = {};\r\n datas: XMenuNode[] = [];\r\n nodes: XMenuNode[] = [];\r\n rootIndex: number = 0;\r\n activated!: XMenuNode;\r\n activatedElementRef!: ElementRef;\r\n expanded: any[] = [];\r\n private _unSubject = new Subject<void>();\r\n private _target!: HTMLElement;\r\n\r\n constructor(\r\n public renderer: Renderer2,\r\n public elementRef: ElementRef,\r\n public cdr: ChangeDetectorRef,\r\n @Inject(DOCUMENT) public doc: any,\r\n public configService: XConfigService\r\n ) {\r\n super();\r\n }\r\n\r\n ngOnInit() {\r\n this.setClassMap();\r\n }\r\n\r\n ngOnChanges(changes: SimpleChanges) {\r\n const { data, activatedId, collapsed, target } = changes;\r\n XIsChange(data) && this.setData();\r\n XIsChange(activatedId) && this.setActivatedNode(this.datas);\r\n XIsChange(collapsed) && this.setClassMap();\r\n if (XIsChange(target)) {\r\n this._target = typeof this.target === 'string' ? this.doc.querySelector(this.target) : this.target;\r\n }\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this._unSubject.next();\r\n this._unSubject.unsubscribe();\r\n }\r\n\r\n ngAfterViewInit() {\r\n if (this.activatedElementRef && this.scroll) {\r\n const nodeRect: DOMRect = this.activatedElementRef.nativeElement.getBoundingClientRect();\r\n const scrollRect: DOMRect = this.scroll.getBoundingClientRect();\r\n let scrollTop = nodeRect.top - scrollRect.top - scrollRect.height;\r\n if (scrollTop > 0) {\r\n let offset = 0;\r\n while (offset < scrollRect.height / 2) {\r\n offset = offset + nodeRect.height;\r\n }\r\n this.scroll.scrollTop = scrollTop + offset;\r\n }\r\n }\r\n }\r\n\r\n onNodeClick(node: XMenuNode) {\r\n if (!this.collapsed) {\r\n this.rootIndex = this.nodes.indexOf(this.getRoot(node));\r\n this.activatedId = node.id;\r\n this.activated = node;\r\n this.nodeClick.emit(node);\r\n this.activatedIdChange.emit(node.id);\r\n this.cdr.detectChanges();\r\n } else {\r\n this.onToggle(null, node, true);\r\n }\r\n }\r\n\r\n rootIndexChange(index: number) {\r\n this.rootIndex = index;\r\n let node = this.nodes[index];\r\n this.activatedId = node.id;\r\n this.activated = node;\r\n this.nodeClick.emit(node);\r\n this.activatedIdChange.emit(node.id);\r\n this.cdr.detectChanges();\r\n }\r\n\r\n onToggle(event: Event \| null, node: XMenuNode, isDropdown = false) {\r\n if ((this.collapsed && !isDropdown) \|\| node.categoryNode) return;\r\n if (!node.leaf) {\r\n this.activated = node;\r\n } else {\r\n event?.stopPropagation();\r\n node.open = !node.open;\r\n if (node.open && !node.childrenLoaded) {\r\n node.childrenLoaded = true;\r\n }\r\n }\r\n this.nodeClick.emit(node);\r\n node.change && node.change();\r\n this.cdr.detectChanges();\r\n }\r\n\r\n setClassMap() {\r\n this.classMap[`${XMenuPrefix}-${this.layout}`] = this.layout ? true : false;\r\n this.classMap[`${XMenuPrefix}-collapsed`] = Boolean(this.collapsed);\r\n this.nodeClassMap[`x-size-${this.size}`] = this.size ? true : false;\r\n this.cdr.detectChanges();\r\n }\r\n\r\n private setData() {\r\n XSetData<XMenuNode>(this.data, this._unSubject).subscribe((x) => {\r\n this.setDataChange(x);\r\n });\r\n }\r\n\r\n private setDataChange(value: XMenuNode[]) {\r\n !XIsEmpty(this.activatedId) && this.setActivatedNode(value);\r\n let handlerDatas: XMenuNode[] = [];\r\n const getChildren = (node: XMenuNode, level: number) => {\r\n node.level = level;\r\n node.children = value.filter((y) => y.pid === node.id);\r\n node.leaf = node.children?.length > 0;\r\n if (node.leaf) {\r\n node.open = Boolean(this.expandedAll) \|\| level <= this.expandedLevel \|\| this.expanded.indexOf(node.id) >= 0;\r\n node.childrenLoaded = node.open;\r\n node.children.map((y) => getChildren(y, level + 1));\r\n node.children = this.setCategory(node.children);\r\n }\r\n handlerDatas = [...handlerDatas, node];\r\n return node;\r\n };\r\n\r\n this.nodes = this.setCategory(value.filter((x) => XIsEmpty(x.pid))).map((x) => getChildren(x, 0));\r\n this.datas = handlerDatas;\r\n this.cdr.detectChanges();\r\n }\r\n\r\n private getRoot(value: XMenuNode) {\r\n let root = value;\r\n const getParent = (node: XMenuNode) => {\r\n const parent = this.datas.find((x) => node.pid === x.id) as XMenuNode;\r\n if (XIsEmpty(parent?.pid)) root = parent;\r\n else getParent(parent);\r\n };\r\n if (!XIsEmpty(value.pid)) getParent(value);\r\n return root;\r\n }\r\n\r\n setCategory(nodes: XMenuNode[]) {\r\n const group = groupBy(nodes as XMenuNode[], 'category');\r\n for (let list of group) {\r\n const first = list[0];\r\n if (first.category) {\r\n list.unshift({\r\n id: `${first.pid}__${first.category}`,\r\n pid: first.pid,\r\n label: first.category,\r\n level: first.level,\r\n categoryNode: true\r\n });\r\n }\r\n }\r\n let con: XMenuNode[] = [];\r\n group.map((x) => {\r\n con = con.concat(x);\r\n });\r\n return con;\r\n }\r\n\r\n setActivatedNode(nodes: XMenuNode[]) {\r\n this.activated = nodes.find((x) => x.id == this.activatedId) as XMenuNode;\r\n this.rootIndex = nodes.findIndex((x) => x.id == this.activatedId && !x.pid);\r\n if (this.activated) {\r\n this.setParentOpen(nodes, this.activated);\r\n }\r\n }\r\n\r\n setParentOpen(nodes: XMenuNode[], node: XMenuNode) {\r\n const getParent = (child: XMenuNode) => {\r\n if (XIsEmpty(child.pid)) return;\r\n const parent = nodes.find((x) => x.id === child.pid) as XMenuNode;\r\n if (!XIsEmpty(parent)) {\r\n this.expanded = [...this.expanded, parent.id];\r\n getParent(parent);\r\n }\r\n };\r\n getParent(node);\r\n }\r\n\r\n trackByNode(_index: number, item: XMenuNode) {\r\n return item.id;\r\n }\r\n}\r\n","<div #menu class=\"x-menu\" [ngClass]=\"classMap\" [style.width]=\"layout === 'column' ? width : ''\">\r\n <div class=\"x-menu-nodes\" ngIf=\"layout === 'column'\">\r\n <ng-container ngFor=\"let node of nodes; trackBy: trackByNode\">\r\n <ng-container ngTemplateOutlet=\"nodeColumnTpl; context: { $node: node, $children: true }\"></ng-container>\r\n </ng-container>\r\n </div>\r\n <x-slider\r\n ngIf=\"layout === 'row'\"\r\n [data]=\"nodes\"\r\n [size]=\"size\"\r\n [nodeTpl]=\"nodeRowTpl\"\r\n [nodeJustify]=\"'center'\"\r\n [activatedIndex]=\"rootIndex\"\r\n (indexChange)=\"rootIndexChange($event)\"\r\n ></x-slider>\r\n</div>\r\n\r\n<ng-template #nodeTpl let-node=\"$node\">\r\n <x-dropdown\r\n ngIf=\"node.level === 0 && collapsed\"\r\n [disabled]=\"!node.leaf\"\r\n [data]=\"node.children\"\r\n [trigger]=\"trigger\"\r\n placement=\"right-start\"\r\n (nodeClick)=\"onNodeClick($event)\"\r\n [portalMinWidth]=\"portalMinWidth\"\r\n children\r\n >\r\n <x-menu-node [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n </x-dropdown>\r\n <x-menu-node ngIf=\"!collapsed\" [node]=\"node\" [menu]=\"this\"></x-menu-node>\r\n</ng-template>\r\n\r\n<ng-template #nodeRowTpl let-node=\"$node\">\r\n <x-dropdown\r\n [disabled]=\"!node.leaf\"\r\n [data]=\"node.children\"\r\n [trigger]=\"trigger\"\r\n (nodeClick)=\"onNodeClick($event)\"\r\n [portalMinWidth]=\"portalMinWidth\"\r\n children\r\n >\r\n <div class=\"x-menu-node\" [ngClass]=\"nodeClassMap\">\r\n <ng-container ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n </div>\r\n </x-dropdown>\r\n</ng-template>\r\n\r\n<ng-template #nodeColumnTpl let-node=\"$node\">\r\n <div\r\n class=\"x-menu-node\"\r\n [class.x-activated]=\"activated?.id === node.id\"\r\n [class.x-menu-category]=\"node.categoryNode\"\r\n [ngClass]=\"nodeClassMap\"\r\n (click)=\"onToggle($event, node)\"\r\n [style.padding-left.rem]=\"(node.level + 1) 0.875\"\r\n >\r\n <ng-container ngTemplateOutlet=\"nodeTpl; context: { $node: node }\"></ng-container>\r\n </div>\r\n <div class=\"x-menu-nodes\" ngIf=\"node.childrenLoaded \|\| (node.leaf && node.open)\" [hidden]=\"!node.open\">\r\n <ng-container ngFor=\"let child of node.children; trackBy: trackByNode\">\r\n <ng-container ngTemplateOutlet=\"nodeColumnTpl; context: { $node: child }\"></ng-container>\r\n </ng-container>\r\n </div>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XMenuComponent } from './menu.component';\r\nimport { XMenuNodeComponent } from './menu-node.component';\r\nimport { XDropdownModule } from '@ng-nest/ui/dropdown';\r\nimport { XSliderModule } from '@ng-nest/ui/slider';\r\nimport { XIconModule } from '@ng-nest/ui/icon';\r\nimport { XMenuProperty, XMenuNodeProperty } from './menu.property';\r\nimport { RouterModule } from '@angular/router';\r\n\r\n@NgModule({\r\n declarations: [XMenuComponent, XMenuNodeComponent, XMenuProperty, XMenuNodeProperty],\r\n exports: [XMenuComponent, XMenuNodeComponent],\r\n imports: [CommonModule, RouterModule, XDropdownModule, XSliderModule, XIconModule]\r\n})\r\nexport class XMenuModule {}\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAeA;;;;;MAKa,WAAW,GAAG,SAAS;AACpC,MAAM,aAAa,GAAG,MAAM,CAAC;AAE7B;;;MAIa,sBAAsB,SAAS;IAD5C;;;;;;QAM2B,SAAI,GAAqB,EAAE,CAAC;;;;;QAK5C,WAAM,GAAgB,KAAK,CAAC;;;;;QAeX,cAAS,GAAa,KAAK,CAAC;;;;;QAoB7B,kBAAa,GAAY,CAAC,CAAC,CAAC;;;;;QAoB3C,cAAS,GAAG,IAAI,YAAY,EAAa,CAAC;;;;;QAK1C,sBAAiB,GAAG,IAAI,YAAY,EAAO,CAAC;KACvD;;gJAvEY,aAAa;oIAAb,aAAa,8aADH,EAAE;AAME;IAAf,YAAY,EAAE;2CAA6B;AAUC;IAA5C,WAAW,CAAQ,aAAa,EAAE,QAAQ,CAAC;2CAAc;AAKb;IAA5C,WAAW,CAAS,aAAa,EAAE,OAAO,CAAC;4CAAgB;AAK3C;IAAhB,aAAa,EAAE;gDAA6B;AAKM;IAAlD,WAAW,CAAe,aAAa,EAAE,OAAO,CAAC;8CAAwB;AAUzD;IAAhB,aAAa,EAAE;kDAAwB;AAKxB;IAAf,YAAY,EAAE;oDAA6B;2FA7C1C,aAAa;kBADzB,SAAS;mBAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;8BAMA,IAAI;sBAA5B,KAAK;gBAKG,MAAM;sBAAd,KAAK;gBAKgD,IAAI;sBAAzD,KAAK;gBAKgD,KAAK;sBAA1D,KAAK;gBAKoB,SAAS;sBAAlC,KAAK;gBAKsD,OAAO;sBAAlE,KAAK;gBAKG,OAAO;sBAAf,KAAK;gBAKoB,WAAW;sBAApC,KAAK;gBAKmB,aAAa;sBAArC,KAAK;gBAKG,WAAW;sBAAnB,KAAK;gBAKG,MAAM;sBAAd,KAAK;gBAKG,cAAc;sBAAtB,KAAK;gBAKI,SAAS;sBAAlB,MAAM;gBAKG,iBAAiB;sBAA1B,MAAM;;AAyDT;;;;;MAKa,eAAe,GAAG,cAAc;AAE7C;;;MAIa,0BAA0B,SAAS;;oJAAnC,iBAAiB;wIAAjB,iBAAiB,qGADP,EAAE;2FACZ,iBAAiB;kBAD7B,SAAS;mBAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;8BAMhB,IAAI;sBAAZ,KAAK;;;MChKK,2BAA2B,iBAAiB;IAEvD;;IAES,GAAsB,EACtB,UAAsB,EACtB,aAA6B;QAEpC,KAAK,EAAE,CAAC;QAJD,QAAG,GAAH,GAAG,CAAmB;QACtB,eAAU,GAAV,UAAU,CAAY;QACtB,kBAAa,GAAb,aAAa,CAAgB;KAGrC;IACD,QAAQ;;QACN,IAAI,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,WAAW,KAAI,IAAI,CAAC,IAAI,CAAC,EAAE,EAAE;YAC1C,IAAI,CAAC,IAAI,CAAC,mBAAmB,GAAG,IAAI,CAAC,UAAU,CAAC;SACjD;QACD,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG;YACjB,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;SAC1B,CAAC;KACH;;qJAjBU,kBAAkB;yIAAlB,kBAAkB,oGCV/B,ufASA;2FDCa,kBAAkB;kBAN9B,SAAS;+BACE,GAAG,eAAe,EAAE,iBAEf,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM;8JAGtC,IAAI;sBAAZ,KAAK;;;MEeK,uBAAuB,aAAa;IAe/C,YACS,QAAmB,EACnB,UAAsB,EACtB,GAAsB,EACJ,GAAQ,EAC1B,aAA6B;QAEpC,KAAK,EAAE,CAAC;QAND,aAAQ,GAAR,QAAQ,CAAW;QACnB,eAAU,GAAV,UAAU,CAAY;QACtB,QAAG,GAAH,GAAG,CAAmB;QACJ,QAAG,GAAH,GAAG,CAAK;QAC1B,kBAAa,GAAb,aAAa,CAAgB;QAnBtC,iBAAY,GAAG,KAAK,CAAC;QAIrB,iBAAY,GAAc,EAAE,CAAC;QAC7B,UAAK,GAAgB,EAAE,CAAC;QACxB,UAAK,GAAgB,EAAE,CAAC;QACxB,cAAS,GAAW,CAAC,CAAC;QAGtB,aAAQ,GAAU,EAAE,CAAC;QACb,eAAU,GAAG,IAAI,OAAO,EAAQ,CAAC;KAWxC;IArBD,IAAI,MAAM;QACR,OAAO,IAAI,CAAC,OAAO,CAAC;KACrB;IAqBD,QAAQ;QACN,IAAI,CAAC,WAAW,EAAE,CAAC;KACpB;IAED,WAAW,CAAC,OAAsB;QAChC,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC;QACzD,SAAS,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;QAClC,SAAS,CAAC,WAAW,CAAC,IAAI,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC5D,SAAS,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;QAC3C,IAAI,SAAS,CAAC,MAAM,CAAC,EAAE;YACrB,IAAI,CAAC,OAAO,GAAG,OAAO,IAAI,CAAC,MAAM,KAAK,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,CAAC;SACpG;KACF;IAED,WAAW;QACT,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAC;QACvB,IAAI,CAAC,UAAU,CAAC,WAAW,EAAE,CAAC;KAC/B;IAED,eAAe;QACb,IAAI,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,MAAM,EAAE;YAC3C,MAAM,QAAQ,GAAY,IAAI,CAAC,mBAAmB,CAAC,aAAa,CAAC,qBAAqB,EAAE,CAAC;YACzF,MAAM,UAAU,GAAY,IAAI,CAAC,MAAM,CAAC,qBAAqB,EAAE,CAAC;YAChE,IAAI,SAAS,GAAG,QAAQ,CAAC,GAAG,GAAG,UAAU,CAAC,GAAG,GAAG,UAAU,CAAC,MAAM,CAAC;YAClE,IAAI,SAAS,GAAG,CAAC,EAAE;gBACjB,IAAI,MAAM,GAAG,CAAC,CAAC;gBACf,OAAO,MAAM,GAAG,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;oBACrC,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC;iBACnC;gBACD,IAAI,CAAC,MAAM,CAAC,SAAS,GAAG,SAAS,GAAG,MAAM,CAAC;aAC5C;SACF;KACF;IAED,WAAW,CAAC,IAAe;QACzB,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;YACnB,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;YACxD,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC;YAC3B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YAC1B,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YACrC,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;SAC1B;aAAM;YACL,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;SACjC;KACF;IAED,eAAe,CAAC,KAAa;QAC3B,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACvB,IAAI,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;QAC7B,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC;QAC3B,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;QACtB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC1B,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QACrC,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;IAED,QAAQ,CAAC,KAAmB,EAAE,IAAe,EAAE,UAAU,GAAG,KAAK;QAC/D,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,UAAU,KAAK,IAAI,CAAC,YAAY;YAAE,OAAO;QACjE,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;YACd,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;SACvB;aAAM;YACL,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,eAAe,EAAE,CAAC;YACzB,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;YACvB,IAAI,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;gBACrC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;aAC5B;SACF;QACD,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QAC1B,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;QAC7B,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;IAED,WAAW;QACT,IAAI,CAAC,QAAQ,CAAC,GAAG,WAAW,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,GAAG,IAAI,GAAG,KAAK,CAAC;QAC5E,IAAI,CAAC,QAAQ,CAAC,GAAG,WAAW,YAAY,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QACpE,IAAI,CAAC,YAAY,CAAC,UAAU,IAAI,CAAC,IAAI,EAAE,CAAC,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,KAAK,CAAC;QACpE,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;IAEO,OAAO;QACb,QAAQ,CAAY,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC;YAC1D,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;SACvB,CAAC,CAAC;KACJ;IAEO,aAAa,CAAC,KAAkB;QACtC,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC;QAC5D,IAAI,YAAY,GAAgB,EAAE,CAAC;QACnC,MAAM,WAAW,GAAG,CAAC,IAAe,EAAE,KAAa;;YACjD,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,EAAE,CAAC,CAAC;YACvD,IAAI,CAAC,IAAI,GAAG,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,MAAM,IAAG,CAAC,CAAC;YACtC,IAAI,IAAI,CAAC,IAAI,EAAE;gBACb,IAAI,CAAC,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,KAAK,IAAI,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;gBAC5G,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC;gBAChC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,WAAW,CAAC,CAAC,EAAE,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC;gBACpD,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;aACjD;YACD,YAAY,GAAG,CAAC,GAAG,YAAY,EAAE,IAAI,CAAC,CAAC;YACvC,OAAO,IAAI,CAAC;SACb,CAAC;QAEF,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,WAAW,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;QAClG,IAAI,CAAC,KAAK,GAAG,YAAY,CAAC;QAC1B,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;IAEO,OAAO,CAAC,KAAgB;QAC9B,IAAI,IAAI,GAAG,KAAK,CAAC;QACjB,MAAM,SAAS,GAAG,CAAC,IAAe;YAChC,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,EAAE,CAAc,CAAC;YACtE,IAAI,QAAQ,CAAC,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,GAAG,CAAC;gBAAE,IAAI,GAAG,MAAM,CAAC;;gBACpC,SAAS,CAAC,MAAM,CAAC,CAAC;SACxB,CAAC;QACF,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC;YAAE,SAAS,CAAC,KAAK,CAAC,CAAC;QAC3C,OAAO,IAAI,CAAC;KACb;IAED,WAAW,CAAC,KAAkB;QAC5B,MAAM,KAAK,GAAG,OAAO,CAAC,KAAoB,EAAE,UAAU,CAAC,CAAC;QACxD,KAAK,IAAI,IAAI,IAAI,KAAK,EAAE;YACtB,MAAM,KAAK,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC;YACtB,IAAI,KAAK,CAAC,QAAQ,EAAE;gBAClB,IAAI,CAAC,OAAO,CAAC;oBACX,EAAE,EAAE,GAAG,KAAK,CAAC,GAAG,KAAK,KAAK,CAAC,QAAQ,EAAE;oBACrC,GAAG,EAAE,KAAK,CAAC,GAAG;oBACd,KAAK,EAAE,KAAK,CAAC,QAAQ;oBACrB,KAAK,EAAE,KAAK,CAAC,KAAK;oBAClB,YAAY,EAAE,IAAI;iBACnB,CAAC,CAAC;aACJ;SACF;QACD,IAAI,GAAG,GAAgB,EAAE,CAAC;QAC1B,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC;YACV,GAAG,GAAG,GAAG,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;SACrB,CAAC,CAAC;QACH,OAAO,GAAG,CAAC;KACZ;IAED,gBAAgB,CAAC,KAAkB;QACjC,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,WAAW,CAAc,CAAC;QAC1E,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,IAAI,CAAC,WAAW,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;QAC5E,IAAI,IAAI,CAAC,SAAS,EAAE;YAClB,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;SAC3C;KACF;IAED,aAAa,CAAC,KAAkB,EAAE,IAAe;QAC/C,MAAM,SAAS,GAAG,CAAC,KAAgB;YACjC,IAAI,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC;gBAAE,OAAO;YAChC,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,KAAK,CAAC,GAAG,CAAc,CAAC;YAClE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;gBACrB,IAAI,CAAC,QAAQ,GAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,EAAE,MAAM,CAAC,EAAE,CAAC,CAAC;gBAC9C,SAAS,CAAC,MAAM,CAAC,CAAC;aACnB;SACF,CAAC;QACF,SAAS,CAAC,IAAI,CAAC,CAAC;KACjB;IAED,WAAW,CAAC,MAAc,EAAE,IAAe;QACzC,OAAO,IAAI,CAAC,EAAE,CAAC;KAChB;;iJA3LU,cAAc,sGAmBf,QAAQ;qIAnBP,cAAc,0FC1B3B,o8EAiEA;2FDvCa,cAAc;kBAP1B,SAAS;+BACE,GAAG,WAAW,EAAE,iBAGX,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM;;;8BAqB5C,MAAM;+BAAC,QAAQ;;;;ME9BP,WAAW;;8IAAX,WAAW;+IAAX,WAAW,iBAJP,cAAc,EAAE,kBAAkB,EAAE,aAAa,EAAE,iBAAiB,aAEzE,YAAY,EAAE,YAAY,EAAE,eAAe,EAAE,aAAa,EAAE,WAAW,aADvE,cAAc,EAAE,kBAAkB;+IAGjC,WAAW,YAFb,CAAC,YAAY,EAAE,YAAY,EAAE,eAAe,EAAE,aAAa,EAAE,WAAW,CAAC;2FAEvE,WAAW;kBALvB,QAAQ;mBAAC;oBACR,YAAY,EAAE,CAAC,cAAc,EAAE,kBAAkB,EAAE,aAAa,EAAE,iBAAiB,CAAC;oBACpF,OAAO,EAAE,CAAC,cAAc,EAAE,kBAAkB,CAAC;oBAC7C,OAAO,EAAE,CAAC,YAAY,EAAE,YAAY,EAAE,eAAe,EAAE,aAAa,EAAE,WAAW,CAAC;iBACnF;;;ACdD;;;;;;"}

package/fesm2015/ng-nest-ui-message.mjs CHANGED Viewed

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { Component, ViewEncapsulation, ChangeDetectionStrategy, Injectable, NgModule } from '@angular/core';
 import * as i2$1 from '@ng-nest/ui/core';
-import { XIsEmpty, XMoveAnimation, XIsString, XIsXTemplate, fillDefault } from '@ng-nest/ui/core';
+import { XIsEmpty, XMoveAnimation, XIsString, XIsXTemplate, fillDefault, XIsUndefined } from '@ng-nest/ui/core';
 import { of } from 'rxjs';
 import { delay } from 'rxjs/operators';
 import * as i1 from '@ng-nest/ui/alert';
@@ -25,7 +25,7 @@ class XMessageComponent {
         this.renderer = renderer;
         this.elementRef = elementRef;
         this.cdr = cdr;
-        this.message = { ref: {}, list: [], currentClose: () => { }, closeAll: () => { } };
+        this.message = { ref: {}, list: [], closeAll: () => { } };
     }
     onClose(item) {
         var _a, _b;
@@ -51,7 +51,7 @@ class XMessageComponent {
         }
     }
     trackByNode(_index, item) {
-        return `${item.title}-${item.content}`;
+        return item.id;
     }
 }
 /** @nocollapse */ /** @nocollapse */ XMessageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XMessageComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
@@ -61,6 +61,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImpor
             args: [{ selector: `${XMessagePrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: [XMoveAnimation], template: "<div class=\"x-message\">\r\n  <ng-container *ngFor=\"let item of message.list; trackBy: trackByNode\">\r\n    <x-alert\r\n      [@x-move-animation]=\"item.placement\"\r\n      (@x-move-animation.done)=\"moveDone($event)\"\r\n      (mouseenter)=\"onEnter(item)\"\r\n      (mouseleave)=\"onLeave(item)\"\r\n      (close)=\"onClose(item)\"\r\n      [hide]=\"item.hide\"\r\n      [title]=\"item.title\"\r\n      [content]=\"item.content\"\r\n      [type]=\"item.type\"\r\n      [effect]=\"item.effect\"\r\n      [hideClose]=\"item.hideClose\"\r\n      [closeText]=\"item.closeText\"\r\n      [showIcon]=\"item.showIcon\"\r\n      duration=\"0\"\r\n      manual\r\n      disabledAnimation\r\n    ></x-alert>\r\n  </ng-container>\r\n</div>\r\n", styles: [".x-message{margin:0;padding:0}.x-message>x-alert{padding:.25rem 0}.x-message>x-alert>.x-alert{box-shadow:var(--x-box-shadow) var(--x-box-shadow-light-color)}.x-message-portal x-message{width:100%}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }]; } });
+// TODO: add more function
+class XMessageRef {
+    constructor(option) {
+        this.close = () => { };
+        this.closeAll = () => { };
+        this.update = (_option) => { };
+        if (!option.id)
+            option.id = `${new Date().getTime()}`;
+        this.option = option;
+    }
+}
 class XMessageService {
     constructor(portal, configService) {
         this.portal = portal;
@@ -93,6 +105,9 @@ class XMessageService {
     error(option) {
         return this.createMessage(option, 'error');
     }
+    loading(option) {
+        return this.createMessage(option, 'loading');
+    }
     create(option) {
         const offset = XIsString(option.offset) ? [option.offset] : option.offset;
         return this.portal.attach({
@@ -113,7 +128,22 @@ class XMessageService {
             opt.type = type;
         }
         fillDefault(opt, this.default);
-        return this.createMessagePlacement(opt);
+        const ref = new XMessageRef(opt);
+        if (XIsUndefined(opt.placement)) {
+            return ref;
+        }
+        ref.close = () => {
+            this.removeMessage(opt);
+        };
+        ref.closeAll = () => {
+            this.closeAll();
+        };
+        ref.update = (_opt) => {
+            this.updateMessage(_opt, opt);
+        };
+        this.setDuration(opt);
+        this.createMessagePlacement(opt);
+        return ref;
     }
     closeAll(excludeOption) {
         for (let key in this.messages) {
@@ -124,28 +154,22 @@ class XMessageService {
     }
     createMessagePlacement(option) {
         var _a, _b;
-        if (typeof option.placement === 'undefined')
-            return { ref: {}, list: [], currentClose: () => { }, closeAll: () => { } };
         let msgPlacement = this.messages[option.placement];
-        this.setDuration(option);
         if (XIsEmpty(msgPlacement) || !((_b = (_a = msgPlacement.ref) === null || _a === void 0 ? void 0 : _a.overlayRef) === null || _b === void 0 ? void 0 : _b.hasAttached())) {
             this.messages[option.placement] = {
                 ref: this.create(option),
                 list: [option],
-                currentClose: () => {
-                    this.removeMessage(option);
-                },
                 closeAll: () => {
                     this.closeAll();
                 }
             };
+            msgPlacement = this.messages[option.placement];
         }
         else {
-            this.messages[option.placement].list = [...this.messages[option.placement].list, option];
+            msgPlacement.list = [...this.messages[option.placement].list, option];
         }
-        this.messageChange(this.messages[option.placement]);
+        this.messageChange(msgPlacement);
         option.displayType === 'single' && this.closeAll(option);
-        return this.messages[option.placement];
     }
     messageChange(message) {
         var _a, _b, _c, _d;
@@ -155,7 +179,7 @@ class XMessageService {
         message.ref.componentRef.instance.cdr.detectChanges();
     }
     setDuration(option) {
-        if (option.duration) {
+        if (option.duration && option.type !== 'loading') {
             option.duration$ = of(true)
                 .pipe(delay(option.duration))
                 .subscribe(() => {
@@ -169,6 +193,15 @@ class XMessageService {
             return;
         (_b = (_a = this.messages[option.placement].ref) === null || _a === void 0 ? void 0 : _a.componentRef) === null || _b === void 0 ? void 0 : _b.instance.onClose(option);
     }
+    updateMessage(newOption, oldOption) {
+        var _a;
+        Object.assign(oldOption, newOption);
+        this.setDuration(oldOption);
+        const refs = this.messages[oldOption.placement];
+        if (refs) {
+            (_a = refs.ref.componentRef) === null || _a === void 0 ? void 0 : _a.instance.cdr.detectChanges();
+        }
+    }
 }
 /** @nocollapse */ /** @nocollapse */ XMessageService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XMessageService, deps: [{ token: i1$1.XPortalService }, { token: i2$1.XConfigService }], target: i0.ɵɵFactoryTarget.Injectable });
 /** @nocollapse */ /** @nocollapse */ XMessageService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XMessageService });
@@ -195,5 +228,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImpor
  * Generated bundle index. Do not edit.
  */
-export { XMessageComponent, XMessageModule, XMessagePortal, XMessagePrefix, XMessageService, X_MESSAGE_CONFIG_NAME };
+export { XMessageComponent, XMessageModule, XMessagePortal, XMessagePrefix, XMessageRef, XMessageService, X_MESSAGE_CONFIG_NAME };
 //# sourceMappingURL=ng-nest-ui-message.mjs.map

package/fesm2015/ng-nest-ui-message.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ng-nest-ui-message.mjs","sources":["../../../../lib/ng-nest/ui/message/message.property.ts","../../../../lib/ng-nest/ui/message/message.component.ts","../../../../lib/ng-nest/ui/message/message.component.html","../../../../lib/ng-nest/ui/message/message.service.ts","../../../../lib/ng-nest/ui/message/message.module.ts","../../../../lib/ng-nest/ui/message/ng-nest-ui-message.ts"],"sourcesContent":["import { XStatus, XPlace } from '@ng-nest/ui/core';\r\nimport { XAlertOption } from '@ng-nest/ui/alert';\r\nimport { Subscription, Subject } from 'rxjs';\r\nimport { XPortalOverlayRef } from '@ng-nest/ui/portal';\r\nimport { XMessageComponent } from './message.component';\r\n\r\n/*\r\n Message\r\n * @selector x-message\r\n * @decorator component\r\n /\r\nexport const XMessagePrefix = 'x-message';\r\nexport const XMessagePortal = 'x-message-portal';\r\nexport const X_MESSAGE_CONFIG_NAME = 'message';\r\n\r\n/\r\n Message Option\r\n /\r\nexport interface XMessageOption extends XAlertOption {\r\n /\r\n @zh_CN 方位，九宫格\r\n * @en_US Direction, nine grid\r\n * @default 'top'\r\n * @withConfig true\r\n /\r\n placement?: XPlace;\r\n /\r\n @zh_CN 偏移距离\r\n * @en_US Offset distance\r\n * @default '2rem'\r\n * @withConfig true\r\n /\r\n offset?: string \| string[];\r\n /\r\n @zh_CN 类型\r\n * @en_US Types of\r\n * @default 'info'\r\n * @withConfig true\r\n /\r\n type?: XMessageType;\r\n /\r\n @zh_CN 多个消息的时候，显示类型\r\n * @en_US When multiple messages, the display type\r\n * @default 'list'\r\n * @withConfig true\r\n /\r\n displayType?: XMessageDisplayType;\r\n /\r\n @zh_CN 宽度\r\n * @en_US Width\r\n * @default '16rem'\r\n * @withConfig true\r\n /\r\n width?: string;\r\n /\r\n @zh_CN 高度\r\n * @en_US Height\r\n /\r\n height?: string;\r\n /\r\n @zh_CN 延迟关闭时间\r\n * @en_US Delay off time\r\n * @default 3000\r\n * @withConfig true\r\n /\r\n duration?: number;\r\n /\r\n @zh_CN 隐藏关闭按钮\r\n * @en_US Hide close button\r\n * @default true\r\n * @withConfig true\r\n /\r\n hideClose?: boolean;\r\n /\r\n @zh_CN 显示图标\r\n * @en_US Show icon\r\n * @default true\r\n * @withConfig true\r\n /\r\n showIcon?: boolean;\r\n /\r\n @zh_CN 延迟关闭订阅后的对象，用来释放或取消\r\n * @en_US Delayed closing the subscribed object, used to release or cancel\r\n /\r\n duration$?: Subscription \| null;\r\n /\r\n @zh_CN 延迟关闭订阅对象\r\n * @en_US Delay in closing the subscription object\r\n /\r\n durationSub?: Subject<any>;\r\n}\r\n\r\n/\r\n @zh_CN 创建的消息对象\r\n * @en_US Message object created\r\n /\r\nexport interface XMessageOverlayRef extends XPortalOverlayRef<XMessageComponent> {}\r\n\r\n/\r\n @zh_CN 九宫格中的消息对象\r\n * @en_US Message object in Jiugongge\r\n /\r\nexport interface XMessagePlacement {\r\n [property: string]: XMessageRef;\r\n}\r\n\r\nexport interface XMessageRef {\r\n ref: XMessageOverlayRef;\r\n list: XMessageOption[];\r\n currentClose: () => void;\r\n closeAll: () => void;\r\n}\r\n\r\n/\r\n @zh_CN 类型\r\n * @en_US Types of\r\n /\r\nexport type XMessageType = XStatus;\r\n\r\n/\r\n @zh_CN 多个消息的时候，显示类型\r\n * @en_US When multiple messages, the display type\r\n /\r\nexport type XMessageDisplayType = 'list' \| 'single';\r\n","import { Component, ViewEncapsulation, Renderer2, ElementRef, ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core';\r\nimport { XMoveAnimation, XIsEmpty } from '@ng-nest/ui/core';\r\nimport { XMessagePrefix, XMessageOption, XMessageRef } from './message.property';\r\nimport { of } from 'rxjs';\r\nimport { delay } from 'rxjs/operators';\r\n\r\n@Component({\r\n selector: `${XMessagePrefix}`,\r\n templateUrl: './message.component.html',\r\n styleUrls: ['./message.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n animations: [XMoveAnimation]\r\n})\r\nexport class XMessageComponent {\r\n message: XMessageRef = { ref: {}, list: [], currentClose: () => {}, closeAll: () => {} };\r\n\r\n constructor(public renderer: Renderer2, public elementRef: ElementRef, public cdr: ChangeDetectorRef) {}\r\n\r\n onClose(item: XMessageOption) {\r\n this.message.list?.splice(this.message.list.indexOf(item), 1);\r\n item.duration$?.unsubscribe();\r\n this.cdr.detectChanges();\r\n }\r\n\r\n moveDone($event: { toState: string }) {\r\n if ($event.toState === 'void' && XIsEmpty(this.message.list)) {\r\n this.message.ref?.overlayRef?.detach();\r\n }\r\n }\r\n\r\n onEnter(item: XMessageOption) {\r\n item.duration$?.unsubscribe();\r\n }\r\n\r\n onLeave(item: XMessageOption) {\r\n if (item.duration) {\r\n item.duration$ = of(true)\r\n .pipe(delay(item.duration))\r\n .subscribe(() => this.onClose(item));\r\n }\r\n }\r\n\r\n trackByNode(_index: number, item: XMessageOption) {\r\n return `${item.title}-${item.content}`;\r\n }\r\n}\r\n","<div class=\"x-message\">\r\n <ng-container ngFor=\"let item of message.list; trackBy: trackByNode\">\r\n <x-alert\r\n [@x-move-animation]=\"item.placement\"\r\n (@x-move-animation.done)=\"moveDone($event)\"\r\n (mouseenter)=\"onEnter(item)\"\r\n (mouseleave)=\"onLeave(item)\"\r\n (close)=\"onClose(item)\"\r\n [hide]=\"item.hide\"\r\n [title]=\"item.title\"\r\n [content]=\"item.content\"\r\n [type]=\"item.type\"\r\n [effect]=\"item.effect\"\r\n [hideClose]=\"item.hideClose\"\r\n [closeText]=\"item.closeText\"\r\n [showIcon]=\"item.showIcon\"\r\n duration=\"0\"\r\n manual\r\n disabledAnimation\r\n ></x-alert>\r\n </ng-container>\r\n</div>\r\n","import { Injectable } from '@angular/core';\r\nimport { XTemplate, XIsXTemplate, XIsEmpty, fillDefault, XIsString, XConfigService, XMessageConfig } from '@ng-nest/ui/core';\r\nimport {\r\n XMessageOverlayRef,\r\n XMessageType,\r\n XMessagePlacement,\r\n XMessageRef,\r\n XMessagePortal,\r\n XMessageOption,\r\n X_MESSAGE_CONFIG_NAME\r\n} from './message.property';\r\nimport { XMessageComponent } from './message.component';\r\nimport { of } from 'rxjs';\r\nimport { delay } from 'rxjs/operators';\r\nimport { XPortalService } from '@ng-nest/ui/portal';\r\n\r\n@Injectable()\r\nexport class XMessageService {\r\n messages: XMessagePlacement = {};\r\n\r\n default: XMessageOption = {\r\n type: 'info',\r\n width: '16rem',\r\n placement: 'top',\r\n offset: '2rem',\r\n effect: 'white',\r\n displayType: 'list',\r\n duration: 3000,\r\n hideClose: true,\r\n showIcon: true,\r\n hide: false\r\n };\r\n\r\n configDefault?: XMessageConfig;\r\n\r\n constructor(public portal: XPortalService, public configService: XConfigService) {\r\n this.configDefault = this.configService.getConfigForComponent(X_MESSAGE_CONFIG_NAME);\r\n Object.assign(this.default, this.configDefault);\r\n }\r\n\r\n info(option: XTemplate \| XMessageOption): XMessageRef {\r\n return this.createMessage(option, 'info');\r\n }\r\n\r\n success(option: XTemplate \| XMessageOption): XMessageRef {\r\n return this.createMessage(option, 'success');\r\n }\r\n\r\n warning(option: XTemplate \| XMessageOption): XMessageRef {\r\n return this.createMessage(option, 'warning');\r\n }\r\n\r\n error(option: XTemplate \| XMessageOption): XMessageRef {\r\n return this.createMessage(option, 'error');\r\n }\r\n\r\n create(option: XMessageOption): XMessageOverlayRef {\r\n const offset = XIsString(option.offset) ? [option.offset as string] : (option.offset as string[]);\r\n\r\n return this.portal.attach({\r\n content: XMessageComponent,\r\n overlayConfig: {\r\n panelClass: XMessagePortal,\r\n positionStrategy: this.portal.setPlace(option.placement, option.width, option.height, ...offset)\r\n }\r\n });\r\n }\r\n\r\n private createMessage(option: XTemplate \| XMessageOption, type: XMessageType): XMessageRef {\r\n let opt: XMessageOption;\r\n if (XIsXTemplate(option)) {\r\n opt = { title: option as XTemplate, type: type };\r\n } else {\r\n opt = option as XMessageOption;\r\n opt.type = type;\r\n }\r\n fillDefault(opt, this.default);\r\n return this.createMessagePlacement(opt);\r\n }\r\n\r\n private closeAll(excludeOption?: XMessageOption) {\r\n for (let key in this.messages) {\r\n for (let option of this.messages[key].list) {\r\n option !== excludeOption && this.removeMessage(option);\r\n }\r\n }\r\n }\r\n\r\n private createMessagePlacement(option: XMessageOption): XMessageRef {\r\n if (typeof option.placement === 'undefined') return { ref: {}, list: [], currentClose: () => {}, closeAll: () => {} };\r\n let msgPlacement = this.messages[option.placement];\r\n this.setDuration(option);\r\n if (XIsEmpty(msgPlacement) \|\| !msgPlacement.ref?.overlayRef?.hasAttached()) {\r\n this.messages[option.placement] = {\r\n ref: this.create(option),\r\n list: [option],\r\n currentClose: () => {\r\n this.removeMessage(option);\r\n },\r\n closeAll: () => {\r\n this.closeAll();\r\n }\r\n };\r\n } else {\r\n this.messages[option.placement].list = [...(this.messages[option.placement].list as XMessageOption[]), option];\r\n }\r\n this.messageChange(this.messages[option.placement]);\r\n\r\n option.displayType === 'single' && this.closeAll(option);\r\n\r\n return this.messages[option.placement];\r\n }\r\n\r\n private messageChange(message: XMessageRef) {\r\n if (!message.ref?.overlayRef?.hasAttached() \|\| !message?.ref?.componentRef?.instance) return;\r\n message.ref.componentRef.instance.message = message;\r\n message.ref.componentRef.instance.cdr.detectChanges();\r\n }\r\n\r\n private setDuration(option: XMessageOption) {\r\n if (option.duration) {\r\n option.duration$ = of(true)\r\n .pipe(delay(option.duration))\r\n .subscribe(() => {\r\n this.removeMessage(option);\r\n });\r\n }\r\n }\r\n\r\n private removeMessage(option: XMessageOption) {\r\n if (typeof option.placement === 'undefined') return;\r\n this.messages[option.placement].ref?.componentRef?.instance.onClose(option);\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XMessageComponent } from './message.component';\r\nimport { XAlertModule } from '@ng-nest/ui/alert';\r\nimport { XMessageService } from './message.service';\r\nimport { XPortalModule } from '@ng-nest/ui/portal';\r\n\r\n@NgModule({\r\n declarations: [XMessageComponent],\r\n exports: [XMessageComponent],\r\n imports: [CommonModule, XPortalModule, XAlertModule],\r\n providers: [XMessageService]\r\n})\r\nexport class XMessageModule {}\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"ng-nest-ui-message.mjs","sources":["../../../../lib/ng-nest/ui/message/message.property.ts","../../../../lib/ng-nest/ui/message/message.component.ts","../../../../lib/ng-nest/ui/message/message.component.html","../../../../lib/ng-nest/ui/message/message-ref.ts","../../../../lib/ng-nest/ui/message/message.service.ts","../../../../lib/ng-nest/ui/message/message.module.ts","../../../../lib/ng-nest/ui/message/ng-nest-ui-message.ts"],"sourcesContent":["import { XStatus, XPlace } from '@ng-nest/ui/core';\r\nimport { XAlertOption } from '@ng-nest/ui/alert';\r\nimport { Subscription, Subject } from 'rxjs';\r\nimport { XPortalOverlayRef } from '@ng-nest/ui/portal';\r\nimport { XMessageComponent } from './message.component';\r\n\r\n/*\r\n Message\r\n * @selector x-message\r\n * @decorator component\r\n /\r\nexport const XMessagePrefix = 'x-message';\r\nexport const XMessagePortal = 'x-message-portal';\r\nexport const X_MESSAGE_CONFIG_NAME = 'message';\r\n\r\n/\r\n Message Option\r\n /\r\nexport interface XMessageOption extends XAlertOption {\r\n /\r\n @zh_CN 消息框的 id\r\n * @en_US Message id\r\n /\r\n id?: string;\r\n /\r\n @zh_CN 方位，九宫格\r\n * @en_US Direction, nine grid\r\n * @default 'top'\r\n * @withConfig true\r\n /\r\n placement?: XPlace;\r\n /\r\n @zh_CN 偏移距离\r\n * @en_US Offset distance\r\n * @default '2rem'\r\n * @withConfig true\r\n /\r\n offset?: string \| string[];\r\n /\r\n @zh_CN 类型\r\n * @en_US Types of\r\n * @default 'info'\r\n * @withConfig true\r\n /\r\n type?: XMessageType;\r\n /\r\n @zh_CN 多个消息的时候，显示类型\r\n * @en_US When multiple messages, the display type\r\n * @default 'list'\r\n * @withConfig true\r\n /\r\n displayType?: XMessageDisplayType;\r\n /\r\n @zh_CN 宽度\r\n * @en_US Width\r\n * @default '16rem'\r\n * @withConfig true\r\n /\r\n width?: string;\r\n /\r\n @zh_CN 高度\r\n * @en_US Height\r\n /\r\n height?: string;\r\n /\r\n @zh_CN 延迟关闭时间\r\n * @en_US Delay off time\r\n * @default 3000\r\n * @withConfig true\r\n /\r\n duration?: number;\r\n /\r\n @zh_CN 隐藏关闭按钮\r\n * @en_US Hide close button\r\n * @default true\r\n * @withConfig true\r\n /\r\n hideClose?: boolean;\r\n /\r\n @zh_CN 显示图标\r\n * @en_US Show icon\r\n * @default true\r\n * @withConfig true\r\n /\r\n showIcon?: boolean;\r\n /\r\n @zh_CN 延迟关闭订阅后的对象，用来释放或取消\r\n * @en_US Delayed closing the subscribed object, used to release or cancel\r\n /\r\n duration$?: Subscription \| null;\r\n /\r\n @zh_CN 延迟关闭订阅对象\r\n * @en_US Delay in closing the subscription object\r\n /\r\n durationSub?: Subject<any>;\r\n}\r\n\r\n/\r\n @zh_CN 创建的消息对象\r\n * @en_US Message object created\r\n /\r\nexport interface XMessageOverlayRef extends XPortalOverlayRef<XMessageComponent> {}\r\n\r\n/\r\n @zh_CN 九宫格中的消息对象\r\n * @en_US Message object in Jiugongge\r\n /\r\nexport interface XMessagePlacement {\r\n [property: string]: XMessagePlacementRef;\r\n}\r\n\r\n/\r\n @zh_CN 九宫格中的消息对象\r\n * @en_US Message object in Jiugongge\r\n /\r\nexport interface XMessagePlacementRef {\r\n /\r\n @zh_CN 方位对应的 overlayRef\r\n * @en_US Placement overlayRef\r\n /\r\n ref: XMessageOverlayRef;\r\n /\r\n @zh_CN 对应的消息 list 数据\r\n * @en_US Corresponding message list data\r\n /\r\n list: XMessageOption[];\r\n /\r\n @zh_CN 关闭所有数据\r\n * @en_US Close all data\r\n /\r\n closeAll: () => void;\r\n}\r\n\r\n/\r\n @zh_CN 类型\r\n * @en_US Types of\r\n /\r\nexport type XMessageType = XStatus;\r\n\r\n/\r\n @zh_CN 多个消息的时候，显示类型\r\n * @en_US When multiple messages, the display type\r\n /\r\nexport type XMessageDisplayType = 'list' \| 'single';\r\n","import { Component, ViewEncapsulation, Renderer2, ElementRef, ChangeDetectorRef, ChangeDetectionStrategy } from '@angular/core';\r\nimport { XMoveAnimation, XIsEmpty } from '@ng-nest/ui/core';\r\nimport { XMessagePrefix, XMessageOption, XMessagePlacementRef } from './message.property';\r\nimport { of } from 'rxjs';\r\nimport { delay } from 'rxjs/operators';\r\n\r\n@Component({\r\n selector: `${XMessagePrefix}`,\r\n templateUrl: './message.component.html',\r\n styleUrls: ['./message.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n animations: [XMoveAnimation]\r\n})\r\nexport class XMessageComponent {\r\n message: XMessagePlacementRef = { ref: {}, list: [], closeAll: () => {} };\r\n\r\n constructor(public renderer: Renderer2, public elementRef: ElementRef, public cdr: ChangeDetectorRef) {}\r\n\r\n onClose(item: XMessageOption) {\r\n this.message.list?.splice(this.message.list.indexOf(item), 1);\r\n item.duration$?.unsubscribe();\r\n this.cdr.detectChanges();\r\n }\r\n\r\n moveDone($event: { toState: string }) {\r\n if ($event.toState === 'void' && XIsEmpty(this.message.list)) {\r\n this.message.ref?.overlayRef?.detach();\r\n }\r\n }\r\n\r\n onEnter(item: XMessageOption) {\r\n item.duration$?.unsubscribe();\r\n }\r\n\r\n onLeave(item: XMessageOption) {\r\n if (item.duration) {\r\n item.duration$ = of(true)\r\n .pipe(delay(item.duration))\r\n .subscribe(() => this.onClose(item));\r\n }\r\n }\r\n\r\n trackByNode(_index: number, item: XMessageOption) {\r\n return item.id;\r\n }\r\n}\r\n","<div class=\"x-message\">\r\n <ng-container ngFor=\"let item of message.list; trackBy: trackByNode\">\r\n <x-alert\r\n [@x-move-animation]=\"item.placement\"\r\n (@x-move-animation.done)=\"moveDone($event)\"\r\n (mouseenter)=\"onEnter(item)\"\r\n (mouseleave)=\"onLeave(item)\"\r\n (close)=\"onClose(item)\"\r\n [hide]=\"item.hide\"\r\n [title]=\"item.title\"\r\n [content]=\"item.content\"\r\n [type]=\"item.type\"\r\n [effect]=\"item.effect\"\r\n [hideClose]=\"item.hideClose\"\r\n [closeText]=\"item.closeText\"\r\n [showIcon]=\"item.showIcon\"\r\n duration=\"0\"\r\n manual\r\n disabledAnimation\r\n ></x-alert>\r\n </ng-container>\r\n</div>\r\n","import { XMessageOption } from './message.property';\r\n\r\n// TODO: add more function\r\nexport class XMessageRef {\r\n option: XMessageOption;\r\n constructor(option: XMessageOption) {\r\n if (!option.id) option.id = `${new Date().getTime()}`;\r\n this.option = option;\r\n }\r\n close = () => {};\r\n closeAll = () => {};\r\n update = (_option: XMessageOption) => {};\r\n}\r\n","import { Injectable } from '@angular/core';\r\nimport { XTemplate, XIsXTemplate, XIsEmpty, fillDefault, XIsString, XConfigService, XMessageConfig, XIsUndefined } from '@ng-nest/ui/core';\r\nimport {\r\n XMessageOverlayRef,\r\n XMessageType,\r\n XMessagePlacement,\r\n XMessagePortal,\r\n XMessageOption,\r\n X_MESSAGE_CONFIG_NAME,\r\n XMessagePlacementRef\r\n} from './message.property';\r\nimport { XMessageComponent } from './message.component';\r\nimport { of } from 'rxjs';\r\nimport { delay } from 'rxjs/operators';\r\nimport { XPortalService } from '@ng-nest/ui/portal';\r\nimport { XMessageRef } from './message-ref';\r\n\r\n@Injectable()\r\nexport class XMessageService {\r\n messages: XMessagePlacement = {};\r\n\r\n default: XMessageOption = {\r\n type: 'info',\r\n width: '16rem',\r\n placement: 'top',\r\n offset: '2rem',\r\n effect: 'white',\r\n displayType: 'list',\r\n duration: 3000,\r\n hideClose: true,\r\n showIcon: true,\r\n hide: false\r\n };\r\n\r\n configDefault?: XMessageConfig;\r\n\r\n constructor(public portal: XPortalService, public configService: XConfigService) {\r\n this.configDefault = this.configService.getConfigForComponent(X_MESSAGE_CONFIG_NAME);\r\n Object.assign(this.default, this.configDefault);\r\n }\r\n\r\n info(option: XTemplate \| XMessageOption): XMessageRef {\r\n return this.createMessage(option, 'info');\r\n }\r\n\r\n success(option: XTemplate \| XMessageOption): XMessageRef {\r\n return this.createMessage(option, 'success');\r\n }\r\n\r\n warning(option: XTemplate \| XMessageOption): XMessageRef {\r\n return this.createMessage(option, 'warning');\r\n }\r\n\r\n error(option: XTemplate \| XMessageOption): XMessageRef {\r\n return this.createMessage(option, 'error');\r\n }\r\n\r\n loading(option: XTemplate \| XMessageOption): XMessageRef {\r\n return this.createMessage(option, 'loading');\r\n }\r\n\r\n create(option: XMessageOption): XMessageOverlayRef {\r\n const offset = XIsString(option.offset) ? [option.offset as string] : (option.offset as string[]);\r\n return this.portal.attach({\r\n content: XMessageComponent,\r\n overlayConfig: {\r\n panelClass: XMessagePortal,\r\n positionStrategy: this.portal.setPlace(option.placement, option.width, option.height, ...offset)\r\n }\r\n });\r\n }\r\n\r\n private createMessage(option: XTemplate \| XMessageOption, type: XMessageType): XMessageRef {\r\n let opt: XMessageOption;\r\n if (XIsXTemplate(option)) {\r\n opt = { title: option as XTemplate, type: type };\r\n } else {\r\n opt = option as XMessageOption;\r\n opt.type = type;\r\n }\r\n fillDefault(opt, this.default);\r\n const ref = new XMessageRef(opt);\r\n if (XIsUndefined(opt.placement)) {\r\n return ref;\r\n }\r\n ref.close = () => {\r\n this.removeMessage(opt);\r\n };\r\n ref.closeAll = () => {\r\n this.closeAll();\r\n };\r\n ref.update = (_opt) => {\r\n this.updateMessage(_opt, opt);\r\n };\r\n this.setDuration(opt);\r\n this.createMessagePlacement(opt);\r\n\r\n return ref;\r\n }\r\n\r\n private closeAll(excludeOption?: XMessageOption) {\r\n for (let key in this.messages) {\r\n for (let option of this.messages[key].list) {\r\n option !== excludeOption && this.removeMessage(option);\r\n }\r\n }\r\n }\r\n\r\n private createMessagePlacement(option: XMessageOption) {\r\n let msgPlacement = this.messages[option.placement!];\r\n if (XIsEmpty(msgPlacement) \|\| !msgPlacement.ref?.overlayRef?.hasAttached()) {\r\n this.messages[option.placement!] = {\r\n ref: this.create(option),\r\n list: [option],\r\n closeAll: () => {\r\n this.closeAll();\r\n }\r\n };\r\n msgPlacement = this.messages[option.placement!];\r\n } else {\r\n msgPlacement.list = [...(this.messages[option.placement!].list as XMessageOption[]), option];\r\n }\r\n this.messageChange(msgPlacement);\r\n\r\n option.displayType === 'single' && this.closeAll(option);\r\n }\r\n\r\n private messageChange(message: XMessagePlacementRef) {\r\n if (!message.ref?.overlayRef?.hasAttached() \|\| !message?.ref?.componentRef?.instance) return;\r\n message.ref.componentRef.instance.message = message;\r\n message.ref.componentRef.instance.cdr.detectChanges();\r\n }\r\n\r\n private setDuration(option: XMessageOption) {\r\n if (option.duration && option.type !== 'loading') {\r\n option.duration$ = of(true)\r\n .pipe(delay(option.duration))\r\n .subscribe(() => {\r\n this.removeMessage(option);\r\n });\r\n }\r\n }\r\n\r\n private removeMessage(option: XMessageOption) {\r\n if (typeof option.placement === 'undefined') return;\r\n this.messages[option.placement].ref?.componentRef?.instance.onClose(option);\r\n }\r\n\r\n private updateMessage(newOption: XMessageOption, oldOption: XMessageOption) {\r\n Object.assign(oldOption, newOption);\r\n this.setDuration(oldOption);\r\n const refs = this.messages[oldOption.placement!];\r\n if (refs) {\r\n refs.ref.componentRef?.instance.cdr.detectChanges();\r\n }\r\n }\r\n}\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XMessageComponent } from './message.component';\r\nimport { XAlertModule } from '@ng-nest/ui/alert';\r\nimport { XMessageService } from './message.service';\r\nimport { XPortalModule } from '@ng-nest/ui/portal';\r\n\r\n@NgModule({\r\n declarations: [XMessageComponent],\r\n exports: [XMessageComponent],\r\n imports: [CommonModule, XPortalModule, XAlertModule],\r\n providers: [XMessageService]\r\n})\r\nexport class XMessageModule {}\r\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;;AAMA;;;;;MAKa,cAAc,GAAG,YAAY;MAC7B,cAAc,GAAG,mBAAmB;MACpC,qBAAqB,GAAG;;MCCxB,iBAAiB;IAG5B,YAAmB,QAAmB,EAAS,UAAsB,EAAS,GAAsB;QAAjF,aAAQ,GAAR,QAAQ,CAAW;QAAS,eAAU,GAAV,UAAU,CAAY;QAAS,QAAG,GAAH,GAAG,CAAmB;QAFpG,YAAO,GAAyB,EAAE,GAAG,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,QAAQ,EAAE,SAAQ,EAAE,CAAC;KAE8B;IAExG,OAAO,CAAC,IAAoB;;QAC1B,MAAA,IAAI,CAAC,OAAO,CAAC,IAAI,0CAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;QAC9D,MAAA,IAAI,CAAC,SAAS,0CAAE,WAAW,EAAE,CAAC;QAC9B,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;IAED,QAAQ,CAAC,MAA2B;;QAClC,IAAI,MAAM,CAAC,OAAO,KAAK,MAAM,IAAI,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;YAC5D,MAAA,MAAA,IAAI,CAAC,OAAO,CAAC,GAAG,0CAAE,UAAU,0CAAE,MAAM,EAAE,CAAC;SACxC;KACF;IAED,OAAO,CAAC,IAAoB;;QAC1B,MAAA,IAAI,CAAC,SAAS,0CAAE,WAAW,EAAE,CAAC;KAC/B;IAED,OAAO,CAAC,IAAoB;QAC1B,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,IAAI,CAAC;iBACtB,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;iBAC1B,SAAS,CAAC,MAAM,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC;SACxC;KACF;IAED,WAAW,CAAC,MAAc,EAAE,IAAoB;QAC9C,OAAO,IAAI,CAAC,EAAE,CAAC;KAChB;;oJA/BU,iBAAiB;wIAAjB,iBAAiB,iDCd9B,ouBAsBA,2ZDVc,CAAC,cAAc,CAAC;2FAEjB,iBAAiB;kBAR7B,SAAS;+BACE,GAAG,cAAc,EAAE,iBAGd,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM,cACnC,CAAC,cAAc,CAAC;;;AEV9B;MACa,WAAW;IAEtB,YAAY,MAAsB;QAIlC,UAAK,GAAG,SAAQ,CAAC;QACjB,aAAQ,GAAG,SAAQ,CAAC;QACpB,WAAM,GAAG,CAAC,OAAuB,QAAO,CAAC;QALvC,IAAI,CAAC,MAAM,CAAC,EAAE;YAAE,MAAM,CAAC,EAAE,GAAG,GAAG,IAAI,IAAI,EAAE,CAAC,OAAO,EAAE,EAAE,CAAC;QACtD,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC;KACtB;;;MCUU,eAAe;IAkB1B,YAAmB,MAAsB,EAAS,aAA6B;QAA5D,WAAM,GAAN,MAAM,CAAgB;QAAS,kBAAa,GAAb,aAAa,CAAgB;QAjB/E,aAAQ,GAAsB,EAAE,CAAC;QAEjC,YAAO,GAAmB;YACxB,IAAI,EAAE,MAAM;YACZ,KAAK,EAAE,OAAO;YACd,SAAS,EAAE,KAAK;YAChB,MAAM,EAAE,MAAM;YACd,MAAM,EAAE,OAAO;YACf,WAAW,EAAE,MAAM;YACnB,QAAQ,EAAE,IAAI;YACd,SAAS,EAAE,IAAI;YACf,QAAQ,EAAE,IAAI;YACd,IAAI,EAAE,KAAK;SACZ,CAAC;QAKA,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,CAAC,qBAAqB,CAAC,qBAAqB,CAAC,CAAC;QACrF,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;KACjD;IAED,IAAI,CAAC,MAAkC;QACrC,OAAO,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;KAC3C;IAED,OAAO,CAAC,MAAkC;QACxC,OAAO,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;KAC9C;IAED,OAAO,CAAC,MAAkC;QACxC,OAAO,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;KAC9C;IAED,KAAK,CAAC,MAAkC;QACtC,OAAO,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;KAC5C;IAED,OAAO,CAAC,MAAkC;QACxC,OAAO,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;KAC9C;IAED,MAAM,CAAC,MAAsB;QAC3B,MAAM,MAAM,GAAG,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,MAAgB,CAAC,GAAI,MAAM,CAAC,MAAmB,CAAC;QAClG,OAAO,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC;YACxB,OAAO,EAAE,iBAAiB;YAC1B,aAAa,EAAE;gBACb,UAAU,EAAE,cAAc;gBAC1B,gBAAgB,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,MAAM,CAAC;aACjG;SACF,CAAC,CAAC;KACJ;IAEO,aAAa,CAAC,MAAkC,EAAE,IAAkB;QAC1E,IAAI,GAAmB,CAAC;QACxB,IAAI,YAAY,CAAC,MAAM,CAAC,EAAE;YACxB,GAAG,GAAG,EAAE,KAAK,EAAE,MAAmB,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;SAClD;aAAM;YACL,GAAG,GAAG,MAAwB,CAAC;YAC/B,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC;SACjB;QACD,WAAW,CAAC,GAAG,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;QAC/B,MAAM,GAAG,GAAG,IAAI,WAAW,CAAC,GAAG,CAAC,CAAC;QACjC,IAAI,YAAY,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE;YAC/B,OAAO,GAAG,CAAC;SACZ;QACD,GAAG,CAAC,KAAK,GAAG;YACV,IAAI,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;SACzB,CAAC;QACF,GAAG,CAAC,QAAQ,GAAG;YACb,IAAI,CAAC,QAAQ,EAAE,CAAC;SACjB,CAAC;QACF,GAAG,CAAC,MAAM,GAAG,CAAC,IAAI;YAChB,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;SAC/B,CAAC;QACF,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC;QACtB,IAAI,CAAC,sBAAsB,CAAC,GAAG,CAAC,CAAC;QAEjC,OAAO,GAAG,CAAC;KACZ;IAEO,QAAQ,CAAC,aAA8B;QAC7C,KAAK,IAAI,GAAG,IAAI,IAAI,CAAC,QAAQ,EAAE;YAC7B,KAAK,IAAI,MAAM,IAAI,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE;gBAC1C,MAAM,KAAK,aAAa,IAAI,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;aACxD;SACF;KACF;IAEO,sBAAsB,CAAC,MAAsB;;QACnD,IAAI,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,SAAU,CAAC,CAAC;QACpD,IAAI,QAAQ,CAAC,YAAY,CAAC,IAAI,EAAC,MAAA,MAAA,YAAY,CAAC,GAAG,0CAAE,UAAU,0CAAE,WAAW,EAAE,CAAA,EAAE;YAC1E,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,SAAU,CAAC,GAAG;gBACjC,GAAG,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC;gBACxB,IAAI,EAAE,CAAC,MAAM,CAAC;gBACd,QAAQ,EAAE;oBACR,IAAI,CAAC,QAAQ,EAAE,CAAC;iBACjB;aACF,CAAC;YACF,YAAY,GAAG,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,SAAU,CAAC,CAAC;SACjD;aAAM;YACL,YAAY,CAAC,IAAI,GAAG,CAAC,GAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,SAAU,CAAC,CAAC,IAAyB,EAAE,MAAM,CAAC,CAAC;SAC9F;QACD,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;QAEjC,MAAM,CAAC,WAAW,KAAK,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC;KAC1D;IAEO,aAAa,CAAC,OAA6B;;QACjD,IAAI,EAAC,MAAA,MAAA,OAAO,CAAC,GAAG,0CAAE,UAAU,0CAAE,WAAW,EAAE,CAAA,IAAI,EAAC,MAAA,MAAA,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,GAAG,0CAAE,YAAY,0CAAE,QAAQ,CAAA;YAAE,OAAO;QAC7F,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,QAAQ,CAAC,OAAO,GAAG,OAAO,CAAC;QACpD,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,QAAQ,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KACvD;IAEO,WAAW,CAAC,MAAsB;QACxC,IAAI,MAAM,CAAC,QAAQ,IAAI,MAAM,CAAC,IAAI,KAAK,SAAS,EAAE;YAChD,MAAM,CAAC,SAAS,GAAG,EAAE,CAAC,IAAI,CAAC;iBACxB,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;iBAC5B,SAAS,CAAC;gBACT,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;aAC5B,CAAC,CAAC;SACN;KACF;IAEO,aAAa,CAAC,MAAsB;;QAC1C,IAAI,OAAO,MAAM,CAAC,SAAS,KAAK,WAAW;YAAE,OAAO;QACpD,MAAA,MAAA,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,GAAG,0CAAE,YAAY,0CAAE,QAAQ,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;KAC7E;IAEO,aAAa,CAAC,SAAyB,EAAE,SAAyB;;QACxE,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;QACpC,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;QAC5B,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,SAAU,CAAC,CAAC;QACjD,IAAI,IAAI,EAAE;YACR,MAAA,IAAI,CAAC,GAAG,CAAC,YAAY,0CAAE,QAAQ,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;SACrD;KACF;;kJAzIU,eAAe;sJAAf,eAAe;2FAAf,eAAe;kBAD3B,UAAU;;;MCJE,cAAc;;iJAAd,cAAc;kJAAd,cAAc,iBALV,iBAAiB,aAEtB,YAAY,EAAE,aAAa,EAAE,YAAY,aADzC,iBAAiB;kJAIhB,cAAc,aAFd,CAAC,eAAe,CAAC,YADnB,CAAC,YAAY,EAAE,aAAa,EAAE,YAAY,CAAC;2FAGzC,cAAc;kBAN1B,QAAQ;mBAAC;oBACR,YAAY,EAAE,CAAC,iBAAiB,CAAC;oBACjC,OAAO,EAAE,CAAC,iBAAiB,CAAC;oBAC5B,OAAO,EAAE,CAAC,YAAY,EAAE,aAAa,EAAE,YAAY,CAAC;oBACpD,SAAS,EAAE,CAAC,eAAe,CAAC;iBAC7B;;;ACZD;;;;;;"}

package/fesm2015/ng-nest-ui-popconfirm.mjs CHANGED Viewed

@@ -2,7 +2,7 @@ import * as i0 from '@angular/core';
 import { EventEmitter, Component, Input, Output, ViewEncapsulation, ChangeDetectionStrategy, NgModule } from '@angular/core';
 import { __decorate } from 'tslib';
 import * as i1 from '@ng-nest/ui/core';
-import { XProperty, XWithConfig } from '@ng-nest/ui/core';
+import { XProperty, XWithConfig, XInputBoolean } from '@ng-nest/ui/core';
 import { Subject } from 'rxjs';
 import { map, takeUntil } from 'rxjs/operators';
 import * as i2 from '@ng-nest/ui/i18n';
@@ -43,7 +43,7 @@ class XPopconfirmProperty extends XProperty {
     }
 }
 /** @nocollapse */ /** @nocollapse */ XPopconfirmProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XPopconfirmProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ /** @nocollapse */ XPopconfirmProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: XPopconfirmProperty, selector: "ng-component", inputs: { title: "title", content: "content", placement: "placement", trigger: "trigger", width: "width", icon: "icon", iconColor: "iconColor", cancelText: "cancelText", confirmText: "confirmText" }, outputs: { cancel: "cancel", confirm: "confirm" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
+/** @nocollapse */ /** @nocollapse */ XPopconfirmProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: XPopconfirmProperty, selector: "ng-component", inputs: { title: "title", content: "content", placement: "placement", trigger: "trigger", width: "width", icon: "icon", iconColor: "iconColor", cancelText: "cancelText", confirmText: "confirmText", confirmAsync: "confirmAsync", condition: "condition" }, outputs: { cancel: "cancel", confirm: "confirm" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
 __decorate([
     XWithConfig(X_CONFIG_NAME, 'bottom')
 ], XPopconfirmProperty.prototype, "placement", void 0);
@@ -65,6 +65,9 @@ __decorate([
 __decorate([
     XWithConfig(X_CONFIG_NAME)
 ], XPopconfirmProperty.prototype, "confirmText", void 0);
+__decorate([
+    XInputBoolean()
+], XPopconfirmProperty.prototype, "condition", void 0);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XPopconfirmProperty, decorators: [{
             type: Component,
             args: [{ template: '' }]
@@ -86,6 +89,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImpor
                 type: Input
             }], confirmText: [{
                 type: Input
+            }], confirmAsync: [{
+                type: Input
+            }], condition: [{
+                type: Input
             }], cancel: [{
                 type: Output
             }], confirm: [{
@@ -101,7 +108,9 @@ class XPopconfirmComponent extends XPopconfirmProperty {
         this.configService = configService;
         this.i18n = i18n;
         this.locale = {};
+        this.loading = false;
         this._unSubject = new Subject();
+        this._asyncUnSub = new Subject();
     }
     get getCancelText() {
         return this.cancelText || this.locale.cancelText;
@@ -117,20 +126,39 @@ class XPopconfirmComponent extends XPopconfirmProperty {
             this.cdr.markForCheck();
         });
     }
+    ngOnDestroy() {
+        this._unSubject.next();
+        this._unSubject.complete();
+    }
     onCancel() {
         this.visible = false;
         this.cancel.emit();
     }
     onConfirm() {
-        this.visible = false;
-        this.confirm.emit();
+        if (this.confirmAsync) {
+            this.loading = true;
+            this.confirmAsync.pipe(takeUntil(this._asyncUnSub)).subscribe(() => {
+                this.loading = false;
+                this.visible = false;
+                this.confirm.emit();
+                this.cdr.detectChanges();
+                this._asyncUnSub.next();
+            });
+        }
+        else {
+            this.visible = false;
+            this.confirm.emit();
+        }
+    }
+    onClick() {
+        this.condition && this.onConfirm();
     }
 }
 /** @nocollapse */ /** @nocollapse */ XPopconfirmComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XPopconfirmComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.XConfigService }, { token: i2.XI18nService }], target: i0.ɵɵFactoryTarget.Component });
-/** @nocollapse */ /** @nocollapse */ XPopconfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: XPopconfirmComponent, selector: "x-popconfirm", usesInheritance: true, ngImport: i0, template: "<div\r\n  #popconfirm\r\n  class=\"x-popconfirm\"\r\n  x-popover\r\n  [title]=\"titleTpl\"\r\n  [content]=\"content\"\r\n  [footer]=\"footerTpl\"\r\n  [placement]=\"placement\"\r\n  [trigger]=\"trigger\"\r\n  [width]=\"width\"\r\n  [(visible)]=\"visible\"\r\n>\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n<ng-template #titleTpl>\r\n  <div class=\"x-popconfirm-title\">\r\n    <ng-container *xOutlet=\"title\">\r\n      <x-icon *ngIf=\"icon\" [style.color]=\"iconColor\" [type]=\"icon\"></x-icon>\r\n      <span>{{ title }}</span>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #footerTpl>\r\n  <div class=\"x-popconfirm-buttons\">\r\n    <x-button (click)=\"onCancel()\">{{ getCancelText }}</x-button>\r\n    <x-button type=\"primary\" (click)=\"onConfirm()\">{{ getConfirmText }}</x-button>\r\n  </div>\r\n</ng-template>\r\n", styles: [".x-popconfirm{margin:0;padding:0;display:inline-block}.x-popconfirm-buttons{display:flex;justify-content:flex-end}.x-popconfirm-buttons>x-button:not(:first-child){margin-left:.5rem}.x-popconfirm-title{display:flex;align-items:center}.x-popconfirm-title>.x-icon{margin-right:.325rem;font-size:1rem}\n"], components: [{ type: i3.XIconComponent, selector: "x-icon" }, { type: i4.XButtonComponent, selector: "x-button" }], directives: [{ type: i5.XPopoverDirective, selector: "[x-popover], x-popover" }, { type: i6.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+/** @nocollapse */ /** @nocollapse */ XPopconfirmComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.3", type: XPopconfirmComponent, selector: "x-popconfirm", usesInheritance: true, ngImport: i0, template: "<div\r\n  #popconfirm\r\n  class=\"x-popconfirm\"\r\n  x-popover\r\n  [title]=\"titleTpl\"\r\n  [content]=\"content\"\r\n  [footer]=\"footerTpl\"\r\n  [placement]=\"placement\"\r\n  [trigger]=\"trigger\"\r\n  [width]=\"width\"\r\n  [condition]=\"condition\"\r\n  [(visible)]=\"visible\"\r\n  (click)=\"onClick()\"\r\n>\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n<ng-template #titleTpl>\r\n  <div class=\"x-popconfirm-title\">\r\n    <ng-container *xOutlet=\"title\">\r\n      <x-icon *ngIf=\"icon\" [style.color]=\"iconColor\" [type]=\"icon\"></x-icon>\r\n      <span>{{ title }}</span>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #footerTpl>\r\n  <div class=\"x-popconfirm-buttons\">\r\n    <x-button (click)=\"onCancel()\">{{ getCancelText }}</x-button>\r\n    <x-button type=\"primary\" (click)=\"onConfirm()\" [loading]=\"loading\">{{ getConfirmText }}</x-button>\r\n  </div>\r\n</ng-template>\r\n", styles: [".x-popconfirm{margin:0;padding:0;display:inline-block}.x-popconfirm-buttons{display:flex;justify-content:flex-end}.x-popconfirm-buttons>x-button:not(:first-child){margin-left:.5rem}.x-popconfirm-title{display:flex;align-items:center}.x-popconfirm-title>.x-icon{margin-right:.325rem;font-size:1rem}\n"], components: [{ type: i3.XIconComponent, selector: "x-icon" }, { type: i4.XButtonComponent, selector: "x-button" }], directives: [{ type: i5.XPopoverDirective, selector: "[x-popover], x-popover" }, { type: i6.XOutletDirective, selector: "[xOutlet]", inputs: ["xOutletContext", "xOutlet"] }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.3", ngImport: i0, type: XPopconfirmComponent, decorators: [{
             type: Component,
-            args: [{ selector: `${XPopconfirmPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  #popconfirm\r\n  class=\"x-popconfirm\"\r\n  x-popover\r\n  [title]=\"titleTpl\"\r\n  [content]=\"content\"\r\n  [footer]=\"footerTpl\"\r\n  [placement]=\"placement\"\r\n  [trigger]=\"trigger\"\r\n  [width]=\"width\"\r\n  [(visible)]=\"visible\"\r\n>\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n<ng-template #titleTpl>\r\n  <div class=\"x-popconfirm-title\">\r\n    <ng-container *xOutlet=\"title\">\r\n      <x-icon *ngIf=\"icon\" [style.color]=\"iconColor\" [type]=\"icon\"></x-icon>\r\n      <span>{{ title }}</span>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #footerTpl>\r\n  <div class=\"x-popconfirm-buttons\">\r\n    <x-button (click)=\"onCancel()\">{{ getCancelText }}</x-button>\r\n    <x-button type=\"primary\" (click)=\"onConfirm()\">{{ getConfirmText }}</x-button>\r\n  </div>\r\n</ng-template>\r\n", styles: [".x-popconfirm{margin:0;padding:0;display:inline-block}.x-popconfirm-buttons{display:flex;justify-content:flex-end}.x-popconfirm-buttons>x-button:not(:first-child){margin-left:.5rem}.x-popconfirm-title{display:flex;align-items:center}.x-popconfirm-title>.x-icon{margin-right:.325rem;font-size:1rem}\n"] }]
+            args: [{ selector: `${XPopconfirmPrefix}`, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n  #popconfirm\r\n  class=\"x-popconfirm\"\r\n  x-popover\r\n  [title]=\"titleTpl\"\r\n  [content]=\"content\"\r\n  [footer]=\"footerTpl\"\r\n  [placement]=\"placement\"\r\n  [trigger]=\"trigger\"\r\n  [width]=\"width\"\r\n  [condition]=\"condition\"\r\n  [(visible)]=\"visible\"\r\n  (click)=\"onClick()\"\r\n>\r\n  <ng-content></ng-content>\r\n</div>\r\n\r\n<ng-template #titleTpl>\r\n  <div class=\"x-popconfirm-title\">\r\n    <ng-container *xOutlet=\"title\">\r\n      <x-icon *ngIf=\"icon\" [style.color]=\"iconColor\" [type]=\"icon\"></x-icon>\r\n      <span>{{ title }}</span>\r\n    </ng-container>\r\n  </div>\r\n</ng-template>\r\n\r\n<ng-template #footerTpl>\r\n  <div class=\"x-popconfirm-buttons\">\r\n    <x-button (click)=\"onCancel()\">{{ getCancelText }}</x-button>\r\n    <x-button type=\"primary\" (click)=\"onConfirm()\" [loading]=\"loading\">{{ getConfirmText }}</x-button>\r\n  </div>\r\n</ng-template>\r\n", styles: [".x-popconfirm{margin:0;padding:0;display:inline-block}.x-popconfirm-buttons{display:flex;justify-content:flex-end}.x-popconfirm-buttons>x-button:not(:first-child){margin-left:.5rem}.x-popconfirm-title{display:flex;align-items:center}.x-popconfirm-title>.x-icon{margin-right:.325rem;font-size:1rem}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.Renderer2 }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.XConfigService }, { type: i2.XI18nService }]; } });
 class XPopconfirmModule {