@pega/dx-component-builder-sdk 0.1.23 → 0.1.24

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 (10) hide show
  1. package/package.json +2 -2
  2. package/src/cli.js +8 -2
  3. package/src/tasks/create/templates/SDK-React/template/DETAILS/demo.stories.jsx.mustache +509 -0
  4. package/src/tasks/create/templates/SDK-React/template/DETAILS/mock.stories.js.mustache +34 -0
  5. package/src/tasks/create/templates/SDK-React/template/DETAILS-region/demo.stories.jsx.mustache +1107 -0
  6. package/src/tasks/create/templates/SDK-React/template/DETAILS-region/mock.stories.js.mustache +34 -0
  7. package/src/tasks/create/templates/SDK-React/template/FORM/demo.stories.jsx.mustache +200 -0
  8. package/src/tasks/index.js +1 -0
  9. package/src/tasks/override/index.js +4 -2
  10. package/src/tasks/override-all/index.js +218 -0
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/dx-component-builder-sdk",
3
- "version": "0.1.23",
3
+ "version": "0.1.24",
4
4
  "description": "Utility for building custom UI components",
5
5
  "bin": "./bin/index.js",
6
6
  "scripts": {
@@ -50,7 +50,7 @@
50
50
  "ts-loader": "^9.3.1",
51
51
  "typescript": "^4.8.3",
52
52
  "url-loader": "4.1.1",
53
- "webpack": "5.74.0"
53
+ "webpack": "^5.76.1"
54
54
  },
55
55
  "author": "Custom component dev",
56
56
  "license": "SEE LICENSE IN LICENSE",
package/src/cli.js CHANGED
@@ -12,6 +12,7 @@ import {
12
12
  listComponents,
13
13
  mapAllComponents,
14
14
  overrideComponent,
15
+ overrideAllComponents,
15
16
  publishComponent,
16
17
  publishAllComponents,
17
18
  updateComponent,
@@ -22,11 +23,12 @@ import {
22
23
  const TASKS = {
23
24
  CREATE: 'create',
24
25
  OVERRIDE: 'override',
26
+ OVERRIDE_ALL: 'overrideAll',
25
27
  BUILD: 'buildComponent',
26
28
  BUILD_ALL: 'buildAllComponents',
27
29
  MAP_ALL: "mapAll",
28
30
  PUBLISH: 'publish',
29
- PUBLISH_All: 'publishAll',
31
+ PUBLISH_ALL: 'publishAll',
30
32
  LIST: 'list',
31
33
  VALIDATE_SCHEMA: 'validateSchema',
32
34
  UPDATE: 'update',
@@ -68,6 +70,10 @@ export default async (args = []) => {
68
70
  overrideComponent(options);
69
71
  break;
70
72
  }
73
+ case TASKS.OVERRIDE_ALL: {
74
+ overrideAllComponents(options);
75
+ break;
76
+ }
71
77
  case TASKS.MAP_ALL: {
72
78
  mapAllComponents(options);
73
79
  break;
@@ -76,7 +82,7 @@ export default async (args = []) => {
76
82
  publishComponent(options);
77
83
  break;
78
84
  }
79
- case TASKS.PUBLISH_All: {
85
+ case TASKS.PUBLISH_A: {
80
86
  publishAllComponents(options);
81
87
  break;
82
88
  }
package/src/tasks/create/templates/SDK-React/template/DETAILS/demo.stories.jsx.mustache ADDED
@@ -0,0 +1,509 @@
1
+ import { withKnobs } from '@storybook/addon-knobs';
2
+
3
+ import {{COMPONENT_CLASS_NAME}} from './index.tsx';
4
+
5
+ import operatorDetails from './mock.stories';
6
+
7
+ export default {
8
+ title: '{{COMPONENT_CLASS_NAME}}',
9
+ decorators: [withKnobs],
10
+ component: {{COMPONENT_CLASS_NAME}},
11
+ parameters: {
12
+ type: "Details"
13
+ },
14
+ };
15
+
16
+ export const Base{{COMPONENT_CLASS_NAME}} = () => {
17
+
18
+ if (!window.PCore) {
19
+ window.PCore = {};
20
+ }
21
+
22
+ window.PCore.getUserApi = () => {
23
+ return {
24
+ getOperatorDetails: () => {
25
+ return new Promise(resolve => {
26
+ resolve(operatorDetails);
27
+ });
28
+ }
29
+ };
30
+ };
31
+
32
+ const firstName = 'John';
33
+ const lastName = 'Doe';
34
+ const phone = '+16397975093';
35
+ const email = 'john@doe.com';
36
+ const internetPlan = '100 Mbps';
37
+ const price = '90.99';
38
+
39
+ const props = {
40
+ NumCols: '1',
41
+ template: 'DefaultForm',
42
+
43
+ children: [
44
+ {
45
+ props: {
46
+ getPConnect: () => {
47
+ return {
48
+ getChildren: () => {
49
+ return [
50
+ {
51
+ getPConnect: () => {
52
+ return {
53
+ isError: false,
54
+ isEditable() {
55
+ return false;
56
+ },
57
+ setAction: () => {/* nothing */},
58
+ hasChildren() {
59
+ return false;
60
+ },
61
+ getComponentName() {
62
+ return 'textInput';
63
+ },
64
+ isConditionExist() {
65
+ return true;
66
+ },
67
+ getActionsApi() {/* nothing */},
68
+ getConfigProps() {
69
+ return {
70
+ readOnly: undefined,
71
+ value: firstName,
72
+ label: 'First Name',
73
+ hasSuggestions: false,
74
+ displayMode: 'LABELS_LEFT'
75
+ };
76
+ },
77
+ getActions() {/* nothing */},
78
+ getReferencedView: () => {
79
+ return {
80
+ config: {
81
+ readOnly: undefined,
82
+ placeholder: 'First Name',
83
+ value: firstName,
84
+ label: 'First Name',
85
+ hasSuggestions: false,
86
+ displayMode: 'LABELS_LEFT'
87
+ }
88
+ };
89
+ },
90
+ getInheritedProps: () => {
91
+ return {};
92
+ },
93
+ getReferencedViewPConnect: () => {
94
+ return {
95
+ readOnly: undefined,
96
+ placeholder: 'First Name',
97
+ value: firstName,
98
+ label: 'First Name',
99
+ hasSuggestions: false,
100
+ displayMode: 'LABELS_LEFT'
101
+ };
102
+ }
103
+ };
104
+ }
105
+ },
106
+ {
107
+ getPConnect: () => {
108
+ return {
109
+ isError: false,
110
+ isEditable() {
111
+ return false;
112
+ },
113
+ setAction() {/* nothing */},
114
+ hasChildren() {
115
+ return false;
116
+ },
117
+ getComponentName() {
118
+ return 'textInput';
119
+ },
120
+ isConditionExist() {
121
+ return true;
122
+ },
123
+ getActionsApi() {/* nothing */},
124
+ getConfigProps() {
125
+ return {
126
+ readOnly: undefined,
127
+ value: lastName,
128
+ label: 'Last Name',
129
+ hasSuggestions: false,
130
+ displayMode: 'LABELS_LEFT'
131
+ };
132
+ },
133
+ getActions() {/* nothing */},
134
+ getReferencedView: () => {
135
+ return {
136
+ config: {
137
+ readOnly: undefined,
138
+ placeholder: 'Last Name',
139
+ value: lastName,
140
+ label: 'Last Name',
141
+ hasSuggestions: false,
142
+ displayMode: 'LABELS_LEFT'
143
+ }
144
+ };
145
+ },
146
+ getInheritedProps: () => {
147
+ return {};
148
+ },
149
+ getReferencedViewPConnect: () => {
150
+ return {
151
+ readOnly: undefined,
152
+ placeholder: 'Last Name',
153
+ value: lastName,
154
+ label: 'Last Name',
155
+ hasSuggestions: false,
156
+ displayMode: 'LABELS_LEFT'
157
+ };
158
+ }
159
+ };
160
+ }
161
+ },
162
+
163
+ {
164
+ getPConnect: () => {
165
+ return {
166
+ isError: false,
167
+ isEditable() {
168
+ return false;
169
+ },
170
+ setAction() {/* nothing */},
171
+ hasChildren() {
172
+ return false;
173
+ },
174
+ getComponentName() {
175
+ return 'email';
176
+ },
177
+ isConditionExist() {
178
+ return true;
179
+ },
180
+ getActionsApi() {/* nothing */},
181
+ getConfigProps() {
182
+ return {
183
+ readOnly: undefined,
184
+ value: email,
185
+ label: 'Email',
186
+ hasSuggestions: false,
187
+ displayMode: 'LABELS_LEFT'
188
+ };
189
+ },
190
+ getActions() {/* nothing */},
191
+ getReferencedView: () => {
192
+ return {
193
+ config: {
194
+ readOnly: undefined,
195
+ placeholder: 'Email',
196
+ value: email,
197
+ label: 'Email',
198
+ hasSuggestions: false,
199
+ displayMode: 'LABELS_LEFT'
200
+ }
201
+ };
202
+ },
203
+ getInheritedProps: () => {
204
+ return {};
205
+ },
206
+ getReferencedViewPConnect: () => {
207
+ return {
208
+ value: email,
209
+ label: 'Email',
210
+ required: true,
211
+ testId: 'CE8AE9DA5B7CD6C3DF2929543A9AF92D',
212
+ hasSuggestions: false,
213
+ displayMode: 'LABELS_LEFT'
214
+ }
215
+ }
216
+ };
217
+ }
218
+ },
219
+
220
+ {
221
+ getPConnect: () => {
222
+ return {
223
+ isError: false,
224
+ isEditable() {
225
+ return false;
226
+ },
227
+ setAction() {/* nothing */},
228
+ hasChildren() {
229
+ return false;
230
+ },
231
+ getComponentName() {
232
+ return 'phone';
233
+ },
234
+ isConditionExist() {
235
+ return true;
236
+ },
237
+ getActionsApi() {/* nothing */},
238
+ getConfigProps() {
239
+ return {
240
+ readOnly: undefined,
241
+ value: phone,
242
+ label: 'Phone',
243
+ hasSuggestions: false,
244
+ displayMode: 'LABELS_LEFT'
245
+ };
246
+ },
247
+ getActions() {/* nothing */},
248
+ getReferencedView: () => {
249
+ return {
250
+ config: {
251
+ readOnly: undefined,
252
+ placeholder: 'Phone',
253
+ value: phone,
254
+ label: 'Phone',
255
+ hasSuggestions: false,
256
+ displayMode: 'LABELS_LEFT'
257
+ }
258
+ };
259
+ },
260
+ getInheritedProps: () => {
261
+ return {};
262
+ },
263
+ getReferencedViewPConnect: () => {
264
+ return {
265
+ readOnly: undefined,
266
+ value: phone,
267
+ label: 'Phone',
268
+ displayMode: 'LABELS_LEFT',
269
+ hasSuggestions: false,
270
+ };
271
+ }
272
+ };
273
+ }
274
+ },
275
+
276
+ {
277
+ getPConnect: () => {
278
+ return {
279
+ isError: false,
280
+ isEditable() {
281
+ return false;
282
+ },
283
+ setAction() {/* nothing */},
284
+ hasChildren() {
285
+ return false;
286
+ },
287
+ getComponentName() {
288
+ return 'currency';
289
+ },
290
+ isConditionExist() {
291
+ return true;
292
+ },
293
+ getActionsApi() {/* nothing */},
294
+ getConfigProps() {
295
+ return {
296
+ readOnly: undefined,
297
+ value: price,
298
+ label: 'Price',
299
+ hasSuggestions: false,
300
+ displayMode: 'LABELS_LEFT'
301
+ };
302
+ },
303
+ getActions() {/* nothing */},
304
+ getReferencedView: () => {
305
+ return {
306
+ config: {
307
+ readOnly: undefined,
308
+ placeholder: 'Price',
309
+ value: price,
310
+ label: 'Price',
311
+ hasSuggestions: false,
312
+ displayMode: 'LABELS_LEFT'
313
+ }
314
+ };
315
+ },
316
+ getInheritedProps: () => {
317
+ return {};
318
+ },
319
+ getReferencedViewPConnect: () => {
320
+ return {
321
+ readOnly: undefined,
322
+ placeholder: 'Price',
323
+ value: price,
324
+ label: 'Price',
325
+ hasSuggestions: false,
326
+ displayMode: 'LABELS_LEFT',
327
+ getPConnect: () => {
328
+ return {
329
+ getActionsApi: () => {/* nothing */},
330
+ getStateProps: () => {
331
+ return{
332
+ value: ""
333
+ }
334
+ },
335
+ getDataObject: () => {/* nothing */}
336
+ }
337
+ }
338
+ };
339
+ }
340
+ };
341
+ }
342
+ },
343
+
344
+ {
345
+ getPConnect: () => {
346
+ return {
347
+ isError: false,
348
+ isEditable() {
349
+ return false;
350
+ },
351
+ setAction() {/* nothing */},
352
+ hasChildren() {
353
+ return false;
354
+ },
355
+ getComponentName() {
356
+ return 'radio';
357
+ },
358
+ isConditionExist() {
359
+ return true;
360
+ },
361
+ getActionsApi() {/* nothing */},
362
+ getConfigProps() {
363
+ return {
364
+ readOnly: undefined,
365
+ value: internetPlan,
366
+ label: 'Internet Plan',
367
+ hasSuggestions: false,
368
+ displayMode: 'LABELS_LEFT'
369
+ };
370
+ },
371
+ getActions() {/* nothing */},
372
+ getReferencedView: () => {
373
+ return {
374
+ config: {
375
+ "readOnly": true,
376
+ "value": internetPlan,
377
+ "label": "Internet Option",
378
+ "listType": "associated",
379
+ "datasource": [
380
+ {
381
+ "key": "100 Mbps",
382
+ "value": "100 Mbps"
383
+ },
384
+ {
385
+ "key": "300 Mbps",
386
+ "value": "300 Mbps"
387
+ },
388
+ {
389
+ "key": "1 Gbps",
390
+ "value": "1 Gbps"
391
+ }
392
+ ],
393
+ "displayMode": "LABELS_LEFT"
394
+ }
395
+ };
396
+ },
397
+ getInheritedProps: () => {
398
+ return {};
399
+ },
400
+ getReferencedViewPConnect: () => {
401
+ return {
402
+ readOnly: undefined,
403
+ placeholder: 'Internet Plan',
404
+ value: internetPlan,
405
+ label: 'Internet Plan',
406
+ hasSuggestions: false,
407
+ displayMode: 'LABELS_LEFT',
408
+ getPConnect: () => {
409
+ return {
410
+ getActionsApi: () => {/* nothing */},
411
+ getStateProps: () => {
412
+ return{
413
+ value: ""
414
+ }
415
+ },
416
+ getDataObject: () => {/* nothing */},
417
+ getConfigProps: () => {
418
+ return {
419
+ listType: 'associated'
420
+ }
421
+ }
422
+ }
423
+ }
424
+ };
425
+ }
426
+ };
427
+ }
428
+ },
429
+
430
+ {
431
+ getPConnect: () => {
432
+ return {
433
+ isError: false,
434
+ isEditable() {
435
+ return false;
436
+ },
437
+ setAction() {/* nothing */},
438
+ hasChildren() {
439
+ return false;
440
+ },
441
+ getComponentName() {
442
+ return 'operator';
443
+ },
444
+ isConditionExist() {
445
+ return true;
446
+ },
447
+ getActionsApi() {/* nothing */},
448
+ getConfigProps() {
449
+ return {
450
+ readOnly: undefined,
451
+ value: '',
452
+ label: '',
453
+ hasSuggestions: false,
454
+ displayMode: 'LABELS_LEFT'
455
+ };
456
+ },
457
+ getActions() {/* nothing */},
458
+ getReferencedView: () => {
459
+ return {
460
+ config: {
461
+ readOnly: undefined,
462
+ placeholder: '',
463
+ value: '',
464
+ label: '',
465
+ hasSuggestions: false,
466
+ displayMode: 'LABELS_LEFT'
467
+ }
468
+ };
469
+ },
470
+ getInheritedProps: () => {
471
+ return {};
472
+ },
473
+ getReferencedViewPConnect: () => {
474
+ return {
475
+ "caseOpConfig": {
476
+ "label": "Create operator",
477
+ "createLabel": "Created",
478
+ "updateLabel": "Updated",
479
+ "updateDateTime": "2023-03-10T15:45:56.919Z",
480
+ "createDateTime": "2023-03-10T15:45:40.154Z",
481
+ "updateOperator": {
482
+ "userId": "rep@mediaco",
483
+ "userName":"representative"
484
+ },
485
+ "createOperator": {
486
+ "userId": "rep@mediaco",
487
+ "userName": "representative"
488
+ }
489
+ }
490
+ }
491
+ }
492
+ };
493
+ }
494
+ },
495
+ ];
496
+ }
497
+ };
498
+ }
499
+ }
500
+ }
501
+ ]
502
+ };
503
+
504
+ return (
505
+ <>
506
+ <{{COMPONENT_CLASS_NAME}} {...props}>{props.children}</{{COMPONENT_CLASS_NAME}}>
507
+ </>
508
+ );
509
+ };
package/src/tasks/create/templates/SDK-React/template/DETAILS/mock.stories.js.mustache ADDED
@@ -0,0 +1,34 @@
1
+ const operatorDetails = {
2
+ data: {
3
+ pzLoadTime: 'January 18, 2023 10:33:19 AM EST',
4
+ pzPageNameHash: '_pa1519192551088960pz',
5
+ pyOperatorInfo: {
6
+ pyUserName: 'french DigV2',
7
+ pyPosition: '',
8
+ pyImageInsKey: '',
9
+ pySkills: [
10
+ {
11
+ pySkillName: '',
12
+ pzIndexOwnerKey: 'DATA-ADMIN-OPERATOR-ID FRENCHTEST.DIGV2',
13
+ pySkillRating: 0
14
+ }
15
+ ],
16
+ pyReportToUserName: '',
17
+ pyReportTo: '',
18
+ pyOrganization: 'DXIL',
19
+ pyTitle: '',
20
+ pyLabel: 'frenchTest.DigV2',
21
+ pyEmailAddress: 'User@DigV2',
22
+ pyTelephone: ''
23
+ }
24
+ },
25
+ status: 200,
26
+ statusText: '',
27
+ headers: {
28
+ 'content-length': '435',
29
+ 'content-type': 'application/json;charset=UTF-8'
30
+ },
31
+ request: {}
32
+ };
33
+
34
+ export default operatorDetails;