@pega/cosmos-react-demos 5.0.0-dev.9.2 → 6.0.0

package/lib/core/Lightbox/Lightbox.mocks.js

@@ -1,59 +1,99 @@
-export const mockAPIImageResources = [
+// cspell:words wordprocessingml
+export const mockData = [
     {
         id: 'photo-1497752531616-c3afd9760a11',
         name: 'Image 1',
         description: 'Descriptive text about Image 1',
-        mime_type: 'image/avif',
-        media_url: 'https://images.unsplash.com/photo-1497752531616-c3afd9760a11?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'
+        format: 'jpeg',
+        src: 'https://images.unsplash.com/photo-1497752531616-c3afd9760a11?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'
+    },
+    {
+        id: 'pdf-1',
+        name: 'Sample-PDF 1',
+        description: 'Descriptive text about Dictionary of old Icelandic',
+        src: 'https://css4.pub/2015/icelandic/dictionary.pdf',
+        format: 'pdf'
     },
     {
         id: 'photo-1470093851219-69951fcbb533',
         name: 'Image 2',
         description: 'Descriptive text about Image 2',
-        mime_type: 'image/avif',
-        media_url: 'https://images.unsplash.com/photo-1470093851219-69951fcbb533?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'
+        format: 'jpeg',
+        src: 'https://images.unsplash.com/photo-1470093851219-69951fcbb533?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2100&q=80'
     },
     {
         id: 'photo-1447684808650-354ae64db5b8',
         name: 'Image 3',
         description: 'Descriptive text about Image 3',
-        mime_type: 'image/avif',
-        media_url: 'https://images.unsplash.com/photo-1447684808650-354ae64db5b8?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2094&q=80'
+        format: 'jpeg',
+        src: 'https://images.unsplash.com/photo-1447684808650-354ae64db5b8?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2094&q=80'
     },
     {
         id: 'photo-1425082661705-1834bfd09dca',
         name: 'Image 4',
         description: 'Descriptive text about Image 4',
-        mime_type: 'image/avif',
-        media_url: 'https://images.unsplash.com/photo-1425082661705-1834bfd09dca?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2110&q=80'
+        format: 'jpeg',
+        src: 'https://images.unsplash.com/photo-1425082661705-1834bfd09dca?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2110&q=80'
     },
     {
         id: 'photo-1494256997604-768d1f608cac',
         name: 'Image 5',
         description: 'Descriptive text about Image 5',
-        mime_type: 'image/avif',
-        media_url: 'https://images.unsplash.com/photo-1494256997604-768d1f608cac?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2301&q=80'
+        format: 'jpeg',
+        src: 'https://images.unsplash.com/photo-1494256997604-768d1f608cac?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2301&q=80'
     },
     {
         id: 'photo-1500694216671-a4e54fc4b513',
         name: 'Image 6',
         description: 'Descriptive text about Image 6',
-        mime_type: 'image/avif',
-        media_url: 'https://images.unsplash.com/photo-1500694216671-a4e54fc4b513?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2092&q=80'
+        format: 'jpeg',
+        src: 'https://images.unsplash.com/photo-1500694216671-a4e54fc4b513?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2092&q=80'
+    },
+    {
+        id: 'doc1',
+        name: 'Pega.docx',
+        description: 'Descriptive text about Pega document',
+        format: 'docx',
+        src: null
     },
     {
-        id: 'photo-1638292597251-6fe6b2ba50f9',
-        name: 'Image 7',
+        id: 'ppt2',
+        name: 'Pega.odp',
+        description: 'Descriptive text about Presentation file',
+        format: 'odp',
+        src: null
+    },
+    {
+        id: 'attachment_link',
+        name: 'Link file',
         description: 'Descriptive text about Image 7',
-        mime_type: 'image/avif',
-        media_url: 'https://images.unsplash.com/photo-1638292597251-6fe6b2ba50f9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1287&q=80'
+        format: 'url',
+        src: 'https://images.unsplash.com/photo-1638292597251-6fe6b2ba50f9?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1287&q=80'
+    },
+    {
+        id: 'generic',
+        name: 'Pega file',
+        description: 'Descriptive text about file',
+        format: '3ds',
+        src: null
+    },
+    {
+        id: 'error',
+        name: 'Pega file',
+        description: 'Error showing content',
+        format: 'jpeg',
+        // invalid url
+        src: 'https://images.unsplash.com/photo'
+    }
+];
+export const mockBadResources = [
+    {
+        id: 'image-error',
+        name: 'Some image',
+        description: 'Descriptive text about Some image',
+        src: '',
+        format: undefined,
+        error: true
     }
 ];
-export const mockBadImageResource = {
-    id: 'error',
-    name: 'Some image',
-    description: 'Descriptive text about Some image',
-    mime_type: 'image/avif',
-    media_url: ''
-};
 //# sourceMappingURL=Lightbox.mocks.js.map

package/lib/core/Lightbox/Lightbox.mocks.js.map

@@ -1 +1 @@
-{"version":3,"file":"Lightbox.mocks.js","sourceRoot":"","sources":["../../../src/core/Lightbox/Lightbox.mocks.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,qBAAqB,GAAG;IACnC;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,SAAS,EAAE,YAAY;QACvB,SAAS,EACP,wIAAwI;KAC3I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,SAAS,EAAE,YAAY;QACvB,SAAS,EACP,wIAAwI;KAC3I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,SAAS,EAAE,YAAY;QACvB,SAAS,EACP,wIAAwI;KAC3I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,SAAS,EAAE,YAAY;QACvB,SAAS,EACP,wIAAwI;KAC3I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,SAAS,EAAE,YAAY;QACvB,SAAS,EACP,wIAAwI;KAC3I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,SAAS,EAAE,YAAY;QACvB,SAAS,EACP,wIAAwI;KAC3I;IACD;QACE,EAAE,EAAE,kCAAkC;QACtC,IAAI,EAAE,SAAS;QACf,WAAW,EAAE,gCAAgC;QAC7C,SAAS,EAAE,YAAY;QACvB,SAAS,EACP,gKAAgK;KACnK;CACF,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG;IAClC,EAAE,EAAE,OAAO;IACX,IAAI,EAAE,YAAY;IAClB,WAAW,EAAE,mCAAmC;IAChD,SAAS,EAAE,YAAY;IACvB,SAAS,EAAE,EAAE;CACd,CAAC","sourcesContent":["export const mockAPIImageResources = [\n  {\n    id: 'photo-1497752531616-c3afd9760a11',\n    name: 'Image 1',\n    description: 'Descriptive text about Image 1',\n    mime_type: 'image/avif',\n    media_url:\n      '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: 'photo-1470093851219-69951fcbb533',\n    name: 'Image 2',\n    description: 'Descriptive text about Image 2',\n    mime_type: 'image/avif',\n    media_url:\n      '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    mime_type: 'image/avif',\n    media_url:\n      '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    mime_type: 'image/avif',\n    media_url:\n      '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    mime_type: 'image/avif',\n    media_url:\n      '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    mime_type: 'image/avif',\n    media_url:\n      '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: 'photo-1638292597251-6fe6b2ba50f9',\n    name: 'Image 7',\n    description: 'Descriptive text about Image 7',\n    mime_type: 'image/avif',\n    media_url:\n      '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\nexport const mockBadImageResource = {\n  id: 'error',\n  name: 'Some image',\n  description: 'Descriptive text about Some image',\n  mime_type: 'image/avif',\n  media_url: ''\n};\n"]}
+{"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"]}

package/lib/core/Lightbox/Lightbox.stories.d.ts.map

@@ -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,wBAGU;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,CAqDpD,CAAC"}
+{"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"}

package/lib/core/Lightbox/Lightbox.stories.js

@@ -1,45 +1,60 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useRef, useState } from 'react';
 import { Button, DateTimeDisplay, Lightbox } from '@pega/cosmos-react-core';
-import { mockAPIImageResources, mockBadImageResource } from './Lightbox.mocks';
+import { mockData, mockBadResources } from './Lightbox.mocks';
 export default {
     title: 'Core/Lightbox',
-    component: Lightbox
+    component: Lightbox,
+    parameters: {
+        layout: 'centered'
+    }
 };
 export const LightboxDemo = (args) => {
     const demoButtonRef = useRef(null);
-    const [images, setImages] = useState(null);
+    const [open, setOpen] = useState(false);
+    const [items, setItems] = useState();
     const onClick = () => {
-        setImages((args.error ? [mockBadImageResource] : mockAPIImageResources.slice(0, args.limit)).map(({ id, name, description, mime_type, media_url }) => {
+        setItems((args.error ? mockBadResources : mockData.slice(0, args.limit)).map(item => {
             return {
-                id,
-                name,
-                description,
-                src: media_url,
+                ...item,
                 metadata: [
-                    mime_type.split('/').pop(),
+                    item.format,
+                    'John smith',
                     _jsx(DateTimeDisplay, { value: new Date(), variant: 'date' })
                 ]
             };
         }));
     };
     const onItemDownload = async (id) => {
-        const a = document.createElement('a');
-        a.href = await fetch(id)
-            .then(response => response.blob())
-            .then(blob => URL.createObjectURL(blob));
-        a.download = images?.find(image => image.id === id)?.name ?? id;
-        document.body.appendChild(a);
-        a.click();
-        document.body.removeChild(a);
+        const currentItem = items?.find(item => item.id === id);
+        if (!currentItem)
+            return;
+        if (currentItem.src) {
+            const objectURL = URL.createObjectURL(await (await fetch(currentItem.src)).blob());
+            const a = document.createElement('a');
+            a.href = objectURL;
+            a.download = currentItem.name ?? id;
+            document.body.appendChild(a);
+            a.click();
+            document.body.removeChild(a);
+            URL.revokeObjectURL(objectURL);
+        }
     };
-    return (_jsxs(_Fragment, { children: [_jsx(Button, { ref: demoButtonRef, onClick: onClick, children: "Open Lightbox" }), images && (_jsx(Lightbox, { items: images, cycle: args.cycle || undefined, onAfterClose: () => {
-                    setImages(null);
+    const onItemError = (id) => {
+        setItems(item => {
+            return item?.map(obj => (obj.id === id ? { ...obj, error: true } : obj));
+        });
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { ref: demoButtonRef, onClick: () => {
+                    setOpen(true);
+                    onClick();
+                }, children: "Open Lightbox" }), open && (_jsx(Lightbox, { items: items ?? [], cycle: args.cycle || undefined, onAfterClose: () => {
+                    setOpen(false);
                     demoButtonRef.current?.focus();
-                }, onItemDownload: onItemDownload }))] }));
+                }, onItemDownload: onItemDownload, onItemError: onItemError }))] }));
 };
 LightboxDemo.args = {
-    limit: 7,
+    limit: 12,
     cycle: false,
     error: false
 };

package/lib/core/Lightbox/Lightbox.stories.js.map

@@ -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,qBAAqB,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAE/E,eAAe;IACb,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,QAAQ;CACZ,CAAC;AAQV,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,IAAwB,EAAE,EAAE;IACpF,MAAM,aAAa,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IACtD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAgC,IAAI,CAAC,CAAC;IAE1E,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,SAAS,CACP,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC,qBAAqB,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CACpF,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,WAAW,EAAE,SAAS,EAAE,SAAS,EAAE,EAAE,EAAE;YAClD,OAAO;gBACL,EAAE;gBACF,IAAI;gBACJ,WAAW;gBACX,GAAG,EAAE,SAAS;gBACd,QAAQ,EAAE;oBACR,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE;oBAC1B,KAAC,eAAe,IAAC,KAAK,EAAE,IAAI,IAAI,EAAE,EAAE,OAAO,EAAC,MAAM,GAAG;iBACtD;aACF,CAAC;QACJ,CAAC,CACF,CACF,CAAC;IACJ,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,KAAK,EAAE,EAAsB,EAAE,EAAE;QACtD,MAAM,CAAC,GAAG,QAAQ,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC;QACtC,CAAC,CAAC,IAAI,GAAG,MAAM,KAAK,CAAC,EAAE,CAAC;aACrB,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;aACjC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC,CAAC;QAE3C,CAAC,CAAC,QAAQ,GAAG,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,IAAI,EAAE,CAAC;QAChE,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;QAC7B,CAAC,CAAC,KAAK,EAAE,CAAC;QACV,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,OAAO,CACL,8BACE,KAAC,MAAM,IAAC,GAAG,EAAE,aAAa,EAAE,OAAO,EAAE,OAAO,8BAEnC,EACR,MAAM,IAAI,CACT,KAAC,QAAQ,IACP,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,SAAS,EAC9B,YAAY,EAAE,GAAG,EAAE;oBACjB,SAAS,CAAC,IAAI,CAAC,CAAC;oBAChB,aAAa,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;gBACjC,CAAC,EACD,cAAc,EAAE,cAAc,GAC9B,CACH,IACA,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,YAAY,CAAC,IAAI,GAAG;IAClB,KAAK,EAAE,CAAC;IACR,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 { mockAPIImageResources, mockBadImageResource } from './Lightbox.mocks';\n\nexport default {\n  title: 'Core/Lightbox',\n  component: Lightbox\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 [images, setImages] = useState<LightboxProps['items'] | null>(null);\n\n  const onClick = () => {\n    setImages(\n      (args.error ? [mockBadImageResource] : mockAPIImageResources.slice(0, args.limit)).map(\n        ({ id, name, description, mime_type, media_url }) => {\n          return {\n            id,\n            name,\n            description,\n            src: media_url,\n            metadata: [\n              mime_type.split('/').pop(),\n              <DateTimeDisplay value={new Date()} variant='date' />\n            ]\n          };\n        }\n      )\n    );\n  };\n\n  const onItemDownload = async (id: LightboxItem['id']) => {\n    const a = document.createElement('a');\n    a.href = await fetch(id)\n      .then(response => response.blob())\n      .then(blob => URL.createObjectURL(blob));\n\n    a.download = images?.find(image => image.id === id)?.name ?? id;\n    document.body.appendChild(a);\n    a.click();\n    document.body.removeChild(a);\n  };\n\n  return (\n    <>\n      <Button ref={demoButtonRef} onClick={onClick}>\n        Open Lightbox\n      </Button>\n      {images && (\n        <Lightbox\n          items={images}\n          cycle={args.cycle || undefined}\n          onAfterClose={() => {\n            setImages(null);\n            demoButtonRef.current?.focus();\n          }}\n          onItemDownload={onItemDownload}\n        />\n      )}\n    </>\n  );\n};\n\nLightboxDemo.args = {\n  limit: 7,\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"]}
+{"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"]}

package/lib/core/ListToolbar/ListToolbar.mocks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListToolbar.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGtC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sEAAsE,CAAC;AAM9G,eAAO,MAAM,OAAO,EAAE,MAAM,EAIzB,CAAC;AAEJ,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,OAAO,CAIhD,CAAC;AAEF,eAAO,MAAM,0BAA0B,2CAA4C,CAAC;AAwDpF,eAAO,MAAM,cAAc,mBAE1B,CAAC;AAEF,eAAO,MAAM,aAAa,mBAEzB,CAAC"}
+{"version":3,"file":"ListToolbar.mocks.d.ts","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGtC,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AACtD,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sEAAsE,CAAC;AAM9G,eAAO,MAAM,OAAO,EAAE,MAAM,EAIzB,CAAC;AAEJ,eAAO,MAAM,SAAS,EAAE,iBAAiB,CAAC,OAAO,CAIhD,CAAC;AAEF,eAAO,MAAM,0BAA0B,2CAA4C,CAAC;AA8CpF,eAAO,MAAM,cAAc,mBAE1B,CAAC;AAEF,eAAO,MAAM,aAAa,mBAEzB,CAAC"}

package/lib/core/ListToolbar/ListToolbar.mocks.js

@@ -16,19 +16,13 @@ export const mockViews = [
 ];
 export const StagedStateDispatchContext = createContext(() => { });
 const GroupByMock = () => {
-    return (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Flex, { container: { direction: 'column', gap: 1 }, children: _jsxs(Flex, { container: {
-                        justify: 'between',
-                        alignItems: 'center',
-                        direction: 'row',
-                        wrap: 'nowrap',
-                        itemGap: 0.5
-                    }, children: [_jsxs(Flex, { container: {
-                                justify: 'start',
-                                alignItems: 'center',
-                                direction: 'row',
-                                wrap: 'nowrap',
-                                itemGap: 0.5
-                            }, item: { grow: 1 }, children: [_jsx(Icon, { name: 'drag' }), _jsx(Flex, { item: { grow: 1, basis: '50%' }, children: _jsx(FieldSelector, { fields: [], value: '', onChange: () => { } }) }), _jsxs(Flex, { as: Select, item: { basis: '50%' }, children: [_jsx(Option, { children: " " }), _jsx(Option, { children: "Item A" })] })] }), _jsx(Button, { "aria-label": 'Delete group', icon: true, variant: 'simple', children: _jsx(Icon, { name: 'trash' }) })] }) }), _jsx(Button, { variant: 'link', "aria-label": 'Add a group', children: _jsxs(Flex, { container: {
+    return (_jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsxs(Flex, { container: {
+                    justify: 'start',
+                    alignItems: 'center',
+                    direction: 'row',
+                    wrap: 'nowrap',
+                    itemGap: 0.5
+                }, item: { grow: 1 }, children: [_jsx(Icon, { name: 'drag' }), _jsx(Flex, { item: { basis: '50%' }, children: _jsx(FieldSelector, { fields: [], value: '', onChange: () => { }, "aria-label": 'Field' }) }), _jsx(Flex, { item: { basis: '50%' }, children: _jsxs(Select, { label: 'Select', "aria-label": 'Select', children: [_jsx(Option, { children: " " }), _jsx(Option, { children: "Item A" })] }) }), _jsx(Button, { "aria-label": 'Delete group', icon: true, variant: 'simple', children: _jsx(Icon, { name: 'trash' }) })] }), _jsx(Button, { variant: 'link', "aria-label": 'Add a group', children: _jsxs(Flex, { container: {
                         inline: true,
                         alignItems: 'start',
                         gap: 1

package/lib/core/ListToolbar/ListToolbar.mocks.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListToolbar.mocks.js","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":"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","sourcesContent":["import { createContext } from 'react';\nimport type { Dispatch } from 'react';\n\nimport { Select, Option, Flex, Button, Icon } from '@pega/cosmos-react-core';\nimport type { Action } from '@pega/cosmos-react-core';\nimport type { ViewSelectorProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';\nimport { ConditionBuilder } from '@pega/cosmos-react-condition-builder';\nimport FieldSelector from '@pega/cosmos-react-condition-builder/lib/components/ConditionBuilder/RhsControls/FieldSelector';\n\nimport { demoFields } from '../../condition-builder/ConditionBuilder/props.mock';\n\nexport const actions: Action[] = ['Action 1', 'Action 2', 'Action 3'].map(text => ({\n  text,\n  id: text,\n  icon: 'filter'\n}));\n\nexport const mockViews: ViewSelectorProps['views'] = [\n  { id: '1', text: 'Data view 1', selected: true },\n  { id: '2', text: 'Data view 2', selected: false },\n  { id: '3', text: 'Data view 3', selected: false }\n];\n\nexport const StagedStateDispatchContext = createContext<Dispatch<object>>(() => {});\n\nconst GroupByMock = () => {\n  return (\n    <Flex container={{ direction: 'column', gap: 2 }}>\n      <Flex container={{ direction: 'column', gap: 1 }}>\n        <Flex\n          container={{\n            justify: 'between',\n            alignItems: 'center',\n            direction: 'row',\n            wrap: 'nowrap',\n            itemGap: 0.5\n          }}\n        >\n          <Flex\n            container={{\n              justify: 'start',\n              alignItems: 'center',\n              direction: 'row',\n              wrap: 'nowrap',\n              itemGap: 0.5\n            }}\n            item={{ grow: 1 }}\n          >\n            <Icon name='drag' />\n            <Flex item={{ grow: 1, basis: '50%' }}>\n              <FieldSelector fields={[]} value='' onChange={() => {}} />\n            </Flex>\n            <Flex as={Select} item={{ basis: '50%' }}>\n              <Option> </Option>\n              <Option>Item A</Option>\n            </Flex>\n          </Flex>\n          <Button aria-label='Delete group' icon variant='simple'>\n            <Icon name='trash' />\n          </Button>\n        </Flex>\n      </Flex>\n      <Button variant='link' aria-label='Add a group'>\n        <Flex\n          container={{\n            inline: true,\n            alignItems: 'start',\n            gap: 1\n          }}\n          as='span'\n        >\n          <Icon name='plus' />\n          <span>Add</span>\n        </Flex>\n      </Button>\n    </Flex>\n  );\n};\n\nexport const FilterRenderer = () => {\n  return <ConditionBuilder fields={demoFields} />;\n};\n\nexport const GroupRenderer = () => {\n  return <GroupByMock />;\n};\n"]}
+{"version":3,"file":"ListToolbar.mocks.js","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.mocks.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAGtC,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAG7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,aAAa,MAAM,gGAAgG,CAAC;AAE3H,OAAO,EAAE,UAAU,EAAE,MAAM,qDAAqD,CAAC;AAEjF,MAAM,CAAC,MAAM,OAAO,GAAa,CAAC,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACjF,IAAI;IACJ,EAAE,EAAE,IAAI;IACR,IAAI,EAAE,QAAQ;CACf,CAAC,CAAC,CAAC;AAEJ,MAAM,CAAC,MAAM,SAAS,GAA+B;IACnD,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAE,IAAI,EAAE;IAChD,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE;IACjD,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE;CAClD,CAAC;AAEF,MAAM,CAAC,MAAM,0BAA0B,GAAG,aAAa,CAAmB,GAAG,EAAE,GAAE,CAAC,CAAC,CAAC;AAEpF,MAAM,WAAW,GAAG,GAAG,EAAE;IACvB,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC9C,MAAC,IAAI,IACH,SAAS,EAAE;oBACT,OAAO,EAAE,OAAO;oBAChB,UAAU,EAAE,QAAQ;oBACpB,SAAS,EAAE,KAAK;oBAChB,IAAI,EAAE,QAAQ;oBACd,OAAO,EAAE,GAAG;iBACb,EACD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,aAEjB,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,EACpB,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,YAC1B,KAAC,aAAa,IAAC,MAAM,EAAE,EAAE,EAAE,KAAK,EAAC,EAAE,EAAC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC,gBAAa,OAAO,GAAG,GACxE,EACP,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,YAC1B,MAAC,MAAM,IAAC,KAAK,EAAC,QAAQ,gBAAY,QAAQ,aACxC,KAAC,MAAM,oBAAW,EAClB,KAAC,MAAM,yBAAgB,IAChB,GACJ,EACP,KAAC,MAAM,kBAAY,cAAc,EAAC,IAAI,QAAC,OAAO,EAAC,QAAQ,YACrD,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,IACJ,EACP,KAAC,MAAM,IAAC,OAAO,EAAC,MAAM,gBAAY,aAAa,YAC7C,MAAC,IAAI,IACH,SAAS,EAAE;wBACT,MAAM,EAAE,IAAI;wBACZ,UAAU,EAAE,OAAO;wBACnB,GAAG,EAAE,CAAC;qBACP,EACD,EAAE,EAAC,MAAM,aAET,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,EACpB,iCAAgB,IACX,GACA,IACJ,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE;IACjC,OAAO,KAAC,gBAAgB,IAAC,MAAM,EAAE,UAAU,GAAI,CAAC;AAClD,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,OAAO,KAAC,WAAW,KAAG,CAAC;AACzB,CAAC,CAAC","sourcesContent":["import { createContext } from 'react';\nimport type { Dispatch } from 'react';\n\nimport { Select, Option, Flex, Button, Icon } from '@pega/cosmos-react-core';\nimport type { Action } from '@pega/cosmos-react-core';\nimport type { ViewSelectorProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';\nimport { ConditionBuilder } from '@pega/cosmos-react-condition-builder';\nimport FieldSelector from '@pega/cosmos-react-condition-builder/lib/components/ConditionBuilder/RhsControls/FieldSelector';\n\nimport { demoFields } from '../../condition-builder/ConditionBuilder/props.mock';\n\nexport const actions: Action[] = ['Action 1', 'Action 2', 'Action 3'].map(text => ({\n  text,\n  id: text,\n  icon: 'filter'\n}));\n\nexport const mockViews: ViewSelectorProps['views'] = [\n  { id: '1', text: 'Data view 1', selected: true },\n  { id: '2', text: 'Data view 2', selected: false },\n  { id: '3', text: 'Data view 3', selected: false }\n];\n\nexport const StagedStateDispatchContext = createContext<Dispatch<object>>(() => {});\n\nconst GroupByMock = () => {\n  return (\n    <Flex container={{ direction: 'column', gap: 2 }}>\n      <Flex\n        container={{\n          justify: 'start',\n          alignItems: 'center',\n          direction: 'row',\n          wrap: 'nowrap',\n          itemGap: 0.5\n        }}\n        item={{ grow: 1 }}\n      >\n        <Icon name='drag' />\n        <Flex item={{ basis: '50%' }}>\n          <FieldSelector fields={[]} value='' onChange={() => {}} aria-label='Field' />\n        </Flex>\n        <Flex item={{ basis: '50%' }}>\n          <Select label='Select' aria-label='Select'>\n            <Option> </Option>\n            <Option>Item A</Option>\n          </Select>\n        </Flex>\n        <Button aria-label='Delete group' icon variant='simple'>\n          <Icon name='trash' />\n        </Button>\n      </Flex>\n      <Button variant='link' aria-label='Add a group'>\n        <Flex\n          container={{\n            inline: true,\n            alignItems: 'start',\n            gap: 1\n          }}\n          as='span'\n        >\n          <Icon name='plus' />\n          <span>Add</span>\n        </Flex>\n      </Button>\n    </Flex>\n  );\n};\n\nexport const FilterRenderer = () => {\n  return <ConditionBuilder fields={demoFields} />;\n};\n\nexport const GroupRenderer = () => {\n  return <GroupByMock />;\n};\n"]}

package/lib/core/ListToolbar/ListToolbar.stories.d.ts

@@ -3,10 +3,15 @@ import type { FormControlProps } from '@pega/cosmos-react-core';
 declare const _default: import("@storybook/types").ComponentAnnotations<import("@storybook/react/dist/types-0a347bb9").R, import("@storybook/types").Args>;
 export default _default;
 interface ListToolbarStoryProps {
-    createNewLabel: string;
     required: FormControlProps['required'];
+    info: FormControlProps['info'];
+    status: FormControlProps['status'];
+    createNewLabel: string;
     showAdditionalInfo?: boolean;
+    numberOfSelected: number;
+    bulkButton: boolean;
+    bulkButtonLabel: string;
 }
 export declare const ListToolbarDemo: StoryFn<ListToolbarStoryProps>;
-export declare const SimpleToolbarDemo: StoryFn;
+export declare const SimpleToolbarDemo: StoryFn<ListToolbarStoryProps>;
 //# sourceMappingURL=ListToolbar.stories.d.ts.map

package/lib/core/ListToolbar/ListToolbar.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ListToolbar.stories.d.ts","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAWtD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;;AAWhE,wBAGU;AAIV,UAAU,qBAAqB;IAC7B,cAAc,EAAE,MAAM,CAAC;IACvB,QAAQ,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACvC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,eAAe,EAAE,OAAO,CAAC,qBAAqB,CAuH1D,CAAC;AAcF,eAAO,MAAM,iBAAiB,EAAE,OAU/B,CAAC"}
+{"version":3,"file":"ListToolbar.stories.d.ts","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAWtD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;;AAWhE,wBAaU;AAIV,UAAU,qBAAqB;IAC7B,QAAQ,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACvC,IAAI,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC/B,MAAM,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACnC,cAAc,EAAE,MAAM,CAAC;IACvB,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B,gBAAgB,EAAE,MAAM,CAAC;IACzB,UAAU,EAAE,OAAO,CAAC;IACpB,eAAe,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,eAAe,EAAE,OAAO,CAAC,qBAAqB,CAwH1D,CAAC;AAuBF,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,qBAAqB,CAY5D,CAAC"}

package/lib/core/ListToolbar/ListToolbar.stories.js

@@ -5,7 +5,17 @@ import { Flex, Link, ListToolbar, MenuButton, listToolbarHelpers as helpers } fr
 import { mockViews, actions, FilterRenderer, StagedStateDispatchContext, GroupRenderer } from './ListToolbar.mocks';
 export default {
     title: 'Core/ListToolbar',
-    component: ListToolbar
+    component: ListToolbar,
+    args: {
+        required: false,
+        info: undefined,
+        status: undefined
+    },
+    argTypes: {
+        required: { control: { type: 'boolean' } },
+        info: { control: { type: 'text' } },
+        status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } }
+    }
 };
 export const ListToolbarDemo = (args) => {
     const [stagedQueryOptionState, setStagedQueryOptionState] = useState(null);
@@ -80,12 +90,13 @@ export const ListToolbarDemo = (args) => {
                 onSearchChange: setSearchValue
             }, count: {
                 total: 1146,
-                selected: 4
-            }, filter: filterProp, sort: sortProp, group: groupProp, actions: actions, additionalActions: _jsx(MenuButton, { text: 'Edit' }), formControlProps: {
+                selected: args.numberOfSelected
+            }, filter: filterProp, sort: sortProp, group: groupProp, actions: actions, additionalActions: args.bulkButton && _jsx(MenuButton, { text: args.bulkButtonLabel }), formControlProps: {
                 required: args.required,
+                info: args.info,
+                status: args.status,
                 additionalInfo: args.showAdditionalInfo
                     ? {
-                        heading: 'Additional Info',
                         content: (_jsxs(Flex, { container: { direction: 'column', alignItems: 'start', gap: 2 }, children: [_jsx("p", { children: "Lorem ipsum dolor sit amet, consectetur it, sed do tempor incididunt ut labore magna aliqua. Nibh praesent tristique magna sit amet. Nec tincidunt praesent semper feugiat nibh sed pulvinar proin gravida." }), _jsx("p", { children: "Pharetra pharetra massa massa ultricies mi quis hendrerit dolor. Est velit egestas dui id ornare arcu odio ut. Varius sit amet mattis vulputate enim nulla aliquet porttitor lacus." }), _jsx(Link, { href: '/', target: '_blank', children: "Neque vitae" })] }))
                     }
                     : undefined
@@ -93,15 +104,24 @@ export const ListToolbarDemo = (args) => {
 };
 ListToolbarDemo.args = {
     createNewLabel: undefined,
-    required: false,
-    showAdditionalInfo: false
+    showAdditionalInfo: false,
+    numberOfSelected: 4,
+    bulkButton: true,
+    bulkButtonLabel: 'Edit'
 };
 ListToolbarDemo.argTypes = {
     createNewLabel: { control: { type: 'text' } },
-    required: { control: { type: 'boolean' } },
-    showAdditionalInfo: { control: { type: 'boolean' } }
+    showAdditionalInfo: { control: { type: 'boolean' } },
+    numberOfSelected: { control: { type: 'number' } },
+    bulkButton: { control: { type: 'boolean' } },
+    bulkButtonLabel: { control: { type: 'text' } }
 };
-export const SimpleToolbarDemo = () => {
-    return (_jsx(ListToolbar, { name: 'Top accounts in California', search: { onSearchSubmit: action('Search submit') }, count: { total: 212, totalHasMore: true }, actions: actions, formControlProps: { required: true } }));
+export const SimpleToolbarDemo = (args) => {
+    return (_jsx(ListToolbar, { name: 'Top accounts in California', search: { onSearchSubmit: action('Search submit') }, count: { total: 212, totalHasMore: true }, actions: actions, formControlProps: args }));
+};
+SimpleToolbarDemo.args = {
+    required: true,
+    info: 'Info message',
+    status: 'error'
 };
 //# sourceMappingURL=ListToolbar.stories.js.map

package/lib/core/ListToolbar/ListToolbar.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListToolbar.stories.js","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useMemo, useState } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n  Flex,\n  Link,\n  ListToolbar,\n  MenuButton,\n  listToolbarHelpers as helpers\n} from '@pega/cosmos-react-core';\nimport type { FormControlProps } from '@pega/cosmos-react-core';\nimport type { PresetMenuProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';\n\nimport {\n  mockViews,\n  actions,\n  FilterRenderer,\n  StagedStateDispatchContext,\n  GroupRenderer\n} from './ListToolbar.mocks';\n\nexport default {\n  title: 'Core/ListToolbar',\n  component: ListToolbar\n} as Meta;\n\ntype SortString = 'asc' | 'desc';\n\ninterface ListToolbarStoryProps {\n  createNewLabel: string;\n  required: FormControlProps['required'];\n  showAdditionalInfo?: boolean;\n}\n\nexport const ListToolbarDemo: StoryFn<ListToolbarStoryProps> = (args: ListToolbarStoryProps) => {\n  const [stagedQueryOptionState, setStagedQueryOptionState] = useState<object | null>(null);\n  const [views, setViews] = useState(mockViews);\n  const [currentSort, setCurrentSort] = useState<SortString | null>(null);\n  const [searchValue, setSearchValue] = useState('');\n\n  const filterProp = useMemo(() => {\n    return {\n      value: stagedQueryOptionState,\n      count: undefined,\n      renderer: FilterRenderer,\n      onCancel: () => {\n        setStagedQueryOptionState(null);\n      },\n      onSubmit: () => {\n        setStagedQueryOptionState(cur => {\n          // eslint-disable-next-line no-console\n          console.table(cur);\n          return null;\n        });\n      }\n    };\n  }, [stagedQueryOptionState]);\n\n  const sortProp: PresetMenuProps = useMemo(() => {\n    return {\n      mode: 'single-select',\n      count: currentSort ? 1 : undefined,\n      items: [\n        {\n          id: 'asc',\n          text: 'Ascending',\n          icon: 'arrow-up',\n          selected: currentSort === 'asc'\n        },\n        {\n          id: 'desc',\n          text: 'Descending',\n          icon: 'arrow-down',\n          selected: currentSort === 'desc'\n        }\n      ],\n      onItemClick: id => {\n        setCurrentSort(cur => {\n          return cur === id ? null : (id as SortString);\n        });\n      }\n    };\n  }, [currentSort]);\n\n  const groupProp = useMemo(() => {\n    return {\n      count: undefined,\n      renderer: GroupRenderer,\n      onCancel: () => {},\n      onSubmit: () => {}\n    };\n  }, []);\n\n  return (\n    <StagedStateDispatchContext.Provider value={setStagedQueryOptionState}>\n      <ListToolbar\n        name='Contacts'\n        viewSelector={{\n          views,\n          onViewSelect: id => {\n            setViews(cur => {\n              return helpers.selectView(cur, id);\n            });\n          },\n          defaultId: '1',\n          appDefaultId: '2'\n        }}\n        createNew={{\n          onClick: action('Clicked Create New'),\n          label: args.createNewLabel\n        }}\n        search={{\n          onSearchSubmit: action('Search submit'),\n          value: searchValue,\n          onSearchChange: setSearchValue\n        }}\n        count={{\n          total: 1146,\n          selected: 4\n        }}\n        filter={filterProp}\n        sort={sortProp}\n        group={groupProp}\n        actions={actions}\n        additionalActions={<MenuButton text='Edit' />}\n        formControlProps={{\n          required: args.required,\n          additionalInfo: args.showAdditionalInfo\n            ? {\n                heading: 'Additional Info',\n                content: (\n                  <Flex container={{ direction: 'column', alignItems: 'start', gap: 2 }}>\n                    <p>\n                      Lorem ipsum dolor sit amet, consectetur it, sed do tempor incididunt ut labore\n                      magna aliqua. Nibh praesent tristique magna sit amet. Nec tincidunt praesent\n                      semper feugiat nibh sed pulvinar proin gravida.\n                    </p>\n                    <p>\n                      Pharetra pharetra massa massa ultricies mi quis hendrerit dolor. Est velit\n                      egestas dui id ornare arcu odio ut. Varius sit amet mattis vulputate enim\n                      nulla aliquet porttitor lacus.\n                    </p>\n                    <Link href='/' target='_blank'>\n                      Neque vitae\n                    </Link>\n                  </Flex>\n                )\n              }\n            : undefined\n        }}\n      />\n    </StagedStateDispatchContext.Provider>\n  );\n};\n\nListToolbarDemo.args = {\n  createNewLabel: undefined,\n  required: false,\n  showAdditionalInfo: false\n};\n\nListToolbarDemo.argTypes = {\n  createNewLabel: { control: { type: 'text' } },\n  required: { control: { type: 'boolean' } },\n  showAdditionalInfo: { control: { type: 'boolean' } }\n};\n\nexport const SimpleToolbarDemo: StoryFn = () => {\n  return (\n    <ListToolbar\n      name='Top accounts in California'\n      search={{ onSearchSubmit: action('Search submit') }}\n      count={{ total: 212, totalHasMore: true }}\n      actions={actions}\n      formControlProps={{ required: true }}\n    />\n  );\n};\n"]}
+{"version":3,"file":"ListToolbar.stories.js","sourceRoot":"","sources":["../../../src/core/ListToolbar/ListToolbar.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useMemo, useState } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n  Flex,\n  Link,\n  ListToolbar,\n  MenuButton,\n  listToolbarHelpers as helpers\n} from '@pega/cosmos-react-core';\nimport type { FormControlProps } from '@pega/cosmos-react-core';\nimport type { PresetMenuProps } from '@pega/cosmos-react-core/lib/components/ListToolbar/ListToolbar.types';\n\nimport {\n  mockViews,\n  actions,\n  FilterRenderer,\n  StagedStateDispatchContext,\n  GroupRenderer\n} from './ListToolbar.mocks';\n\nexport default {\n  title: 'Core/ListToolbar',\n  component: ListToolbar,\n  args: {\n    required: false,\n    info: undefined,\n    status: undefined\n  },\n  argTypes: {\n    required: { control: { type: 'boolean' } },\n    info: { control: { type: 'text' } },\n    status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } }\n  }\n} as Meta;\n\ntype SortString = 'asc' | 'desc';\n\ninterface ListToolbarStoryProps {\n  required: FormControlProps['required'];\n  info: FormControlProps['info'];\n  status: FormControlProps['status'];\n  createNewLabel: string;\n  showAdditionalInfo?: boolean;\n  numberOfSelected: number;\n  bulkButton: boolean;\n  bulkButtonLabel: string;\n}\n\nexport const ListToolbarDemo: StoryFn<ListToolbarStoryProps> = (args: ListToolbarStoryProps) => {\n  const [stagedQueryOptionState, setStagedQueryOptionState] = useState<object | null>(null);\n  const [views, setViews] = useState(mockViews);\n  const [currentSort, setCurrentSort] = useState<SortString | null>(null);\n  const [searchValue, setSearchValue] = useState('');\n\n  const filterProp = useMemo(() => {\n    return {\n      value: stagedQueryOptionState,\n      count: undefined,\n      renderer: FilterRenderer,\n      onCancel: () => {\n        setStagedQueryOptionState(null);\n      },\n      onSubmit: () => {\n        setStagedQueryOptionState(cur => {\n          // eslint-disable-next-line no-console\n          console.table(cur);\n          return null;\n        });\n      }\n    };\n  }, [stagedQueryOptionState]);\n\n  const sortProp: PresetMenuProps = useMemo(() => {\n    return {\n      mode: 'single-select',\n      count: currentSort ? 1 : undefined,\n      items: [\n        {\n          id: 'asc',\n          text: 'Ascending',\n          icon: 'arrow-up',\n          selected: currentSort === 'asc'\n        },\n        {\n          id: 'desc',\n          text: 'Descending',\n          icon: 'arrow-down',\n          selected: currentSort === 'desc'\n        }\n      ],\n      onItemClick: id => {\n        setCurrentSort(cur => {\n          return cur === id ? null : (id as SortString);\n        });\n      }\n    };\n  }, [currentSort]);\n\n  const groupProp = useMemo(() => {\n    return {\n      count: undefined,\n      renderer: GroupRenderer,\n      onCancel: () => {},\n      onSubmit: () => {}\n    };\n  }, []);\n\n  return (\n    <StagedStateDispatchContext.Provider value={setStagedQueryOptionState}>\n      <ListToolbar\n        name='Contacts'\n        viewSelector={{\n          views,\n          onViewSelect: id => {\n            setViews(cur => {\n              return helpers.selectView(cur, id);\n            });\n          },\n          defaultId: '1',\n          appDefaultId: '2'\n        }}\n        createNew={{\n          onClick: action('Clicked Create New'),\n          label: args.createNewLabel\n        }}\n        search={{\n          onSearchSubmit: action('Search submit'),\n          value: searchValue,\n          onSearchChange: setSearchValue\n        }}\n        count={{\n          total: 1146,\n          selected: args.numberOfSelected\n        }}\n        filter={filterProp}\n        sort={sortProp}\n        group={groupProp}\n        actions={actions}\n        additionalActions={args.bulkButton && <MenuButton text={args.bulkButtonLabel} />}\n        formControlProps={{\n          required: args.required,\n          info: args.info,\n          status: args.status,\n          additionalInfo: args.showAdditionalInfo\n            ? {\n                content: (\n                  <Flex container={{ direction: 'column', alignItems: 'start', gap: 2 }}>\n                    <p>\n                      Lorem ipsum dolor sit amet, consectetur it, sed do tempor incididunt ut labore\n                      magna aliqua. Nibh praesent tristique magna sit amet. Nec tincidunt praesent\n                      semper feugiat nibh sed pulvinar proin gravida.\n                    </p>\n                    <p>\n                      Pharetra pharetra massa massa ultricies mi quis hendrerit dolor. Est velit\n                      egestas dui id ornare arcu odio ut. Varius sit amet mattis vulputate enim\n                      nulla aliquet porttitor lacus.\n                    </p>\n                    <Link href='/' target='_blank'>\n                      Neque vitae\n                    </Link>\n                  </Flex>\n                )\n              }\n            : undefined\n        }}\n      />\n    </StagedStateDispatchContext.Provider>\n  );\n};\n\nListToolbarDemo.args = {\n  createNewLabel: undefined,\n  showAdditionalInfo: false,\n  numberOfSelected: 4,\n  bulkButton: true,\n  bulkButtonLabel: 'Edit'\n};\n\nListToolbarDemo.argTypes = {\n  createNewLabel: { control: { type: 'text' } },\n  showAdditionalInfo: { control: { type: 'boolean' } },\n  numberOfSelected: { control: { type: 'number' } },\n  bulkButton: { control: { type: 'boolean' } },\n  bulkButtonLabel: { control: { type: 'text' } }\n};\n\ninterface SimpleToolbarStoryProps {\n  required: FormControlProps['required'];\n  info: FormControlProps['info'];\n  status: FormControlProps['status'];\n}\nexport const SimpleToolbarDemo: StoryFn<ListToolbarStoryProps> = (\n  args: SimpleToolbarStoryProps\n) => {\n  return (\n    <ListToolbar\n      name='Top accounts in California'\n      search={{ onSearchSubmit: action('Search submit') }}\n      count={{ total: 212, totalHasMore: true }}\n      actions={actions}\n      formControlProps={args}\n    />\n  );\n};\n\nSimpleToolbarDemo.args = {\n  required: true,\n  info: 'Info message',\n  status: 'error'\n};\n"]}

package/lib/core/Location/Location.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Location.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Location/Location.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAItD,OAAO,KAAK,EAEV,oBAAoB,EACpB,kBAAkB,EAClB,iBAAiB,EAClB,MAAM,yBAAyB,CAAC;;AAEjC,wBAGU;AAEV,UAAU,MAAM;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,YAAY,EAAE,OAAO,CAAC,kBAAkB,GAAG,MAAM,CA+C7D,CAAC;AA8BF,UAAU,uBAAwB,SAAQ,kBAAkB;IAC1D,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,uBAAuB,GAAG,MAAM,CAoCvE,CAAC;AA4BF,eAAO,MAAM,gBAAgB,EAAE,OAAO,CAAC,iBAAiB,GAAG,MAAM,CAsBhE,CAAC;AAkBF,eAAO,MAAM,mBAAmB,EAAE,OAAO,CAAC,oBAAoB,GAAG,MAAM,CAgBtE,CAAC"}
+{"version":3,"file":"Location.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Location/Location.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAItD,OAAO,KAAK,EAEV,oBAAoB,EACpB,kBAAkB,EAClB,iBAAiB,EAClB,MAAM,yBAAyB,CAAC;;AAEjC,wBAGU;AAEV,UAAU,MAAM;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,YAAY,EAAE,OAAO,CAAC,kBAAkB,GAAG,MAAM,CA+C7D,CAAC;AA8BF,UAAU,uBAAwB,SAAQ,kBAAkB;IAC1D,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,uBAAuB,GAAG,MAAM,CAmCvE,CAAC;AA4BF,eAAO,MAAM,gBAAgB,EAAE,OAAO,CAAC,iBAAiB,GAAG,MAAM,CAsBhE,CAAC;AAkBF,eAAO,MAAM,mBAAmB,EAAE,OAAO,CAAC,oBAAoB,GAAG,MAAM,CAgBtE,CAAC"}

package/lib/core/Location/Location.stories.js

@@ -62,7 +62,6 @@ export const LocationInputDemo = (args) => {
                 setValue(selectedValueObj.name ?? '');
             }, status: args.status, required: args.required, disabled: args.disabled, readOnly: args.readOnly, additionalInfo: args.showAdditionalInfo
                 ? {
-                    heading: 'Additional Info',
                     content: 'Please enter your location'
                 }
                 : undefined }) }));

package/lib/core/Location/Location.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Location.stories.js","sourceRoot":"","sources":["../../../src/core/Location/Location.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useMemo, useState } from 'react';\n\nimport { LocationDisplay, LocationInput, LocationView, MapsContext } from '@pega/cosmos-react-core';\nimport type {\n  LatLng,\n  LocationDisplayProps,\n  LocationInputProps,\n  LocationViewProps\n} from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Location',\n  component: LocationInput\n} as Meta;\n\ninterface APIKey {\n  apiKey?: string;\n}\n\nexport const LocationDemo: StoryFn<LocationInputProps & APIKey> = (\n  args: LocationInputProps & APIKey\n) => {\n  const [value, setValue] = useState('Boston, MA');\n  const [locationObj, setLocationObj] = useState<LatLng | string>('Boston, MA');\n\n  const handleClick = ({ latitude, longitude }: { latitude: number; longitude: number }) => {\n    setLocationObj({ latitude, longitude });\n  };\n\n  const ctx = useMemo(() => ({ name: 'google', apiKey: args.apiKey }), [args.apiKey]);\n\n  return (\n    <MapsContext.Provider value={ctx}>\n      <LocationInput\n        showMap\n        defaultToCurrentLocation={args.defaultToCurrentLocation}\n        value={value}\n        label={args.label}\n        labelHidden={args.labelHidden}\n        info={args.info}\n        onChange={inputValue => {\n          setValue(inputValue);\n        }}\n        location={locationObj}\n        onSelect={selectedValueObj => {\n          setValue(selectedValueObj.name ?? '');\n          if (selectedValueObj.latitude && selectedValueObj.longitude) {\n            setLocationObj({\n              latitude: selectedValueObj.latitude,\n              longitude: selectedValueObj.longitude\n            });\n          } else {\n            setLocationObj(selectedValueObj.name ?? '');\n          }\n        }}\n        onClick={handleClick}\n        centerMapOnChange={args.centerMapOnChange}\n        zoomLevel={args.zoomLevel}\n        height='25rem'\n        status={args.status}\n        required={args.required}\n        disabled={args.disabled}\n        readOnly={args.readOnly}\n      />\n    </MapsContext.Provider>\n  );\n};\n\nLocationDemo.args = {\n  apiKey: '',\n  defaultToCurrentLocation: false,\n  label: 'Location',\n  labelHidden: false,\n  info: undefined,\n  centerMapOnChange: true,\n  zoomLevel: 13,\n  status: undefined,\n  required: false,\n  disabled: false,\n  readOnly: false\n};\n\nLocationDemo.argTypes = {\n  apiKey: { control: { type: 'text' } },\n  defaultToCurrentLocation: { control: { type: 'boolean' } },\n  label: { control: { type: 'text' } },\n  labelHidden: { control: { type: 'boolean' } },\n  info: { control: { type: 'text', label: 'Helper text' } },\n  centerMapOnChange: { control: { type: 'boolean' } },\n  zoomLevel: { control: { type: 'number' } },\n  status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n  required: { control: { type: 'boolean' } },\n  disabled: { control: { type: 'boolean' } },\n  readOnly: { control: { type: 'boolean' } }\n};\n\ninterface LocationInputStoryProps extends LocationInputProps {\n  showAdditionalInfo?: boolean;\n}\n\nexport const LocationInputDemo: StoryFn<LocationInputStoryProps & APIKey> = (\n  args: LocationInputStoryProps & APIKey\n) => {\n  const [value, setValue] = useState('');\n\n  const ctx = useMemo(() => ({ name: 'google', apiKey: args.apiKey }), [args.apiKey]);\n\n  return (\n    <MapsContext.Provider value={ctx}>\n      <LocationInput\n        defaultToCurrentLocation={args.defaultToCurrentLocation}\n        value={value}\n        label={args.label}\n        labelHidden={args.labelHidden}\n        info={args.info}\n        onChange={inputValue => {\n          setValue(inputValue);\n        }}\n        onSelect={selectedValueObj => {\n          setValue(selectedValueObj.name ?? '');\n        }}\n        status={args.status}\n        required={args.required}\n        disabled={args.disabled}\n        readOnly={args.readOnly}\n        additionalInfo={\n          args.showAdditionalInfo\n            ? {\n                heading: 'Additional Info',\n                content: 'Please enter your location'\n              }\n            : undefined\n        }\n      />\n    </MapsContext.Provider>\n  );\n};\n\nLocationInputDemo.args = {\n  apiKey: '',\n  defaultToCurrentLocation: false,\n  label: 'Location',\n  labelHidden: false,\n  info: 'Enter some location',\n  status: undefined,\n  required: false,\n  disabled: false,\n  readOnly: false,\n  showAdditionalInfo: false\n};\n\nLocationInputDemo.argTypes = {\n  apiKey: { control: { type: 'text' } },\n  defaultToCurrentLocation: { control: { type: 'boolean' } },\n  label: { control: { type: 'text' } },\n  labelHidden: { control: { type: 'boolean' } },\n  info: { control: { type: 'text', label: 'Helper text' } },\n  status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n  required: { control: { type: 'boolean' } },\n  disabled: { control: { type: 'boolean' } },\n  readOnly: { control: { type: 'boolean' } },\n  showAdditionalInfo: { control: { type: 'boolean' } }\n};\n\nexport const LocationViewDemo: StoryFn<LocationViewProps & APIKey> = (\n  args: LocationViewProps & APIKey\n) => {\n  const [location, setLocation] = useState(args.location);\n\n  const handleClick = ({ latitude, longitude }: { latitude: number; longitude: number }) => {\n    setLocation(`${latitude.toString()},${longitude.toString()}`);\n  };\n\n  const ctx = useMemo(() => ({ name: 'google', apiKey: args.apiKey }), [args.apiKey]);\n\n  return (\n    <MapsContext.Provider value={ctx}>\n      <LocationView\n        location={location}\n        centerMapOnChange={args.centerMapOnChange}\n        zoomLevel={args.zoomLevel}\n        height={args.height}\n        onClick={handleClick}\n      />\n    </MapsContext.Provider>\n  );\n};\n\nLocationViewDemo.args = {\n  apiKey: '',\n  location: 'Boston, MA',\n  centerMapOnChange: true,\n  zoomLevel: 13,\n  height: '25rem'\n};\n\nLocationViewDemo.argTypes = {\n  apiKey: { control: { type: 'text' } },\n  location: { control: { type: 'text' } },\n  centerMapOnChange: { control: { type: 'boolean' } },\n  zoomLevel: { control: { type: 'number' } },\n  height: { control: { type: 'text' } }\n};\n\nexport const LocationDisplayDemo: StoryFn<LocationDisplayProps & APIKey> = (\n  args: LocationDisplayProps & APIKey\n) => {\n  const ctx = useMemo(() => ({ name: 'google', apiKey: args.apiKey }), [args.apiKey]);\n\n  return (\n    <MapsContext.Provider value={ctx}>\n      <LocationDisplay\n        value={args.value}\n        zoomLevel={args.zoomLevel}\n        height={args.height}\n        variant={args.variant}\n        displayText={args.displayText}\n      />\n    </MapsContext.Provider>\n  );\n};\n\nLocationDisplayDemo.args = {\n  apiKey: '',\n  value: 'Boston, MA',\n  zoomLevel: 13,\n  height: '25rem',\n  variant: 'text-map',\n  displayText: 'Come visit Boston!'\n};\n\nLocationDisplayDemo.argTypes = {\n  apiKey: { control: { type: 'text' } },\n  value: { control: { type: 'text' } },\n  zoomLevel: { control: { type: 'number' } },\n  height: { control: { type: 'text' } },\n  variant: { options: ['text-map', 'map', 'text'], control: { type: 'select' } },\n  displayText: { control: { type: 'text' } }\n};\n"]}
+{"version":3,"file":"Location.stories.js","sourceRoot":"","sources":["../../../src/core/Location/Location.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Meta, StoryFn } from '@storybook/react';\nimport { useMemo, useState } from 'react';\n\nimport { LocationDisplay, LocationInput, LocationView, MapsContext } from '@pega/cosmos-react-core';\nimport type {\n  LatLng,\n  LocationDisplayProps,\n  LocationInputProps,\n  LocationViewProps\n} from '@pega/cosmos-react-core';\n\nexport default {\n  title: 'Core/Location',\n  component: LocationInput\n} as Meta;\n\ninterface APIKey {\n  apiKey?: string;\n}\n\nexport const LocationDemo: StoryFn<LocationInputProps & APIKey> = (\n  args: LocationInputProps & APIKey\n) => {\n  const [value, setValue] = useState('Boston, MA');\n  const [locationObj, setLocationObj] = useState<LatLng | string>('Boston, MA');\n\n  const handleClick = ({ latitude, longitude }: { latitude: number; longitude: number }) => {\n    setLocationObj({ latitude, longitude });\n  };\n\n  const ctx = useMemo(() => ({ name: 'google', apiKey: args.apiKey }), [args.apiKey]);\n\n  return (\n    <MapsContext.Provider value={ctx}>\n      <LocationInput\n        showMap\n        defaultToCurrentLocation={args.defaultToCurrentLocation}\n        value={value}\n        label={args.label}\n        labelHidden={args.labelHidden}\n        info={args.info}\n        onChange={inputValue => {\n          setValue(inputValue);\n        }}\n        location={locationObj}\n        onSelect={selectedValueObj => {\n          setValue(selectedValueObj.name ?? '');\n          if (selectedValueObj.latitude && selectedValueObj.longitude) {\n            setLocationObj({\n              latitude: selectedValueObj.latitude,\n              longitude: selectedValueObj.longitude\n            });\n          } else {\n            setLocationObj(selectedValueObj.name ?? '');\n          }\n        }}\n        onClick={handleClick}\n        centerMapOnChange={args.centerMapOnChange}\n        zoomLevel={args.zoomLevel}\n        height='25rem'\n        status={args.status}\n        required={args.required}\n        disabled={args.disabled}\n        readOnly={args.readOnly}\n      />\n    </MapsContext.Provider>\n  );\n};\n\nLocationDemo.args = {\n  apiKey: '',\n  defaultToCurrentLocation: false,\n  label: 'Location',\n  labelHidden: false,\n  info: undefined,\n  centerMapOnChange: true,\n  zoomLevel: 13,\n  status: undefined,\n  required: false,\n  disabled: false,\n  readOnly: false\n};\n\nLocationDemo.argTypes = {\n  apiKey: { control: { type: 'text' } },\n  defaultToCurrentLocation: { control: { type: 'boolean' } },\n  label: { control: { type: 'text' } },\n  labelHidden: { control: { type: 'boolean' } },\n  info: { control: { type: 'text', label: 'Helper text' } },\n  centerMapOnChange: { control: { type: 'boolean' } },\n  zoomLevel: { control: { type: 'number' } },\n  status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n  required: { control: { type: 'boolean' } },\n  disabled: { control: { type: 'boolean' } },\n  readOnly: { control: { type: 'boolean' } }\n};\n\ninterface LocationInputStoryProps extends LocationInputProps {\n  showAdditionalInfo?: boolean;\n}\n\nexport const LocationInputDemo: StoryFn<LocationInputStoryProps & APIKey> = (\n  args: LocationInputStoryProps & APIKey\n) => {\n  const [value, setValue] = useState('');\n\n  const ctx = useMemo(() => ({ name: 'google', apiKey: args.apiKey }), [args.apiKey]);\n\n  return (\n    <MapsContext.Provider value={ctx}>\n      <LocationInput\n        defaultToCurrentLocation={args.defaultToCurrentLocation}\n        value={value}\n        label={args.label}\n        labelHidden={args.labelHidden}\n        info={args.info}\n        onChange={inputValue => {\n          setValue(inputValue);\n        }}\n        onSelect={selectedValueObj => {\n          setValue(selectedValueObj.name ?? '');\n        }}\n        status={args.status}\n        required={args.required}\n        disabled={args.disabled}\n        readOnly={args.readOnly}\n        additionalInfo={\n          args.showAdditionalInfo\n            ? {\n                content: 'Please enter your location'\n              }\n            : undefined\n        }\n      />\n    </MapsContext.Provider>\n  );\n};\n\nLocationInputDemo.args = {\n  apiKey: '',\n  defaultToCurrentLocation: false,\n  label: 'Location',\n  labelHidden: false,\n  info: 'Enter some location',\n  status: undefined,\n  required: false,\n  disabled: false,\n  readOnly: false,\n  showAdditionalInfo: false\n};\n\nLocationInputDemo.argTypes = {\n  apiKey: { control: { type: 'text' } },\n  defaultToCurrentLocation: { control: { type: 'boolean' } },\n  label: { control: { type: 'text' } },\n  labelHidden: { control: { type: 'boolean' } },\n  info: { control: { type: 'text', label: 'Helper text' } },\n  status: { options: [undefined, 'success', 'warning', 'error'], control: { type: 'select' } },\n  required: { control: { type: 'boolean' } },\n  disabled: { control: { type: 'boolean' } },\n  readOnly: { control: { type: 'boolean' } },\n  showAdditionalInfo: { control: { type: 'boolean' } }\n};\n\nexport const LocationViewDemo: StoryFn<LocationViewProps & APIKey> = (\n  args: LocationViewProps & APIKey\n) => {\n  const [location, setLocation] = useState(args.location);\n\n  const handleClick = ({ latitude, longitude }: { latitude: number; longitude: number }) => {\n    setLocation(`${latitude.toString()},${longitude.toString()}`);\n  };\n\n  const ctx = useMemo(() => ({ name: 'google', apiKey: args.apiKey }), [args.apiKey]);\n\n  return (\n    <MapsContext.Provider value={ctx}>\n      <LocationView\n        location={location}\n        centerMapOnChange={args.centerMapOnChange}\n        zoomLevel={args.zoomLevel}\n        height={args.height}\n        onClick={handleClick}\n      />\n    </MapsContext.Provider>\n  );\n};\n\nLocationViewDemo.args = {\n  apiKey: '',\n  location: 'Boston, MA',\n  centerMapOnChange: true,\n  zoomLevel: 13,\n  height: '25rem'\n};\n\nLocationViewDemo.argTypes = {\n  apiKey: { control: { type: 'text' } },\n  location: { control: { type: 'text' } },\n  centerMapOnChange: { control: { type: 'boolean' } },\n  zoomLevel: { control: { type: 'number' } },\n  height: { control: { type: 'text' } }\n};\n\nexport const LocationDisplayDemo: StoryFn<LocationDisplayProps & APIKey> = (\n  args: LocationDisplayProps & APIKey\n) => {\n  const ctx = useMemo(() => ({ name: 'google', apiKey: args.apiKey }), [args.apiKey]);\n\n  return (\n    <MapsContext.Provider value={ctx}>\n      <LocationDisplay\n        value={args.value}\n        zoomLevel={args.zoomLevel}\n        height={args.height}\n        variant={args.variant}\n        displayText={args.displayText}\n      />\n    </MapsContext.Provider>\n  );\n};\n\nLocationDisplayDemo.args = {\n  apiKey: '',\n  value: 'Boston, MA',\n  zoomLevel: 13,\n  height: '25rem',\n  variant: 'text-map',\n  displayText: 'Come visit Boston!'\n};\n\nLocationDisplayDemo.argTypes = {\n  apiKey: { control: { type: 'text' } },\n  value: { control: { type: 'text' } },\n  zoomLevel: { control: { type: 'number' } },\n  height: { control: { type: 'text' } },\n  variant: { options: ['text-map', 'map', 'text'], control: { type: 'select' } },\n  displayText: { control: { type: 'text' } }\n};\n"]}

package/lib/core/Number/Number.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Number.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Number/Number.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAItD,OAAO,KAAK,EACV,kBAAkB,EAClB,gBAAgB,EAChB,qBAAqB,EACrB,UAAU,EACX,MAAM,yBAAyB,CAAC;;AAEjC,wBAGU;AAEV,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,gBAAgB,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IAClF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,OAAO,CAAC,gBAAgB,CA2CrD,CAAC;AA2EF,eAAO,MAAM,oBAAoB,EAAE,OAAO,CAAC,qBAAqB,CA6C/D,CAAC;AA2EF,eAAO,MAAM,WAAW,EAAE,OAAO,CAAC,gBAAgB,CA4CjD,CAAC;AAqCF,UAAU,uBAAwB,SAAQ,kBAAkB;IAC1D,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,OAAO,CAAC;IACzB,QAAQ,EAAE,UAAU,GAAG,SAAS,CAAC;CAClC;AAED,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,uBAAuB,CAc9D,CAAC"}
+{"version":3,"file":"Number.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Number/Number.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,OAAO,EAAE,MAAM,kBAAkB,CAAC;AAItD,OAAO,KAAK,EACV,kBAAkB,EAClB,gBAAgB,EAChB,qBAAqB,EACrB,UAAU,EACX,MAAM,yBAAyB,CAAC;;AAEjC,wBAGU;AAEV,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,gBAAgB,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IAClF,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,kBAAkB,CAAC,EAAE,OAAO,CAAC;CAC9B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,OAAO,CAAC,gBAAgB,CA6CrD,CAAC;AA2EF,eAAO,MAAM,oBAAoB,EAAE,OAAO,CAAC,qBAAqB,CA6C/D,CAAC;AA2EF,eAAO,MAAM,WAAW,EAAE,OAAO,CAAC,gBAAgB,CA8CjD,CAAC;AAqCF,UAAU,uBAAwB,SAAQ,kBAAkB;IAC1D,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,OAAO,CAAC;IACzB,QAAQ,EAAE,UAAU,GAAG,SAAS,CAAC;CAClC;AAED,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,uBAAuB,CAc9D,CAAC"}