@acorex/modules 20.2.4-next.3 → 20.2.4-next.6

package/fesm2022/acorex-modules-security-management.mjs

@@ -2397,6 +2397,12 @@ class AXPPermissionsEditorComponent {
     isSelected(name) {
         return this.selectedPermissions().includes(name);
     }
+    /**
+     * Checks if a permission is selected.
+     */
+    badgeToNumber(value) {
+        return Number(value);
+    }
     /**
      * Recursively collects all descendant permission names for a single item (including itself).
      */
@@ -2468,7 +2474,7 @@ class AXPPermissionsEditorComponent {
         this.permissionsChanged.emit(this.selectedPermissions());
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.6", ngImport: i0, type: AXPPermissionsEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPPermissionsEditorComponent, isStandalone: true, selector: "axm-permissions-editor", inputs: { initialPermissions: { classPropertyName: "initialPermissions", publicName: "initialPermissions", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { permissionsChanged: "permissionsChanged", permissionsSelected: "permissionsSelected" }, host: { classAttribute: "ax-h-[75vh] ax-flex" }, ngImport: i0, template: "<div class=\"__groups ax-p-4 ax-min-h-full  ax-w-2/5\">\n    <ax-tabs location=\"start\" look=\"with-line-color\" class=\"ax-h-full\">\n        @for (group of groupsWithBadge(); track $index) {\n        <ax-tab-item [active]=\"group.name === selectedGroup()?.name\" [text]=\"group.title\"\n            (onClick)=\"handleMenuItemClick(group)\">\n            <ax-suffix>\n                <ax-badge color=\"primary\" [text]=\"group.badge\"></ax-badge>\n            </ax-suffix>\n        </ax-tab-item>\n        }\n    </ax-tabs>\n</div>\n\n<div class=\"__permissions ax-flex ax-h-full ax-overflow-auto ax-flex-col ax-w-3/5 ax-border-s\">\n\n    <div class=\"__header ax-p-4 ax-border-b ax-border-lightest\">\n        <span class=\"ax-h6\">{{ selectedGroup()?.title! }}</span>\n    </div>\n\n    <div class=\"__content ax-flex ax-p-4 ax-overflow-auto\">\n\n        <ul class=\"__list\">\n            <ng-template #recursiveList let-items>\n                @for (item of items; track $index) {\n                <li class=\"__item ax-py-1 ax-ps-2\">\n\n                    <ax-check-box [ngModel]=\"item.isSelected\" [readonly]=\"readOnly()\"\n                        (onValueChanged)=\"onPermissionToggle(item, $event)\">\n                        <ax-label>\n                            {{ item.title }}\n                            @if (item.description) {\n                            <i class=\"ax-ps-2 ax-text-xs fa-light fa-circle-info\" [title]=\"item.description\"></i>\n                            }\n                        </ax-label>\n                    </ax-check-box>\n\n                    @if (item.children && item.children.length > 0) {\n                    <ul class=\"__children ax-p-2 ax-mt-1 ax-ms-1\">\n                        <ng-container\n                            *ngTemplateOutlet=\"recursiveList; context: { $implicit: item.children }\"></ng-container>\n                    </ul>\n                    }\n\n                </li>\n                }\n            </ng-template>\n            <ng-container *ngTemplateOutlet=\"recursiveList; context: { $implicit: items() }\"></ng-container>\n        </ul>\n    </div>\n</div>", styles: [".axm-permissions-editor{display:flex;height:100%;flex-direction:column}.axm-permissions-editor .__groups .__tabs{height:100%}.axm-permissions-editor .__permissions .__header .__title{font-size:1rem;font-weight:500;line-height:1rem}.axm-permissions-editor .__permissions .__content .__list{width:100%}.axm-permissions-editor .__permissions .__content .__list .__item .__children{margin-left:.5rem;border-left-width:1px;border-style:dashed;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lighter-surface),var(--tw-border-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: 
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.6", type: AXPPermissionsEditorComponent, isStandalone: true, selector: "axm-permissions-editor", inputs: { initialPermissions: { classPropertyName: "initialPermissions", publicName: "initialPermissions", isSignal: true, isRequired: false, transformFunction: null }, readOnly: { classPropertyName: "readOnly", publicName: "readOnly", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { permissionsChanged: "permissionsChanged", permissionsSelected: "permissionsSelected" }, host: { classAttribute: "ax-h-[75vh] ax-flex" }, ngImport: i0, template: "<div class=\"__groups ax-p-4 ax-min-h-full ax-w-2/5\">\n  <ax-tabs location=\"start\" look=\"with-line-color\" class=\"ax-h-full\">\n    @for (group of groupsWithBadge(); track $index) {\n      <ax-tab-item\n        [active]=\"group.name === selectedGroup()?.name\"\n        [text]=\"group.title\"\n        (onClick)=\"handleMenuItemClick(group)\"\n      >\n        @if (badgeToNumber(group.badge) > 0) {\n          <ax-suffix>\n            <ax-badge color=\"primary\" [text]=\"group.badge\"></ax-badge>\n          </ax-suffix>\n        }\n      </ax-tab-item>\n    }\n  </ax-tabs>\n</div>\n\n<div class=\"__permissions ax-flex ax-h-full ax-overflow-auto ax-flex-col ax-w-3/5 ax-border-s\">\n  <div class=\"__header ax-p-4 ax-border-b ax-border-lightest\">\n    <span class=\"ax-h6\">{{ selectedGroup()?.title! }}</span>\n  </div>\n\n  <div class=\"__content ax-flex ax-p-4 ax-overflow-auto\">\n    <ul class=\"__list\">\n      <ng-template #recursiveList let-items>\n        @for (item of items; track $index) {\n          <li class=\"__item ax-py-1 ax-ps-2\">\n            <ax-check-box\n              [ngModel]=\"item.isSelected\"\n              [readonly]=\"readOnly()\"\n              (onValueChanged)=\"onPermissionToggle(item, $event)\"\n            >\n              <ax-label>\n                {{ item.title }}\n                @if (item.description) {\n                  <i class=\"ax-ps-2 ax-text-xs fa-light fa-circle-info\" [title]=\"item.description\"></i>\n                }\n              </ax-label>\n            </ax-check-box>\n\n            @if (item.children && item.children.length > 0) {\n              <ul class=\"__children ax-p-2 ax-mt-1 ax-ms-1\">\n                <ng-container *ngTemplateOutlet=\"recursiveList; context: { $implicit: item.children }\"></ng-container>\n              </ul>\n            }\n          </li>\n        }\n      </ng-template>\n      <ng-container *ngTemplateOutlet=\"recursiveList; context: { $implicit: items() }\"></ng-container>\n    </ul>\n  </div>\n</div>\n", styles: [".axm-permissions-editor{display:flex;height:100%;flex-direction:column}.axm-permissions-editor .__groups .__tabs{height:100%}.axm-permissions-editor .__permissions .__header .__title{font-size:1rem;font-weight:500;line-height:1rem}.axm-permissions-editor .__permissions .__content .__list{width:100%}.axm-permissions-editor .__permissions .__content .__list .__item .__children{margin-left:.5rem;border-left-width:1px;border-style:dashed;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lighter-surface),var(--tw-border-opacity, 1))}\n"], dependencies: [{ kind: "ngmodule", type: 
                 // Angular
                 CommonModule }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: 
                 // ACoreX
@@ -2494,7 +2500,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.6", ngImpor
                         AXTooltipModule,
                     ], encapsulation: ViewEncapsulation.None, host: {
                         class: 'ax-h-[75vh] ax-flex'
-                    }, template: "<div class=\"__groups ax-p-4 ax-min-h-full  ax-w-2/5\">\n    <ax-tabs location=\"start\" look=\"with-line-color\" class=\"ax-h-full\">\n        @for (group of groupsWithBadge(); track $index) {\n        <ax-tab-item [active]=\"group.name === selectedGroup()?.name\" [text]=\"group.title\"\n            (onClick)=\"handleMenuItemClick(group)\">\n            <ax-suffix>\n                <ax-badge color=\"primary\" [text]=\"group.badge\"></ax-badge>\n            </ax-suffix>\n        </ax-tab-item>\n        }\n    </ax-tabs>\n</div>\n\n<div class=\"__permissions ax-flex ax-h-full ax-overflow-auto ax-flex-col ax-w-3/5 ax-border-s\">\n\n    <div class=\"__header ax-p-4 ax-border-b ax-border-lightest\">\n        <span class=\"ax-h6\">{{ selectedGroup()?.title! }}</span>\n    </div>\n\n    <div class=\"__content ax-flex ax-p-4 ax-overflow-auto\">\n\n        <ul class=\"__list\">\n            <ng-template #recursiveList let-items>\n                @for (item of items; track $index) {\n                <li class=\"__item ax-py-1 ax-ps-2\">\n\n                    <ax-check-box [ngModel]=\"item.isSelected\" [readonly]=\"readOnly()\"\n                        (onValueChanged)=\"onPermissionToggle(item, $event)\">\n                        <ax-label>\n                            {{ item.title }}\n                            @if (item.description) {\n                            <i class=\"ax-ps-2 ax-text-xs fa-light fa-circle-info\" [title]=\"item.description\"></i>\n                            }\n                        </ax-label>\n                    </ax-check-box>\n\n                    @if (item.children && item.children.length > 0) {\n                    <ul class=\"__children ax-p-2 ax-mt-1 ax-ms-1\">\n                        <ng-container\n                            *ngTemplateOutlet=\"recursiveList; context: { $implicit: item.children }\"></ng-container>\n                    </ul>\n                    }\n\n                </li>\n                }\n            </ng-template>\n            <ng-container *ngTemplateOutlet=\"recursiveList; context: { $implicit: items() }\"></ng-container>\n        </ul>\n    </div>\n</div>", styles: [".axm-permissions-editor{display:flex;height:100%;flex-direction:column}.axm-permissions-editor .__groups .__tabs{height:100%}.axm-permissions-editor .__permissions .__header .__title{font-size:1rem;font-weight:500;line-height:1rem}.axm-permissions-editor .__permissions .__content .__list{width:100%}.axm-permissions-editor .__permissions .__content .__list .__item .__children{margin-left:.5rem;border-left-width:1px;border-style:dashed;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lighter-surface),var(--tw-border-opacity, 1))}\n"] }]
+                    }, template: "<div class=\"__groups ax-p-4 ax-min-h-full ax-w-2/5\">\n  <ax-tabs location=\"start\" look=\"with-line-color\" class=\"ax-h-full\">\n    @for (group of groupsWithBadge(); track $index) {\n      <ax-tab-item\n        [active]=\"group.name === selectedGroup()?.name\"\n        [text]=\"group.title\"\n        (onClick)=\"handleMenuItemClick(group)\"\n      >\n        @if (badgeToNumber(group.badge) > 0) {\n          <ax-suffix>\n            <ax-badge color=\"primary\" [text]=\"group.badge\"></ax-badge>\n          </ax-suffix>\n        }\n      </ax-tab-item>\n    }\n  </ax-tabs>\n</div>\n\n<div class=\"__permissions ax-flex ax-h-full ax-overflow-auto ax-flex-col ax-w-3/5 ax-border-s\">\n  <div class=\"__header ax-p-4 ax-border-b ax-border-lightest\">\n    <span class=\"ax-h6\">{{ selectedGroup()?.title! }}</span>\n  </div>\n\n  <div class=\"__content ax-flex ax-p-4 ax-overflow-auto\">\n    <ul class=\"__list\">\n      <ng-template #recursiveList let-items>\n        @for (item of items; track $index) {\n          <li class=\"__item ax-py-1 ax-ps-2\">\n            <ax-check-box\n              [ngModel]=\"item.isSelected\"\n              [readonly]=\"readOnly()\"\n              (onValueChanged)=\"onPermissionToggle(item, $event)\"\n            >\n              <ax-label>\n                {{ item.title }}\n                @if (item.description) {\n                  <i class=\"ax-ps-2 ax-text-xs fa-light fa-circle-info\" [title]=\"item.description\"></i>\n                }\n              </ax-label>\n            </ax-check-box>\n\n            @if (item.children && item.children.length > 0) {\n              <ul class=\"__children ax-p-2 ax-mt-1 ax-ms-1\">\n                <ng-container *ngTemplateOutlet=\"recursiveList; context: { $implicit: item.children }\"></ng-container>\n              </ul>\n            }\n          </li>\n        }\n      </ng-template>\n      <ng-container *ngTemplateOutlet=\"recursiveList; context: { $implicit: items() }\"></ng-container>\n    </ul>\n  </div>\n</div>\n", styles: [".axm-permissions-editor{display:flex;height:100%;flex-direction:column}.axm-permissions-editor .__groups .__tabs{height:100%}.axm-permissions-editor .__permissions .__header .__title{font-size:1rem;font-weight:500;line-height:1rem}.axm-permissions-editor .__permissions .__content .__list{width:100%}.axm-permissions-editor .__permissions .__content .__list .__item .__children{margin-left:.5rem;border-left-width:1px;border-style:dashed;--tw-border-opacity: 1;border-color:rgba(var(--ax-sys-color-border-lighter-surface),var(--tw-border-opacity, 1))}\n"] }]
         }] });
 
 // #region ----------------   Imports   ----------------