@pega/cosmos-react-demos 4.0.0-dev.17.1 → 4.0.0-dev.18.0

package/lib/cs/Article/Article.stories.js

@@ -1,6 +1,7 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
 import { action } from '@storybook/addon-actions';
-import { Button, Flex, Icon, registerIcon, Link, Text } from '@pega/cosmos-react-core';
+import { registerIcon, createUID, HTML } from '@pega/cosmos-react-core';
 import * as openIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/open.icon';
 import * as starIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/star.icon';
 import * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';
@@ -17,69 +18,183 @@ export default {
         layout: 'fullscreen'
     }
 };
-export const ArticleStory = () => {
+export const ArticleStory = (args) => {
+    const [feedbackStatus, setFeedbackStatus] = useState();
+    const [showFeedbackThanks, setShowFeedbackThanks] = useState(false);
+    const [loading, setLoading] = useState(true);
+    const { showHeader, backButtonText, showPrimaryActions, showSecondaryActions, showFooter, enableFeedback, showTags, showRelatedLinks, showMoreLikeThis, showAttachments } = args;
     const onBackToArticlesClick = (event) => {
         event.preventDefault();
     };
+    const onFeedbackClick = button => {
+        if (button === 'like') {
+            if (feedbackStatus === 'liked') {
+                setFeedbackStatus(undefined);
+            }
+            else {
+                setFeedbackStatus('liked');
+                setShowFeedbackThanks(true);
+            }
+        }
+        else if (feedbackStatus === 'disliked') {
+            setFeedbackStatus(undefined);
+        }
+        else {
+            setFeedbackStatus('disliked');
+            setShowFeedbackThanks(true);
+        }
+    };
+    useEffect(() => {
+        setTimeout(() => {
+            setLoading(false);
+        }, 2000);
+    }, []);
     return (_jsx("div", { style: {
-            maxWidth: '31.25rem',
-            maxHeight: '100vh'
-        }, children: _jsx(Article, { navigation: _jsx(Link, { href: '/', onClick: onBackToArticlesClick, children: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: 'caret-left' }), _jsx(Text, { children: "Back to all articles" })] }) }), primaryActions: _jsxs(_Fragment, { children: [_jsx(Button, { "aria-label": 'star', variant: 'simple', icon: true, children: _jsx(Icon, { name: 'star' }) }), _jsx(Button, { "aria-label": 'open', variant: 'simple', icon: true, children: _jsx(Icon, { name: 'open' }) })] }), secondaryActions: [
-                {
-                    text: 'Filter 1',
-                    id: 'f1a'
-                },
-                {
-                    text: 'Filter 2',
-                    id: 'f2a'
+            maxWidth: '25rem'
+        }, children: _jsx(Article, { header: showHeader
+                ? {
+                    title: 'Knowledge articles',
+                    icon: 'book-open'
                 }
-            ], content: 
-            // TODO : Container components need to ensure that html being sent to the __html below needs to be free from XSS attack
-            // eslint-disable-next-line react/no-danger
-            _jsx("div", { dangerouslySetInnerHTML: { __html: ArticleMockData.fullArticleContent.content } }), skeletonize: false, title: ArticleMockData.fullArticleContent.header, meta: [
-                _jsx(Text, { variant: 'secondary', "aria-label": 'category', children: ArticleMockData.fullArticleContent.meta.category }),
-                _jsx(Text, { variant: 'secondary', "aria-label": 'published date', children: ArticleMockData.fullArticleContent.meta.publishedDate }),
-                _jsxs(Flex, { container: { gap: 2, alignItems: 'center' }, children: [_jsxs(Flex, { container: { gap: 1, alignItems: 'center' }, children: [_jsx(Icon, { name: 'thumbs-up-solid' }), _jsxs(Text, { "aria-label": 'likes', children: ["(", ArticleMockData.fullArticleContent.meta.likes, ")"] })] }), _jsxs(Flex, { container: { gap: 1, alignItems: 'center' }, children: [_jsx(Icon, { name: 'thumbs-down-solid' }), _jsxs(Text, { "aria-label": 'dislikes', children: ["(", ArticleMockData.fullArticleContent.meta.disLikes, ")"] })] })] })
-            ], footer: _jsx(ArticleFooter, { content: _jsxs(Flex, { container: { gap: 1 }, children: [_jsx(Text, { children: "Was this helpful ?" }), " ", _jsx(Button, { children: "Yes" }), " ", _jsx(Button, { children: "No" })] }), tags: [
-                    {
-                        id: 'Retail banking',
-                        tagName: '#Retail_banking'
-                    },
+                : undefined, backNavigation: {
+                title: backButtonText,
+                onClick: onBackToArticlesClick
+            }, primaryActions: showPrimaryActions
+                ? [
                     {
-                        id: 'difficult_customers',
-                        tagName: '#Difficult_customers'
+                        icon: 'star',
+                        label: 'Follow',
+                        id: createUID(),
+                        onClick: id => {
+                            action('Follow')(id);
+                        }
                     },
                     {
-                        id: '223444',
-                        tagName: '#CSR_Skills'
-                    },
-                    {
-                        id: '223446',
-                        tagName: '#Premium_Customers'
-                    },
+                        icon: 'open',
+                        label: 'Open',
+                        id: createUID(),
+                        onClick: id => {
+                            action('Open')(id);
+                        }
+                    }
+                ]
+                : undefined, secondaryActions: showSecondaryActions
+                ? [
                     {
-                        id: '223447',
-                        tagName: '#Rare_Customers'
+                        text: 'Send in email',
+                        id: 'action1',
+                        onClick: action('Action')
                     },
                     {
-                        id: '223448',
-                        tagName: '#Finance_Customers'
+                        text: 'Send in chat',
+                        id: 'action2',
+                        onClick: action('Action')
                     }
-                ], onTagClick: action('Tag clicked') }) }) }));
-};
-export const ArticleStorySkeletonize = () => {
-    const onBackToArticlesClick = (event) => {
-        event.preventDefault();
-    };
-    return (_jsx("div", { style: { maxWidth: '31.25rem', maxHeight: '100vh' }, children: _jsx(Article, { skeletonize: true, navigation: _jsx(Link, { href: '/', onClick: onBackToArticlesClick, children: _jsxs(Flex, { container: { alignItems: 'center', gap: 1 }, children: [_jsx(Icon, { name: 'caret-left' }), _jsx(Text, { children: "Back to articles" })] }) }), primaryActions: _jsxs(_Fragment, { children: [_jsx(Button, { variant: 'simple', icon: true, children: _jsx(Icon, { name: 'star' }) }), _jsx(Button, { variant: 'simple', icon: true, children: _jsx(Icon, { name: 'open' }) })] }), secondaryActions: [
-                {
-                    text: 'Filter 1',
-                    id: 'f1a'
-                },
-                {
-                    text: 'Filter 2',
-                    id: 'f2a'
+                ]
+                : undefined, content: _jsx(HTML, { content: ArticleMockData.fullArticleContent.content }), title: ArticleMockData.fullArticleContent.header, meta: {
+                category: ArticleMockData.fullArticleContent.meta.category,
+                publishedDate: ArticleMockData.fullArticleContent.meta.publishedDate,
+                feedback: {
+                    likes: ArticleMockData.fullArticleContent.meta.likes,
+                    dislikes: ArticleMockData.fullArticleContent.meta.disLikes
                 }
-            ] }) }));
+            }, footer: showFooter
+                ? {
+                    feedback: enableFeedback
+                        ? {
+                            showThanksMessage: showFeedbackThanks,
+                            status: feedbackStatus,
+                            onFeedbackClick
+                        }
+                        : undefined,
+                    tags: showTags
+                        ? {
+                            list: [
+                                {
+                                    id: 'Retail banking',
+                                    tagName: '#Retail_banking'
+                                },
+                                {
+                                    id: 'Billing',
+                                    tagName: '#Billing'
+                                },
+                                {
+                                    id: '223444',
+                                    tagName: '#CSR_Skills'
+                                },
+                                {
+                                    id: '223446',
+                                    tagName: '#Premium_Customers'
+                                },
+                                {
+                                    id: '223447',
+                                    tagName: '#Rare_Customers'
+                                },
+                                {
+                                    id: '223448',
+                                    tagName: '#Finance_Customers'
+                                }
+                            ],
+                            onTagClick: action('Tag clicked')
+                        }
+                        : undefined,
+                    relatedLinks: showRelatedLinks
+                        ? [
+                            { title: 'Retail banking for beginners', href: 'https://pega.com' },
+                            { title: 'How to handle premium customers', href: 'https://pega.com' }
+                        ]
+                        : undefined,
+                    relatedArticles: showMoreLikeThis
+                        ? [
+                            {
+                                title: 'What are the implications of change in billing cycle',
+                                onClick: action('Related article'),
+                                id: createUID()
+                            },
+                            {
+                                title: 'What is the best billing cycle for premium customers',
+                                onClick: action('Related article'),
+                                id: createUID()
+                            },
+                            {
+                                title: 'How to enable automatic bill payment',
+                                onClick: action('Related article'),
+                                id: createUID()
+                            }
+                        ]
+                        : undefined,
+                    attachments: showAttachments
+                        ? [
+                            { name: 'Billing cycle FAQ.doc', onDownload: action('On Download') },
+                            { name: 'Training video.mp4', onDownload: action('On Download') },
+                            { name: 'Terms and conditions.pdf', onDownload: action('On Download') }
+                        ]
+                        : undefined
+                }
+                : undefined, loading: loading }) }));
+};
+ArticleStory.args = {
+    showHeader: true,
+    backButtonText: 'Back to all articles',
+    showPrimaryActions: true,
+    showSecondaryActions: true,
+    showFooter: true,
+    enableFeedback: true,
+    showTags: true,
+    showRelatedLinks: true,
+    showMoreLikeThis: true,
+    showAttachments: true
+};
+ArticleStory.argTypes = {
+    showHeader: { control: { type: 'boolean' } },
+    backButtonText: { control: { type: 'text' } },
+    showPrimaryActions: { control: { type: 'boolean' } },
+    showSecondaryActions: { control: { type: 'boolean' } },
+    showFooter: { control: { type: 'boolean' } },
+    enableFeedback: { control: { type: 'boolean' } },
+    showTags: { control: { type: 'boolean' } },
+    showRelatedLinks: { control: { type: 'boolean' } },
+    showMoreLikeThis: { control: { type: 'boolean' } },
+    showAttachments: { control: { type: 'boolean' } }
 };
 //# sourceMappingURL=Article.stories.js.map

package/lib/cs/Article/Article.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Article.stories.js","sourceRoot":"","sources":["../../../src/cs/Article/Article.stories.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAGlD,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AACvF,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AACxF,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AACxF,OAAO,KAAK,aAAa,MAAM,mEAAmE,CAAC;AACnG,OAAO,KAAK,iBAAiB,MAAM,wEAAwE,CAAC;AAC5G,OAAO,KAAK,mBAAmB,MAAM,0EAA0E,CAAC;AAChH,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE/D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAElD,YAAY,CAAC,QAAQ,EAAE,QAAQ,EAAE,aAAa,EAAE,iBAAiB,EAAE,mBAAmB,CAAC,CAAC;AAExF,eAAe;IACb,KAAK,EAAE,0BAA0B;IACjC,SAAS,EAAE,OAAO;IAClB,aAAa,EAAE,EAAE,aAAa,EAAE;IAChC,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACM,CAAC;AAEV,MAAM,CAAC,MAAM,YAAY,GAAU,GAAG,EAAE;IACtC,MAAM,qBAAqB,GAAG,CAAC,KAAiB,EAAE,EAAE;QAClD,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO,CACL,cACE,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,SAAS,EAAE,OAAO;SACnB,YAED,KAAC,OAAO,IACN,UAAU,EACR,KAAC,IAAI,IAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,qBAAqB,YAC3C,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC/C,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,EAC1B,KAAC,IAAI,uCAA4B,IAC5B,GACF,EAET,cAAc,EACZ,8BACE,KAAC,MAAM,kBAAY,MAAM,EAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,kBAC7C,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,GACb,EACT,KAAC,MAAM,kBAAY,MAAM,EAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,kBAC7C,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,GACb,IACR,EAEL,gBAAgB,EAAE;gBAChB;oBACE,IAAI,EAAE,UAAU;oBAChB,EAAE,EAAE,KAAK;iBACV;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,EAAE,EAAE,KAAK;iBACV;aACF,EACD,OAAO;YACL,uHAAuH;YACvH,2CAA2C;YAC3C,cAAK,uBAAuB,EAAE,EAAE,MAAM,EAAE,eAAe,CAAC,kBAAkB,CAAC,OAAO,EAAE,GAAI,EAE1F,WAAW,EAAE,KAAK,EAClB,KAAK,EAAE,eAAe,CAAC,kBAAkB,CAAC,MAAM,EAChD,IAAI,EAAE;gBACJ,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,gBAAY,UAAU,YAC5C,eAAe,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,GAC5C;gBACP,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,gBAAY,gBAAgB,YAClD,eAAe,CAAC,kBAAkB,CAAC,IAAI,CAAC,aAAa,GACjD;gBACP,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC/C,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC/C,KAAC,IAAI,IAAC,IAAI,EAAC,iBAAiB,GAAG,EAC/B,MAAC,IAAI,kBAAY,OAAO,kBAAG,eAAe,CAAC,kBAAkB,CAAC,IAAI,CAAC,KAAK,SAAS,IAC5E,EACP,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,aAC/C,KAAC,IAAI,IAAC,IAAI,EAAC,mBAAmB,GAAG,EACjC,MAAC,IAAI,kBAAY,UAAU,kBACvB,eAAe,CAAC,kBAAkB,CAAC,IAAI,CAAC,QAAQ,SAC7C,IACF,IACF;aACR,EACD,MAAM,EACJ,KAAC,aAAa,IACZ,OAAO,EACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,aACzB,KAAC,IAAI,qCAA0B,OAAC,KAAC,MAAM,sBAAa,OAAC,KAAC,MAAM,qBAAY,IACnE,EAET,IAAI,EAAE;oBACJ;wBACE,EAAE,EAAE,gBAAgB;wBACpB,OAAO,EAAE,iBAAiB;qBAC3B;oBACD;wBACE,EAAE,EAAE,qBAAqB;wBACzB,OAAO,EAAE,sBAAsB;qBAChC;oBACD;wBACE,EAAE,EAAE,QAAQ;wBACZ,OAAO,EAAE,aAAa;qBACvB;oBACD;wBACE,EAAE,EAAE,QAAQ;wBACZ,OAAO,EAAE,oBAAoB;qBAC9B;oBACD;wBACE,EAAE,EAAE,QAAQ;wBACZ,OAAO,EAAE,iBAAiB;qBAC3B;oBACD;wBACE,EAAE,EAAE,QAAQ;wBACZ,OAAO,EAAE,oBAAoB;qBAC9B;iBACF,EACD,UAAU,EAAE,MAAM,CAAC,aAAa,CAAC,GACjC,GAEJ,GACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAU,GAAG,EAAE;IACjD,MAAM,qBAAqB,GAAG,CAAC,KAAiB,EAAE,EAAE;QAClD,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC,CAAC;IAEF,OAAO,CACL,cAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,YACtD,KAAC,OAAO,IACN,WAAW,QACX,UAAU,EACR,KAAC,IAAI,IAAC,IAAI,EAAC,GAAG,EAAC,OAAO,EAAE,qBAAqB,YAC3C,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC/C,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,EAC1B,KAAC,IAAI,mCAAwB,IACxB,GACF,EAET,cAAc,EACZ,8BACE,KAAC,MAAM,IAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,kBAC3B,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,GACb,EACT,KAAC,MAAM,IAAC,OAAO,EAAC,QAAQ,EAAC,IAAI,kBAC3B,KAAC,IAAI,IAAC,IAAI,EAAC,MAAM,GAAG,GACb,IACR,EAEL,gBAAgB,EAAE;gBAChB;oBACE,IAAI,EAAE,UAAU;oBAChB,EAAE,EAAE,KAAK;iBACV;gBACD;oBACE,IAAI,EAAE,UAAU;oBAChB,EAAE,EAAE,KAAK;iBACV;aACF,GACD,GACE,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import { MouseEvent } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Meta, Story } from '@storybook/react';\n\nimport { Button, Flex, Icon, registerIcon, Link, Text } from '@pega/cosmos-react-core';\nimport * as openIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/open.icon';\nimport * as starIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/star.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';\nimport * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';\nimport { Article, ArticleFooter } from '@pega/cosmos-react-cs';\n\nimport { ArticleMockData } from './Article.mocks';\n\nregisterIcon(openIcon, starIcon, caretLeftIcon, thumbsUpSolidIcon, thumbsDownSolidIcon);\n\nexport default {\n  title: 'Customer Service/Article',\n  component: Article,\n  subcomponents: { ArticleFooter },\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\nexport const ArticleStory: Story = () => {\n  const onBackToArticlesClick = (event: MouseEvent) => {\n    event.preventDefault();\n  };\n\n  return (\n    <div\n      style={{\n        maxWidth: '31.25rem',\n        maxHeight: '100vh'\n      }}\n    >\n      <Article\n        navigation={\n          <Link href='/' onClick={onBackToArticlesClick}>\n            <Flex container={{ alignItems: 'center', gap: 1 }}>\n              <Icon name='caret-left' />\n              <Text>Back to all articles</Text>\n            </Flex>\n          </Link>\n        }\n        primaryActions={\n          <>\n            <Button aria-label='star' variant='simple' icon>\n              <Icon name='star' />\n            </Button>\n            <Button aria-label='open' variant='simple' icon>\n              <Icon name='open' />\n            </Button>\n          </>\n        }\n        secondaryActions={[\n          {\n            text: 'Filter 1',\n            id: 'f1a'\n          },\n          {\n            text: 'Filter 2',\n            id: 'f2a'\n          }\n        ]}\n        content={\n          // TODO : Container components need to ensure that html being sent to the __html below needs to be free from XSS attack\n          // eslint-disable-next-line react/no-danger\n          <div dangerouslySetInnerHTML={{ __html: ArticleMockData.fullArticleContent.content }} />\n        }\n        skeletonize={false}\n        title={ArticleMockData.fullArticleContent.header}\n        meta={[\n          <Text variant='secondary' aria-label='category'>\n            {ArticleMockData.fullArticleContent.meta.category}\n          </Text>,\n          <Text variant='secondary' aria-label='published date'>\n            {ArticleMockData.fullArticleContent.meta.publishedDate}\n          </Text>,\n          <Flex container={{ gap: 2, alignItems: 'center' }}>\n            <Flex container={{ gap: 1, alignItems: 'center' }}>\n              <Icon name='thumbs-up-solid' />\n              <Text aria-label='likes'>({ArticleMockData.fullArticleContent.meta.likes})</Text>\n            </Flex>\n            <Flex container={{ gap: 1, alignItems: 'center' }}>\n              <Icon name='thumbs-down-solid' />\n              <Text aria-label='dislikes'>\n                ({ArticleMockData.fullArticleContent.meta.disLikes})\n              </Text>\n            </Flex>\n          </Flex>\n        ]}\n        footer={\n          <ArticleFooter\n            content={\n              <Flex container={{ gap: 1 }}>\n                <Text>Was this helpful ?</Text> <Button>Yes</Button> <Button>No</Button>\n              </Flex>\n            }\n            tags={[\n              {\n                id: 'Retail banking',\n                tagName: '#Retail_banking'\n              },\n              {\n                id: 'difficult_customers',\n                tagName: '#Difficult_customers'\n              },\n              {\n                id: '223444',\n                tagName: '#CSR_Skills'\n              },\n              {\n                id: '223446',\n                tagName: '#Premium_Customers'\n              },\n              {\n                id: '223447',\n                tagName: '#Rare_Customers'\n              },\n              {\n                id: '223448',\n                tagName: '#Finance_Customers'\n              }\n            ]}\n            onTagClick={action('Tag clicked')}\n          />\n        }\n      />\n    </div>\n  );\n};\n\nexport const ArticleStorySkeletonize: Story = () => {\n  const onBackToArticlesClick = (event: MouseEvent) => {\n    event.preventDefault();\n  };\n\n  return (\n    <div style={{ maxWidth: '31.25rem', maxHeight: '100vh' }}>\n      <Article\n        skeletonize\n        navigation={\n          <Link href='/' onClick={onBackToArticlesClick}>\n            <Flex container={{ alignItems: 'center', gap: 1 }}>\n              <Icon name='caret-left' />\n              <Text>Back to articles</Text>\n            </Flex>\n          </Link>\n        }\n        primaryActions={\n          <>\n            <Button variant='simple' icon>\n              <Icon name='star' />\n            </Button>\n            <Button variant='simple' icon>\n              <Icon name='open' />\n            </Button>\n          </>\n        }\n        secondaryActions={[\n          {\n            text: 'Filter 1',\n            id: 'f1a'\n          },\n          {\n            text: 'Filter 2',\n            id: 'f2a'\n          }\n        ]}\n      />\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"Article.stories.js","sourceRoot":"","sources":["../../../src/cs/Article/Article.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { MouseEvent, useEffect, useState } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Meta, Story } from '@storybook/react';\n\nimport { registerIcon, createUID, HTML } from '@pega/cosmos-react-core';\nimport * as openIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/open.icon';\nimport * as starIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/star.icon';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';\nimport * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';\nimport { Article, ArticleFooter, ArticleFooterProps } from '@pega/cosmos-react-cs';\n\nimport { ArticleMockData } from './Article.mocks';\n\nregisterIcon(openIcon, starIcon, caretLeftIcon, thumbsUpSolidIcon, thumbsDownSolidIcon);\n\nexport default {\n  title: 'Customer Service/Article',\n  component: Article,\n  subcomponents: { ArticleFooter },\n  parameters: {\n    layout: 'fullscreen'\n  }\n} as Meta;\n\nexport interface ArticleDemoProps {\n  showHeader: boolean;\n  backButtonText: string;\n  showPrimaryActions: boolean;\n  showSecondaryActions: boolean;\n  showFooter: boolean;\n  enableFeedback: boolean;\n  showTags: boolean;\n  showRelatedLinks: boolean;\n  showMoreLikeThis: boolean;\n  showAttachments: boolean;\n}\n\nexport const ArticleStory: Story<ArticleDemoProps> = (args: ArticleDemoProps) => {\n  const [feedbackStatus, setFeedbackStatus] =\n    useState<Required<ArticleFooterProps>['feedback']['status']>();\n  const [showFeedbackThanks, setShowFeedbackThanks] = useState<boolean>(false);\n  const [loading, setLoading] = useState<boolean>(true);\n\n  const {\n    showHeader,\n    backButtonText,\n    showPrimaryActions,\n    showSecondaryActions,\n    showFooter,\n    enableFeedback,\n    showTags,\n    showRelatedLinks,\n    showMoreLikeThis,\n    showAttachments\n  } = args;\n\n  const onBackToArticlesClick = (event: MouseEvent) => {\n    event.preventDefault();\n  };\n\n  const onFeedbackClick: Required<ArticleFooterProps>['feedback']['onFeedbackClick'] = button => {\n    if (button === 'like') {\n      if (feedbackStatus === 'liked') {\n        setFeedbackStatus(undefined);\n      } else {\n        setFeedbackStatus('liked');\n        setShowFeedbackThanks(true);\n      }\n    } else if (feedbackStatus === 'disliked') {\n      setFeedbackStatus(undefined);\n    } else {\n      setFeedbackStatus('disliked');\n      setShowFeedbackThanks(true);\n    }\n  };\n\n  useEffect(() => {\n    setTimeout(() => {\n      setLoading(false);\n    }, 2000);\n  }, []);\n\n  return (\n    <div\n      style={{\n        maxWidth: '25rem'\n      }}\n    >\n      <Article\n        header={\n          showHeader\n            ? {\n                title: 'Knowledge articles',\n                icon: 'book-open'\n              }\n            : undefined\n        }\n        backNavigation={{\n          title: backButtonText,\n          onClick: onBackToArticlesClick\n        }}\n        primaryActions={\n          showPrimaryActions\n            ? [\n                {\n                  icon: 'star',\n                  label: 'Follow',\n                  id: createUID(),\n                  onClick: id => {\n                    action('Follow')(id);\n                  }\n                },\n                {\n                  icon: 'open',\n                  label: 'Open',\n                  id: createUID(),\n                  onClick: id => {\n                    action('Open')(id);\n                  }\n                }\n              ]\n            : undefined\n        }\n        secondaryActions={\n          showSecondaryActions\n            ? [\n                {\n                  text: 'Send in email',\n                  id: 'action1',\n                  onClick: action('Action')\n                },\n                {\n                  text: 'Send in chat',\n                  id: 'action2',\n                  onClick: action('Action')\n                }\n              ]\n            : undefined\n        }\n        content={<HTML content={ArticleMockData.fullArticleContent.content} />}\n        title={ArticleMockData.fullArticleContent.header}\n        meta={{\n          category: ArticleMockData.fullArticleContent.meta.category,\n          publishedDate: ArticleMockData.fullArticleContent.meta.publishedDate,\n          feedback: {\n            likes: ArticleMockData.fullArticleContent.meta.likes,\n            dislikes: ArticleMockData.fullArticleContent.meta.disLikes\n          }\n        }}\n        footer={\n          showFooter\n            ? {\n                feedback: enableFeedback\n                  ? {\n                      showThanksMessage: showFeedbackThanks,\n                      status: feedbackStatus,\n                      onFeedbackClick\n                    }\n                  : undefined,\n                tags: showTags\n                  ? {\n                      list: [\n                        {\n                          id: 'Retail banking',\n                          tagName: '#Retail_banking'\n                        },\n                        {\n                          id: 'Billing',\n                          tagName: '#Billing'\n                        },\n                        {\n                          id: '223444',\n                          tagName: '#CSR_Skills'\n                        },\n                        {\n                          id: '223446',\n                          tagName: '#Premium_Customers'\n                        },\n                        {\n                          id: '223447',\n                          tagName: '#Rare_Customers'\n                        },\n                        {\n                          id: '223448',\n                          tagName: '#Finance_Customers'\n                        }\n                      ],\n                      onTagClick: action('Tag clicked')\n                    }\n                  : undefined,\n                relatedLinks: showRelatedLinks\n                  ? [\n                      { title: 'Retail banking for beginners', href: 'https://pega.com' },\n                      { title: 'How to handle premium customers', href: 'https://pega.com' }\n                    ]\n                  : undefined,\n                relatedArticles: showMoreLikeThis\n                  ? [\n                      {\n                        title: 'What are the implications of change in billing cycle',\n                        onClick: action('Related article'),\n                        id: createUID()\n                      },\n                      {\n                        title: 'What is the best billing cycle for premium customers',\n                        onClick: action('Related article'),\n                        id: createUID()\n                      },\n                      {\n                        title: 'How to enable automatic bill payment',\n                        onClick: action('Related article'),\n                        id: createUID()\n                      }\n                    ]\n                  : undefined,\n                attachments: showAttachments\n                  ? [\n                      { name: 'Billing cycle FAQ.doc', onDownload: action('On Download') },\n                      { name: 'Training video.mp4', onDownload: action('On Download') },\n                      { name: 'Terms and conditions.pdf', onDownload: action('On Download') }\n                    ]\n                  : undefined\n              }\n            : undefined\n        }\n        loading={loading}\n      />\n    </div>\n  );\n};\n\nArticleStory.args = {\n  showHeader: true,\n  backButtonText: 'Back to all articles',\n  showPrimaryActions: true,\n  showSecondaryActions: true,\n  showFooter: true,\n  enableFeedback: true,\n  showTags: true,\n  showRelatedLinks: true,\n  showMoreLikeThis: true,\n  showAttachments: true\n};\n\nArticleStory.argTypes = {\n  showHeader: { control: { type: 'boolean' } },\n  backButtonText: { control: { type: 'text' } },\n  showPrimaryActions: { control: { type: 'boolean' } },\n  showSecondaryActions: { control: { type: 'boolean' } },\n  showFooter: { control: { type: 'boolean' } },\n  enableFeedback: { control: { type: 'boolean' } },\n  showTags: { control: { type: 'boolean' } },\n  showRelatedLinks: { control: { type: 'boolean' } },\n  showMoreLikeThis: { control: { type: 'boolean' } },\n  showAttachments: { control: { type: 'boolean' } }\n};\n"]}

package/lib/cs/ArticleList/ArticleList.mocks.d.ts

@@ -1,21 +1,140 @@
-export declare const ArticleListMockData: {
-    articleList: {
+export declare const suggestedMock: {
+    count: number;
+    articles: ({
         articleId: string;
-        header: string;
+        title: string;
+        href: string;
         abstract: string;
         meta: {
             category: string;
             publishedDate: string;
-            likes: number;
-            disLikes: number;
+            feedback: {
+                likes: number;
+                dislikes: number;
+            };
         };
+        isFollowed: boolean;
+        isLiked: boolean;
+        quickFilters?: undefined;
+    } | {
+        articleId: string;
+        title: string;
+        href: string;
+        abstract: string;
+        meta: {
+            category: string;
+            publishedDate: string;
+            feedback: {
+                likes: number;
+                dislikes: number;
+            };
+        };
+        isFollowed: boolean;
+        isLiked: boolean;
+        quickFilters: {
+            id: string;
+            name: string;
+        }[];
+    })[];
+};
+export declare const followedMock: {
+    count: number;
+    articles: ({
+        articleId: string;
+        title: string;
+        href: string;
+        abstract: string;
+        meta: {
+            category: string;
+            publishedDate: string;
+            feedback: {
+                likes: number;
+                dislikes: number;
+            };
+        };
+        isFollowed: boolean;
+        isLiked: boolean;
+        quickFilters: {
+            id: string;
+            name: string;
+        }[];
+    } | {
+        articleId: string;
+        title: string;
+        href: string;
+        abstract: string;
+        meta: {
+            category: string;
+            publishedDate: string;
+            feedback: {
+                likes: number;
+                dislikes: number;
+            };
+        };
+        isFollowed: boolean;
+        isLiked: boolean;
+        quickFilters?: undefined;
+    })[];
+    category: ({
+        id: string;
+        primary: string;
+        secondary: string[];
+        items: {
+            id: string;
+            primary: string;
+            secondary: string[];
+        }[];
+    } | {
+        id: string;
+        primary: string;
+        secondary: string[];
+        items?: undefined;
+    })[];
+    sortBy: {
+        id: string;
+        primary: string;
+    }[];
+};
+export declare const searchMock: {
+    count: number;
+    articles: {
+        articleId: string;
+        title: string;
+        href: string;
+        abstract: string;
+        meta: {
+            category: string;
+            publishedDate: string;
+            feedback: {
+                likes: number;
+                dislikes: number;
+            };
+        };
+        isFollowed: boolean;
+        isLiked: boolean;
+        quickFilters: {
+            id: string;
+            name: string;
+        }[];
     }[];
-    categoriesList: {
+    category: ({
+        id: string;
+        primary: string;
+        secondary: string[];
+        items: {
+            id: string;
+            primary: string;
+            secondary: string[];
+        }[];
+    } | {
+        id: string;
+        primary: string;
+        secondary: string[];
+        items?: undefined;
+    })[];
+    sortBy: {
         id: string;
-        name: string;
-        level: string;
-        category: string;
+        primary: string;
     }[];
-    sortByOptions: string[];
 };
 //# sourceMappingURL=ArticleList.mocks.d.ts.map

package/lib/cs/ArticleList/ArticleList.mocks.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ArticleList.mocks.d.ts","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.mocks.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;CA4G/B,CAAC"}
+{"version":3,"file":"ArticleList.mocks.d.ts","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.mocks.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwJzB,CAAC;AACF,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgKxB,CAAC;AAEF,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwHtB,CAAC"}