@memberjunction/ng-data-context 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 +139 -0
  2. package/package.json +4 -4
package/README.md ADDED
@@ -0,0 +1,139 @@
1
+ # Data Context Component
2
+
3
+ This Angular component package provides a way to display and interact with MemberJunction Data Contexts, which are collections of data items from different sources that can be used together.
4
+
5
+ ## Features
6
+
7
+ - **Display Data Context Details**: View information about a data context including ID, name, and description
8
+ - **View Data Context Items**: See all items within a data context in a grid format
9
+ - **Dialog Wrapper**: Includes a dialog component for easy integration into existing UIs
10
+ - **Metadata Provider Integration**: Works with MemberJunction metadata providers
11
+ - **Loading State Management**: Provides visual feedback during data loading
12
+
13
+ ## Installation
14
+
15
+ ```bash
16
+ npm install @memberjunction/ng-data-context
17
+ ```
18
+
19
+ ## Usage
20
+
21
+ ### Import the Module
22
+
23
+ ```typescript
24
+ import { DataContextModule } from '@memberjunction/ng-data-context';
25
+
26
+ @NgModule({
27
+ imports: [
28
+ DataContextModule,
29
+ // other imports
30
+ ],
31
+ // ...
32
+ })
33
+ export class YourModule { }
34
+ ```
35
+
36
+ ### Basic Component Usage
37
+
38
+ ```html
39
+ <!-- Display a data context using its ID -->
40
+ <mj-data-context
41
+ [dataContextId]="'your-data-context-id'"
42
+ [Provider]="customMetadataProvider">
43
+ </mj-data-context>
44
+ ```
45
+
46
+ ### Dialog Component Usage
47
+
48
+ ```html
49
+ <!-- Show data context in a dialog -->
50
+ <mj-data-context-dialog
51
+ *ngIf="showDataContextDialog"
52
+ [dataContextId]="selectedDataContextId"
53
+ (dialogClosed)="showDataContextDialog = false">
54
+ </mj-data-context-dialog>
55
+ ```
56
+
57
+ ### TypeScript Component Example
58
+
59
+ ```typescript
60
+ import { Component } from '@angular/core';
61
+ import { IMetadataProvider } from '@memberjunction/core';
62
+
63
+ @Component({
64
+ selector: 'app-data-context-viewer',
65
+ template: `
66
+ <button (click)="showDialog()">View Data Context</button>
67
+
68
+ <mj-data-context-dialog
69
+ *ngIf="isDialogVisible"
70
+ [dataContextId]="currentDataContextId"
71
+ [Provider]="metadataProvider"
72
+ (dialogClosed)="isDialogVisible = false">
73
+ </mj-data-context-dialog>
74
+ `
75
+ })
76
+ export class DataContextViewerComponent {
77
+ isDialogVisible = false;
78
+ currentDataContextId = '12345';
79
+ metadataProvider: IMetadataProvider;
80
+
81
+ constructor(metadataService: YourMetadataService) {
82
+ this.metadataProvider = metadataService.getProvider();
83
+ }
84
+
85
+ showDialog() {
86
+ this.isDialogVisible = true;
87
+ }
88
+ }
89
+ ```
90
+
91
+ ## API Reference
92
+
93
+ ### DataContextComponent
94
+
95
+ This is the main component for displaying a data context and its items.
96
+
97
+ #### Inputs
98
+
99
+ - `dataContextId`: string - The ID of the data context to display (required)
100
+ - `Provider`: IMetadataProvider - Custom metadata provider (optional, will use global provider if not specified)
101
+
102
+ ### DataContextDialogComponent
103
+
104
+ This component wraps the DataContextComponent in a Kendo dialog window.
105
+
106
+ #### Inputs
107
+
108
+ - `dataContextId`: string - The ID of the data context to display (required)
109
+ - `Provider`: IMetadataProvider - Custom metadata provider (optional)
110
+
111
+ #### Outputs
112
+
113
+ - `dialogClosed`: EventEmitter<void> - Emitted when the dialog is closed
114
+
115
+ ## Data Context Structure
116
+
117
+ A data context in MemberJunction typically consists of:
118
+
119
+ 1. **Context Record** - Contains metadata about the context (name, description, etc.)
120
+ 2. **Context Items** - The actual data items that make up the context, which can be:
121
+ - SQL queries
122
+ - Views
123
+ - Entity records
124
+ - Query results
125
+ - Other data items
126
+
127
+ The component displays both the context metadata and a grid of the items contained within it.
128
+
129
+ ## Styling
130
+
131
+ The component uses Kendo UI components for consistent styling and includes basic CSS that can be overridden in your application.
132
+
133
+ ## Dependencies
134
+
135
+ - `@memberjunction/core`: For metadata and entity access
136
+ - `@memberjunction/core-entities`: For DataContextEntity type
137
+ - `@memberjunction/global`: For global utilities
138
+ - `@progress/kendo-angular-grid`: For displaying data context items
139
+ - `@progress/kendo-angular-indicators`: For loading indicators
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@memberjunction/ng-data-context",
3
- "version": "2.32.2",
3
+ "version": "2.34.0",
4
4
  "description": "MemberJunction: Angular component and pop-up window to display and edit the contents of a data context.",
5
5
  "main": "./dist/public-api.js",
6
6
  "typings": "./dist/public-api.d.ts",
@@ -25,9 +25,9 @@
25
25
  "@progress/kendo-angular-indicators": "16.2.0"
26
26
  },
27
27
  "dependencies": {
28
- "@memberjunction/core": "2.32.2",
29
- "@memberjunction/core-entities": "2.32.2",
30
- "@memberjunction/global": "2.32.2",
28
+ "@memberjunction/core": "2.34.0",
29
+ "@memberjunction/core-entities": "2.34.0",
30
+ "@memberjunction/global": "2.34.0",
31
31
  "tslib": "^2.3.0"
32
32
  },
33
33
  "sideEffects": false