@pega/cosmos-react-demos 3.0.0-dev.27.1 → 3.0.0-dev.27.2
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.
- package/jsx/build/ExpressionBuilder/ExpressionBuilder.mocks.d.ts +9 -13
- package/jsx/build/ExpressionBuilder/ExpressionBuilder.mocks.d.ts.map +1 -1
- package/jsx/build/ExpressionBuilder/ExpressionBuilder.mocks.js +46 -13
- package/jsx/build/ExpressionBuilder/ExpressionBuilder.mocks.js.map +1 -1
- package/jsx/build/ExpressionBuilder/ExpressionBuilder.stories.d.ts +1 -0
- package/jsx/build/ExpressionBuilder/ExpressionBuilder.stories.d.ts.map +1 -1
- package/jsx/build/ExpressionBuilder/ExpressionBuilder.stories.jsx +67 -11
- package/jsx/build/ExpressionBuilder/ExpressionBuilder.stories.jsx.map +1 -1
- package/jsx/cs/CallControlPanel/CallControlPanel.mocks.d.ts +4 -0
- package/jsx/cs/CallControlPanel/CallControlPanel.mocks.d.ts.map +1 -1
- package/jsx/cs/CallControlPanel/CallControlPanel.mocks.js +14 -0
- package/jsx/cs/CallControlPanel/CallControlPanel.mocks.js.map +1 -1
- package/jsx/cs/CallControlPanel/CallControlPanel.stories.d.ts.map +1 -1
- package/jsx/cs/CallControlPanel/CallControlPanel.stories.jsx +64 -6
- package/jsx/cs/CallControlPanel/CallControlPanel.stories.jsx.map +1 -1
- package/jsx/social/Email/Email.stories.d.ts +5 -1
- package/jsx/social/Email/Email.stories.d.ts.map +1 -1
- package/jsx/social/Email/Email.stories.jsx +18 -2
- package/jsx/social/Email/Email.stories.jsx.map +1 -1
- package/lib/build/ExpressionBuilder/ExpressionBuilder.mocks.d.ts +9 -13
- package/lib/build/ExpressionBuilder/ExpressionBuilder.mocks.d.ts.map +1 -1
- package/lib/build/ExpressionBuilder/ExpressionBuilder.mocks.js +46 -13
- package/lib/build/ExpressionBuilder/ExpressionBuilder.mocks.js.map +1 -1
- package/lib/build/ExpressionBuilder/ExpressionBuilder.stories.d.ts +1 -0
- package/lib/build/ExpressionBuilder/ExpressionBuilder.stories.d.ts.map +1 -1
- package/lib/build/ExpressionBuilder/ExpressionBuilder.stories.js +65 -12
- package/lib/build/ExpressionBuilder/ExpressionBuilder.stories.js.map +1 -1
- package/lib/cs/CallControlPanel/CallControlPanel.mocks.d.ts +4 -0
- package/lib/cs/CallControlPanel/CallControlPanel.mocks.d.ts.map +1 -1
- package/lib/cs/CallControlPanel/CallControlPanel.mocks.js +14 -0
- package/lib/cs/CallControlPanel/CallControlPanel.mocks.js.map +1 -1
- package/lib/cs/CallControlPanel/CallControlPanel.stories.d.ts.map +1 -1
- package/lib/cs/CallControlPanel/CallControlPanel.stories.js +64 -6
- package/lib/cs/CallControlPanel/CallControlPanel.stories.js.map +1 -1
- package/lib/social/Email/Email.stories.d.ts +5 -1
- package/lib/social/Email/Email.stories.d.ts.map +1 -1
- package/lib/social/Email/Email.stories.js +18 -8
- package/lib/social/Email/Email.stories.js.map +1 -1
- package/package.json +9 -9
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { MenuProps } from '@pega/cosmos-react-core';
|
|
2
|
+
export declare const getFilterRegex: (inputValue: string) => RegExp;
|
|
2
3
|
export declare const errors = "Error message 1. Some unrealistic error message. Server unreachable. Check your network connection and try again";
|
|
3
4
|
export declare const items: ({
|
|
4
5
|
id: string;
|
|
@@ -20,19 +21,6 @@ export declare const items: ({
|
|
|
20
21
|
type: string;
|
|
21
22
|
}[];
|
|
22
23
|
};
|
|
23
|
-
} | {
|
|
24
|
-
id: string;
|
|
25
|
-
primary: string;
|
|
26
|
-
type: string;
|
|
27
|
-
expression: string;
|
|
28
|
-
details: {
|
|
29
|
-
primary: {
|
|
30
|
-
field: string;
|
|
31
|
-
value: string;
|
|
32
|
-
}[];
|
|
33
|
-
output?: undefined;
|
|
34
|
-
input?: undefined;
|
|
35
|
-
};
|
|
36
24
|
} | {
|
|
37
25
|
id: string;
|
|
38
26
|
primary: string;
|
|
@@ -57,4 +45,12 @@ export declare const primaryDetails: {
|
|
|
57
45
|
name: string;
|
|
58
46
|
value: string;
|
|
59
47
|
}[];
|
|
48
|
+
export declare const suggestedFields: {
|
|
49
|
+
label: string;
|
|
50
|
+
value: string;
|
|
51
|
+
}[];
|
|
52
|
+
export declare const suggestedFunctions: {
|
|
53
|
+
label: string;
|
|
54
|
+
value: string;
|
|
55
|
+
}[];
|
|
60
56
|
//# sourceMappingURL=ExpressionBuilder.mocks.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpressionBuilder.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.mocks.ts"],"names":[],"mappings":"AAIA,OAAO,EAAa,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAE/D,eAAO,MAAM,MAAM,qHACiG,CAAC;AAErH,eAAO,MAAM,KAAK
|
|
1
|
+
{"version":3,"file":"ExpressionBuilder.mocks.d.ts","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.mocks.ts"],"names":[],"mappings":"AAIA,OAAO,EAAa,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAE/D,eAAO,MAAM,cAAc,eAAgB,MAAM,WAEhD,CAAC;AAEF,eAAO,MAAM,MAAM,qHACiG,CAAC;AAErH,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA0ZjB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,SAAS,CAAC,OAAO,CA+B/C,CAAC;AAEF,eAAO,MAAM,2BAA2B,yGAMtC,CAAC;AAEH,eAAO,MAAM,cAAc;;;;GAgB1B,CAAC;AAEF,eAAO,MAAM,eAAe;;;GAa3B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;GAa9B,CAAC"}
|
|
@@ -1,17 +1,20 @@
|
|
|
1
1
|
import styled, { css } from 'styled-components';
|
|
2
2
|
import { createUID } from '@pega/cosmos-react-core';
|
|
3
|
+
export const getFilterRegex = (inputValue) => {
|
|
4
|
+
return new RegExp(`${inputValue.replace(/[.*+\-?^${}()|[\]\\]/g, '\\$&')}`, 'i');
|
|
5
|
+
};
|
|
3
6
|
export const errors = 'Error message 1. Some unrealistic error message. Server unreachable. Check your network connection and try again';
|
|
4
7
|
export const items = [
|
|
5
8
|
{
|
|
6
9
|
id: createUID(),
|
|
7
10
|
primary: 'Validate loan value',
|
|
8
11
|
type: 'Decision',
|
|
9
|
-
expression: 'validateLoanValue()',
|
|
12
|
+
expression: '@validateLoanValue()',
|
|
10
13
|
details: {
|
|
11
14
|
primary: [
|
|
12
15
|
{
|
|
13
16
|
field: 'Description',
|
|
14
|
-
value: 'Function to validate loan value'
|
|
17
|
+
value: 'Function to validate loan value through simple interest or compound interest based on user choice'
|
|
15
18
|
},
|
|
16
19
|
{
|
|
17
20
|
field: 'Scope',
|
|
@@ -51,7 +54,7 @@ export const items = [
|
|
|
51
54
|
id: createUID(),
|
|
52
55
|
primary: 'Loan amount under 100k',
|
|
53
56
|
type: 'When',
|
|
54
|
-
expression: 'isLoanAmountUnder100k()',
|
|
57
|
+
expression: '@isLoanAmountUnder100k()',
|
|
55
58
|
details: {
|
|
56
59
|
primary: [
|
|
57
60
|
{
|
|
@@ -97,7 +100,8 @@ export const items = [
|
|
|
97
100
|
field: 'Namespace',
|
|
98
101
|
value: 'px'
|
|
99
102
|
}
|
|
100
|
-
]
|
|
103
|
+
],
|
|
104
|
+
output: []
|
|
101
105
|
}
|
|
102
106
|
},
|
|
103
107
|
{
|
|
@@ -119,14 +123,15 @@ export const items = [
|
|
|
119
123
|
field: 'Namespace',
|
|
120
124
|
value: 'px'
|
|
121
125
|
}
|
|
122
|
-
]
|
|
126
|
+
],
|
|
127
|
+
output: []
|
|
123
128
|
}
|
|
124
129
|
},
|
|
125
130
|
{
|
|
126
131
|
id: createUID(),
|
|
127
132
|
primary: 'Max',
|
|
128
133
|
type: 'Function',
|
|
129
|
-
expression: 'max()',
|
|
134
|
+
expression: '@max()',
|
|
130
135
|
details: {
|
|
131
136
|
primary: [
|
|
132
137
|
{
|
|
@@ -166,7 +171,7 @@ export const items = [
|
|
|
166
171
|
id: createUID(),
|
|
167
172
|
primary: 'Min',
|
|
168
173
|
type: 'Function',
|
|
169
|
-
expression: 'min()',
|
|
174
|
+
expression: '@min()',
|
|
170
175
|
details: {
|
|
171
176
|
primary: [
|
|
172
177
|
{
|
|
@@ -206,7 +211,7 @@ export const items = [
|
|
|
206
211
|
id: createUID(),
|
|
207
212
|
primary: 'Sum',
|
|
208
213
|
type: 'Function',
|
|
209
|
-
expression: 'sum()',
|
|
214
|
+
expression: '@sum()',
|
|
210
215
|
details: {
|
|
211
216
|
primary: [
|
|
212
217
|
{
|
|
@@ -246,7 +251,7 @@ export const items = [
|
|
|
246
251
|
id: createUID(),
|
|
247
252
|
primary: 'Absolute',
|
|
248
253
|
type: 'Function',
|
|
249
|
-
expression: 'abs()',
|
|
254
|
+
expression: '@abs()',
|
|
250
255
|
details: {
|
|
251
256
|
primary: [
|
|
252
257
|
{
|
|
@@ -281,7 +286,7 @@ export const items = [
|
|
|
281
286
|
id: createUID(),
|
|
282
287
|
primary: 'Square root',
|
|
283
288
|
type: 'Function',
|
|
284
|
-
expression: 'sqrt()',
|
|
289
|
+
expression: '@sqrt()',
|
|
285
290
|
details: {
|
|
286
291
|
primary: [
|
|
287
292
|
{
|
|
@@ -316,7 +321,7 @@ export const items = [
|
|
|
316
321
|
id: createUID(),
|
|
317
322
|
primary: 'Average',
|
|
318
323
|
type: 'Function',
|
|
319
|
-
expression: 'average()',
|
|
324
|
+
expression: '@average()',
|
|
320
325
|
details: {
|
|
321
326
|
primary: [
|
|
322
327
|
{
|
|
@@ -356,7 +361,7 @@ export const items = [
|
|
|
356
361
|
id: createUID(),
|
|
357
362
|
primary: 'Is the current browser Firefox',
|
|
358
363
|
type: 'When',
|
|
359
|
-
expression: 'isFirefox()',
|
|
364
|
+
expression: '@isFirefox()',
|
|
360
365
|
details: {
|
|
361
366
|
primary: [
|
|
362
367
|
{
|
|
@@ -384,7 +389,7 @@ export const items = [
|
|
|
384
389
|
id: createUID(),
|
|
385
390
|
primary: 'Is the current browser Internet Explorer',
|
|
386
391
|
type: 'When',
|
|
387
|
-
expression: 'isIE()',
|
|
392
|
+
expression: '@isIE()',
|
|
388
393
|
details: {
|
|
389
394
|
primary: [
|
|
390
395
|
{
|
|
@@ -465,4 +470,32 @@ export const primaryDetails = [
|
|
|
465
470
|
value: 'px'
|
|
466
471
|
}
|
|
467
472
|
];
|
|
473
|
+
export const suggestedFields = [
|
|
474
|
+
{
|
|
475
|
+
label: 'field1',
|
|
476
|
+
value: '.field1'
|
|
477
|
+
},
|
|
478
|
+
{
|
|
479
|
+
label: 'field2',
|
|
480
|
+
value: '.field2'
|
|
481
|
+
},
|
|
482
|
+
{
|
|
483
|
+
label: 'field3',
|
|
484
|
+
value: '.field3'
|
|
485
|
+
}
|
|
486
|
+
];
|
|
487
|
+
export const suggestedFunctions = [
|
|
488
|
+
{
|
|
489
|
+
label: 'validateLoanValue',
|
|
490
|
+
value: '@validateLoanValue()'
|
|
491
|
+
},
|
|
492
|
+
{
|
|
493
|
+
label: 'max',
|
|
494
|
+
value: '@max()'
|
|
495
|
+
},
|
|
496
|
+
{
|
|
497
|
+
label: 'min3',
|
|
498
|
+
value: '@min()'
|
|
499
|
+
}
|
|
500
|
+
];
|
|
468
501
|
//# sourceMappingURL=ExpressionBuilder.mocks.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpressionBuilder.mocks.js","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.mocks.ts"],"names":[],"mappings":"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","sourcesContent":["// cSpell:words O1XPTI\n\nimport styled, { css } from 'styled-components';\n\nimport { createUID, MenuProps } from '@pega/cosmos-react-core';\n\nexport const errors =\n 'Error message 1. Some unrealistic error message. Server unreachable. Check your network connection and try again';\n\nexport const items = [\n {\n id: createUID(),\n primary: 'Validate loan value',\n type: 'Decision',\n expression: 'validateLoanValue()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Function to validate loan value'\n },\n {\n field: 'Scope',\n value: 'CCDBankLoan'\n },\n {\n field: 'Namespace',\n value: 'px'\n }\n ],\n output: [\n {\n field: 'isValid',\n value: 'Boolean'\n }\n ],\n input: [\n {\n id: 'accountNumber',\n field: 'Account number',\n type: 'text'\n },\n {\n id: 'term',\n field: 'Term in years',\n type: 'number'\n },\n {\n id: 'accountType',\n field: 'Account type',\n type: 'text'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Loan amount under 100k',\n type: 'When',\n expression: 'isLoanAmountUnder100k()',\n details: {\n primary: [\n {\n field: 'Scope',\n value: 'CCDBankLoan'\n },\n {\n field: 'Namespace',\n value: 'px'\n }\n ],\n output: [\n {\n field: 'isUnder100k',\n value: 'Boolean'\n }\n ],\n input: [\n {\n id: 'accountNumber',\n field: 'Account number',\n type: 'text'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Loan number',\n type: 'Field',\n expression: '.loanNumber',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Loan account number of current customer'\n },\n {\n field: 'Scope',\n value: 'CCDBankLoan'\n },\n {\n field: 'Namespace',\n value: 'px'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Customer name',\n type: 'Field',\n expression: '.customerName',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Fullname of current customer'\n },\n {\n field: 'Scope',\n value: 'CCDBankLoan'\n },\n {\n field: 'Namespace',\n value: 'px'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Max',\n type: 'Function',\n expression: 'max()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Returns max of two numbers'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'max',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n },\n {\n id: 'param2',\n field: 'Param 2',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Min',\n type: 'Function',\n expression: 'min()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return min of two numbers'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'min',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n },\n {\n id: 'param2',\n field: 'Param 2',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Sum',\n type: 'Function',\n expression: 'sum()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return sum of two numbers'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'sum',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n },\n {\n id: 'param2',\n field: 'Param 2',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Absolute',\n type: 'Function',\n expression: 'abs()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return absolute value of a number'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'abs',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Square root',\n type: 'Function',\n expression: 'sqrt()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return square root of a number'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'squareRoot',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Average',\n type: 'Function',\n expression: 'average()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return average value of two number'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'average',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n },\n {\n id: 'param2',\n field: 'Param 2',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Is the current browser Firefox',\n type: 'When',\n expression: 'isFirefox()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return true if the current browser is Firefox'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'isFirefox',\n value: 'Boolean'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Is the current browser Internet Explorer',\n type: 'When',\n expression: 'isIE()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return true if the current browser is IE'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'isIE',\n value: 'Boolean'\n }\n ]\n }\n }\n];\n\nexport const filterCategories: MenuProps['items'] = [\n {\n id: 'item_0',\n primary: 'All',\n selected: true\n },\n {\n id: 'item_1',\n primary: 'Automation',\n selected: false\n },\n {\n id: 'item_2',\n primary: 'Configuration',\n selected: false\n },\n {\n id: 'item_3',\n primary: 'Decision',\n selected: false\n },\n {\n id: 'item_4',\n primary: 'Data page',\n selected: false\n },\n {\n id: 'item_5',\n primary: 'Function',\n selected: false\n }\n];\n\nexport const StyledExpressionBuilderDemo = styled.div(() => {\n return css`\n max-width: 95%;\n height: 80vh;\n position: relative;\n `;\n});\n\nexport const primaryDetails = [\n {\n id: 'desc',\n name: 'Description',\n value: 'Send email to recipients'\n },\n {\n id: 'scope',\n name: 'Scope',\n value: 'Email'\n },\n {\n id: 'namespace',\n name: 'Namespace',\n value: 'px'\n }\n];\n"]}
|
|
1
|
+
{"version":3,"file":"ExpressionBuilder.mocks.js","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.mocks.ts"],"names":[],"mappings":"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","sourcesContent":["// cSpell:words O1XPTI\n\nimport styled, { css } from 'styled-components';\n\nimport { createUID, MenuProps } from '@pega/cosmos-react-core';\n\nexport const getFilterRegex = (inputValue: string) => {\n return new RegExp(`${inputValue.replace(/[.*+\\-?^${}()|[\\]\\\\]/g, '\\\\$&')}`, 'i');\n};\n\nexport const errors =\n 'Error message 1. Some unrealistic error message. Server unreachable. Check your network connection and try again';\n\nexport const items = [\n {\n id: createUID(),\n primary: 'Validate loan value',\n type: 'Decision',\n expression: '@validateLoanValue()',\n details: {\n primary: [\n {\n field: 'Description',\n value:\n 'Function to validate loan value through simple interest or compound interest based on user choice'\n },\n {\n field: 'Scope',\n value: 'CCDBankLoan'\n },\n {\n field: 'Namespace',\n value: 'px'\n }\n ],\n output: [\n {\n field: 'isValid',\n value: 'Boolean'\n }\n ],\n input: [\n {\n id: 'accountNumber',\n field: 'Account number',\n type: 'text'\n },\n {\n id: 'term',\n field: 'Term in years',\n type: 'number'\n },\n {\n id: 'accountType',\n field: 'Account type',\n type: 'text'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Loan amount under 100k',\n type: 'When',\n expression: '@isLoanAmountUnder100k()',\n details: {\n primary: [\n {\n field: 'Scope',\n value: 'CCDBankLoan'\n },\n {\n field: 'Namespace',\n value: 'px'\n }\n ],\n output: [\n {\n field: 'isUnder100k',\n value: 'Boolean'\n }\n ],\n input: [\n {\n id: 'accountNumber',\n field: 'Account number',\n type: 'text'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Loan number',\n type: 'Field',\n expression: '.loanNumber',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Loan account number of current customer'\n },\n {\n field: 'Scope',\n value: 'CCDBankLoan'\n },\n {\n field: 'Namespace',\n value: 'px'\n }\n ],\n output: []\n }\n },\n {\n id: createUID(),\n primary: 'Customer name',\n type: 'Field',\n expression: '.customerName',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Fullname of current customer'\n },\n {\n field: 'Scope',\n value: 'CCDBankLoan'\n },\n {\n field: 'Namespace',\n value: 'px'\n }\n ],\n output: []\n }\n },\n {\n id: createUID(),\n primary: 'Max',\n type: 'Function',\n expression: '@max()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Returns max of two numbers'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'max',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n },\n {\n id: 'param2',\n field: 'Param 2',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Min',\n type: 'Function',\n expression: '@min()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return min of two numbers'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'min',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n },\n {\n id: 'param2',\n field: 'Param 2',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Sum',\n type: 'Function',\n expression: '@sum()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return sum of two numbers'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'sum',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n },\n {\n id: 'param2',\n field: 'Param 2',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Absolute',\n type: 'Function',\n expression: '@abs()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return absolute value of a number'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'abs',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Square root',\n type: 'Function',\n expression: '@sqrt()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return square root of a number'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'squareRoot',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Average',\n type: 'Function',\n expression: '@average()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return average value of two number'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'average',\n value: 'Number'\n }\n ],\n input: [\n {\n id: 'param1',\n field: 'Param 1',\n type: 'number'\n },\n {\n id: 'param2',\n field: 'Param 2',\n type: 'number'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Is the current browser Firefox',\n type: 'When',\n expression: '@isFirefox()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return true if the current browser is Firefox'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'isFirefox',\n value: 'Boolean'\n }\n ]\n }\n },\n {\n id: createUID(),\n primary: 'Is the current browser Internet Explorer',\n type: 'When',\n expression: '@isIE()',\n details: {\n primary: [\n {\n field: 'Description',\n value: 'Return true if the current browser is IE'\n },\n {\n field: 'Scope',\n value: 'base'\n },\n {\n field: 'Namespace',\n value: 'py'\n }\n ],\n output: [\n {\n field: 'isIE',\n value: 'Boolean'\n }\n ]\n }\n }\n];\n\nexport const filterCategories: MenuProps['items'] = [\n {\n id: 'item_0',\n primary: 'All',\n selected: true\n },\n {\n id: 'item_1',\n primary: 'Automation',\n selected: false\n },\n {\n id: 'item_2',\n primary: 'Configuration',\n selected: false\n },\n {\n id: 'item_3',\n primary: 'Decision',\n selected: false\n },\n {\n id: 'item_4',\n primary: 'Data page',\n selected: false\n },\n {\n id: 'item_5',\n primary: 'Function',\n selected: false\n }\n];\n\nexport const StyledExpressionBuilderDemo = styled.div(() => {\n return css`\n max-width: 95%;\n height: 80vh;\n position: relative;\n `;\n});\n\nexport const primaryDetails = [\n {\n id: 'desc',\n name: 'Description',\n value: 'Send email to recipients'\n },\n {\n id: 'scope',\n name: 'Scope',\n value: 'Email'\n },\n {\n id: 'namespace',\n name: 'Namespace',\n value: 'px'\n }\n];\n\nexport const suggestedFields = [\n {\n label: 'field1',\n value: '.field1'\n },\n {\n label: 'field2',\n value: '.field2'\n },\n {\n label: 'field3',\n value: '.field3'\n }\n];\n\nexport const suggestedFunctions = [\n {\n label: 'validateLoanValue',\n value: '@validateLoanValue()'\n },\n {\n label: 'max',\n value: '@max()'\n },\n {\n label: 'min3',\n value: '@min()'\n }\n];\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpressionBuilder.stories.d.ts","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAI/C,OAAO,EAKL,sBAAsB,
|
|
1
|
+
{"version":3,"file":"ExpressionBuilder.stories.d.ts","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAI/C,OAAO,EAKL,sBAAsB,EAMvB,MAAM,0BAA0B,CAAC;;AAoBlC,wBAGU;AAEV,eAAO,MAAM,kBAAkB,EAAE,KA6DhC,CAAC;AAEF,eAAO,MAAM,qBAAqB,EAAE,KAoCnC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,KAwEhC,CAAC;AAEF,UAAU,2BAA2B;IACnC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,sBAAsB,CAAC,QAAQ,CAAC,CAAC;IAC1C,SAAS,CAAC,EAAE,sBAAsB,CAAC,MAAM,CAAC,CAAC,WAAW,CAAC,CAAC;IACxD,YAAY,CAAC,EAAE,sBAAsB,CAAC,MAAM,CAAC,CAAC,cAAc,CAAC,CAAC;IAC9D,cAAc,CAAC,EAAE,sBAAsB,CAAC,MAAM,CAAC,CAAC,gBAAgB,CAAC,CAAC;IAClE,cAAc,CAAC,EAAE,sBAAsB,CAAC,QAAQ,CAAC,CAAC,gBAAgB,CAAC,CAAC;IACpE,cAAc,CAAC,EAAE,sBAAsB,CAAC,QAAQ,CAAC,CAAC,gBAAgB,CAAC,CAAC;IACpE,MAAM,CAAC,EAAE,sBAAsB,CAAC,QAAQ,CAAC,CAAC;IAC1C,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,2BAA2B,CA4LpE,CAAC;AAUF,eAAO,MAAM,cAAc,EAAE,KA+B5B,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { action } from '@storybook/addon-actions';
|
|
2
|
-
import { useState, useEffect, useRef } from 'react';
|
|
3
|
-
import { ExpressionBuilder, ExpressionItem, ExpressionList, ExpressionDetails } from '@pega/cosmos-react-build';
|
|
4
|
-
import { createUID, Input } from '@pega/cosmos-react-core';
|
|
5
|
-
import { errors, items, primaryDetails, StyledExpressionBuilderDemo } from './ExpressionBuilder.mocks';
|
|
2
|
+
import { useState, useEffect, useRef, useMemo } from 'react';
|
|
3
|
+
import { ExpressionBuilder, ExpressionItem, ExpressionList, ExpressionDetails, CodeEditor } from '@pega/cosmos-react-build';
|
|
4
|
+
import { BuildTheme, Configuration, createUID, Input } from '@pega/cosmos-react-core';
|
|
5
|
+
import { errors, getFilterRegex, items, primaryDetails, StyledExpressionBuilderDemo, suggestedFields, suggestedFunctions } from './ExpressionBuilder.mocks';
|
|
6
6
|
export default {
|
|
7
7
|
title: 'Build/ExpressionBuilder',
|
|
8
8
|
component: ExpressionBuilder
|
|
@@ -142,13 +142,33 @@ export const ExpressionBuilderDemo = (args) => {
|
|
|
142
142
|
const handle = useRef(null);
|
|
143
143
|
const [expressionDetails, setExpressionDetails] = useState({});
|
|
144
144
|
const [expressionDetailsValues, setExpressionDetailsValues] = useState({});
|
|
145
|
+
const filterRegex = useMemo(() => getFilterRegex(searchValue), [searchValue]);
|
|
146
|
+
const detailsFilter = (location, filterValue) => location.find(field => field.value.toLowerCase().includes(filterValue));
|
|
145
147
|
useEffect(() => {
|
|
146
148
|
const lowerSearchFilter = searchFilter.toLowerCase();
|
|
147
149
|
const lowerSearchValue = searchValue.toLowerCase();
|
|
148
|
-
|
|
150
|
+
const filteredItems = items.filter(item => {
|
|
149
151
|
return (item.type.toLowerCase().includes(lowerSearchFilter === 'all' ? '' : lowerSearchFilter) &&
|
|
150
|
-
item.primary.toLowerCase().includes(lowerSearchValue)
|
|
151
|
-
|
|
152
|
+
(item.primary.toLowerCase().includes(lowerSearchValue) ||
|
|
153
|
+
detailsFilter(item.details.primary, lowerSearchValue) ||
|
|
154
|
+
detailsFilter(item.details.output, lowerSearchValue)));
|
|
155
|
+
});
|
|
156
|
+
const matchedItems = filteredItems.map(item => {
|
|
157
|
+
if (item.primary.toLowerCase().includes(lowerSearchValue))
|
|
158
|
+
return item;
|
|
159
|
+
let matchedField;
|
|
160
|
+
const primaryField = detailsFilter(item.details.primary, lowerSearchValue);
|
|
161
|
+
if (primaryField)
|
|
162
|
+
matchedField = primaryField;
|
|
163
|
+
const outputField = detailsFilter(item.details.output, lowerSearchValue);
|
|
164
|
+
if (outputField && !primaryField)
|
|
165
|
+
matchedField = outputField;
|
|
166
|
+
return {
|
|
167
|
+
...item,
|
|
168
|
+
matchedField: { name: matchedField?.field, value: matchedField?.value }
|
|
169
|
+
};
|
|
170
|
+
});
|
|
171
|
+
setExpressionItems(matchedItems);
|
|
152
172
|
}, [searchValue, searchFilter]);
|
|
153
173
|
const onItemAdd = (id, addExpression) => {
|
|
154
174
|
const item = items.find(instance => instance.id === id);
|
|
@@ -164,7 +184,6 @@ export const ExpressionBuilderDemo = (args) => {
|
|
|
164
184
|
.join(', ')
|
|
165
185
|
: ''})`);
|
|
166
186
|
}
|
|
167
|
-
action('Current expression')(handle.current?.getExpression());
|
|
168
187
|
};
|
|
169
188
|
const onInputParamChange = (id, field, value) => {
|
|
170
189
|
action('Input param change')(id, field, value);
|
|
@@ -227,6 +246,20 @@ export const ExpressionBuilderDemo = (args) => {
|
|
|
227
246
|
return newValues;
|
|
228
247
|
});
|
|
229
248
|
};
|
|
249
|
+
const fetchSuggestions = autoCompleteTrigger => {
|
|
250
|
+
if (autoCompleteTrigger === '@') {
|
|
251
|
+
return new Promise(resolve => {
|
|
252
|
+
setTimeout(() => {
|
|
253
|
+
resolve(suggestedFunctions);
|
|
254
|
+
}, 1000);
|
|
255
|
+
});
|
|
256
|
+
}
|
|
257
|
+
return new Promise(resolve => {
|
|
258
|
+
setTimeout(() => {
|
|
259
|
+
resolve(suggestedFields);
|
|
260
|
+
}, 1000);
|
|
261
|
+
});
|
|
262
|
+
};
|
|
230
263
|
return (<StyledExpressionBuilderDemo>
|
|
231
264
|
<ExpressionBuilder list={{
|
|
232
265
|
items: expressionItems,
|
|
@@ -235,15 +268,16 @@ export const ExpressionBuilderDemo = (args) => {
|
|
|
235
268
|
onItemCollapse: args.onItemCollapse || onItemCollapse,
|
|
236
269
|
details: expressionDetails
|
|
237
270
|
}} search={{
|
|
238
|
-
filters: ['Field', 'Function', 'Decision'],
|
|
271
|
+
filters: ['Field', 'Function', 'Decision', 'When'],
|
|
239
272
|
onFilterChange: args.onFilterChange
|
|
240
273
|
? args.onFilterChange
|
|
241
274
|
: value => setSearchFilter(value),
|
|
242
275
|
onSearchChange: args.onSearchChange
|
|
243
276
|
? args.onSearchChange
|
|
244
277
|
: value => setSearchValue(value),
|
|
245
|
-
value: searchValue
|
|
246
|
-
|
|
278
|
+
value: searchValue,
|
|
279
|
+
accent: filterRegex
|
|
280
|
+
}} errors={args.showErrors ? args.errors || errors : undefined} defaultValue={args.defaultValue === undefined ? '@testExp(arg1, arg2)' : args.defaultValue} handle={args.handle || handle} fetchSuggestions={fetchSuggestions}/>
|
|
247
281
|
</StyledExpressionBuilderDemo>);
|
|
248
282
|
};
|
|
249
283
|
ExpressionBuilderDemo.args = {
|
|
@@ -252,4 +286,26 @@ ExpressionBuilderDemo.args = {
|
|
|
252
286
|
ExpressionBuilderDemo.argTypes = {
|
|
253
287
|
showErrors: { control: { type: 'boolean' } }
|
|
254
288
|
};
|
|
289
|
+
export const CodeEditorDemo = () => {
|
|
290
|
+
const codeEditorHandle = useRef(null);
|
|
291
|
+
const fetchSuggestions = autoCompleteTrigger => {
|
|
292
|
+
if (autoCompleteTrigger === '@') {
|
|
293
|
+
return new Promise(resolve => {
|
|
294
|
+
setTimeout(() => {
|
|
295
|
+
resolve(suggestedFunctions);
|
|
296
|
+
}, 1000);
|
|
297
|
+
});
|
|
298
|
+
}
|
|
299
|
+
return new Promise(resolve => {
|
|
300
|
+
setTimeout(() => {
|
|
301
|
+
resolve(suggestedFields);
|
|
302
|
+
}, 1000);
|
|
303
|
+
});
|
|
304
|
+
};
|
|
305
|
+
return (<Configuration theme={BuildTheme}>
|
|
306
|
+
<CodeEditor fetchSuggestions={fetchSuggestions} autoCompleteTriggers={['.', '@']} editorConfigProps={{
|
|
307
|
+
mode: 'expression'
|
|
308
|
+
}} codeEditorHandle={codeEditorHandle} defaultValue='@testing()'/>
|
|
309
|
+
</Configuration>);
|
|
310
|
+
};
|
|
255
311
|
//# sourceMappingURL=ExpressionBuilder.stories.jsx.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExpressionBuilder.stories.jsx","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\nimport { useState, useEffect, useRef, ChangeEvent } from 'react';\n\nimport {\n ExpressionBuilder,\n ExpressionItem,\n ExpressionItemProps,\n ExpressionList,\n ExpressionBuilderProps,\n ExpressionDetails,\n HandleValue,\n InputParams\n} from '@pega/cosmos-react-build';\nimport { createUID, ForwardProps, Input, InputProps } from '@pega/cosmos-react-core';\n\nimport {\n errors,\n items,\n primaryDetails,\n StyledExpressionBuilderDemo\n} from './ExpressionBuilder.mocks';\n\nexport default {\n title: 'Build/ExpressionBuilder',\n component: ExpressionBuilder\n} as Meta;\n\nexport const ExpressionItemDemo: Story = () => {\n const [expanded, setExpanded] = useState<ExpressionItemProps['expanded']>(false);\n const onAdd = (id: ExpressionItemProps['id']) => {\n action(`${id} clicked`);\n };\n\n const onExpand = (id: ExpressionItemProps['id']) => {\n setExpanded(true);\n action(`${id} expanded`);\n };\n\n const onCollapse = (id: ExpressionItemProps['id']) => {\n setExpanded(false);\n action(`${id} collapsed`);\n };\n\n const handleChange = (id: string, field: string, value: any) => {\n action('Input param change')(id, field, value);\n };\n\n return (\n <ExpressionItem\n id={createUID()}\n primary='Loan to value validation'\n type='Decision'\n onAdd={onAdd}\n onExpand={onExpand}\n onCollapse={onCollapse}\n expanded={expanded}\n details={{\n primary: primaryDetails,\n outputParams: [\n {\n id: 'type',\n name: 'Type',\n value: 'Text'\n }\n ],\n inputParams: [\n {\n id: 'firstParam',\n renderer: Input,\n rendererProps: {\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n handleChange('Test Expression Id', 'Test Input Field', e.target.value),\n label: 'Test Input'\n }\n },\n {\n id: 'secondParam',\n renderer: Input,\n rendererProps: {\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n handleChange('Test Expression Id', 'Test Input Field 2', e.target.value),\n label: 'Test Input2'\n }\n }\n ]\n }}\n />\n );\n};\n\nexport const ExpressionDetailsDemo: Story = () => {\n const handleChange = (id: string, field: string, value: any) => {\n action('Input param change')(id, field, value);\n };\n return (\n <ExpressionDetails\n primary={primaryDetails}\n outputParams={[\n {\n id: 'type',\n name: 'Type',\n value: 'Text'\n }\n ]}\n inputParams={[\n {\n id: 'firstParam',\n renderer: Input,\n rendererProps: {\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n handleChange('Test Expression Id', 'Test Input Field', e.target.value),\n label: 'Test Input'\n }\n },\n {\n id: 'secondParam',\n renderer: Input,\n rendererProps: {\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n handleChange('Test Expression Id', 'Test Input Field 2', e.target.value),\n label: 'Test Input2'\n }\n }\n ]}\n />\n );\n};\n\nexport const ExpressionListDemo: Story = () => {\n const [expressionDetails, setExpressionDetails] = useState<\n ExpressionBuilderProps['list']['details']\n >({});\n const onInputParamChange = (id: string, field: string, value: any) => {\n action('Input param change')(id, field, value);\n };\n\n const onItemExpand = (id: string) => {\n action('onItemExpand')(id);\n const itemDetails = items.find(item => item.id === id)?.details;\n\n const fieldValueMapper = ({ field, value }: { field: string; value: string }) => {\n return {\n id: `${id}-${field}`,\n name: field,\n value\n };\n };\n\n if (itemDetails) {\n const primary = itemDetails.primary.map(fieldValueMapper);\n\n const outputParams = itemDetails.output?.map(fieldValueMapper);\n\n const inputParams = itemDetails.input?.map(({ id: fieldId, field, type }) => {\n const inputParam: InputParams<InputProps & ForwardProps> = {\n id: `${id}-${fieldId}`,\n renderer: Input,\n rendererProps: {\n label: field,\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n onInputParamChange(id, fieldId, e.target.value),\n type: type as InputProps['type']\n }\n };\n return inputParam;\n });\n\n setExpressionDetails(prev => {\n return {\n ...prev,\n [id]: {\n primary,\n outputParams,\n inputParams\n }\n };\n });\n }\n };\n\n const onItemCollapse = (id: string) => {\n action('onItemCollapse')(id);\n setTimeout(() => {\n setExpressionDetails(prev => {\n const newExpressionDetails = { ...prev };\n delete newExpressionDetails[id];\n return newExpressionDetails;\n });\n }, 500);\n };\n\n return (\n <ExpressionList\n items={items}\n onItemAdd={action('onItemAdd')}\n onItemExpand={onItemExpand}\n onItemCollapse={onItemCollapse}\n details={expressionDetails}\n />\n );\n};\n\ninterface ExpressionBuilderStoryProps {\n showErrors?: boolean;\n errors?: ExpressionBuilderProps['errors'];\n onItemAdd?: ExpressionBuilderProps['list']['onItemAdd'];\n onItemExpand?: ExpressionBuilderProps['list']['onItemExpand'];\n onItemCollapse?: ExpressionBuilderProps['list']['onItemCollapse'];\n onFilterChange?: ExpressionBuilderProps['search']['onFilterChange'];\n onSearchChange?: ExpressionBuilderProps['search']['onSearchChange'];\n handle?: ExpressionBuilderProps['handle'];\n defaultValue?: string;\n}\n\nexport const ExpressionBuilderDemo: Story<ExpressionBuilderStoryProps> = (\n args: ExpressionBuilderStoryProps\n) => {\n const [searchValue, setSearchValue] = useState('');\n const [searchFilter, setSearchFilter] = useState('');\n const [expressionItems, setExpressionItems] = useState(items);\n const handle = useRef<HandleValue>(null);\n const [expressionDetails, setExpressionDetails] = useState<\n ExpressionBuilderProps['list']['details']\n >({});\n const [expressionDetailsValues, setExpressionDetailsValues] = useState<{\n [id: string]: {\n [field: string]: any;\n };\n }>({});\n\n useEffect(() => {\n const lowerSearchFilter = searchFilter.toLowerCase();\n const lowerSearchValue = searchValue.toLowerCase();\n setExpressionItems(\n items.filter(item => {\n return (\n item.type.toLowerCase().includes(lowerSearchFilter === 'all' ? '' : lowerSearchFilter) &&\n item.primary.toLowerCase().includes(lowerSearchValue)\n );\n })\n );\n }, [searchValue, searchFilter]);\n\n const onItemAdd = (\n id: ExpressionItemProps['id'],\n addExpression: (expression: string) => void\n ) => {\n const item = items.find(instance => instance.id === id);\n if (!item) return;\n if (item.type.toLowerCase() === 'field') {\n addExpression(item.expression);\n } else {\n addExpression(\n `${item.expression.slice(0, item.expression.length - 1)}${\n expressionDetailsValues[item.id]\n ? Object.keys(expressionDetailsValues[item.id])\n .map(field => `${expressionDetailsValues[item.id][field]}`)\n .join(', ')\n : ''\n })`\n );\n }\n\n // Added this action to demonstrate the usage of getExpression\n action('Current expression')(handle.current?.getExpression());\n };\n\n const onInputParamChange = (id: string, field: string, value: any) => {\n action('Input param change')(id, field, value);\n setExpressionDetailsValues(prev => {\n return {\n ...prev,\n [id]: { ...prev[id], [field]: value }\n };\n });\n };\n\n const onItemExpand = (id: string) => {\n action('onItemExpand')(id);\n const itemDetails = expressionItems.find(item => item.id === id)?.details;\n\n const fieldValueMapper = ({ field, value }: { field: string; value: string }) => {\n return {\n id: `${id}-${field}`,\n name: field,\n value\n };\n };\n\n if (itemDetails) {\n const primary = itemDetails.primary.map(fieldValueMapper);\n\n const outputParams = itemDetails.output?.map(fieldValueMapper);\n\n const inputParams = itemDetails.input?.map(({ id: fieldId, field, type }) => {\n const inputParam: InputParams<InputProps & ForwardProps> = {\n id: `${id}-${fieldId}`,\n renderer: Input,\n rendererProps: {\n label: field,\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n onInputParamChange(id, fieldId, e.target.value),\n type: type as InputProps['type']\n }\n };\n return inputParam;\n });\n\n setExpressionDetails(prev => {\n return {\n ...prev,\n [id]: {\n primary,\n outputParams,\n inputParams\n }\n };\n });\n }\n };\n\n const onItemCollapse = (id: string) => {\n action('onItemCollapse')(id);\n setTimeout(() => {\n setExpressionDetails(prev => {\n const newExpressionDetails = { ...prev };\n delete newExpressionDetails[id];\n return newExpressionDetails;\n });\n }, 500);\n\n setExpressionDetailsValues(prev => {\n const newValues = { ...prev };\n delete newValues[id];\n return newValues;\n });\n };\n\n return (\n <StyledExpressionBuilderDemo>\n <ExpressionBuilder\n list={{\n items: expressionItems,\n onItemAdd: args.onItemAdd || onItemAdd,\n onItemExpand: args.onItemExpand || onItemExpand,\n onItemCollapse: args.onItemCollapse || onItemCollapse,\n details: expressionDetails\n }}\n search={{\n filters: ['Field', 'Function', 'Decision'],\n onFilterChange: args.onFilterChange\n ? args.onFilterChange\n : value => setSearchFilter(value),\n onSearchChange: args.onSearchChange\n ? args.onSearchChange\n : value => setSearchValue(value),\n value: searchValue\n }}\n errors={args.showErrors ? args.errors || errors : undefined}\n defaultValue={args.defaultValue === undefined ? 'testExp(arg1, arg2)' : args.defaultValue}\n handle={args.handle || handle}\n />\n </StyledExpressionBuilderDemo>\n );\n};\n\nExpressionBuilderDemo.args = {\n showErrors: false\n};\n\nExpressionBuilderDemo.argTypes = {\n showErrors: { control: { type: 'boolean' } }\n};\n"]}
|
|
1
|
+
{"version":3,"file":"ExpressionBuilder.stories.jsx","sourceRoot":"","sources":["../../../src/build/ExpressionBuilder/ExpressionBuilder.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { action } from '@storybook/addon-actions';\nimport { useState, useEffect, useRef, ChangeEvent, useMemo } from 'react';\n\nimport {\n ExpressionBuilder,\n ExpressionItem,\n ExpressionItemProps,\n ExpressionList,\n ExpressionBuilderProps,\n ExpressionDetails,\n HandleValue,\n InputParams,\n CodeEditor,\n EditorState\n} from '@pega/cosmos-react-build';\nimport {\n BuildTheme,\n Configuration,\n createUID,\n ForwardProps,\n Input,\n InputProps\n} from '@pega/cosmos-react-core';\n\nimport {\n errors,\n getFilterRegex,\n items,\n primaryDetails,\n StyledExpressionBuilderDemo,\n suggestedFields,\n suggestedFunctions\n} from './ExpressionBuilder.mocks';\n\nexport default {\n title: 'Build/ExpressionBuilder',\n component: ExpressionBuilder\n} as Meta;\n\nexport const ExpressionItemDemo: Story = () => {\n const [expanded, setExpanded] = useState<ExpressionItemProps['expanded']>(false);\n const onAdd = (id: ExpressionItemProps['id']) => {\n action(`${id} clicked`);\n };\n\n const onExpand = (id: ExpressionItemProps['id']) => {\n setExpanded(true);\n action(`${id} expanded`);\n };\n\n const onCollapse = (id: ExpressionItemProps['id']) => {\n setExpanded(false);\n action(`${id} collapsed`);\n };\n\n const handleChange = (id: string, field: string, value: any) => {\n action('Input param change')(id, field, value);\n };\n\n return (\n <ExpressionItem\n id={createUID()}\n primary='Loan to value validation'\n type='Decision'\n onAdd={onAdd}\n onExpand={onExpand}\n onCollapse={onCollapse}\n expanded={expanded}\n details={{\n primary: primaryDetails,\n outputParams: [\n {\n id: 'type',\n name: 'Type',\n value: 'Text'\n }\n ],\n inputParams: [\n {\n id: 'firstParam',\n renderer: Input,\n rendererProps: {\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n handleChange('Test Expression Id', 'Test Input Field', e.target.value),\n label: 'Test Input'\n }\n },\n {\n id: 'secondParam',\n renderer: Input,\n rendererProps: {\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n handleChange('Test Expression Id', 'Test Input Field 2', e.target.value),\n label: 'Test Input2'\n }\n }\n ]\n }}\n />\n );\n};\n\nexport const ExpressionDetailsDemo: Story = () => {\n const handleChange = (id: string, field: string, value: any) => {\n action('Input param change')(id, field, value);\n };\n return (\n <ExpressionDetails\n primary={primaryDetails}\n outputParams={[\n {\n id: 'type',\n name: 'Type',\n value: 'Text'\n }\n ]}\n inputParams={[\n {\n id: 'firstParam',\n renderer: Input,\n rendererProps: {\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n handleChange('Test Expression Id', 'Test Input Field', e.target.value),\n label: 'Test Input'\n }\n },\n {\n id: 'secondParam',\n renderer: Input,\n rendererProps: {\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n handleChange('Test Expression Id', 'Test Input Field 2', e.target.value),\n label: 'Test Input2'\n }\n }\n ]}\n />\n );\n};\n\nexport const ExpressionListDemo: Story = () => {\n const [expressionDetails, setExpressionDetails] = useState<\n ExpressionBuilderProps['list']['details']\n >({});\n const onInputParamChange = (id: string, field: string, value: any) => {\n action('Input param change')(id, field, value);\n };\n\n const onItemExpand = (id: string) => {\n action('onItemExpand')(id);\n const itemDetails = items.find(item => item.id === id)?.details;\n\n const fieldValueMapper = ({ field, value }: { field: string; value: string }) => {\n return {\n id: `${id}-${field}`,\n name: field,\n value\n };\n };\n\n if (itemDetails) {\n const primary = itemDetails.primary.map(fieldValueMapper);\n\n const outputParams = itemDetails.output?.map(fieldValueMapper);\n\n const inputParams = itemDetails.input?.map(({ id: fieldId, field, type }) => {\n const inputParam: InputParams<InputProps & ForwardProps> = {\n id: `${id}-${fieldId}`,\n renderer: Input,\n rendererProps: {\n label: field,\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n onInputParamChange(id, fieldId, e.target.value),\n type: type as InputProps['type']\n }\n };\n return inputParam;\n });\n\n setExpressionDetails(prev => {\n return {\n ...prev,\n [id]: {\n primary,\n outputParams,\n inputParams\n }\n };\n });\n }\n };\n\n const onItemCollapse = (id: string) => {\n action('onItemCollapse')(id);\n setTimeout(() => {\n setExpressionDetails(prev => {\n const newExpressionDetails = { ...prev };\n delete newExpressionDetails[id];\n return newExpressionDetails;\n });\n }, 500);\n };\n\n return (\n <ExpressionList\n items={items}\n onItemAdd={action('onItemAdd')}\n onItemExpand={onItemExpand}\n onItemCollapse={onItemCollapse}\n details={expressionDetails}\n />\n );\n};\n\ninterface ExpressionBuilderStoryProps {\n showErrors?: boolean;\n errors?: ExpressionBuilderProps['errors'];\n onItemAdd?: ExpressionBuilderProps['list']['onItemAdd'];\n onItemExpand?: ExpressionBuilderProps['list']['onItemExpand'];\n onItemCollapse?: ExpressionBuilderProps['list']['onItemCollapse'];\n onFilterChange?: ExpressionBuilderProps['search']['onFilterChange'];\n onSearchChange?: ExpressionBuilderProps['search']['onSearchChange'];\n handle?: ExpressionBuilderProps['handle'];\n defaultValue?: string;\n}\n\nexport const ExpressionBuilderDemo: Story<ExpressionBuilderStoryProps> = (\n args: ExpressionBuilderStoryProps\n) => {\n const [searchValue, setSearchValue] = useState('');\n const [searchFilter, setSearchFilter] = useState('');\n const [expressionItems, setExpressionItems] = useState(items);\n const handle = useRef<HandleValue>(null);\n const [expressionDetails, setExpressionDetails] = useState<\n ExpressionBuilderProps['list']['details']\n >({});\n const [expressionDetailsValues, setExpressionDetailsValues] = useState<{\n [id: string]: {\n [field: string]: any;\n };\n }>({});\n\n const filterRegex = useMemo(() => getFilterRegex(searchValue), [searchValue]);\n\n const detailsFilter = (location: { field: string; value: string }[], filterValue: string) =>\n location.find(field => field.value.toLowerCase().includes(filterValue));\n\n useEffect(() => {\n const lowerSearchFilter = searchFilter.toLowerCase();\n const lowerSearchValue = searchValue.toLowerCase();\n const filteredItems = items.filter(item => {\n return (\n item.type.toLowerCase().includes(lowerSearchFilter === 'all' ? '' : lowerSearchFilter) &&\n (item.primary.toLowerCase().includes(lowerSearchValue) ||\n detailsFilter(item.details.primary, lowerSearchValue) ||\n detailsFilter(item.details.output, lowerSearchValue))\n );\n });\n\n const matchedItems = filteredItems.map(item => {\n if (item.primary.toLowerCase().includes(lowerSearchValue)) return item;\n\n let matchedField;\n\n const primaryField = detailsFilter(item.details.primary, lowerSearchValue);\n if (primaryField) matchedField = primaryField;\n\n const outputField = detailsFilter(item.details.output, lowerSearchValue);\n if (outputField && !primaryField) matchedField = outputField;\n\n return {\n ...item,\n matchedField: { name: matchedField?.field, value: matchedField?.value }\n };\n });\n\n setExpressionItems(matchedItems);\n }, [searchValue, searchFilter]);\n\n const onItemAdd = (\n id: ExpressionItemProps['id'],\n addExpression: (expression: string) => void\n ) => {\n const item = items.find(instance => instance.id === id);\n if (!item) return;\n if (item.type.toLowerCase() === 'field') {\n addExpression(item.expression);\n } else {\n addExpression(\n `${item.expression.slice(0, item.expression.length - 1)}${\n expressionDetailsValues[item.id]\n ? Object.keys(expressionDetailsValues[item.id])\n .map(field => `${expressionDetailsValues[item.id][field]}`)\n .join(', ')\n : ''\n })`\n );\n }\n };\n\n const onInputParamChange = (id: string, field: string, value: any) => {\n action('Input param change')(id, field, value);\n setExpressionDetailsValues(prev => {\n return {\n ...prev,\n [id]: { ...prev[id], [field]: value }\n };\n });\n };\n\n const onItemExpand = (id: string) => {\n action('onItemExpand')(id);\n const itemDetails = expressionItems.find(item => item.id === id)?.details;\n\n const fieldValueMapper = ({ field, value }: { field: string; value: string }) => {\n return {\n id: `${id}-${field}`,\n name: field,\n value\n };\n };\n\n if (itemDetails) {\n const primary = itemDetails.primary.map(fieldValueMapper);\n\n const outputParams = itemDetails.output?.map(fieldValueMapper);\n\n const inputParams = itemDetails.input?.map(({ id: fieldId, field, type }) => {\n const inputParam: InputParams<InputProps & ForwardProps> = {\n id: `${id}-${fieldId}`,\n renderer: Input,\n rendererProps: {\n label: field,\n onChange: (e: ChangeEvent<HTMLInputElement>) =>\n onInputParamChange(id, fieldId, e.target.value),\n type: type as InputProps['type']\n }\n };\n return inputParam;\n });\n\n setExpressionDetails(prev => {\n return {\n ...prev,\n [id]: {\n primary,\n outputParams,\n inputParams\n }\n };\n });\n }\n };\n\n const onItemCollapse = (id: string) => {\n action('onItemCollapse')(id);\n setTimeout(() => {\n setExpressionDetails(prev => {\n const newExpressionDetails = { ...prev };\n delete newExpressionDetails[id];\n return newExpressionDetails;\n });\n }, 500);\n\n setExpressionDetailsValues(prev => {\n const newValues = { ...prev };\n delete newValues[id];\n return newValues;\n });\n };\n\n const fetchSuggestions: ExpressionBuilderProps['fetchSuggestions'] = autoCompleteTrigger => {\n if (autoCompleteTrigger === '@') {\n return new Promise(resolve => {\n setTimeout(() => {\n resolve(suggestedFunctions);\n }, 1000);\n });\n }\n return new Promise(resolve => {\n setTimeout(() => {\n resolve(suggestedFields);\n }, 1000);\n });\n };\n\n return (\n <StyledExpressionBuilderDemo>\n <ExpressionBuilder\n list={{\n items: expressionItems,\n onItemAdd: args.onItemAdd || onItemAdd,\n onItemExpand: args.onItemExpand || onItemExpand,\n onItemCollapse: args.onItemCollapse || onItemCollapse,\n details: expressionDetails\n }}\n search={{\n filters: ['Field', 'Function', 'Decision', 'When'],\n onFilterChange: args.onFilterChange\n ? args.onFilterChange\n : value => setSearchFilter(value),\n onSearchChange: args.onSearchChange\n ? args.onSearchChange\n : value => setSearchValue(value),\n value: searchValue,\n accent: filterRegex\n }}\n errors={args.showErrors ? args.errors || errors : undefined}\n defaultValue={args.defaultValue === undefined ? '@testExp(arg1, arg2)' : args.defaultValue}\n handle={args.handle || handle}\n fetchSuggestions={fetchSuggestions}\n />\n </StyledExpressionBuilderDemo>\n );\n};\n\nExpressionBuilderDemo.args = {\n showErrors: false\n};\n\nExpressionBuilderDemo.argTypes = {\n showErrors: { control: { type: 'boolean' } }\n};\n\nexport const CodeEditorDemo: Story = () => {\n const codeEditorHandle = useRef<EditorState | null>(null);\n\n const fetchSuggestions: ExpressionBuilderProps['fetchSuggestions'] = autoCompleteTrigger => {\n if (autoCompleteTrigger === '@') {\n return new Promise(resolve => {\n setTimeout(() => {\n resolve(suggestedFunctions);\n }, 1000);\n });\n }\n return new Promise(resolve => {\n setTimeout(() => {\n resolve(suggestedFields);\n }, 1000);\n });\n };\n\n return (\n <Configuration theme={BuildTheme}>\n <CodeEditor\n fetchSuggestions={fetchSuggestions}\n autoCompleteTriggers={['.', '@']}\n editorConfigProps={{\n mode: 'expression'\n }}\n codeEditorHandle={codeEditorHandle}\n defaultValue='@testing()'\n />\n </Configuration>\n );\n};\n"]}
|
|
@@ -9,6 +9,10 @@ export declare const transferReasons: {
|
|
|
9
9
|
id: string;
|
|
10
10
|
label: string;
|
|
11
11
|
}[];
|
|
12
|
+
export declare const interactionOptions: {
|
|
13
|
+
id: string;
|
|
14
|
+
label: string;
|
|
15
|
+
}[];
|
|
12
16
|
export declare const userStatusOptions: UserAvailabilityStatusOption[];
|
|
13
17
|
declare type StyleVariableName = '--app-bg-color' | '--header-border-color' | '--text-color' | '--msg-border-radius' | '--msg-you-bg-color' | '--msg-you-text-color' | '--msg-me-bg-color' | '--msg-me-text-color' | '--input-height' | '--input-background-color' | '--input-border-color' | '--input-border-width' | '--input-border-radius' | '--input-focus-border-color' | '--input-focus-box-shadow' | '--input-text-color' | '--button-text-color' | '--button-height' | '--button-bg-color' | '--button-border-color' | '--button-border-radius' | '--button-hover-bg-color' | '--footer-bg-color';
|
|
14
18
|
export declare type ExternalStyles = Partial<Record<StyleVariableName, string>>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CallControlPanel.mocks.d.ts","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.mocks.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,uBAAuB,CAAC;AAE1E,eAAO,MAAM,YAAY;;;;;GAmExB,CAAC;AAEF,eAAO,MAAM,eAAe;;;GAa3B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,4BAA4B,EA4B3D,CAAC;AAEF,aAAK,iBAAiB,GAClB,gBAAgB,GAChB,uBAAuB,GACvB,cAAc,GACd,qBAAqB,GACrB,oBAAoB,GACpB,sBAAsB,GACtB,mBAAmB,GACnB,qBAAqB,GACrB,gBAAgB,GAChB,0BAA0B,GAC1B,sBAAsB,GACtB,sBAAsB,GACtB,uBAAuB,GACvB,4BAA4B,GAC5B,0BAA0B,GAC1B,oBAAoB,GACpB,qBAAqB,GACrB,iBAAiB,GACjB,mBAAmB,GACnB,uBAAuB,GACvB,wBAAwB,GACxB,yBAAyB,GACzB,mBAAmB,CAAC;AAExB,oBAAY,cAAc,GAAG,OAAO,CAAC,MAAM,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC,CAAC;AAExE,eAAO,MAAM,2BAA2B,YAAY,cAAc,GAAG,SAAS,WA6H7E,CAAC"}
|
|
1
|
+
{"version":3,"file":"CallControlPanel.mocks.d.ts","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.mocks.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,uBAAuB,CAAC;AAE1E,eAAO,MAAM,YAAY;;;;;GAmExB,CAAC;AAEF,eAAO,MAAM,eAAe;;;GAa3B,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;GAa9B,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,4BAA4B,EA4B3D,CAAC;AAEF,aAAK,iBAAiB,GAClB,gBAAgB,GAChB,uBAAuB,GACvB,cAAc,GACd,qBAAqB,GACrB,oBAAoB,GACpB,sBAAsB,GACtB,mBAAmB,GACnB,qBAAqB,GACrB,gBAAgB,GAChB,0BAA0B,GAC1B,sBAAsB,GACtB,sBAAsB,GACtB,uBAAuB,GACvB,4BAA4B,GAC5B,0BAA0B,GAC1B,oBAAoB,GACpB,qBAAqB,GACrB,iBAAiB,GACjB,mBAAmB,GACnB,uBAAuB,GACvB,wBAAwB,GACxB,yBAAyB,GACzB,mBAAmB,CAAC;AAExB,oBAAY,cAAc,GAAG,OAAO,CAAC,MAAM,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC,CAAC;AAExE,eAAO,MAAM,2BAA2B,YAAY,cAAc,GAAG,SAAS,WA6H7E,CAAC"}
|
|
@@ -80,6 +80,20 @@ export const transferReasons = [
|
|
|
80
80
|
label: 'On break'
|
|
81
81
|
}
|
|
82
82
|
];
|
|
83
|
+
export const interactionOptions = [
|
|
84
|
+
{
|
|
85
|
+
id: '4545455',
|
|
86
|
+
label: 'Gregory Rhodes'
|
|
87
|
+
},
|
|
88
|
+
{
|
|
89
|
+
id: '123243434',
|
|
90
|
+
label: 'Ella Bridges'
|
|
91
|
+
},
|
|
92
|
+
{
|
|
93
|
+
id: '4545455',
|
|
94
|
+
label: 'Carrie Hanson'
|
|
95
|
+
}
|
|
96
|
+
];
|
|
83
97
|
export const userStatusOptions = [
|
|
84
98
|
{
|
|
85
99
|
id: 'available',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CallControlPanel.mocks.js","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.mocks.ts"],"names":[],"mappings":"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","sourcesContent":["import type { UserAvailabilityStatusOption } from '@pega/cosmos-react-cs';\n\nexport const contactsList = [\n {\n phoneNumber: '343445656',\n primary: 'Gregory Rhodes',\n secondary: 'Supervisor',\n favorite: true\n },\n {\n phoneNumber: '123243434',\n primary: 'Ella Bridges',\n secondary: 'Representative',\n favorite: true\n },\n {\n phoneNumber: '4545455',\n primary: 'Carrie Hanson',\n secondary: 'Representative',\n favorite: false\n },\n {\n phoneNumber: '48436346',\n primary: 'Chris Wallas',\n secondary: 'Supervisor',\n favorite: false\n },\n {\n phoneNumber: '34455656',\n primary: 'Craig Marsh',\n secondary: 'Supervisor',\n favorite: false\n },\n {\n phoneNumber: '45565678',\n primary: 'Derrick Sutton',\n secondary: 'Representative',\n favorite: false\n },\n {\n phoneNumber: '54367578',\n primary: 'Lizzie Johnson',\n secondary: 'Supervisor',\n favorite: false\n },\n {\n phoneNumber: '65345789',\n primary: 'Ivan Fuller',\n secondary: 'Representative',\n favorite: false\n },\n {\n phoneNumber: '764455478',\n primary: 'Sam Smith',\n secondary: 'Supervisor',\n favorite: false\n },\n {\n phoneNumber: '876464003',\n primary: 'Joe Doe',\n secondary: 'Representative',\n favorite: false\n },\n {\n phoneNumber: '426464003',\n primary: 'Jane Doe',\n secondary: 'Representative',\n favorite: false\n }\n];\n\nexport const transferReasons = [\n {\n id: 'offline',\n label: 'Offline'\n },\n {\n id: 'busy',\n label: 'Busy'\n },\n {\n id: 'on_break',\n label: 'On break'\n }\n];\n\nexport const userStatusOptions: UserAvailabilityStatusOption[] = [\n {\n id: 'available',\n label: 'Available',\n status: 'available'\n },\n {\n id: 'not_available',\n label: 'Not available',\n status: 'busy',\n disabled: true\n },\n {\n id: 'after_call_work',\n label: 'After call work',\n status: 'after_work'\n },\n {\n id: 'reconnecting',\n label: 'Reconnecting',\n status: 'unavailable',\n disabled: true\n },\n {\n id: 'offline',\n label: 'Offline',\n status: 'logout'\n }\n];\n\ntype StyleVariableName =\n | '--app-bg-color'\n | '--header-border-color'\n | '--text-color'\n | '--msg-border-radius'\n | '--msg-you-bg-color'\n | '--msg-you-text-color'\n | '--msg-me-bg-color'\n | '--msg-me-text-color'\n | '--input-height'\n | '--input-background-color'\n | '--input-border-color'\n | '--input-border-width'\n | '--input-border-radius'\n | '--input-focus-border-color'\n | '--input-focus-box-shadow'\n | '--input-text-color'\n | '--button-text-color'\n | '--button-height'\n | '--button-bg-color'\n | '--button-border-color'\n | '--button-border-radius'\n | '--button-hover-bg-color'\n | '--footer-bg-color';\n\nexport type ExternalStyles = Partial<Record<StyleVariableName, string>>;\n\nexport const createExternalIframeContent = (styles: ExternalStyles | undefined = {}) => `\n<!DOCTYPE html>\n<html>\n <head>\n <style>\n :root {\n ${Object.entries(styles)\n .map(([key, value]) => `${key}: ${value};`)\n .join('\\n')}\n }\n </style>\n <style>\n html {\n height: 100vh;\n background-color: var(--app-bg-color, #F5F0EF);\n color: var(--text-color, black);\n }\n body {\n max-width: 100vw;\n height: 100%;\n display: flex;\n flex-direction: column;\n margin: 0;\n }\n header {\n height: 3rem;\n font-size: 10px;\n border-bottom: 2px solid var(--header-border-color, black);\n padding: 0 8px;\n }\n main {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n max-height: calc(100% - 3rem);\n }\n ul {\n flex-grow: 1;\n overflow: auto;\n display: flex;\n flex-direction: column;\n list-style: none;\n padding-inline: 10px;\n gap: 6px;\n margin-block-end: 0;\n }\n li {\n padding: 8px;\n }\n li.you {\n align-self: start;\n background-color: var(--msg-you-bg-color, lightblue);\n color: var(--msg-you-text-color, black);\n border-radius: 0 var(--msg-border-radius, 4px) var(--msg-border-radius, 4px);\n }\n li.you:before {\n content: \"\\\\00B7\";\n margin-inline-end: 4px;\n }\n li.me {\n align-self: end;\n background-color: var(--msg-me-bg-color, pink);\n color: var(--msg-me-text-color, black);\n border-radius: var(--msg-border-radius, 4px) 0 var(--msg-border-radius, 4px) var(--msg-border-radius, 4px);\n }\n li.me:after {\n content: \"\\\\00B7\";\n margin-inline-start: 4px;\n }\n div {\n display: flex;\n justify-content: stretch;\n align-items: center;\n gap: 8px;\n padding: 8px;\n background-color: var(--footer-bg-color, transparent);\n }\n input {\n outline: none;\n color: var(--input-text-color, black);\n height: var(--input-height, 2rem);\n background-color: var(--input-background-color, white);\n border-color: var(--input-border-color, black);\n border-width: var(--input-border-width, 1px);\n border-radius: var(--input-border-radius, 4px);\n flex-grow: 1;\n }\n input:focus {\n border-color: var(--input-focus-border-color, lightblue);\n box-shadow: var(--input-focus-box-shadow, none);\n }\n button {\n padding: 0 8px;\n color: var(--button-text-color, black);\n height: var(--button-height, 2rem);\n background-color: var(--button-bg-color, white);\n border: 1px solid var(--button-border-color, blue);\n border-radius: var(--button-border-radius, 4px);\n }\n button:hover {\n background-color: var(--button-hover-bg-color, gray);\n }\n </style>\n </head>\n <body>\n <header><h1>Customer: Julian Brewster</h1></header>\n <main>\n <ul>\n <li class=\"you\">Hey!</li>\n <li class=\"you\">I want to check my account balance.</li>\n <li class=\"me\">Hello Mr Brewster.</li>\n <li class=\"me\">You have two accounts open. Which one do you want to check?</li>\n <li class=\"you\">The default one.</li>\n <li class=\"me\">Your account balance is $12345.45.</li>\n <li class=\"me\">Is there anything I can help you, Mr Brewster?</li>\n <li class=\"you\">I want to close the other account.</li>\n <li class=\"me\">Alright. What account the money should be transferred to?</li>\n </ul>\n <div>\n <input name=\"message\" autocomplete=\"off\" />\n <button>Send</button>\n </div>\n </main>\n </body>\n</html>\n`;\n"]}
|
|
1
|
+
{"version":3,"file":"CallControlPanel.mocks.js","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.mocks.ts"],"names":[],"mappings":"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","sourcesContent":["import type { UserAvailabilityStatusOption } from '@pega/cosmos-react-cs';\n\nexport const contactsList = [\n {\n phoneNumber: '343445656',\n primary: 'Gregory Rhodes',\n secondary: 'Supervisor',\n favorite: true\n },\n {\n phoneNumber: '123243434',\n primary: 'Ella Bridges',\n secondary: 'Representative',\n favorite: true\n },\n {\n phoneNumber: '4545455',\n primary: 'Carrie Hanson',\n secondary: 'Representative',\n favorite: false\n },\n {\n phoneNumber: '48436346',\n primary: 'Chris Wallas',\n secondary: 'Supervisor',\n favorite: false\n },\n {\n phoneNumber: '34455656',\n primary: 'Craig Marsh',\n secondary: 'Supervisor',\n favorite: false\n },\n {\n phoneNumber: '45565678',\n primary: 'Derrick Sutton',\n secondary: 'Representative',\n favorite: false\n },\n {\n phoneNumber: '54367578',\n primary: 'Lizzie Johnson',\n secondary: 'Supervisor',\n favorite: false\n },\n {\n phoneNumber: '65345789',\n primary: 'Ivan Fuller',\n secondary: 'Representative',\n favorite: false\n },\n {\n phoneNumber: '764455478',\n primary: 'Sam Smith',\n secondary: 'Supervisor',\n favorite: false\n },\n {\n phoneNumber: '876464003',\n primary: 'Joe Doe',\n secondary: 'Representative',\n favorite: false\n },\n {\n phoneNumber: '426464003',\n primary: 'Jane Doe',\n secondary: 'Representative',\n favorite: false\n }\n];\n\nexport const transferReasons = [\n {\n id: 'offline',\n label: 'Offline'\n },\n {\n id: 'busy',\n label: 'Busy'\n },\n {\n id: 'on_break',\n label: 'On break'\n }\n];\n\nexport const interactionOptions = [\n {\n id: '4545455',\n label: 'Gregory Rhodes'\n },\n {\n id: '123243434',\n label: 'Ella Bridges'\n },\n {\n id: '4545455',\n label: 'Carrie Hanson'\n }\n];\n\nexport const userStatusOptions: UserAvailabilityStatusOption[] = [\n {\n id: 'available',\n label: 'Available',\n status: 'available'\n },\n {\n id: 'not_available',\n label: 'Not available',\n status: 'busy',\n disabled: true\n },\n {\n id: 'after_call_work',\n label: 'After call work',\n status: 'after_work'\n },\n {\n id: 'reconnecting',\n label: 'Reconnecting',\n status: 'unavailable',\n disabled: true\n },\n {\n id: 'offline',\n label: 'Offline',\n status: 'logout'\n }\n];\n\ntype StyleVariableName =\n | '--app-bg-color'\n | '--header-border-color'\n | '--text-color'\n | '--msg-border-radius'\n | '--msg-you-bg-color'\n | '--msg-you-text-color'\n | '--msg-me-bg-color'\n | '--msg-me-text-color'\n | '--input-height'\n | '--input-background-color'\n | '--input-border-color'\n | '--input-border-width'\n | '--input-border-radius'\n | '--input-focus-border-color'\n | '--input-focus-box-shadow'\n | '--input-text-color'\n | '--button-text-color'\n | '--button-height'\n | '--button-bg-color'\n | '--button-border-color'\n | '--button-border-radius'\n | '--button-hover-bg-color'\n | '--footer-bg-color';\n\nexport type ExternalStyles = Partial<Record<StyleVariableName, string>>;\n\nexport const createExternalIframeContent = (styles: ExternalStyles | undefined = {}) => `\n<!DOCTYPE html>\n<html>\n <head>\n <style>\n :root {\n ${Object.entries(styles)\n .map(([key, value]) => `${key}: ${value};`)\n .join('\\n')}\n }\n </style>\n <style>\n html {\n height: 100vh;\n background-color: var(--app-bg-color, #F5F0EF);\n color: var(--text-color, black);\n }\n body {\n max-width: 100vw;\n height: 100%;\n display: flex;\n flex-direction: column;\n margin: 0;\n }\n header {\n height: 3rem;\n font-size: 10px;\n border-bottom: 2px solid var(--header-border-color, black);\n padding: 0 8px;\n }\n main {\n display: flex;\n flex-direction: column;\n flex-grow: 1;\n max-height: calc(100% - 3rem);\n }\n ul {\n flex-grow: 1;\n overflow: auto;\n display: flex;\n flex-direction: column;\n list-style: none;\n padding-inline: 10px;\n gap: 6px;\n margin-block-end: 0;\n }\n li {\n padding: 8px;\n }\n li.you {\n align-self: start;\n background-color: var(--msg-you-bg-color, lightblue);\n color: var(--msg-you-text-color, black);\n border-radius: 0 var(--msg-border-radius, 4px) var(--msg-border-radius, 4px);\n }\n li.you:before {\n content: \"\\\\00B7\";\n margin-inline-end: 4px;\n }\n li.me {\n align-self: end;\n background-color: var(--msg-me-bg-color, pink);\n color: var(--msg-me-text-color, black);\n border-radius: var(--msg-border-radius, 4px) 0 var(--msg-border-radius, 4px) var(--msg-border-radius, 4px);\n }\n li.me:after {\n content: \"\\\\00B7\";\n margin-inline-start: 4px;\n }\n div {\n display: flex;\n justify-content: stretch;\n align-items: center;\n gap: 8px;\n padding: 8px;\n background-color: var(--footer-bg-color, transparent);\n }\n input {\n outline: none;\n color: var(--input-text-color, black);\n height: var(--input-height, 2rem);\n background-color: var(--input-background-color, white);\n border-color: var(--input-border-color, black);\n border-width: var(--input-border-width, 1px);\n border-radius: var(--input-border-radius, 4px);\n flex-grow: 1;\n }\n input:focus {\n border-color: var(--input-focus-border-color, lightblue);\n box-shadow: var(--input-focus-box-shadow, none);\n }\n button {\n padding: 0 8px;\n color: var(--button-text-color, black);\n height: var(--button-height, 2rem);\n background-color: var(--button-bg-color, white);\n border: 1px solid var(--button-border-color, blue);\n border-radius: var(--button-border-radius, 4px);\n }\n button:hover {\n background-color: var(--button-hover-bg-color, gray);\n }\n </style>\n </head>\n <body>\n <header><h1>Customer: Julian Brewster</h1></header>\n <main>\n <ul>\n <li class=\"you\">Hey!</li>\n <li class=\"you\">I want to check my account balance.</li>\n <li class=\"me\">Hello Mr Brewster.</li>\n <li class=\"me\">You have two accounts open. Which one do you want to check?</li>\n <li class=\"you\">The default one.</li>\n <li class=\"me\">Your account balance is $12345.45.</li>\n <li class=\"me\">Is there anything I can help you, Mr Brewster?</li>\n <li class=\"you\">I want to close the other account.</li>\n <li class=\"me\">Alright. What account the money should be transferred to?</li>\n </ul>\n <div>\n <input name=\"message\" autocomplete=\"off\" />\n <button>Send</button>\n </div>\n </main>\n </body>\n</html>\n`;\n"]}
|