@memberjunction/ng-entity-permissions 2.32.2 → 2.34.0

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 (2) hide show
  1. package/README.md +178 -0
  2. package/package.json +6 -6
package/README.md ADDED
@@ -0,0 +1,178 @@
1
+ # @memberjunction/ng-entity-permissions
2
+
3
+ The `@memberjunction/ng-entity-permissions` package provides Angular components for displaying and editing permissions for MemberJunction entities. It allows administrators to manage role-based access control (RBAC) for entities in a user-friendly grid interface.
4
+
5
+ ## Features
6
+
7
+ - Grid-based interface for viewing and editing entity permissions
8
+ - Support for managing permissions in two modes: by entity or by role
9
+ - Ability to toggle Read, Create, Update, and Delete permissions individually
10
+ - Batch editing capabilities with transaction support
11
+ - Entity selector with integrated permissions grid
12
+ - Visual indication of modified permissions before saving
13
+ - Quick actions to flip all permissions or reset changes
14
+
15
+ ## Installation
16
+
17
+ ```bash
18
+ npm install @memberjunction/ng-entity-permissions
19
+ ```
20
+
21
+ ## Requirements
22
+
23
+ - Angular 18+
24
+ - @memberjunction/core
25
+ - @memberjunction/core-entities
26
+ - @progress/kendo-angular-grid
27
+ - @progress/kendo-angular-dropdowns
28
+ - @progress/kendo-angular-buttons
29
+ - @progress/kendo-angular-dialog
30
+ - @progress/kendo-angular-indicators
31
+
32
+ ## Usage
33
+
34
+ ### Basic Setup
35
+
36
+ First, import the EntityPermissionsModule in your module:
37
+
38
+ ```typescript
39
+ import { EntityPermissionsModule } from '@memberjunction/ng-entity-permissions';
40
+
41
+ @NgModule({
42
+ imports: [
43
+ // other imports...
44
+ EntityPermissionsModule
45
+ ],
46
+ })
47
+ export class YourModule { }
48
+ ```
49
+
50
+ ### Entity Permissions Grid
51
+
52
+ Use the grid component to display and edit permissions for a specific entity:
53
+
54
+ ```html
55
+ <mj-entity-permissions-grid
56
+ [EntityName]="'Customer'"
57
+ [Mode]="'Entity'"
58
+ (PermissionChanged)="handlePermissionChanged($event)">
59
+ </mj-entity-permissions-grid>
60
+ ```
61
+
62
+ Or to display permissions for a specific role across all entities:
63
+
64
+ ```html
65
+ <mj-entity-permissions-grid
66
+ [RoleName]="'Administrator'"
67
+ [Mode]="'Role'"
68
+ (PermissionChanged)="handlePermissionChanged($event)">
69
+ </mj-entity-permissions-grid>
70
+ ```
71
+
72
+ In your component:
73
+
74
+ ```typescript
75
+ import { Component } from '@angular/core';
76
+ import { EntityPermissionChangedEvent } from '@memberjunction/ng-entity-permissions';
77
+
78
+ @Component({
79
+ selector: 'app-permissions-manager',
80
+ templateUrl: './permissions-manager.component.html',
81
+ })
82
+ export class PermissionsManagerComponent {
83
+ handlePermissionChanged(event: EntityPermissionChangedEvent) {
84
+ console.log('Permission changed:', event);
85
+ // You can cancel the change if needed by setting event.Cancel = true
86
+ }
87
+ }
88
+ ```
89
+
90
+ ### Entity Selector with Permissions Grid
91
+
92
+ Use the selector component to allow users to choose an entity and then manage its permissions:
93
+
94
+ ```html
95
+ <mj-entity-permissions-selector-with-grid
96
+ (PermissionChanged)="handlePermissionChanged($event)">
97
+ </mj-entity-permissions-selector-with-grid>
98
+ ```
99
+
100
+ ## API Reference
101
+
102
+ ### EntityPermissionsGridComponent
103
+
104
+ #### Inputs
105
+
106
+ | Name | Type | Default | Description |
107
+ |------|------|---------|-------------|
108
+ | `Mode` | `'Entity' \| 'Role'` | `'Entity'` | Whether to display permissions for a specific entity or role |
109
+ | `EntityName` | `string` | `undefined` | Name of the entity to show permissions for (when Mode is 'Entity') |
110
+ | `RoleName` | `string` | `undefined` | Name of the role to show permissions for (when Mode is 'Role') |
111
+ | `BottomMargin` | `number` | `0` | Margin to apply at the bottom of the grid |
112
+
113
+ #### Outputs
114
+
115
+ | Name | Type | Description |
116
+ |------|------|-------------|
117
+ | `PermissionChanged` | `EventEmitter<EntityPermissionChangedEvent>` | Emitted when a permission is changed |
118
+
119
+ #### Methods
120
+
121
+ | Name | Parameters | Return Type | Description |
122
+ |------|------------|-------------|-------------|
123
+ | `Refresh` | None | `Promise<void>` | Reloads permissions data |
124
+ | `savePermissions` | None | `Promise<void>` | Saves all modified permissions |
125
+ | `cancelEdit` | None | `Promise<void>` | Reverts all unsaved changes |
126
+ | `flipAllPermissions` | `type: 'Read' \| 'Create' \| 'Update' \| 'Delete'` | `void` | Toggles all permissions of the specified type |
127
+
128
+ ### EntityPermissionsSelectorWithGridComponent
129
+
130
+ #### Inputs
131
+
132
+ | Name | Type | Default | Description |
133
+ |------|------|---------|-------------|
134
+ | `EntityName` | `string` | `undefined` | Name of the initially selected entity |
135
+ | `BottomMargin` | `number` | `0` | Margin to apply at the bottom of the component |
136
+
137
+ #### Outputs
138
+
139
+ | Name | Type | Description |
140
+ |------|------|-------------|
141
+ | `PermissionChanged` | `EventEmitter<EntityPermissionChangedEvent>` | Emitted when a permission is changed |
142
+
143
+ ### EntityPermissionChangedEvent Interface
144
+
145
+ ```typescript
146
+ type EntityPermissionChangedEvent = {
147
+ EntityName: string, // Name of the entity
148
+ RoleID: string // ID of the role
149
+ PermissionTypeChanged: 'Read' | 'Create' | 'Update' | 'Delete' // Type of permission changed
150
+ Value: boolean // New value of the permission
151
+ Cancel: boolean // Set to true to cancel the change
152
+ }
153
+ ```
154
+
155
+ ## Styling
156
+
157
+ The components use the following CSS classes that can be customized:
158
+
159
+ - `.grid`: Main permissions grid
160
+ - `.permission-left-col`: Left column in the grid (entity/role name)
161
+ - `.dirty-row`: Applied to rows with unsaved changes
162
+ - `.entity-selector`: Applied to the entity dropdown
163
+ - `.inner-grid`: Applied to the grid within the selector component
164
+
165
+ ## Dependencies
166
+
167
+ - @angular/common
168
+ - @angular/core
169
+ - @angular/forms
170
+ - @memberjunction/core
171
+ - @memberjunction/core-entities
172
+ - @memberjunction/ng-container-directives
173
+ - @memberjunction/ng-shared
174
+ - @progress/kendo-angular-dropdowns
175
+ - @progress/kendo-angular-grid
176
+ - @progress/kendo-angular-buttons
177
+ - @progress/kendo-angular-dialog
178
+ - @progress/kendo-angular-indicators
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@memberjunction/ng-entity-permissions",
3
- "version": "2.32.2",
3
+ "version": "2.34.0",
4
4
  "description": "MemberJunction: Angular components for displaying/editing permissions for an entity, and related components.",
5
5
  "main": "./dist/public-api.js",
6
6
  "typings": "./dist/public-api.d.ts",
@@ -25,11 +25,11 @@
25
25
  "@angular/router": "18.0.2"
26
26
  },
27
27
  "dependencies": {
28
- "@memberjunction/core-entities": "2.32.2",
29
- "@memberjunction/global": "2.32.2",
30
- "@memberjunction/core": "2.32.2",
31
- "@memberjunction/ng-container-directives": "2.32.2",
32
- "@memberjunction/ng-shared": "2.32.2",
28
+ "@memberjunction/core-entities": "2.34.0",
29
+ "@memberjunction/global": "2.34.0",
30
+ "@memberjunction/core": "2.34.0",
31
+ "@memberjunction/ng-container-directives": "2.34.0",
32
+ "@memberjunction/ng-shared": "2.34.0",
33
33
  "@progress/kendo-angular-dropdowns": "16.2.0",
34
34
  "@progress/kendo-angular-grid": "16.2.0",
35
35
  "@progress/kendo-angular-buttons": "16.2.0",