@pega/cosmos-react-demos 5.0.0-dev.14.0 → 5.0.0-dev.15.1
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/core/Lightbox/Lightbox.mocks.d.ts +15 -8
- package/jsx/core/Lightbox/Lightbox.mocks.d.ts.map +1 -1
- package/jsx/core/Lightbox/Lightbox.mocks.js +62 -24
- package/jsx/core/Lightbox/Lightbox.mocks.js.map +1 -1
- package/jsx/core/Lightbox/Lightbox.stories.d.ts.map +1 -1
- package/jsx/core/Lightbox/Lightbox.stories.jsx +37 -22
- package/jsx/core/Lightbox/Lightbox.stories.jsx.map +1 -1
- package/jsx/social/Feed/Feed.stories.d.ts.map +1 -1
- package/jsx/social/Feed/Feed.stories.jsx +2 -0
- package/jsx/social/Feed/Feed.stories.jsx.map +1 -1
- package/lib/core/Lightbox/Lightbox.mocks.d.ts +15 -8
- package/lib/core/Lightbox/Lightbox.mocks.d.ts.map +1 -1
- package/lib/core/Lightbox/Lightbox.mocks.js +64 -24
- package/lib/core/Lightbox/Lightbox.mocks.js.map +1 -1
- package/lib/core/Lightbox/Lightbox.stories.d.ts.map +1 -1
- package/lib/core/Lightbox/Lightbox.stories.js +36 -21
- package/lib/core/Lightbox/Lightbox.stories.js.map +1 -1
- package/lib/social/Feed/Feed.stories.d.ts.map +1 -1
- package/lib/social/Feed/Feed.stories.js +2 -0
- package/lib/social/Feed/Feed.stories.js.map +1 -1
- package/package.json +7 -7
|
@@ -1,15 +1,22 @@
|
|
|
1
|
-
export declare const
|
|
1
|
+
export declare const mockData: ({
|
|
2
2
|
id: string;
|
|
3
3
|
name: string;
|
|
4
4
|
description: string;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
}
|
|
8
|
-
export declare const mockBadImageResource: {
|
|
5
|
+
format: string;
|
|
6
|
+
src: string;
|
|
7
|
+
} | {
|
|
9
8
|
id: string;
|
|
10
9
|
name: string;
|
|
11
10
|
description: string;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
};
|
|
11
|
+
format: string;
|
|
12
|
+
src: null;
|
|
13
|
+
})[];
|
|
14
|
+
export declare const mockBadResources: {
|
|
15
|
+
id: string;
|
|
16
|
+
name: string;
|
|
17
|
+
description: string;
|
|
18
|
+
src: string;
|
|
19
|
+
format: undefined;
|
|
20
|
+
error: boolean;
|
|
21
|
+
}[];
|
|
15
22
|
//# sourceMappingURL=Lightbox.mocks.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.mocks.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Lightbox.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.mocks.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,QAAQ;;;;;;;;;;;;IAsFpB,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;GAS5B,CAAC"}
|
|
@@ -1,59 +1,97 @@
|
|
|
1
|
-
export const
|
|
1
|
+
export const mockData = [
|
|
2
2
|
{
|
|
3
3
|
id: 'photo-1497752531616-c3afd9760a11',
|
|
4
4
|
name: 'Image 1',
|
|
5
5
|
description: 'Descriptive text about Image 1',
|
|
6
|
-
|
|
7
|
-
|
|
6
|
+
format: 'jpeg',
|
|
7
|
+
src: 'https://images.unsplash.com/photo-1497752531616-c3afd9760a11?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'
|
|
8
|
+
},
|
|
9
|
+
{
|
|
10
|
+
id: 'pdf-1',
|
|
11
|
+
name: 'Sample-PDF 1',
|
|
12
|
+
description: 'Descriptive text about Dictionary of old Icelandic',
|
|
13
|
+
src: 'https://css4.pub/2015/icelandic/dictionary.pdf',
|
|
14
|
+
format: 'pdf'
|
|
8
15
|
},
|
|
9
16
|
{
|
|
10
17
|
id: 'photo-1470093851219-69951fcbb533',
|
|
11
18
|
name: 'Image 2',
|
|
12
19
|
description: 'Descriptive text about Image 2',
|
|
13
|
-
|
|
14
|
-
|
|
20
|
+
format: 'jpeg',
|
|
21
|
+
src: 'https://images.unsplash.com/photo-1470093851219-69951fcbb533?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'
|
|
15
22
|
},
|
|
16
23
|
{
|
|
17
24
|
id: 'photo-1447684808650-354ae64db5b8',
|
|
18
25
|
name: 'Image 3',
|
|
19
26
|
description: 'Descriptive text about Image 3',
|
|
20
|
-
|
|
21
|
-
|
|
27
|
+
format: 'jpeg',
|
|
28
|
+
src: 'https://images.unsplash.com/photo-1447684808650-354ae64db5b8?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2094&q=80'
|
|
22
29
|
},
|
|
23
30
|
{
|
|
24
31
|
id: 'photo-1425082661705-1834bfd09dca',
|
|
25
32
|
name: 'Image 4',
|
|
26
33
|
description: 'Descriptive text about Image 4',
|
|
27
|
-
|
|
28
|
-
|
|
34
|
+
format: 'jpeg',
|
|
35
|
+
src: 'https://images.unsplash.com/photo-1425082661705-1834bfd09dca?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2110&q=80'
|
|
29
36
|
},
|
|
30
37
|
{
|
|
31
38
|
id: 'photo-1494256997604-768d1f608cac',
|
|
32
39
|
name: 'Image 5',
|
|
33
40
|
description: 'Descriptive text about Image 5',
|
|
34
|
-
|
|
35
|
-
|
|
41
|
+
format: 'jpeg',
|
|
42
|
+
src: 'https://images.unsplash.com/photo-1494256997604-768d1f608cac?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2301&q=80'
|
|
36
43
|
},
|
|
37
44
|
{
|
|
38
45
|
id: 'photo-1500694216671-a4e54fc4b513',
|
|
39
46
|
name: 'Image 6',
|
|
40
47
|
description: 'Descriptive text about Image 6',
|
|
41
|
-
|
|
42
|
-
|
|
48
|
+
format: 'jpeg',
|
|
49
|
+
src: 'https://images.unsplash.com/photo-1500694216671-a4e54fc4b513?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2092&q=80'
|
|
50
|
+
},
|
|
51
|
+
{
|
|
52
|
+
id: 'doc1',
|
|
53
|
+
name: 'Pega.docx',
|
|
54
|
+
description: 'Descriptive text about Pega document',
|
|
55
|
+
format: 'docx',
|
|
56
|
+
src: null
|
|
43
57
|
},
|
|
44
58
|
{
|
|
45
|
-
id: '
|
|
46
|
-
name: '
|
|
59
|
+
id: 'ppt2',
|
|
60
|
+
name: 'Pega.odp',
|
|
61
|
+
description: 'Descriptive text about Presentation file',
|
|
62
|
+
format: 'odp',
|
|
63
|
+
src: null
|
|
64
|
+
},
|
|
65
|
+
{
|
|
66
|
+
id: 'attachment_link',
|
|
67
|
+
name: 'Link file',
|
|
47
68
|
description: 'Descriptive text about Image 7',
|
|
48
|
-
|
|
49
|
-
|
|
69
|
+
format: 'url',
|
|
70
|
+
src: 'https://images.unsplash.com/photo-1638292597251-6fe6b2ba50f9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1287&q=80'
|
|
71
|
+
},
|
|
72
|
+
{
|
|
73
|
+
id: 'generic',
|
|
74
|
+
name: 'Pega file',
|
|
75
|
+
description: 'Descriptive text about file',
|
|
76
|
+
format: '3ds',
|
|
77
|
+
src: null
|
|
78
|
+
},
|
|
79
|
+
{
|
|
80
|
+
id: 'error',
|
|
81
|
+
name: 'Pega file',
|
|
82
|
+
description: 'Error showing content',
|
|
83
|
+
format: 'jpeg',
|
|
84
|
+
src: 'https://images.unsplash.com/photo'
|
|
85
|
+
}
|
|
86
|
+
];
|
|
87
|
+
export const mockBadResources = [
|
|
88
|
+
{
|
|
89
|
+
id: 'image-error',
|
|
90
|
+
name: 'Some image',
|
|
91
|
+
description: 'Descriptive text about Some image',
|
|
92
|
+
src: '',
|
|
93
|
+
format: undefined,
|
|
94
|
+
error: true
|
|
50
95
|
}
|
|
51
96
|
];
|
|
52
|
-
export const mockBadImageResource = {
|
|
53
|
-
id: 'error',
|
|
54
|
-
name: 'Some image',
|
|
55
|
-
description: 'Descriptive text about Some image',
|
|
56
|
-
mime_type: 'image/avif',
|
|
57
|
-
media_url: ''
|
|
58
|
-
};
|
|
59
97
|
//# sourceMappingURL=Lightbox.mocks.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.mocks.js","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.mocks.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Lightbox.mocks.js","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.mocks.ts"],"names":[],"mappings":"AACA,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,OAAO;QACX,IAAI,EAAE,cAAc;QACpB,WAAW,EAAE,oDAAoD;QACjE,GAAG,EAAE,gDAAgD;QACrD,MAAM,EAAE,KAAK;KACd;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,MAAM;QACV,IAAI,EAAE,WAAW;QACjB,WAAW,EAAE,sCAAsC;QACnD,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,IAAI;KACV;IACD;QACE,EAAE,EAAE,MAAM;QACV,IAAI,EAAE,UAAU;QAChB,WAAW,EAAE,0CAA0C;QACvD,MAAM,EAAE,KAAK;QACb,GAAG,EAAE,IAAI;KACV;IACD;QACE,EAAE,EAAE,iBAAiB;QACrB,IAAI,EAAE,WAAW;QACjB,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,KAAK;QACb,GAAG,EAAE,gKAAgK;KACtK;IACD;QACE,EAAE,EAAE,SAAS;QACb,IAAI,EAAE,WAAW;QACjB,WAAW,EAAE,6BAA6B;QAC1C,MAAM,EAAE,KAAK;QACb,GAAG,EAAE,IAAI;KACV;IACD;QACE,EAAE,EAAE,OAAO;QACX,IAAI,EAAE,WAAW;QACjB,WAAW,EAAE,uBAAuB;QACpC,MAAM,EAAE,MAAM;QAEd,GAAG,EAAE,mCAAmC;KACzC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B;QACE,EAAE,EAAE,aAAa;QACjB,IAAI,EAAE,YAAY;QAClB,WAAW,EAAE,mCAAmC;QAChD,GAAG,EAAE,EAAE;QACP,MAAM,EAAE,SAAS;QACjB,KAAK,EAAE,IAAI;KACZ;CACF,CAAC","sourcesContent":["// cspell:words wordprocessingml\nexport const mockData = [\n {\n id: 'photo-1497752531616-c3afd9760a11',\n name: 'Image 1',\n description: 'Descriptive text about Image 1',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1497752531616-c3afd9760a11?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'\n },\n {\n id: 'pdf-1',\n name: 'Sample-PDF 1',\n description: 'Descriptive text about Dictionary of old Icelandic',\n src: 'https://css4.pub/2015/icelandic/dictionary.pdf',\n format: 'pdf'\n },\n {\n id: 'photo-1470093851219-69951fcbb533',\n name: 'Image 2',\n description: 'Descriptive text about Image 2',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1470093851219-69951fcbb533?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'\n },\n {\n id: 'photo-1447684808650-354ae64db5b8',\n name: 'Image 3',\n description: 'Descriptive text about Image 3',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1447684808650-354ae64db5b8?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2094&q=80'\n },\n {\n id: 'photo-1425082661705-1834bfd09dca',\n name: 'Image 4',\n description: 'Descriptive text about Image 4',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1425082661705-1834bfd09dca?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2110&q=80'\n },\n {\n id: 'photo-1494256997604-768d1f608cac',\n name: 'Image 5',\n description: 'Descriptive text about Image 5',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1494256997604-768d1f608cac?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2301&q=80'\n },\n {\n id: 'photo-1500694216671-a4e54fc4b513',\n name: 'Image 6',\n description: 'Descriptive text about Image 6',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1500694216671-a4e54fc4b513?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2092&q=80'\n },\n {\n id: 'doc1',\n name: 'Pega.docx',\n description: 'Descriptive text about Pega document',\n format: 'docx',\n src: null\n },\n {\n id: 'ppt2',\n name: 'Pega.odp',\n description: 'Descriptive text about Presentation file',\n format: 'odp',\n src: null\n },\n {\n id: 'attachment_link',\n name: 'Link file',\n description: 'Descriptive text about Image 7',\n format: 'url',\n src: 'https://images.unsplash.com/photo-1638292597251-6fe6b2ba50f9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1287&q=80'\n },\n {\n id: 'generic',\n name: 'Pega file',\n description: 'Descriptive text about file',\n format: '3ds',\n src: null\n },\n {\n id: 'error',\n name: 'Pega file',\n description: 'Error showing content',\n format: 'jpeg',\n // invalid url\n src: 'https://images.unsplash.com/photo'\n }\n];\n\nexport const mockBadResources = [\n {\n id: 'image-error',\n name: 'Some image',\n description: 'Descriptive text about Some image',\n src: '',\n format: undefined,\n error: true\n }\n];\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;;AAQtD,
|
|
1
|
+
{"version":3,"file":"Lightbox.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;;AAQtD,wBAMU;AAEV,UAAU,kBAAkB;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,eAAO,MAAM,YAAY,EAAE,OAAO,CAAC,kBAAkB,CAoEpD,CAAC"}
|
|
@@ -1,49 +1,64 @@
|
|
|
1
1
|
import { useRef, useState } from 'react';
|
|
2
2
|
import { Button, DateTimeDisplay, Lightbox } from '@pega/cosmos-react-core';
|
|
3
|
-
import {
|
|
3
|
+
import { mockData, mockBadResources } from './Lightbox.mocks';
|
|
4
4
|
export default {
|
|
5
5
|
title: 'Core/Lightbox',
|
|
6
|
-
component: Lightbox
|
|
6
|
+
component: Lightbox,
|
|
7
|
+
parameters: {
|
|
8
|
+
layout: 'centered'
|
|
9
|
+
}
|
|
7
10
|
};
|
|
8
11
|
export const LightboxDemo = (args) => {
|
|
9
12
|
const demoButtonRef = useRef(null);
|
|
10
|
-
const [
|
|
13
|
+
const [open, setOpen] = useState(false);
|
|
14
|
+
const [items, setItems] = useState();
|
|
11
15
|
const onClick = () => {
|
|
12
|
-
|
|
16
|
+
setItems((args.error ? mockBadResources : mockData.slice(0, args.limit)).map(item => {
|
|
13
17
|
return {
|
|
14
|
-
|
|
15
|
-
name,
|
|
16
|
-
description,
|
|
17
|
-
src: media_url,
|
|
18
|
+
...item,
|
|
18
19
|
metadata: [
|
|
19
|
-
|
|
20
|
+
item.format,
|
|
21
|
+
'John smith',
|
|
20
22
|
<DateTimeDisplay value={new Date()} variant='date'/>
|
|
21
23
|
]
|
|
22
24
|
};
|
|
23
25
|
}));
|
|
24
26
|
};
|
|
25
27
|
const onItemDownload = async (id) => {
|
|
26
|
-
const
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
28
|
+
const currentItem = items?.find(item => item.id === id);
|
|
29
|
+
if (!currentItem)
|
|
30
|
+
return;
|
|
31
|
+
if (currentItem.src) {
|
|
32
|
+
const objectURL = URL.createObjectURL(await (await fetch(currentItem.src)).blob());
|
|
33
|
+
const a = document.createElement('a');
|
|
34
|
+
a.href = objectURL;
|
|
35
|
+
a.download = currentItem.name ?? id;
|
|
36
|
+
document.body.appendChild(a);
|
|
37
|
+
a.click();
|
|
38
|
+
document.body.removeChild(a);
|
|
39
|
+
URL.revokeObjectURL(objectURL);
|
|
40
|
+
}
|
|
41
|
+
};
|
|
42
|
+
const onItemError = (id) => {
|
|
43
|
+
setItems(item => {
|
|
44
|
+
return item?.map(obj => (obj.id === id ? { ...obj, error: true } : obj));
|
|
45
|
+
});
|
|
34
46
|
};
|
|
35
47
|
return (<>
|
|
36
|
-
<Button ref={demoButtonRef} onClick={
|
|
48
|
+
<Button ref={demoButtonRef} onClick={() => {
|
|
49
|
+
setOpen(true);
|
|
50
|
+
onClick();
|
|
51
|
+
}}>
|
|
37
52
|
Open Lightbox
|
|
38
53
|
</Button>
|
|
39
|
-
{
|
|
40
|
-
|
|
54
|
+
{open && (<Lightbox items={items ?? []} cycle={args.cycle || undefined} onAfterClose={() => {
|
|
55
|
+
setOpen(false);
|
|
41
56
|
demoButtonRef.current?.focus();
|
|
42
|
-
}} onItemDownload={onItemDownload}/>)}
|
|
57
|
+
}} onItemDownload={onItemDownload} onItemError={onItemError}/>)}
|
|
43
58
|
</>);
|
|
44
59
|
};
|
|
45
60
|
LightboxDemo.args = {
|
|
46
|
-
limit:
|
|
61
|
+
limit: 12,
|
|
47
62
|
cycle: false,
|
|
48
63
|
error: false
|
|
49
64
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.stories.jsx","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAG5E,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"Lightbox.stories.jsx","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAG5E,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAE9D,eAAe;IACb,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,QAAQ;IACnB,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;KACnB;CACM,CAAC;AAQV,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,IAAwB,EAAE,EAAE;IACpF,MAAM,aAAa,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACtD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACjD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,EAA0B,CAAC;IAE7D,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,QAAQ,CACN,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;YACzE,OAAO;gBACL,GAAG,IAAI;gBACP,QAAQ,EAAE;oBACR,IAAI,CAAC,MAAM;oBACX,YAAY;oBACZ,CAAC,eAAe,CAAC,KAAK,CAAC,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC,MAAM,EAAG;iBACtD;aACF,CAAC;QACJ,CAAC,CAAC,CACH,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,KAAK,EAAE,EAAsB,EAAE,EAAE;QACtD,MAAM,WAAW,GAAG,KAAK,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC;QACxD,IAAI,CAAC,WAAW;YAAE,OAAO;QAEzB,IAAI,WAAW,CAAC,GAAG,EAAE;YACnB,MAAM,SAAS,GAAG,GAAG,CAAC,eAAe,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;YAEnF,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;YACtC,CAAC,CAAC,IAAI,GAAG,SAAS,CAAC;YACnB,CAAC,CAAC,QAAQ,GAAG,WAAW,CAAC,IAAI,IAAI,EAAE,CAAC;YACpC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;YAC7B,CAAC,CAAC,KAAK,EAAE,CAAC;YACV,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;YAC7B,GAAG,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC;SAChC;IACH,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,EAAsB,EAAE,EAAE;QAC7C,QAAQ,CAAC,IAAI,CAAC,EAAE;YACd,OAAO,IAAI,EAAE,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,GAAG,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QAC3E,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,EACE;MAAA,CAAC,MAAM,CACL,GAAG,CAAC,CAAC,aAAa,CAAC,CACnB,OAAO,CAAC,CAAC,GAAG,EAAE;YACZ,OAAO,CAAC,IAAI,CAAC,CAAC;YACd,OAAO,EAAE,CAAC;QACZ,CAAC,CAAC,CAEF;;MACF,EAAE,MAAM,CACR;MAAA,CAAC,IAAI,IAAI,CACP,CAAC,QAAQ,CACP,KAAK,CAAC,CAAC,KAAK,IAAI,EAAE,CAAC,CACnB,KAAK,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,SAAS,CAAC,CAC/B,YAAY,CAAC,CAAC,GAAG,EAAE;gBACjB,OAAO,CAAC,KAAK,CAAC,CAAC;gBACf,aAAa,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;YACjC,CAAC,CAAC,CACF,cAAc,CAAC,CAAC,cAAc,CAAC,CAC/B,WAAW,CAAC,CAAC,WAAW,CAAC,EACzB,CACH,CACH;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,IAAI,GAAG;IAClB,KAAK,EAAE,EAAE;IACT,KAAK,EAAE,KAAK;IACZ,KAAK,EAAE,KAAK;CACb,CAAC;AAEF,YAAY,CAAC,QAAQ,GAAG;IACtB,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;IACtC,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;IACvC,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CACxC,CAAC","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useRef, useState } from 'react';\n\nimport { Button, DateTimeDisplay, Lightbox } from '@pega/cosmos-react-core';\nimport type { LightboxItem, LightboxProps } from '@pega/cosmos-react-core';\n\nimport { mockData, mockBadResources } from './Lightbox.mocks';\n\nexport default {\n title: 'Core/Lightbox',\n component: Lightbox,\n parameters: {\n layout: 'centered'\n }\n} as Meta;\n\ninterface LightboxStoryProps {\n limit?: number;\n cycle?: boolean;\n error?: boolean;\n}\n\nexport const LightboxDemo: StoryFn<LightboxStoryProps> = (args: LightboxStoryProps) => {\n const demoButtonRef = useRef<HTMLButtonElement>(null);\n const [open, setOpen] = useState<boolean>(false);\n const [items, setItems] = useState<LightboxProps['items']>();\n\n const onClick = () => {\n setItems(\n (args.error ? mockBadResources : mockData.slice(0, args.limit)).map(item => {\n return {\n ...item,\n metadata: [\n item.format,\n 'John smith',\n <DateTimeDisplay value={new Date()} variant='date' />\n ]\n };\n })\n );\n };\n\n const onItemDownload = async (id: LightboxItem['id']) => {\n const currentItem = items?.find(item => item.id === id);\n if (!currentItem) return;\n\n if (currentItem.src) {\n const objectURL = URL.createObjectURL(await (await fetch(currentItem.src)).blob());\n\n const a = document.createElement('a');\n a.href = objectURL;\n a.download = currentItem.name ?? id;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(objectURL);\n }\n };\n\n const onItemError = (id: LightboxItem['id']) => {\n setItems(item => {\n return item?.map(obj => (obj.id === id ? { ...obj, error: true } : obj));\n });\n };\n\n return (\n <>\n <Button\n ref={demoButtonRef}\n onClick={() => {\n setOpen(true);\n onClick();\n }}\n >\n Open Lightbox\n </Button>\n {open && (\n <Lightbox\n items={items ?? []}\n cycle={args.cycle || undefined}\n onAfterClose={() => {\n setOpen(false);\n demoButtonRef.current?.focus();\n }}\n onItemDownload={onItemDownload}\n onItemError={onItemError}\n />\n )}\n </>\n );\n};\n\nLightboxDemo.args = {\n limit: 12,\n cycle: false,\n error: false\n};\n\nLightboxDemo.argTypes = {\n limit: { control: { type: 'number' } },\n cycle: { control: { type: 'boolean' } },\n error: { control: { type: 'boolean' } }\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Feed.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/Feed.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAYtD,OAAO,KAAK,EAEV,SAAS,EAIV,MAAM,2BAA2B,CAAC;;AAanC,wBAGU;AAEV,UAAU,aAAa;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IACvC,gBAAgB,CAAC,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,QAAQ,EAAE,OAAO,CAAC,aAAa,
|
|
1
|
+
{"version":3,"file":"Feed.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/Feed.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAYtD,OAAO,KAAK,EAEV,SAAS,EAIV,MAAM,2BAA2B,CAAC;;AAanC,wBAGU;AAEV,UAAU,aAAa;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IACvC,gBAAgB,CAAC,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,QAAQ,EAAE,OAAO,CAAC,aAAa,CA6S3C,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,OAE9B,CAAC"}
|
|
@@ -127,6 +127,7 @@ export const FeedDemo = ({ markdownMap, onMentionPreview }) => {
|
|
|
127
127
|
return {
|
|
128
128
|
id: image.thumbnail,
|
|
129
129
|
name: image.name,
|
|
130
|
+
format: 'jpeg',
|
|
130
131
|
description: '',
|
|
131
132
|
src: null
|
|
132
133
|
};
|
|
@@ -156,6 +157,7 @@ export const FeedDemo = ({ markdownMap, onMentionPreview }) => {
|
|
|
156
157
|
return {
|
|
157
158
|
id: image.thumbnail,
|
|
158
159
|
name: image.name,
|
|
160
|
+
format: 'jpeg',
|
|
159
161
|
description: image.name,
|
|
160
162
|
src: image.thumbnail,
|
|
161
163
|
metadata: [image.type, <DateTimeDisplay value={new Date()} variant='date'/>],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Feed.stories.jsx","sourceRoot":"","sources":["../../../src/social/Feed/Feed.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useState, useRef, useCallback, useEffect } from 'react';\n\nimport { createUID, DateTimeDisplay, Lightbox, OneColumnPage } from '@pega/cosmos-react-core';\nimport type { LightboxItem, LightboxProps, MenuItemProps } from '@pega/cosmos-react-core';\nimport {\n AutopilotConfig,\n Feed,\n MentionButtonConfig,\n HashtagButtonConfig,\n AutopilotGlimpse\n} from '@pega/cosmos-react-social';\nimport type {\n AutopilotGlimpseProps,\n FeedProps,\n Filter,\n AttachedFiles,\n FeedPostProps\n} from '@pega/cosmos-react-social';\nimport { Glimpse } from '@pega/cosmos-react-work';\nimport type { GlimpseProps } from '@pega/cosmos-react-work';\n\nimport { loadingTimeoutMS } from '../../core/Progress/Progress.mocks';\nimport { AppShellDemo } from '../../core/AppShell/AppShell.stories';\n\nimport { FeedPostDemo } from './FeedPost.mocks';\nimport { FeedNewPostDemo } from './FeedNewPost.mocks';\nimport { caseMentions, feedPosts, userMentions } from './Feed.mocks';\nimport type { FeedPostDemoProps } from './Feed.mocks';\nimport { FeedReplyDemo } from './FeedReply.mocks';\n\nexport default {\n title: 'Social/Feed',\n component: Feed\n} as Meta;\n\ninterface FeedDemoProps {\n markdownMap?: FeedProps['markdownMap'];\n onMentionPreview?: FeedProps['onMentionPreview'];\n}\n\nexport const FeedDemo: StoryFn<FeedDemoProps> = ({\n markdownMap,\n onMentionPreview\n}: FeedDemoProps) => {\n const [extraPosts, setExtraPosts] = useState<FeedPostDemoProps[]>(() => feedPosts);\n const [postGenerated, setPostGenerated] = useState(false);\n const [searchResults, setSearchResults] = useState<MenuItemProps[]>([]);\n\n const [filters, setFilters] = useState<Filter[]>(\n Array.from({ length: 10 }, (_, index) => {\n return {\n id: `filter-${index + 1}`,\n label: `Filter ${index + 1}`\n };\n })\n );\n\n const toggleFilter = (filterId: string) => {\n const updatedFilters = [...filters];\n const filterToUpdate = updatedFilters.find(x => x.id === filterId);\n\n if (filterToUpdate) filterToUpdate.on = !filterToUpdate.on;\n\n setFilters(updatedFilters);\n };\n\n const onSearch = ({\n type,\n search,\n mentionType\n }: {\n type: 'mention' | 'tag';\n search: string;\n mentionType: string;\n }) => {\n if (type === 'mention') {\n const availableMentions = mentionType === 'case' ? caseMentions : userMentions;\n\n const mentions: MenuItemProps[] = availableMentions\n .filter(user => {\n const names = user.primary.toLowerCase().split(' ');\n const searchWords = search.toLowerCase().split(' ');\n return !!searchWords.every((word: string) =>\n names.find((name: string) => name.startsWith(word))\n );\n })\n .map(({ id, primary, secondary, visual, href }) => {\n return {\n id,\n primary,\n secondary:\n secondary !== undefined && !Array.isArray(secondary) ? [secondary] : secondary,\n visual,\n href\n };\n });\n setSearchResults(mentions);\n } else {\n setSearchResults(\n ['cosmos', 'hashtag', 'pega']\n .filter(tag => {\n return tag.toLowerCase().includes(search.toLowerCase());\n })\n .map(tag => ({ id: tag, primary: tag }))\n );\n }\n };\n\n const [loading, setLoading] = useState(false);\n let timeoutId: ReturnType<typeof setTimeout>;\n\n const generateNewPost = useCallback(() => {\n if (!loading && !postGenerated) {\n setLoading(true);\n timeoutId = setTimeout(() => {\n setLoading(false);\n setPostGenerated(true);\n setExtraPosts(posts => [\n ...posts,\n {\n id: createUID(),\n fullname: 'Feed Bot',\n icon: 'robot-solid',\n username: 'feed_bot',\n content: 'This post was loaded after the Feed was scrolled to the bottom!',\n attachments: [],\n replies: []\n }\n ]);\n }, 1000);\n }\n }, [loading, postGenerated]);\n\n useEffect(() => {\n return () => clearTimeout(timeoutId);\n }, []);\n\n const onAutopilotClick = ({\n target,\n onDismiss\n }: Partial<Pick<AutopilotGlimpseProps, 'target' | 'onDismiss'>>) => {\n if (target && onDismiss) {\n return <AutopilotGlimpse target={target} onDismiss={onDismiss} placement='right' />;\n }\n };\n\n const onMentionClick = ({\n id,\n type,\n target,\n closeGlimpse\n }: { id: string; type: string; closeGlimpse?: () => void } & Partial<\n Pick<GlimpseProps, 'target'>\n >) => {\n if (type === 'user') {\n const user = userMentions.find(mention => mention.id === id);\n if (user && target && closeGlimpse) {\n const { primary, secondary, visual, ...restUser } = user;\n\n return (\n <Glimpse\n {...restUser}\n heading={{\n primary,\n secondary: Array.isArray(secondary) ? secondary.join(', ') : secondary,\n visual\n }}\n target={target}\n onDismiss={() => {\n closeGlimpse();\n }}\n placement='right'\n />\n );\n }\n }\n };\n\n const [showLightbox, setShowLightbox] = useState(false);\n const [lightboxImages, setLightboxImages] = useState<LightboxProps['items']>([]);\n const defaultLBIndex = useRef(0);\n const mockAPIImages = useRef<(LightboxItem & { resolved: boolean })[]>([]);\n\n const getLightboxImage = async (id: string) => {\n await new Promise(resolve => {\n setTimeout(() => resolve(0), loadingTimeoutMS);\n });\n const mockImage = mockAPIImages.current.find(image => image.id === id);\n if (mockImage) {\n mockImage.resolved = true;\n }\n return mockImage;\n };\n\n const renderLightbox = (imageAttachments: AttachedFiles[], name: string) => {\n const idx = imageAttachments.findIndex(image => image.name === name);\n defaultLBIndex.current = idx > -1 ? idx : 0;\n\n const images = imageAttachments.map<LightboxItem>(image => {\n const mockImage = mockAPIImages.current.find(mockImg => mockImg.name === image.name);\n if (mockImage?.resolved) return mockImage;\n\n return {\n id: image.thumbnail as string,\n name: image.name,\n description: '',\n src: null\n };\n });\n\n setLightboxImages(images);\n setShowLightbox(true);\n };\n\n const deletePost = (index: number) => {\n setExtraPosts(posts => {\n const postsCopy = [...posts];\n postsCopy.splice(index, 1);\n return [...postsCopy];\n });\n };\n\n return (\n <>\n <Feed\n title='Pulse'\n userInfo={{ username: 'demo_user', fullname: 'Demo User', userStatus: 'active' }}\n searchTypes={['user', 'case', 'autopilot']}\n onDecoratorSearch={onSearch}\n searchResults={searchResults}\n autopilotInfo={{\n id: 'autopilot',\n label: 'Autopilot',\n meta: 'Pega GenAI™ virtual assistant',\n description: `Mention Autopilot to effortlessly initiate tasks and prompt interactions.\\n\\nAsk about performance metrics or make a variety of requests using everyday language, and receive a swift response within seconds.`\n }}\n onAutopilotClick={onAutopilotClick}\n onMentionClick={onMentionClick}\n onMentionPreview={onMentionPreview}\n markdownMap={markdownMap}\n interactionRenderers={[MentionButtonConfig, HashtagButtonConfig, AutopilotConfig]}\n filters={filters}\n onFilterChange={toggleFilter}\n loadingPosts={loading}\n onLoadMore={generateNewPost}\n newPostRegion={\n <FeedNewPostDemo\n onSubmit={postEvent => {\n const { value, attachments, recipients, clear } = postEvent;\n\n const images = attachments.filter(\n attachment => attachment.type.includes('image') && attachment.thumbnail\n );\n\n mockAPIImages.current = [\n ...mockAPIImages.current,\n ...images.map(image => {\n return {\n id: image.thumbnail as string,\n name: image.name,\n description: image.name,\n src: image.thumbnail as string,\n metadata: [image.type, <DateTimeDisplay value={new Date()} variant='date' />],\n resolved: false\n };\n })\n ];\n\n attachments.forEach(file => {\n delete file.onDelete;\n file.onPreview = file.type.includes('image')\n ? () => renderLightbox(images, file.name)\n : undefined;\n file.onDownload = () => {};\n });\n\n if (value || attachments.length > 0) {\n const replies: FeedPostProps['replies'] = [];\n\n const triggersAutopilot = value.match(AutopilotConfig.regexPattern);\n if (triggersAutopilot && triggersAutopilot.length && triggersAutopilot.length > 0) {\n replies.push(\n <FeedReplyDemo\n key={`autopilot-${createUID()}`}\n fullname='Autopilot'\n username='autopilot'\n content='This is just an automatic reply. In order to truly experience the power of the Pega GenAI™ virtual assistant, make sure to interact with Autopilot in a production environment!'\n postTimestamp={new Date()}\n />\n );\n }\n\n setExtraPosts(posts => [\n {\n id: createUID(),\n fullname: 'Demo User',\n username: 'demo_user',\n userStatus: 'active',\n content: value,\n attachments,\n recipients,\n postType: recipients?.length ? 'private' : 'public',\n replies,\n postTimestamp: new Date()\n },\n ...posts\n ]);\n clear();\n }\n }}\n />\n }\n posts={extraPosts.map((post, i) => {\n return <FeedPostDemo {...post} key={post.id} onDelete={() => deletePost(i)} />;\n })}\n />\n {showLightbox && (\n <Lightbox\n items={lightboxImages}\n defaultIndex={defaultLBIndex.current}\n cycle\n onNavigate={async (id, index) => {\n if (!lightboxImages[index].src) {\n const updatedImages = [...lightboxImages];\n const requestedImage = await getLightboxImage(id);\n if (requestedImage) {\n updatedImages[index] = requestedImage;\n setLightboxImages(updatedImages);\n }\n }\n }}\n onAfterClose={() => {\n setShowLightbox(false);\n setLightboxImages([]);\n }}\n />\n )}\n </>\n );\n};\n\nexport const FeedWithAppShell: StoryFn = () => {\n return <AppShellDemo appHeader main={<OneColumnPage title='Welcome' a={<FeedDemo />} />} />;\n};\n\nFeedWithAppShell.parameters = {\n layout: 'fullscreen'\n};\n"]}
|
|
1
|
+
{"version":3,"file":"Feed.stories.jsx","sourceRoot":"","sources":["../../../src/social/Feed/Feed.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useState, useRef, useCallback, useEffect } from 'react';\n\nimport { createUID, DateTimeDisplay, Lightbox, OneColumnPage } from '@pega/cosmos-react-core';\nimport type { LightboxItem, LightboxProps, MenuItemProps } from '@pega/cosmos-react-core';\nimport {\n AutopilotConfig,\n Feed,\n MentionButtonConfig,\n HashtagButtonConfig,\n AutopilotGlimpse\n} from '@pega/cosmos-react-social';\nimport type {\n AutopilotGlimpseProps,\n FeedProps,\n Filter,\n AttachedFiles,\n FeedPostProps\n} from '@pega/cosmos-react-social';\nimport { Glimpse } from '@pega/cosmos-react-work';\nimport type { GlimpseProps } from '@pega/cosmos-react-work';\n\nimport { loadingTimeoutMS } from '../../core/Progress/Progress.mocks';\nimport { AppShellDemo } from '../../core/AppShell/AppShell.stories';\n\nimport { FeedPostDemo } from './FeedPost.mocks';\nimport { FeedNewPostDemo } from './FeedNewPost.mocks';\nimport { caseMentions, feedPosts, userMentions } from './Feed.mocks';\nimport type { FeedPostDemoProps } from './Feed.mocks';\nimport { FeedReplyDemo } from './FeedReply.mocks';\n\nexport default {\n title: 'Social/Feed',\n component: Feed\n} as Meta;\n\ninterface FeedDemoProps {\n markdownMap?: FeedProps['markdownMap'];\n onMentionPreview?: FeedProps['onMentionPreview'];\n}\n\nexport const FeedDemo: StoryFn<FeedDemoProps> = ({\n markdownMap,\n onMentionPreview\n}: FeedDemoProps) => {\n const [extraPosts, setExtraPosts] = useState<FeedPostDemoProps[]>(() => feedPosts);\n const [postGenerated, setPostGenerated] = useState(false);\n const [searchResults, setSearchResults] = useState<MenuItemProps[]>([]);\n\n const [filters, setFilters] = useState<Filter[]>(\n Array.from({ length: 10 }, (_, index) => {\n return {\n id: `filter-${index + 1}`,\n label: `Filter ${index + 1}`\n };\n })\n );\n\n const toggleFilter = (filterId: string) => {\n const updatedFilters = [...filters];\n const filterToUpdate = updatedFilters.find(x => x.id === filterId);\n\n if (filterToUpdate) filterToUpdate.on = !filterToUpdate.on;\n\n setFilters(updatedFilters);\n };\n\n const onSearch = ({\n type,\n search,\n mentionType\n }: {\n type: 'mention' | 'tag';\n search: string;\n mentionType: string;\n }) => {\n if (type === 'mention') {\n const availableMentions = mentionType === 'case' ? caseMentions : userMentions;\n\n const mentions: MenuItemProps[] = availableMentions\n .filter(user => {\n const names = user.primary.toLowerCase().split(' ');\n const searchWords = search.toLowerCase().split(' ');\n return !!searchWords.every((word: string) =>\n names.find((name: string) => name.startsWith(word))\n );\n })\n .map(({ id, primary, secondary, visual, href }) => {\n return {\n id,\n primary,\n secondary:\n secondary !== undefined && !Array.isArray(secondary) ? [secondary] : secondary,\n visual,\n href\n };\n });\n setSearchResults(mentions);\n } else {\n setSearchResults(\n ['cosmos', 'hashtag', 'pega']\n .filter(tag => {\n return tag.toLowerCase().includes(search.toLowerCase());\n })\n .map(tag => ({ id: tag, primary: tag }))\n );\n }\n };\n\n const [loading, setLoading] = useState(false);\n let timeoutId: ReturnType<typeof setTimeout>;\n\n const generateNewPost = useCallback(() => {\n if (!loading && !postGenerated) {\n setLoading(true);\n timeoutId = setTimeout(() => {\n setLoading(false);\n setPostGenerated(true);\n setExtraPosts(posts => [\n ...posts,\n {\n id: createUID(),\n fullname: 'Feed Bot',\n icon: 'robot-solid',\n username: 'feed_bot',\n content: 'This post was loaded after the Feed was scrolled to the bottom!',\n attachments: [],\n replies: []\n }\n ]);\n }, 1000);\n }\n }, [loading, postGenerated]);\n\n useEffect(() => {\n return () => clearTimeout(timeoutId);\n }, []);\n\n const onAutopilotClick = ({\n target,\n onDismiss\n }: Partial<Pick<AutopilotGlimpseProps, 'target' | 'onDismiss'>>) => {\n if (target && onDismiss) {\n return <AutopilotGlimpse target={target} onDismiss={onDismiss} placement='right' />;\n }\n };\n\n const onMentionClick = ({\n id,\n type,\n target,\n closeGlimpse\n }: { id: string; type: string; closeGlimpse?: () => void } & Partial<\n Pick<GlimpseProps, 'target'>\n >) => {\n if (type === 'user') {\n const user = userMentions.find(mention => mention.id === id);\n if (user && target && closeGlimpse) {\n const { primary, secondary, visual, ...restUser } = user;\n\n return (\n <Glimpse\n {...restUser}\n heading={{\n primary,\n secondary: Array.isArray(secondary) ? secondary.join(', ') : secondary,\n visual\n }}\n target={target}\n onDismiss={() => {\n closeGlimpse();\n }}\n placement='right'\n />\n );\n }\n }\n };\n\n const [showLightbox, setShowLightbox] = useState(false);\n const [lightboxImages, setLightboxImages] = useState<LightboxProps['items']>([]);\n const defaultLBIndex = useRef(0);\n const mockAPIImages = useRef<(LightboxItem & { resolved: boolean })[]>([]);\n\n const getLightboxImage = async (id: string) => {\n await new Promise(resolve => {\n setTimeout(() => resolve(0), loadingTimeoutMS);\n });\n const mockImage = mockAPIImages.current.find(image => image.id === id);\n if (mockImage) {\n mockImage.resolved = true;\n }\n return mockImage;\n };\n\n const renderLightbox = (imageAttachments: AttachedFiles[], name: string) => {\n const idx = imageAttachments.findIndex(image => image.name === name);\n defaultLBIndex.current = idx > -1 ? idx : 0;\n\n const images = imageAttachments.map<LightboxItem>(image => {\n const mockImage = mockAPIImages.current.find(mockImg => mockImg.name === image.name);\n if (mockImage?.resolved) return mockImage;\n\n return {\n id: image.thumbnail as string,\n name: image.name,\n format: 'jpeg',\n description: '',\n src: null\n };\n });\n\n setLightboxImages(images);\n setShowLightbox(true);\n };\n\n const deletePost = (index: number) => {\n setExtraPosts(posts => {\n const postsCopy = [...posts];\n postsCopy.splice(index, 1);\n return [...postsCopy];\n });\n };\n\n return (\n <>\n <Feed\n title='Pulse'\n userInfo={{ username: 'demo_user', fullname: 'Demo User', userStatus: 'active' }}\n searchTypes={['user', 'case', 'autopilot']}\n onDecoratorSearch={onSearch}\n searchResults={searchResults}\n autopilotInfo={{\n id: 'autopilot',\n label: 'Autopilot',\n meta: 'Pega GenAI™ virtual assistant',\n description: `Mention Autopilot to effortlessly initiate tasks and prompt interactions.\\n\\nAsk about performance metrics or make a variety of requests using everyday language, and receive a swift response within seconds.`\n }}\n onAutopilotClick={onAutopilotClick}\n onMentionClick={onMentionClick}\n onMentionPreview={onMentionPreview}\n markdownMap={markdownMap}\n interactionRenderers={[MentionButtonConfig, HashtagButtonConfig, AutopilotConfig]}\n filters={filters}\n onFilterChange={toggleFilter}\n loadingPosts={loading}\n onLoadMore={generateNewPost}\n newPostRegion={\n <FeedNewPostDemo\n onSubmit={postEvent => {\n const { value, attachments, recipients, clear } = postEvent;\n\n const images = attachments.filter(\n attachment => attachment.type.includes('image') && attachment.thumbnail\n );\n\n mockAPIImages.current = [\n ...mockAPIImages.current,\n ...images.map(image => {\n return {\n id: image.thumbnail as string,\n name: image.name,\n format: 'jpeg',\n description: image.name,\n src: image.thumbnail as string,\n metadata: [image.type, <DateTimeDisplay value={new Date()} variant='date' />],\n resolved: false\n };\n })\n ];\n\n attachments.forEach(file => {\n delete file.onDelete;\n file.onPreview = file.type.includes('image')\n ? () => renderLightbox(images, file.name)\n : undefined;\n file.onDownload = () => {};\n });\n\n if (value || attachments.length > 0) {\n const replies: FeedPostProps['replies'] = [];\n\n const triggersAutopilot = value.match(AutopilotConfig.regexPattern);\n if (triggersAutopilot && triggersAutopilot.length && triggersAutopilot.length > 0) {\n replies.push(\n <FeedReplyDemo\n key={`autopilot-${createUID()}`}\n fullname='Autopilot'\n username='autopilot'\n content='This is just an automatic reply. In order to truly experience the power of the Pega GenAI™ virtual assistant, make sure to interact with Autopilot in a production environment!'\n postTimestamp={new Date()}\n />\n );\n }\n\n setExtraPosts(posts => [\n {\n id: createUID(),\n fullname: 'Demo User',\n username: 'demo_user',\n userStatus: 'active',\n content: value,\n attachments,\n recipients,\n postType: recipients?.length ? 'private' : 'public',\n replies,\n postTimestamp: new Date()\n },\n ...posts\n ]);\n clear();\n }\n }}\n />\n }\n posts={extraPosts.map((post, i) => {\n return <FeedPostDemo {...post} key={post.id} onDelete={() => deletePost(i)} />;\n })}\n />\n {showLightbox && (\n <Lightbox\n items={lightboxImages}\n defaultIndex={defaultLBIndex.current}\n cycle\n onNavigate={async (id, index) => {\n if (!lightboxImages[index].src) {\n const updatedImages = [...lightboxImages];\n const requestedImage = await getLightboxImage(id);\n if (requestedImage) {\n updatedImages[index] = requestedImage;\n setLightboxImages(updatedImages);\n }\n }\n }}\n onAfterClose={() => {\n setShowLightbox(false);\n setLightboxImages([]);\n }}\n />\n )}\n </>\n );\n};\n\nexport const FeedWithAppShell: StoryFn = () => {\n return <AppShellDemo appHeader main={<OneColumnPage title='Welcome' a={<FeedDemo />} />} />;\n};\n\nFeedWithAppShell.parameters = {\n layout: 'fullscreen'\n};\n"]}
|
|
@@ -1,15 +1,22 @@
|
|
|
1
|
-
export declare const
|
|
1
|
+
export declare const mockData: ({
|
|
2
2
|
id: string;
|
|
3
3
|
name: string;
|
|
4
4
|
description: string;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
}
|
|
8
|
-
export declare const mockBadImageResource: {
|
|
5
|
+
format: string;
|
|
6
|
+
src: string;
|
|
7
|
+
} | {
|
|
9
8
|
id: string;
|
|
10
9
|
name: string;
|
|
11
10
|
description: string;
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
};
|
|
11
|
+
format: string;
|
|
12
|
+
src: null;
|
|
13
|
+
})[];
|
|
14
|
+
export declare const mockBadResources: {
|
|
15
|
+
id: string;
|
|
16
|
+
name: string;
|
|
17
|
+
description: string;
|
|
18
|
+
src: string;
|
|
19
|
+
format: undefined;
|
|
20
|
+
error: boolean;
|
|
21
|
+
}[];
|
|
15
22
|
//# sourceMappingURL=Lightbox.mocks.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.mocks.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Lightbox.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.mocks.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,QAAQ;;;;;;;;;;;;IAsFpB,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;GAS5B,CAAC"}
|
|
@@ -1,59 +1,99 @@
|
|
|
1
|
-
|
|
1
|
+
// cspell:words wordprocessingml
|
|
2
|
+
export const mockData = [
|
|
2
3
|
{
|
|
3
4
|
id: 'photo-1497752531616-c3afd9760a11',
|
|
4
5
|
name: 'Image 1',
|
|
5
6
|
description: 'Descriptive text about Image 1',
|
|
6
|
-
|
|
7
|
-
|
|
7
|
+
format: 'jpeg',
|
|
8
|
+
src: 'https://images.unsplash.com/photo-1497752531616-c3afd9760a11?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'
|
|
9
|
+
},
|
|
10
|
+
{
|
|
11
|
+
id: 'pdf-1',
|
|
12
|
+
name: 'Sample-PDF 1',
|
|
13
|
+
description: 'Descriptive text about Dictionary of old Icelandic',
|
|
14
|
+
src: 'https://css4.pub/2015/icelandic/dictionary.pdf',
|
|
15
|
+
format: 'pdf'
|
|
8
16
|
},
|
|
9
17
|
{
|
|
10
18
|
id: 'photo-1470093851219-69951fcbb533',
|
|
11
19
|
name: 'Image 2',
|
|
12
20
|
description: 'Descriptive text about Image 2',
|
|
13
|
-
|
|
14
|
-
|
|
21
|
+
format: 'jpeg',
|
|
22
|
+
src: 'https://images.unsplash.com/photo-1470093851219-69951fcbb533?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'
|
|
15
23
|
},
|
|
16
24
|
{
|
|
17
25
|
id: 'photo-1447684808650-354ae64db5b8',
|
|
18
26
|
name: 'Image 3',
|
|
19
27
|
description: 'Descriptive text about Image 3',
|
|
20
|
-
|
|
21
|
-
|
|
28
|
+
format: 'jpeg',
|
|
29
|
+
src: 'https://images.unsplash.com/photo-1447684808650-354ae64db5b8?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2094&q=80'
|
|
22
30
|
},
|
|
23
31
|
{
|
|
24
32
|
id: 'photo-1425082661705-1834bfd09dca',
|
|
25
33
|
name: 'Image 4',
|
|
26
34
|
description: 'Descriptive text about Image 4',
|
|
27
|
-
|
|
28
|
-
|
|
35
|
+
format: 'jpeg',
|
|
36
|
+
src: 'https://images.unsplash.com/photo-1425082661705-1834bfd09dca?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2110&q=80'
|
|
29
37
|
},
|
|
30
38
|
{
|
|
31
39
|
id: 'photo-1494256997604-768d1f608cac',
|
|
32
40
|
name: 'Image 5',
|
|
33
41
|
description: 'Descriptive text about Image 5',
|
|
34
|
-
|
|
35
|
-
|
|
42
|
+
format: 'jpeg',
|
|
43
|
+
src: 'https://images.unsplash.com/photo-1494256997604-768d1f608cac?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2301&q=80'
|
|
36
44
|
},
|
|
37
45
|
{
|
|
38
46
|
id: 'photo-1500694216671-a4e54fc4b513',
|
|
39
47
|
name: 'Image 6',
|
|
40
48
|
description: 'Descriptive text about Image 6',
|
|
41
|
-
|
|
42
|
-
|
|
49
|
+
format: 'jpeg',
|
|
50
|
+
src: 'https://images.unsplash.com/photo-1500694216671-a4e54fc4b513?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2092&q=80'
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
id: 'doc1',
|
|
54
|
+
name: 'Pega.docx',
|
|
55
|
+
description: 'Descriptive text about Pega document',
|
|
56
|
+
format: 'docx',
|
|
57
|
+
src: null
|
|
43
58
|
},
|
|
44
59
|
{
|
|
45
|
-
id: '
|
|
46
|
-
name: '
|
|
60
|
+
id: 'ppt2',
|
|
61
|
+
name: 'Pega.odp',
|
|
62
|
+
description: 'Descriptive text about Presentation file',
|
|
63
|
+
format: 'odp',
|
|
64
|
+
src: null
|
|
65
|
+
},
|
|
66
|
+
{
|
|
67
|
+
id: 'attachment_link',
|
|
68
|
+
name: 'Link file',
|
|
47
69
|
description: 'Descriptive text about Image 7',
|
|
48
|
-
|
|
49
|
-
|
|
70
|
+
format: 'url',
|
|
71
|
+
src: 'https://images.unsplash.com/photo-1638292597251-6fe6b2ba50f9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1287&q=80'
|
|
72
|
+
},
|
|
73
|
+
{
|
|
74
|
+
id: 'generic',
|
|
75
|
+
name: 'Pega file',
|
|
76
|
+
description: 'Descriptive text about file',
|
|
77
|
+
format: '3ds',
|
|
78
|
+
src: null
|
|
79
|
+
},
|
|
80
|
+
{
|
|
81
|
+
id: 'error',
|
|
82
|
+
name: 'Pega file',
|
|
83
|
+
description: 'Error showing content',
|
|
84
|
+
format: 'jpeg',
|
|
85
|
+
// invalid url
|
|
86
|
+
src: 'https://images.unsplash.com/photo'
|
|
87
|
+
}
|
|
88
|
+
];
|
|
89
|
+
export const mockBadResources = [
|
|
90
|
+
{
|
|
91
|
+
id: 'image-error',
|
|
92
|
+
name: 'Some image',
|
|
93
|
+
description: 'Descriptive text about Some image',
|
|
94
|
+
src: '',
|
|
95
|
+
format: undefined,
|
|
96
|
+
error: true
|
|
50
97
|
}
|
|
51
98
|
];
|
|
52
|
-
export const mockBadImageResource = {
|
|
53
|
-
id: 'error',
|
|
54
|
-
name: 'Some image',
|
|
55
|
-
description: 'Descriptive text about Some image',
|
|
56
|
-
mime_type: 'image/avif',
|
|
57
|
-
media_url: ''
|
|
58
|
-
};
|
|
59
99
|
//# sourceMappingURL=Lightbox.mocks.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.mocks.js","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.mocks.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"Lightbox.mocks.js","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.mocks.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,OAAO;QACX,IAAI,EAAE,cAAc;QACpB,WAAW,EAAE,oDAAoD;QACjE,GAAG,EAAE,gDAAgD;QACrD,MAAM,EAAE,KAAK;KACd;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,wIAAwI;KAC9I;IACD;QACE,EAAE,EAAE,MAAM;QACV,IAAI,EAAE,WAAW;QACjB,WAAW,EAAE,sCAAsC;QACnD,MAAM,EAAE,MAAM;QACd,GAAG,EAAE,IAAI;KACV;IACD;QACE,EAAE,EAAE,MAAM;QACV,IAAI,EAAE,UAAU;QAChB,WAAW,EAAE,0CAA0C;QACvD,MAAM,EAAE,KAAK;QACb,GAAG,EAAE,IAAI;KACV;IACD;QACE,EAAE,EAAE,iBAAiB;QACrB,IAAI,EAAE,WAAW;QACjB,WAAW,EAAE,gCAAgC;QAC7C,MAAM,EAAE,KAAK;QACb,GAAG,EAAE,gKAAgK;KACtK;IACD;QACE,EAAE,EAAE,SAAS;QACb,IAAI,EAAE,WAAW;QACjB,WAAW,EAAE,6BAA6B;QAC1C,MAAM,EAAE,KAAK;QACb,GAAG,EAAE,IAAI;KACV;IACD;QACE,EAAE,EAAE,OAAO;QACX,IAAI,EAAE,WAAW;QACjB,WAAW,EAAE,uBAAuB;QACpC,MAAM,EAAE,MAAM;QACd,cAAc;QACd,GAAG,EAAE,mCAAmC;KACzC;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B;QACE,EAAE,EAAE,aAAa;QACjB,IAAI,EAAE,YAAY;QAClB,WAAW,EAAE,mCAAmC;QAChD,GAAG,EAAE,EAAE;QACP,MAAM,EAAE,SAAS;QACjB,KAAK,EAAE,IAAI;KACZ;CACF,CAAC","sourcesContent":["// cspell:words wordprocessingml\nexport const mockData = [\n {\n id: 'photo-1497752531616-c3afd9760a11',\n name: 'Image 1',\n description: 'Descriptive text about Image 1',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1497752531616-c3afd9760a11?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'\n },\n {\n id: 'pdf-1',\n name: 'Sample-PDF 1',\n description: 'Descriptive text about Dictionary of old Icelandic',\n src: 'https://css4.pub/2015/icelandic/dictionary.pdf',\n format: 'pdf'\n },\n {\n id: 'photo-1470093851219-69951fcbb533',\n name: 'Image 2',\n description: 'Descriptive text about Image 2',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1470093851219-69951fcbb533?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'\n },\n {\n id: 'photo-1447684808650-354ae64db5b8',\n name: 'Image 3',\n description: 'Descriptive text about Image 3',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1447684808650-354ae64db5b8?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2094&q=80'\n },\n {\n id: 'photo-1425082661705-1834bfd09dca',\n name: 'Image 4',\n description: 'Descriptive text about Image 4',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1425082661705-1834bfd09dca?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2110&q=80'\n },\n {\n id: 'photo-1494256997604-768d1f608cac',\n name: 'Image 5',\n description: 'Descriptive text about Image 5',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1494256997604-768d1f608cac?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2301&q=80'\n },\n {\n id: 'photo-1500694216671-a4e54fc4b513',\n name: 'Image 6',\n description: 'Descriptive text about Image 6',\n format: 'jpeg',\n src: 'https://images.unsplash.com/photo-1500694216671-a4e54fc4b513?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2092&q=80'\n },\n {\n id: 'doc1',\n name: 'Pega.docx',\n description: 'Descriptive text about Pega document',\n format: 'docx',\n src: null\n },\n {\n id: 'ppt2',\n name: 'Pega.odp',\n description: 'Descriptive text about Presentation file',\n format: 'odp',\n src: null\n },\n {\n id: 'attachment_link',\n name: 'Link file',\n description: 'Descriptive text about Image 7',\n format: 'url',\n src: 'https://images.unsplash.com/photo-1638292597251-6fe6b2ba50f9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1287&q=80'\n },\n {\n id: 'generic',\n name: 'Pega file',\n description: 'Descriptive text about file',\n format: '3ds',\n src: null\n },\n {\n id: 'error',\n name: 'Pega file',\n description: 'Error showing content',\n format: 'jpeg',\n // invalid url\n src: 'https://images.unsplash.com/photo'\n }\n];\n\nexport const mockBadResources = [\n {\n id: 'image-error',\n name: 'Some image',\n description: 'Descriptive text about Some image',\n src: '',\n format: undefined,\n error: true\n }\n];\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;;AAQtD,
|
|
1
|
+
{"version":3,"file":"Lightbox.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;;AAQtD,wBAMU;AAEV,UAAU,kBAAkB;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,eAAO,MAAM,YAAY,EAAE,OAAO,CAAC,kBAAkB,CAoEpD,CAAC"}
|
|
@@ -1,45 +1,60 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useRef, useState } from 'react';
|
|
3
3
|
import { Button, DateTimeDisplay, Lightbox } from '@pega/cosmos-react-core';
|
|
4
|
-
import {
|
|
4
|
+
import { mockData, mockBadResources } from './Lightbox.mocks';
|
|
5
5
|
export default {
|
|
6
6
|
title: 'Core/Lightbox',
|
|
7
|
-
component: Lightbox
|
|
7
|
+
component: Lightbox,
|
|
8
|
+
parameters: {
|
|
9
|
+
layout: 'centered'
|
|
10
|
+
}
|
|
8
11
|
};
|
|
9
12
|
export const LightboxDemo = (args) => {
|
|
10
13
|
const demoButtonRef = useRef(null);
|
|
11
|
-
const [
|
|
14
|
+
const [open, setOpen] = useState(false);
|
|
15
|
+
const [items, setItems] = useState();
|
|
12
16
|
const onClick = () => {
|
|
13
|
-
|
|
17
|
+
setItems((args.error ? mockBadResources : mockData.slice(0, args.limit)).map(item => {
|
|
14
18
|
return {
|
|
15
|
-
|
|
16
|
-
name,
|
|
17
|
-
description,
|
|
18
|
-
src: media_url,
|
|
19
|
+
...item,
|
|
19
20
|
metadata: [
|
|
20
|
-
|
|
21
|
+
item.format,
|
|
22
|
+
'John smith',
|
|
21
23
|
_jsx(DateTimeDisplay, { value: new Date(), variant: 'date' })
|
|
22
24
|
]
|
|
23
25
|
};
|
|
24
26
|
}));
|
|
25
27
|
};
|
|
26
28
|
const onItemDownload = async (id) => {
|
|
27
|
-
const
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
const currentItem = items?.find(item => item.id === id);
|
|
30
|
+
if (!currentItem)
|
|
31
|
+
return;
|
|
32
|
+
if (currentItem.src) {
|
|
33
|
+
const objectURL = URL.createObjectURL(await (await fetch(currentItem.src)).blob());
|
|
34
|
+
const a = document.createElement('a');
|
|
35
|
+
a.href = objectURL;
|
|
36
|
+
a.download = currentItem.name ?? id;
|
|
37
|
+
document.body.appendChild(a);
|
|
38
|
+
a.click();
|
|
39
|
+
document.body.removeChild(a);
|
|
40
|
+
URL.revokeObjectURL(objectURL);
|
|
41
|
+
}
|
|
35
42
|
};
|
|
36
|
-
|
|
37
|
-
|
|
43
|
+
const onItemError = (id) => {
|
|
44
|
+
setItems(item => {
|
|
45
|
+
return item?.map(obj => (obj.id === id ? { ...obj, error: true } : obj));
|
|
46
|
+
});
|
|
47
|
+
};
|
|
48
|
+
return (_jsxs(_Fragment, { children: [_jsx(Button, { ref: demoButtonRef, onClick: () => {
|
|
49
|
+
setOpen(true);
|
|
50
|
+
onClick();
|
|
51
|
+
}, children: "Open Lightbox" }), open && (_jsx(Lightbox, { items: items ?? [], cycle: args.cycle || undefined, onAfterClose: () => {
|
|
52
|
+
setOpen(false);
|
|
38
53
|
demoButtonRef.current?.focus();
|
|
39
|
-
}, onItemDownload: onItemDownload }))] }));
|
|
54
|
+
}, onItemDownload: onItemDownload, onItemError: onItemError }))] }));
|
|
40
55
|
};
|
|
41
56
|
LightboxDemo.args = {
|
|
42
|
-
limit:
|
|
57
|
+
limit: 12,
|
|
43
58
|
cycle: false,
|
|
44
59
|
error: false
|
|
45
60
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Lightbox.stories.js","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,MAAM,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAG5E,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"Lightbox.stories.js","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useRef, useState } from 'react';\n\nimport { Button, DateTimeDisplay, Lightbox } from '@pega/cosmos-react-core';\nimport type { LightboxItem, LightboxProps } from '@pega/cosmos-react-core';\n\nimport { mockData, mockBadResources } from './Lightbox.mocks';\n\nexport default {\n title: 'Core/Lightbox',\n component: Lightbox,\n parameters: {\n layout: 'centered'\n }\n} as Meta;\n\ninterface LightboxStoryProps {\n limit?: number;\n cycle?: boolean;\n error?: boolean;\n}\n\nexport const LightboxDemo: StoryFn<LightboxStoryProps> = (args: LightboxStoryProps) => {\n const demoButtonRef = useRef<HTMLButtonElement>(null);\n const [open, setOpen] = useState<boolean>(false);\n const [items, setItems] = useState<LightboxProps['items']>();\n\n const onClick = () => {\n setItems(\n (args.error ? mockBadResources : mockData.slice(0, args.limit)).map(item => {\n return {\n ...item,\n metadata: [\n item.format,\n 'John smith',\n <DateTimeDisplay value={new Date()} variant='date' />\n ]\n };\n })\n );\n };\n\n const onItemDownload = async (id: LightboxItem['id']) => {\n const currentItem = items?.find(item => item.id === id);\n if (!currentItem) return;\n\n if (currentItem.src) {\n const objectURL = URL.createObjectURL(await (await fetch(currentItem.src)).blob());\n\n const a = document.createElement('a');\n a.href = objectURL;\n a.download = currentItem.name ?? id;\n document.body.appendChild(a);\n a.click();\n document.body.removeChild(a);\n URL.revokeObjectURL(objectURL);\n }\n };\n\n const onItemError = (id: LightboxItem['id']) => {\n setItems(item => {\n return item?.map(obj => (obj.id === id ? { ...obj, error: true } : obj));\n });\n };\n\n return (\n <>\n <Button\n ref={demoButtonRef}\n onClick={() => {\n setOpen(true);\n onClick();\n }}\n >\n Open Lightbox\n </Button>\n {open && (\n <Lightbox\n items={items ?? []}\n cycle={args.cycle || undefined}\n onAfterClose={() => {\n setOpen(false);\n demoButtonRef.current?.focus();\n }}\n onItemDownload={onItemDownload}\n onItemError={onItemError}\n />\n )}\n </>\n );\n};\n\nLightboxDemo.args = {\n limit: 12,\n cycle: false,\n error: false\n};\n\nLightboxDemo.argTypes = {\n limit: { control: { type: 'number' } },\n cycle: { control: { type: 'boolean' } },\n error: { control: { type: 'boolean' } }\n};\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Feed.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/Feed.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAYtD,OAAO,KAAK,EAEV,SAAS,EAIV,MAAM,2BAA2B,CAAC;;AAanC,wBAGU;AAEV,UAAU,aAAa;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IACvC,gBAAgB,CAAC,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,QAAQ,EAAE,OAAO,CAAC,aAAa,
|
|
1
|
+
{"version":3,"file":"Feed.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/Feed.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAYtD,OAAO,KAAK,EAEV,SAAS,EAIV,MAAM,2BAA2B,CAAC;;AAanC,wBAGU;AAEV,UAAU,aAAa;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IACvC,gBAAgB,CAAC,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC;CAClD;AAED,eAAO,MAAM,QAAQ,EAAE,OAAO,CAAC,aAAa,CA6S3C,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,OAE9B,CAAC"}
|
|
@@ -129,6 +129,7 @@ export const FeedDemo = ({ markdownMap, onMentionPreview }) => {
|
|
|
129
129
|
return {
|
|
130
130
|
id: image.thumbnail,
|
|
131
131
|
name: image.name,
|
|
132
|
+
format: 'jpeg',
|
|
132
133
|
description: '',
|
|
133
134
|
src: null
|
|
134
135
|
};
|
|
@@ -157,6 +158,7 @@ export const FeedDemo = ({ markdownMap, onMentionPreview }) => {
|
|
|
157
158
|
return {
|
|
158
159
|
id: image.thumbnail,
|
|
159
160
|
name: image.name,
|
|
161
|
+
format: 'jpeg',
|
|
160
162
|
description: image.name,
|
|
161
163
|
src: image.thumbnail,
|
|
162
164
|
metadata: [image.type, _jsx(DateTimeDisplay, { value: new Date(), variant: 'date' })],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Feed.stories.js","sourceRoot":"","sources":["../../../src/social/Feed/Feed.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useState, useRef, useCallback, useEffect } from 'react';\n\nimport { createUID, DateTimeDisplay, Lightbox, OneColumnPage } from '@pega/cosmos-react-core';\nimport type { LightboxItem, LightboxProps, MenuItemProps } from '@pega/cosmos-react-core';\nimport {\n AutopilotConfig,\n Feed,\n MentionButtonConfig,\n HashtagButtonConfig,\n AutopilotGlimpse\n} from '@pega/cosmos-react-social';\nimport type {\n AutopilotGlimpseProps,\n FeedProps,\n Filter,\n AttachedFiles,\n FeedPostProps\n} from '@pega/cosmos-react-social';\nimport { Glimpse } from '@pega/cosmos-react-work';\nimport type { GlimpseProps } from '@pega/cosmos-react-work';\n\nimport { loadingTimeoutMS } from '../../core/Progress/Progress.mocks';\nimport { AppShellDemo } from '../../core/AppShell/AppShell.stories';\n\nimport { FeedPostDemo } from './FeedPost.mocks';\nimport { FeedNewPostDemo } from './FeedNewPost.mocks';\nimport { caseMentions, feedPosts, userMentions } from './Feed.mocks';\nimport type { FeedPostDemoProps } from './Feed.mocks';\nimport { FeedReplyDemo } from './FeedReply.mocks';\n\nexport default {\n title: 'Social/Feed',\n component: Feed\n} as Meta;\n\ninterface FeedDemoProps {\n markdownMap?: FeedProps['markdownMap'];\n onMentionPreview?: FeedProps['onMentionPreview'];\n}\n\nexport const FeedDemo: StoryFn<FeedDemoProps> = ({\n markdownMap,\n onMentionPreview\n}: FeedDemoProps) => {\n const [extraPosts, setExtraPosts] = useState<FeedPostDemoProps[]>(() => feedPosts);\n const [postGenerated, setPostGenerated] = useState(false);\n const [searchResults, setSearchResults] = useState<MenuItemProps[]>([]);\n\n const [filters, setFilters] = useState<Filter[]>(\n Array.from({ length: 10 }, (_, index) => {\n return {\n id: `filter-${index + 1}`,\n label: `Filter ${index + 1}`\n };\n })\n );\n\n const toggleFilter = (filterId: string) => {\n const updatedFilters = [...filters];\n const filterToUpdate = updatedFilters.find(x => x.id === filterId);\n\n if (filterToUpdate) filterToUpdate.on = !filterToUpdate.on;\n\n setFilters(updatedFilters);\n };\n\n const onSearch = ({\n type,\n search,\n mentionType\n }: {\n type: 'mention' | 'tag';\n search: string;\n mentionType: string;\n }) => {\n if (type === 'mention') {\n const availableMentions = mentionType === 'case' ? caseMentions : userMentions;\n\n const mentions: MenuItemProps[] = availableMentions\n .filter(user => {\n const names = user.primary.toLowerCase().split(' ');\n const searchWords = search.toLowerCase().split(' ');\n return !!searchWords.every((word: string) =>\n names.find((name: string) => name.startsWith(word))\n );\n })\n .map(({ id, primary, secondary, visual, href }) => {\n return {\n id,\n primary,\n secondary:\n secondary !== undefined && !Array.isArray(secondary) ? [secondary] : secondary,\n visual,\n href\n };\n });\n setSearchResults(mentions);\n } else {\n setSearchResults(\n ['cosmos', 'hashtag', 'pega']\n .filter(tag => {\n return tag.toLowerCase().includes(search.toLowerCase());\n })\n .map(tag => ({ id: tag, primary: tag }))\n );\n }\n };\n\n const [loading, setLoading] = useState(false);\n let timeoutId: ReturnType<typeof setTimeout>;\n\n const generateNewPost = useCallback(() => {\n if (!loading && !postGenerated) {\n setLoading(true);\n timeoutId = setTimeout(() => {\n setLoading(false);\n setPostGenerated(true);\n setExtraPosts(posts => [\n ...posts,\n {\n id: createUID(),\n fullname: 'Feed Bot',\n icon: 'robot-solid',\n username: 'feed_bot',\n content: 'This post was loaded after the Feed was scrolled to the bottom!',\n attachments: [],\n replies: []\n }\n ]);\n }, 1000);\n }\n }, [loading, postGenerated]);\n\n useEffect(() => {\n return () => clearTimeout(timeoutId);\n }, []);\n\n const onAutopilotClick = ({\n target,\n onDismiss\n }: Partial<Pick<AutopilotGlimpseProps, 'target' | 'onDismiss'>>) => {\n if (target && onDismiss) {\n return <AutopilotGlimpse target={target} onDismiss={onDismiss} placement='right' />;\n }\n };\n\n const onMentionClick = ({\n id,\n type,\n target,\n closeGlimpse\n }: { id: string; type: string; closeGlimpse?: () => void } & Partial<\n Pick<GlimpseProps, 'target'>\n >) => {\n if (type === 'user') {\n const user = userMentions.find(mention => mention.id === id);\n if (user && target && closeGlimpse) {\n const { primary, secondary, visual, ...restUser } = user;\n\n return (\n <Glimpse\n {...restUser}\n heading={{\n primary,\n secondary: Array.isArray(secondary) ? secondary.join(', ') : secondary,\n visual\n }}\n target={target}\n onDismiss={() => {\n closeGlimpse();\n }}\n placement='right'\n />\n );\n }\n }\n };\n\n const [showLightbox, setShowLightbox] = useState(false);\n const [lightboxImages, setLightboxImages] = useState<LightboxProps['items']>([]);\n const defaultLBIndex = useRef(0);\n const mockAPIImages = useRef<(LightboxItem & { resolved: boolean })[]>([]);\n\n const getLightboxImage = async (id: string) => {\n await new Promise(resolve => {\n setTimeout(() => resolve(0), loadingTimeoutMS);\n });\n const mockImage = mockAPIImages.current.find(image => image.id === id);\n if (mockImage) {\n mockImage.resolved = true;\n }\n return mockImage;\n };\n\n const renderLightbox = (imageAttachments: AttachedFiles[], name: string) => {\n const idx = imageAttachments.findIndex(image => image.name === name);\n defaultLBIndex.current = idx > -1 ? idx : 0;\n\n const images = imageAttachments.map<LightboxItem>(image => {\n const mockImage = mockAPIImages.current.find(mockImg => mockImg.name === image.name);\n if (mockImage?.resolved) return mockImage;\n\n return {\n id: image.thumbnail as string,\n name: image.name,\n description: '',\n src: null\n };\n });\n\n setLightboxImages(images);\n setShowLightbox(true);\n };\n\n const deletePost = (index: number) => {\n setExtraPosts(posts => {\n const postsCopy = [...posts];\n postsCopy.splice(index, 1);\n return [...postsCopy];\n });\n };\n\n return (\n <>\n <Feed\n title='Pulse'\n userInfo={{ username: 'demo_user', fullname: 'Demo User', userStatus: 'active' }}\n searchTypes={['user', 'case', 'autopilot']}\n onDecoratorSearch={onSearch}\n searchResults={searchResults}\n autopilotInfo={{\n id: 'autopilot',\n label: 'Autopilot',\n meta: 'Pega GenAI™ virtual assistant',\n description: `Mention Autopilot to effortlessly initiate tasks and prompt interactions.\\n\\nAsk about performance metrics or make a variety of requests using everyday language, and receive a swift response within seconds.`\n }}\n onAutopilotClick={onAutopilotClick}\n onMentionClick={onMentionClick}\n onMentionPreview={onMentionPreview}\n markdownMap={markdownMap}\n interactionRenderers={[MentionButtonConfig, HashtagButtonConfig, AutopilotConfig]}\n filters={filters}\n onFilterChange={toggleFilter}\n loadingPosts={loading}\n onLoadMore={generateNewPost}\n newPostRegion={\n <FeedNewPostDemo\n onSubmit={postEvent => {\n const { value, attachments, recipients, clear } = postEvent;\n\n const images = attachments.filter(\n attachment => attachment.type.includes('image') && attachment.thumbnail\n );\n\n mockAPIImages.current = [\n ...mockAPIImages.current,\n ...images.map(image => {\n return {\n id: image.thumbnail as string,\n name: image.name,\n description: image.name,\n src: image.thumbnail as string,\n metadata: [image.type, <DateTimeDisplay value={new Date()} variant='date' />],\n resolved: false\n };\n })\n ];\n\n attachments.forEach(file => {\n delete file.onDelete;\n file.onPreview = file.type.includes('image')\n ? () => renderLightbox(images, file.name)\n : undefined;\n file.onDownload = () => {};\n });\n\n if (value || attachments.length > 0) {\n const replies: FeedPostProps['replies'] = [];\n\n const triggersAutopilot = value.match(AutopilotConfig.regexPattern);\n if (triggersAutopilot && triggersAutopilot.length && triggersAutopilot.length > 0) {\n replies.push(\n <FeedReplyDemo\n key={`autopilot-${createUID()}`}\n fullname='Autopilot'\n username='autopilot'\n content='This is just an automatic reply. In order to truly experience the power of the Pega GenAI™ virtual assistant, make sure to interact with Autopilot in a production environment!'\n postTimestamp={new Date()}\n />\n );\n }\n\n setExtraPosts(posts => [\n {\n id: createUID(),\n fullname: 'Demo User',\n username: 'demo_user',\n userStatus: 'active',\n content: value,\n attachments,\n recipients,\n postType: recipients?.length ? 'private' : 'public',\n replies,\n postTimestamp: new Date()\n },\n ...posts\n ]);\n clear();\n }\n }}\n />\n }\n posts={extraPosts.map((post, i) => {\n return <FeedPostDemo {...post} key={post.id} onDelete={() => deletePost(i)} />;\n })}\n />\n {showLightbox && (\n <Lightbox\n items={lightboxImages}\n defaultIndex={defaultLBIndex.current}\n cycle\n onNavigate={async (id, index) => {\n if (!lightboxImages[index].src) {\n const updatedImages = [...lightboxImages];\n const requestedImage = await getLightboxImage(id);\n if (requestedImage) {\n updatedImages[index] = requestedImage;\n setLightboxImages(updatedImages);\n }\n }\n }}\n onAfterClose={() => {\n setShowLightbox(false);\n setLightboxImages([]);\n }}\n />\n )}\n </>\n );\n};\n\nexport const FeedWithAppShell: StoryFn = () => {\n return <AppShellDemo appHeader main={<OneColumnPage title='Welcome' a={<FeedDemo />} />} />;\n};\n\nFeedWithAppShell.parameters = {\n layout: 'fullscreen'\n};\n"]}
|
|
1
|
+
{"version":3,"file":"Feed.stories.js","sourceRoot":"","sources":["../../../src/social/Feed/Feed.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useState, useRef, useCallback, useEffect } from 'react';\n\nimport { createUID, DateTimeDisplay, Lightbox, OneColumnPage } from '@pega/cosmos-react-core';\nimport type { LightboxItem, LightboxProps, MenuItemProps } from '@pega/cosmos-react-core';\nimport {\n AutopilotConfig,\n Feed,\n MentionButtonConfig,\n HashtagButtonConfig,\n AutopilotGlimpse\n} from '@pega/cosmos-react-social';\nimport type {\n AutopilotGlimpseProps,\n FeedProps,\n Filter,\n AttachedFiles,\n FeedPostProps\n} from '@pega/cosmos-react-social';\nimport { Glimpse } from '@pega/cosmos-react-work';\nimport type { GlimpseProps } from '@pega/cosmos-react-work';\n\nimport { loadingTimeoutMS } from '../../core/Progress/Progress.mocks';\nimport { AppShellDemo } from '../../core/AppShell/AppShell.stories';\n\nimport { FeedPostDemo } from './FeedPost.mocks';\nimport { FeedNewPostDemo } from './FeedNewPost.mocks';\nimport { caseMentions, feedPosts, userMentions } from './Feed.mocks';\nimport type { FeedPostDemoProps } from './Feed.mocks';\nimport { FeedReplyDemo } from './FeedReply.mocks';\n\nexport default {\n title: 'Social/Feed',\n component: Feed\n} as Meta;\n\ninterface FeedDemoProps {\n markdownMap?: FeedProps['markdownMap'];\n onMentionPreview?: FeedProps['onMentionPreview'];\n}\n\nexport const FeedDemo: StoryFn<FeedDemoProps> = ({\n markdownMap,\n onMentionPreview\n}: FeedDemoProps) => {\n const [extraPosts, setExtraPosts] = useState<FeedPostDemoProps[]>(() => feedPosts);\n const [postGenerated, setPostGenerated] = useState(false);\n const [searchResults, setSearchResults] = useState<MenuItemProps[]>([]);\n\n const [filters, setFilters] = useState<Filter[]>(\n Array.from({ length: 10 }, (_, index) => {\n return {\n id: `filter-${index + 1}`,\n label: `Filter ${index + 1}`\n };\n })\n );\n\n const toggleFilter = (filterId: string) => {\n const updatedFilters = [...filters];\n const filterToUpdate = updatedFilters.find(x => x.id === filterId);\n\n if (filterToUpdate) filterToUpdate.on = !filterToUpdate.on;\n\n setFilters(updatedFilters);\n };\n\n const onSearch = ({\n type,\n search,\n mentionType\n }: {\n type: 'mention' | 'tag';\n search: string;\n mentionType: string;\n }) => {\n if (type === 'mention') {\n const availableMentions = mentionType === 'case' ? caseMentions : userMentions;\n\n const mentions: MenuItemProps[] = availableMentions\n .filter(user => {\n const names = user.primary.toLowerCase().split(' ');\n const searchWords = search.toLowerCase().split(' ');\n return !!searchWords.every((word: string) =>\n names.find((name: string) => name.startsWith(word))\n );\n })\n .map(({ id, primary, secondary, visual, href }) => {\n return {\n id,\n primary,\n secondary:\n secondary !== undefined && !Array.isArray(secondary) ? [secondary] : secondary,\n visual,\n href\n };\n });\n setSearchResults(mentions);\n } else {\n setSearchResults(\n ['cosmos', 'hashtag', 'pega']\n .filter(tag => {\n return tag.toLowerCase().includes(search.toLowerCase());\n })\n .map(tag => ({ id: tag, primary: tag }))\n );\n }\n };\n\n const [loading, setLoading] = useState(false);\n let timeoutId: ReturnType<typeof setTimeout>;\n\n const generateNewPost = useCallback(() => {\n if (!loading && !postGenerated) {\n setLoading(true);\n timeoutId = setTimeout(() => {\n setLoading(false);\n setPostGenerated(true);\n setExtraPosts(posts => [\n ...posts,\n {\n id: createUID(),\n fullname: 'Feed Bot',\n icon: 'robot-solid',\n username: 'feed_bot',\n content: 'This post was loaded after the Feed was scrolled to the bottom!',\n attachments: [],\n replies: []\n }\n ]);\n }, 1000);\n }\n }, [loading, postGenerated]);\n\n useEffect(() => {\n return () => clearTimeout(timeoutId);\n }, []);\n\n const onAutopilotClick = ({\n target,\n onDismiss\n }: Partial<Pick<AutopilotGlimpseProps, 'target' | 'onDismiss'>>) => {\n if (target && onDismiss) {\n return <AutopilotGlimpse target={target} onDismiss={onDismiss} placement='right' />;\n }\n };\n\n const onMentionClick = ({\n id,\n type,\n target,\n closeGlimpse\n }: { id: string; type: string; closeGlimpse?: () => void } & Partial<\n Pick<GlimpseProps, 'target'>\n >) => {\n if (type === 'user') {\n const user = userMentions.find(mention => mention.id === id);\n if (user && target && closeGlimpse) {\n const { primary, secondary, visual, ...restUser } = user;\n\n return (\n <Glimpse\n {...restUser}\n heading={{\n primary,\n secondary: Array.isArray(secondary) ? secondary.join(', ') : secondary,\n visual\n }}\n target={target}\n onDismiss={() => {\n closeGlimpse();\n }}\n placement='right'\n />\n );\n }\n }\n };\n\n const [showLightbox, setShowLightbox] = useState(false);\n const [lightboxImages, setLightboxImages] = useState<LightboxProps['items']>([]);\n const defaultLBIndex = useRef(0);\n const mockAPIImages = useRef<(LightboxItem & { resolved: boolean })[]>([]);\n\n const getLightboxImage = async (id: string) => {\n await new Promise(resolve => {\n setTimeout(() => resolve(0), loadingTimeoutMS);\n });\n const mockImage = mockAPIImages.current.find(image => image.id === id);\n if (mockImage) {\n mockImage.resolved = true;\n }\n return mockImage;\n };\n\n const renderLightbox = (imageAttachments: AttachedFiles[], name: string) => {\n const idx = imageAttachments.findIndex(image => image.name === name);\n defaultLBIndex.current = idx > -1 ? idx : 0;\n\n const images = imageAttachments.map<LightboxItem>(image => {\n const mockImage = mockAPIImages.current.find(mockImg => mockImg.name === image.name);\n if (mockImage?.resolved) return mockImage;\n\n return {\n id: image.thumbnail as string,\n name: image.name,\n format: 'jpeg',\n description: '',\n src: null\n };\n });\n\n setLightboxImages(images);\n setShowLightbox(true);\n };\n\n const deletePost = (index: number) => {\n setExtraPosts(posts => {\n const postsCopy = [...posts];\n postsCopy.splice(index, 1);\n return [...postsCopy];\n });\n };\n\n return (\n <>\n <Feed\n title='Pulse'\n userInfo={{ username: 'demo_user', fullname: 'Demo User', userStatus: 'active' }}\n searchTypes={['user', 'case', 'autopilot']}\n onDecoratorSearch={onSearch}\n searchResults={searchResults}\n autopilotInfo={{\n id: 'autopilot',\n label: 'Autopilot',\n meta: 'Pega GenAI™ virtual assistant',\n description: `Mention Autopilot to effortlessly initiate tasks and prompt interactions.\\n\\nAsk about performance metrics or make a variety of requests using everyday language, and receive a swift response within seconds.`\n }}\n onAutopilotClick={onAutopilotClick}\n onMentionClick={onMentionClick}\n onMentionPreview={onMentionPreview}\n markdownMap={markdownMap}\n interactionRenderers={[MentionButtonConfig, HashtagButtonConfig, AutopilotConfig]}\n filters={filters}\n onFilterChange={toggleFilter}\n loadingPosts={loading}\n onLoadMore={generateNewPost}\n newPostRegion={\n <FeedNewPostDemo\n onSubmit={postEvent => {\n const { value, attachments, recipients, clear } = postEvent;\n\n const images = attachments.filter(\n attachment => attachment.type.includes('image') && attachment.thumbnail\n );\n\n mockAPIImages.current = [\n ...mockAPIImages.current,\n ...images.map(image => {\n return {\n id: image.thumbnail as string,\n name: image.name,\n format: 'jpeg',\n description: image.name,\n src: image.thumbnail as string,\n metadata: [image.type, <DateTimeDisplay value={new Date()} variant='date' />],\n resolved: false\n };\n })\n ];\n\n attachments.forEach(file => {\n delete file.onDelete;\n file.onPreview = file.type.includes('image')\n ? () => renderLightbox(images, file.name)\n : undefined;\n file.onDownload = () => {};\n });\n\n if (value || attachments.length > 0) {\n const replies: FeedPostProps['replies'] = [];\n\n const triggersAutopilot = value.match(AutopilotConfig.regexPattern);\n if (triggersAutopilot && triggersAutopilot.length && triggersAutopilot.length > 0) {\n replies.push(\n <FeedReplyDemo\n key={`autopilot-${createUID()}`}\n fullname='Autopilot'\n username='autopilot'\n content='This is just an automatic reply. In order to truly experience the power of the Pega GenAI™ virtual assistant, make sure to interact with Autopilot in a production environment!'\n postTimestamp={new Date()}\n />\n );\n }\n\n setExtraPosts(posts => [\n {\n id: createUID(),\n fullname: 'Demo User',\n username: 'demo_user',\n userStatus: 'active',\n content: value,\n attachments,\n recipients,\n postType: recipients?.length ? 'private' : 'public',\n replies,\n postTimestamp: new Date()\n },\n ...posts\n ]);\n clear();\n }\n }}\n />\n }\n posts={extraPosts.map((post, i) => {\n return <FeedPostDemo {...post} key={post.id} onDelete={() => deletePost(i)} />;\n })}\n />\n {showLightbox && (\n <Lightbox\n items={lightboxImages}\n defaultIndex={defaultLBIndex.current}\n cycle\n onNavigate={async (id, index) => {\n if (!lightboxImages[index].src) {\n const updatedImages = [...lightboxImages];\n const requestedImage = await getLightboxImage(id);\n if (requestedImage) {\n updatedImages[index] = requestedImage;\n setLightboxImages(updatedImages);\n }\n }\n }}\n onAfterClose={() => {\n setShowLightbox(false);\n setLightboxImages([]);\n }}\n />\n )}\n </>\n );\n};\n\nexport const FeedWithAppShell: StoryFn = () => {\n return <AppShellDemo appHeader main={<OneColumnPage title='Welcome' a={<FeedDemo />} />} />;\n};\n\nFeedWithAppShell.parameters = {\n layout: 'fullscreen'\n};\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-demos",
|
|
3
|
-
"version": "5.0.0-dev.
|
|
3
|
+
"version": "5.0.0-dev.15.1",
|
|
4
4
|
"repository": {
|
|
5
5
|
"type": "git",
|
|
6
6
|
"url": "git+https://github.com/pegasystems/cosmos-react.git",
|
|
@@ -19,12 +19,12 @@
|
|
|
19
19
|
"build": "tsc -b tsconfig.build.json && tsc -b tsconfig.build-preserve.json"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@pega/cosmos-react-condition-builder": "5.0.0-dev.
|
|
23
|
-
"@pega/cosmos-react-core": "5.0.0-dev.
|
|
24
|
-
"@pega/cosmos-react-dnd": "5.0.0-dev.
|
|
25
|
-
"@pega/cosmos-react-rte": "5.0.0-dev.
|
|
26
|
-
"@pega/cosmos-react-social": "5.0.0-dev.
|
|
27
|
-
"@pega/cosmos-react-work": "5.0.0-dev.
|
|
22
|
+
"@pega/cosmos-react-condition-builder": "5.0.0-dev.15.1",
|
|
23
|
+
"@pega/cosmos-react-core": "5.0.0-dev.15.1",
|
|
24
|
+
"@pega/cosmos-react-dnd": "5.0.0-dev.15.1",
|
|
25
|
+
"@pega/cosmos-react-rte": "5.0.0-dev.15.1",
|
|
26
|
+
"@pega/cosmos-react-social": "5.0.0-dev.15.1",
|
|
27
|
+
"@pega/cosmos-react-work": "5.0.0-dev.15.1",
|
|
28
28
|
"@storybook/addon-actions": "~7.5.3",
|
|
29
29
|
"@storybook/react": "~7.5.3",
|
|
30
30
|
"@types/dompurify": "^3.0.5",
|