npm - @pega/cosmos-react-demos - Versions diffs - 3.0.0-dev.4.1 → 3.0.0-dev.4.2 - Mend

@pega/cosmos-react-demos 3.0.0-dev.4.1 → 3.0.0-dev.4.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (497) hide show

package/jsx/core/Tree/Tree.stories.jsx CHANGED Viewed

@@ -15,7 +15,7 @@ export const BaseTree = () => {
           </>);
         }}/>);
 };
-export const StandardTreeDemo = ({ lined }) => {
+export const StandardTreeDemo = (args) => {
     const getMockNodes = ({ length = 5, parent = true } = {}) => {
         return Array.from({ length }, (_, i) => {
             const isParent = parent && i !== 2;
@@ -60,7 +60,7 @@ export const StandardTreeDemo = ({ lined }) => {
         });
     };
     return (<>
-      <StandardTree lined={lined} currentNodeId={currentNodeId} nodes={allNodes} onNodeClick={id => {
+      <StandardTree lined={args.lined} currentNodeId={currentNodeId} nodes={allNodes} onNodeClick={id => {
             const clickedNode = treeHelpers.getNode(allNodes, id);
             setCurrentNodeId(id);
             if (!clickedNode?.nodes)

package/jsx/core/Tree/Tree.stories.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tree.stories.jsx","sourceRoot":"","sources":["../../../src/core/Tree/Tree.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAGlD,OAAO,EACL,MAAM,EACN,YAAY,EAEZ,IAAI,EAEJ,WAAW,EACX,SAAS,EACT,eAAe,EAChB,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,cAAc,EAAE,MAAM,eAAe,CAAC;AAE/C,eAAe;IACb,KAAK,EAAE,WAAW;IAClB,SAAS,EAAE,IAAI;CACR,CAAC;AAEV,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,EAAE;IAC3B,OAAO,CACL,CAAC,cAAc,CACb,KAAK,CAAC,CAAC,WAAW,CAAC,eAAe,CAAC,CAAC,CACpC,YAAY,CAAC,CAAC,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;YAChC,OAAO,CACL,EACE;YAAA,CAAC,IAAI,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,CAChB;YAAA,CAAC,OAAO,CACV;UAAA,GAAG,CACJ,CAAC;QACJ,CAAC,CAAC,EACF,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAA4C,~~CAAC~~,~~EAAE~~,~~KAAK~~,EAAE~~,EAAE,EAAE~~;~~IACrF~~,MAAM,YAAY,GAAG,CAAC,EACpB,MAAM,GAAG,CAAC,EACV,MAAM,GAAG,IAAI,KAC4B,EAAE,EAA8B,EAAE;QAC3E,OAAO,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE;YACrC,MAAM,QAAQ,GAAG,MAAM,IAAI,CAAC,KAAK,CAAC,CAAC;YACnC,MAAM,EAAE,GAAG,SAAS,EAAE,CAAC;YACvB,OAAO;gBACL,EAAE;gBACF,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM;gBACnC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,gBAAgB;gBAClD,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS;gBAChC,OAAO,EAAE;oBACP,EAAE,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,CAAC,cAAc,EAAE,EAAE,CAAC,EAAE;oBAC/E,EAAE,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,CAAC,aAAa,EAAE,EAAE,CAAC,EAAE;iBAC5E;gBACD,OAAO,EAAE,QAAQ;oBACf,CAAC,CAAC,SAAS;oBACX,CAAC,CAAC,MAAM,CAAC,EAAE;wBACP,MAAM,CAAC,oBAAoB,MAAM,EAAE,CAAC,EAAE,CAAC;oBACzC,CAAC;aACN,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,EAAsB,CAAC;IACzE,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAA6B,GAAG,EAAE;QACxE,OAAO,YAAY,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,CAAC;IACtC,CAAC,CAAC,CAAC;IAEH,MAAM,cAAc,GAAG,CAAC,EAAU,EAAE,EAAE;QACpC,UAAU,CAAC,GAAG,EAAE;YACd,WAAW,CAAC,IAAI,CAAC,EAAE;gBACjB,OAAO,WAAW,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE;oBAC1C,OAAO;wBACL,GAAG,IAAI;wBACP,OAAO,EAAE,KAAK;wBACd,KAAK,EAAE,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,EAAE,GAAG,YAAY,EAAE,CAAC;qBAClD,CAAC;gBACJ,CAAC,CAAC,CAAC;YACL,CAAC,CAAC,CAAC;QACL,CAAC,EAAE,IAAI,CAAC,CAAC;IACX,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,CAAC,EAAkB,EAAE,EAAE;QACtC,WAAW,CAAC,IAAI,CAAC,EAAE;YACjB,OAAO,WAAW,CAAC,QAAQ,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACxC,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,EACE;MAAA,CAAC,YAAY,CACX,KAAK,CAAC,CAAC,KAAK,CAAC,~~CACb~~,aAAa,CAAC,CAAC,aAAa,CAAC,CAC7B,KAAK,CAAC,CAAC,QAAQ,CAAC,CAChB,WAAW,CAAC,CAAC,EAAE,CAAC,EAAE;YAChB,MAAM,WAAW,GAAG,WAAW,CAAC,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;YACtD,gBAAgB,CAAC,EAAE,CAAC,CAAC;YAErB,IAAI,CAAC,WAAW,EAAE,KAAK;gBAAE,OAAO;YAEhC,WAAW,CAAC,IAAI,CAAC,EAAE,CACjB,WAAW,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,EAAE,IAAI,CAAC,EAAE;gBACnC,OAAO;oBACL,GAAG,IAAI;oBACP,QAAQ,EAAE,CAAC,IAAI,CAAC,QAAQ;oBACxB,OAAO,EAAE,IAAI,CAAC,KAAK,EAAE,MAAM,KAAK,CAAC;iBAClC,CAAC;YACJ,CAAC,CAAC,CACH,CAAC;YAGF,IAAI,WAAW,EAAE,KAAK,EAAE,MAAM,GAAG,CAAC;gBAAE,OAAO;YAE3C,cAAc,CAAC,EAAE,CAAC,CAAC;QACrB,CAAC,CAAC,EAEJ;MAAA,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,EAAE,MAAM,CACzD;MAAA,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,aAAa,IAAI,EAAE,CAAC,CAAC,CAAC,qBAAqB,EAAE,MAAM,CACrF;IAAA,GAAG,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,gBAAgB,CAAC,IAAI,GAAG;IACtB,KAAK,EAAE,KAAK;CACb,CAAC;AAEF,gBAAgB,CAAC,QAAQ,GAAG;IAC1B,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE;CACxC,CAAC","sourcesContent":["import { useState } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Meta, Story } from '@storybook/react';\n\nimport {\n Button,\n StandardTree,\n StandardTreeProps,\n Tree,\n TreeNode,\n treeHelpers,\n createUID,\n themeDefinition\n} from '@pega/cosmos-react-core';\n\nimport { themeToTree } from './Tree.mocks';\nimport { StyledBaseTree } from './Tree.styles';\n\nexport default {\n title: 'Core/Tree',\n component: Tree\n} as Meta;\n\nexport const BaseTree = () => {\n return (\n <StyledBaseTree\n nodes={themeToTree(themeDefinition)}\n nodeRenderer={({ id, subTree }) => {\n return (\n <>\n <span>{id}</span>\n {subTree}\n </>\n );\n }}\n />\n );\n};\n\nexport const StandardTreeDemo: Story<Pick<StandardTreeProps, 'lined'>> = ({ lined }) => {\n const getMockNodes = ({\n length = 5,\n parent = true\n }: { length?: number; parent?: boolean } = {}): StandardTreeProps['nodes'] => {\n return Array.from({ length }, (_, i) => {\n const isParent = parent && i !== 2;\n const id = createUID();\n return {\n id,\n label: isParent ? 'Parent' : 'Leaf',\n icon: isParent ? 'folder-solid' : 'document-solid',\n nodes: isParent ? [] : undefined,\n actions: [\n { id: 'star', text: 'Star', icon: 'star', onClick: action(`Star node: ${id}`) },\n { id: 'pin', text: 'Pin', icon: 'pin', onClick: action(`Pin node: ${id}`) }\n ],\n onClick: isParent\n ? undefined\n : nodeId => {\n action(`Action for node: ${nodeId}`)();\n }\n };\n });\n };\n\n const [currentNodeId, setCurrentNodeId] = useState<string \| undefined>();\n const [allNodes, setAllNodes] = useState<StandardTreeProps['nodes']>(() => {\n return getMockNodes({ length: 10 });\n });\n\n const loadChildNodes = (id: string) => {\n setTimeout(() => {\n setAllNodes(tree => {\n return treeHelpers.mapNode(tree, id, node => {\n return {\n ...node,\n loading: false,\n nodes: [...(node.nodes ?? []), ...getMockNodes()]\n };\n });\n });\n }, 1000);\n };\n\n const expandTo = (id: TreeNode['id']) => {\n setAllNodes(tree => {\n return treeHelpers.expandTo(tree, id);\n });\n };\n\n return (\n <>\n <StandardTree\n lined={lined}\n currentNodeId={currentNodeId}\n nodes={allNodes}\n onNodeClick={id => {\n const clickedNode = treeHelpers.getNode(allNodes, id);\n setCurrentNodeId(id);\n // If a leaf node, just set to current\n if (!clickedNode?.nodes) return;\n\n setAllNodes(tree =>\n treeHelpers.mapNode(tree, id, node => {\n return {\n ...node,\n expanded: !node.expanded,\n loading: node.nodes?.length === 0\n };\n })\n );\n\n // If a parent node with children already loaded, we're done.\n if (clickedNode?.nodes?.length > 0) return;\n\n loadChildNodes(id);\n }}\n />\n <Button onClick={() => expandTo('')}>Collapse All</Button>\n <Button onClick={() => expandTo(currentNodeId \|\| '')}>Expand to active item</Button>\n </>\n );\n};\n\nStandardTreeDemo.args = {\n lined: false\n};\n\nStandardTreeDemo.argTypes = {\n lined: { control: { type: 'boolean' } }\n};\n"]}
1	+ {"version":3,"file":"Tree.stories.jsx","sourceRoot":"","sources":["../../../src/core/Tree/Tree.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Meta, Story } from '@storybook/react';\n\nimport {\n Button,\n StandardTree,\n StandardTreeProps,\n Tree,\n TreeNode,\n treeHelpers,\n createUID,\n themeDefinition\n} from '@pega/cosmos-react-core';\n\nimport { themeToTree } from './Tree.mocks';\nimport { StyledBaseTree } from './Tree.styles';\n\nexport default {\n title: 'Core/Tree',\n component: Tree\n} as Meta;\n\nexport const BaseTree = () => {\n return (\n <StyledBaseTree\n nodes={themeToTree(themeDefinition)}\n nodeRenderer={({ id, subTree }) => {\n return (\n <>\n <span>{id}</span>\n {subTree}\n </>\n );\n }}\n />\n );\n};\n\nexport const StandardTreeDemo: Story<Pick<StandardTreeProps, 'lined'>> = (\n args: Pick<StandardTreeProps, 'lined'>\n) => {\n const getMockNodes = ({\n length = 5,\n parent = true\n }: { length?: number; parent?: boolean } = {}): StandardTreeProps['nodes'] => {\n return Array.from({ length }, (_, i) => {\n const isParent = parent && i !== 2;\n const id = createUID();\n return {\n id,\n label: isParent ? 'Parent' : 'Leaf',\n icon: isParent ? 'folder-solid' : 'document-solid',\n nodes: isParent ? [] : undefined,\n actions: [\n { id: 'star', text: 'Star', icon: 'star', onClick: action(`Star node: ${id}`) },\n { id: 'pin', text: 'Pin', icon: 'pin', onClick: action(`Pin node: ${id}`) }\n ],\n onClick: isParent\n ? undefined\n : nodeId => {\n action(`Action for node: ${nodeId}`)();\n }\n };\n });\n };\n\n const [currentNodeId, setCurrentNodeId] = useState<string \| undefined>();\n const [allNodes, setAllNodes] = useState<StandardTreeProps['nodes']>(() => {\n return getMockNodes({ length: 10 });\n });\n\n const loadChildNodes = (id: string) => {\n setTimeout(() => {\n setAllNodes(tree => {\n return treeHelpers.mapNode(tree, id, node => {\n return {\n ...node,\n loading: false,\n nodes: [...(node.nodes ?? []), ...getMockNodes()]\n };\n });\n });\n }, 1000);\n };\n\n const expandTo = (id: TreeNode['id']) => {\n setAllNodes(tree => {\n return treeHelpers.expandTo(tree, id);\n });\n };\n\n return (\n <>\n <StandardTree\n lined={args.lined}\n currentNodeId={currentNodeId}\n nodes={allNodes}\n onNodeClick={id => {\n const clickedNode = treeHelpers.getNode(allNodes, id);\n setCurrentNodeId(id);\n // If a leaf node, just set to current\n if (!clickedNode?.nodes) return;\n\n setAllNodes(tree =>\n treeHelpers.mapNode(tree, id, node => {\n return {\n ...node,\n expanded: !node.expanded,\n loading: node.nodes?.length === 0\n };\n })\n );\n\n // If a parent node with children already loaded, we're done.\n if (clickedNode?.nodes?.length > 0) return;\n\n loadChildNodes(id);\n }}\n />\n <Button onClick={() => expandTo('')}>Collapse All</Button>\n <Button onClick={() => expandTo(currentNodeId \|\| '')}>Expand to active item</Button>\n </>\n );\n};\n\nStandardTreeDemo.args = {\n lined: false\n};\n\nStandardTreeDemo.argTypes = {\n lined: { control: { type: 'boolean' } }\n};\n"]}

package/jsx/cs/Article/Article.stories.d.ts CHANGED Viewed

@@ -1,14 +1,6 @@
 /// <reference types="react" />
-declare const _default: {
-    title: string;
-    component: import("react").FunctionComponent<import("@pega/cosmos-react-cs").ArticleProps & import("@pega/cosmos-react-core").ForwardProps>;
-    subcomponents: {
-        ArticleFooter: import("react").FunctionComponent<import("@pega/cosmos-react-cs").ArticleFooterProps & import("@pega/cosmos-react-core").ForwardProps>;
-    };
-    parameters: {
-        layout: string;
-    };
-};
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
 export declare const ArticleStory: () => JSX.Element;
 export declare const ArticleStorySkeletonize: () => JSX.Element;

package/jsx/cs/Article/Article.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Article.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/Article/Article.stories.tsx"],"names":[],"mappings":"~~;;;;;;;;;;;AAeA~~,~~wBAOE~~;~~AAEF~~,eAAO,MAAM,YAAY,mBA2GxB,CAAC;AAEF,eAAO,MAAM,uBAAuB,mBAwCnC,CAAC"}
1	+ {"version":3,"file":"Article.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/Article/Article.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;;AAcxC,wBAOU;AAEV,eAAO,MAAM,YAAY,mBA2GxB,CAAC;AAEF,eAAO,MAAM,uBAAuB,mBAwCnC,CAAC"}

package/jsx/cs/Article/Article.stories.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Article.stories.jsx","sourceRoot":"","sources":["../../../src/cs/Article/Article.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { MouseEvent } from 'react';\nimport { action } from '@storybook/addon-actions';\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};\n\nexport const ArticleStory = () => {\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 = () => {\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"]}
1	+ {"version":3,"file":"Article.stories.jsx","sourceRoot":"","sources":["../../../src/cs/Article/Article.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { MouseEvent } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Meta } 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 = () => {\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 = () => {\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"]}

package/jsx/cs/ArticleList/ArticleList.stories.d.ts CHANGED Viewed

@@ -1,15 +1,6 @@
 /// <reference types="react" />
-declare const _default: {
-    title: string;
-    component: import("react").FunctionComponent<import("@pega/cosmos-react-cs").ArticleListProps & import("@pega/cosmos-react-core").ForwardProps>;
-    subcomponents: {
-        ArticleSummary: import("react").FunctionComponent<import("@pega/cosmos-react-cs").ArticleSummaryProps & import("@pega/cosmos-react-core").ForwardProps>;
-        ArticleListHeader: import("react").FunctionComponent<import("@pega/cosmos-react-cs").ArticleListHeaderProps>;
-    };
-    parameters: {
-        layout: string;
-    };
-};
+import { Meta } from '@storybook/react';
+declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
 export declare const FirstArticleList: () => JSX.Element;
 export declare const ArticleListWithSkeleton: () => JSX.Element;

package/jsx/cs/ArticleList/ArticleList.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleList.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.stories.tsx"],"names":[],"mappings":"~~;;;;;;;;;;;;AA0BA~~,~~wBAOE~~;~~AAIF~~,eAAO,MAAM,gBAAgB,mBA2J5B,CAAC;AAEF,eAAO,MAAM,uBAAuB,mBASnC,CAAC"}
1	+ {"version":3,"file":"ArticleList.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.stories.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAC;;AAyBxC,wBAOU;AAIV,eAAO,MAAM,gBAAgB,mBA2J5B,CAAC;AAEF,eAAO,MAAM,uBAAuB,mBASnC,CAAC"}

package/jsx/cs/ArticleList/ArticleList.stories.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleList.stories.jsx","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAA8B,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,EACL,QAAQ,EACR,IAAI,EACJ,SAAS,EACT,IAAI,EACJ,IAAI,EACJ,UAAU,EACV,UAAU,EACV,WAAW,EACX,MAAM,EACN,MAAM,EACN,IAAI,EACJ,WAAW,EAEX,YAAY,EACb,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,iBAAiB,MAAM,wEAAwE,CAAC;AAC5G,OAAO,KAAK,mBAAmB,MAAM,0EAA0E,CAAC;AAChH,OAAO,KAAK,QAAQ,MAAM,6DAA6D,CAAC;AACxF,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAEvF,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAE1D,eAAe;IACb,KAAK,EAAE,8BAA8B;IACrC,SAAS,EAAE,WAAW;IACtB,aAAa,EAAE,EAAE,cAAc,EAAE,iBAAiB,EAAE;IACpD,UAAU,EAAE;QACV,MAAM,EAAE,YAAY;KACrB;CACF,CAAC;AAEF,YAAY,CAAC,iBAAiB,EAAE,mBAAmB,EAAE,QAAQ,CAAC,CAAC;AAE/D,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACnC,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACvC,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAClD,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAClD,SAAS,CACV,CAAC;IACF,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAClD,mBAAmB,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE;QACvE,OAAO;YACL,EAAE;YACF,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAC;YAC5B,QAAQ,EAAE,KAAK;SAChB,CAAC;IACJ,CAAC,CAAC,CACH,CAAC;IAEF,MAAM,sBAAsB,GAAG,CAAC,KAAiB,EAAE,EAAE;QACnD,KAAK,CAAC,cAAc,EAAE,CAAC;IACzB,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG;QACf,IAAI,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,EAAG;QAC1B,UAAU,EAAE,oBAAoB;QAChC,KAAK,EAAE,CAAC;QACR,OAAO,EAAE;YACP,MAAM,EAAE,CACN,CAAC,WAAW,CACV,KAAK,CAAC,CAAC,KAAK,CAAC,CACb,QAAQ,CAAC,CAAC,CAAC,KAAoD,EAAE,EAAE,CACjE,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAC7B,CACD,cAAc,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC,CACvC,cAAc,CAAC,CAAC,MAAM,CAAC,eAAe,CAAC,CAAC,CACxC,WAAW,CAAC,SAAS,EACrB,CACH;YACD,OAAO,EAAE;gBACP,EAAE,IAAI,EAAE,iBAAiB,EAAE,EAAE,EAAE,IAAI,EAAE;gBACrC,EAAE,IAAI,EAAE,iBAAiB,EAAE,EAAE,EAAE,IAAI,EAAE;aACtC;YACD,cAAc,EAAE,CACd,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,CAC1B;UAAA,CAAC,UAAU,CACT,OAAO,CAAC,QAAQ,CAChB,IAAI,CAAC,CAAC;oBACJ,KAAK,EAAE;wBACL;4BACE,OAAO,EAAE,UAAU;4BACnB,EAAE,EAAE,KAAK;yBACV;wBACD;4BACE,OAAO,EAAE,UAAU;4BACnB,EAAE,EAAE,KAAK;yBACV;qBACF;iBACF,CAAC,CACF,IAAI,CAAC,QAAQ,CACb,IAAI,CAAC,QAAQ,CACb,QAAQ,EAEZ;QAAA,EAAE,IAAI,CAAC,CACR;SACF;QACD,SAAS,EAAE,CACT,EACE;QAAA,CAAC,SAAS,CAAC,KAAK,CAAC,UAAU,CACzB;UAAA,CAAC,QAAQ,CACP,QAAQ,CAAC,CAAC,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC,CACpC,WAAW,CAAC,oBAAoB,CAChC,IAAI,CAAC,CAAC;gBACJ,KAAK,EAAE,cAAc;gBACrB,WAAW,EAAE,EAAE,CAAC,EAAE;oBAChB,MAAM,OAAO,GAAG,WAAW,CAAC,UAAU,CAAC,cAAc,EAAE,EAAE,EAAE,eAAe,CAAC,CAAC;oBAC5E,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,WAAW,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;oBAClE,iBAAiB,CAAC,OAAO,CAAC,CAAC;oBAC3B,iBAAiB,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC;gBAC5C,CAAC;aACF,CAAC,EAEN;QAAA,EAAE,SAAS,CACX;QAAA,CAAC,MAAM,CAAC,KAAK,CAAC,SAAS,CACrB;UAAA,CAAC,mBAAmB,CAAC,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAC5C,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,MAAM,CAAC,CACjC,CAAC,CACJ;QAAA,EAAE,MAAM,CACV;MAAA,GAAG,CACJ;KACF,CAAC;IACF,OAAO,CACL,CAAC,GAAG,CACF,KAAK,CAAC,CAAC;YACL,KAAK,EAAE,UAAU;YACjB,SAAS,EAAE,OAAO;SACnB,CAAC,CAEF;MAAA,CAAC,WAAW,CACV,WAAW,CAAC,CAAC,KAAK,CAAC,CACnB,MAAM,CAAC,CACL,CAAC,iBAAiB,CAChB,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CACpB,KAAK,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CACtB,UAAU,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,CAChC,OAAO,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,CAC1B,SAAS,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,CAC9B,QAAQ,CAAC,CAAC,MAAM,CAAC,0BAA0B,CAAC,CAAC,EAC7C,CACH,CACD,MAAM,CAAC,CACL,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,CAC3E;YAAA,CAAC,UAAU,CACT,KAAK,CAAC,CAAC,EAAE,CAAC,CACV,UAAU,CAAC,CAAC,WAAW,CAAC,CACxB,YAAY,CAAC,CAAC,UAAU,CAAC,EAAE;gBACzB,cAAc,CAAC,UAAU,CAAC,CAAC;YAC7B,CAAC,CAAC,EAEN;UAAA,EAAE,IAAI,CAAC,CACR,CAED;QAAA,CAAC,mBAAmB,CAAC,WAAW,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,EAAE,EAAE,EAAE;YACpD,OAAO,CACL,CAAC,cAAc,CACb,GAAG,CAAC,CAAC,EAAE,CAAC,QAAQ,EAAE,CAAC,CACnB,MAAM,CAAC,CACL,CAAC,IAAI,CACH,IAAI,CAAC,iBAAiB,CACtB,eAAe,CAAC,CAAC,QAAQ,CAAC,SAAS,CAAC,CACpC,OAAO,CAAC,CAAC,sBAAsB,CAAC,CAEhC;kBAAA,CAAC,QAAQ,CAAC,MAAM,CAClB;gBAAA,EAAE,IAAI,CAAC,CACR,CACD,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC,CAAC,CAC1C,SAAS,CAAC,CAAC,WAAW,EAAE,EAAE,CAAC,CAC3B,IAAI,CAAC,CAAC;oBACJ,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI,CAAC;oBACrC,QAAQ,CAAC,IAAI,CAAC,aAAa;oBAC3B,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,CAChD;kBAAA,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,CAChD;oBAAA,CAAC,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAC5B;oBAAA,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CACrC;kBAAA,EAAE,IAAI,CACN;kBAAA,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,UAAU,EAAE,QAAQ,EAAE,CAAC,CAChD;oBAAA,CAAC,IAAI,CAAC,IAAI,CAAC,mBAAmB,EAC9B;oBAAA,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CACxC;kBAAA,EAAE,IAAI,CACR;gBAAA,EAAE,IAAI,CAAC;iBACR,CAAC,EACF,CACH,CAAC;QACJ,CAAC,CAAC,CACJ;MAAA,EAAE,WAAW,CACf;IAAA,EAAE,GAAG,CAAC,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,uBAAuB,GAAG,GAAG,EAAE,CAAC,CAC3C,CAAC,GAAG,CACF,KAAK,CAAC,CAAC;QACL,QAAQ,EAAE,UAAU;QACpB,SAAS,EAAE,OAAO;KACnB,CAAC,CAEF;IAAA,CAAC,WAAW,CAAC,WAAW,EAC1B;EAAA,EAAE,GAAG,CAAC,CACP,CAAC","sourcesContent":["import { useState, MouseEvent, SetStateAction } from 'react';\nimport { action } from '@storybook/addon-actions';\n\nimport {\n ComboBox,\n Flex,\n FormField,\n Icon,\n Link,\n MenuButton,\n Pagination,\n SearchInput,\n Select,\n Option,\n Text,\n menuHelpers,\n MenuProps,\n registerIcon\n} from '@pega/cosmos-react-core';\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 * as helpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/help.icon';\nimport { ArticleList, ArticleSummary, ArticleListHeader } from '@pega/cosmos-react-cs';\n\nimport { ArticleListMockData } from './ArticleList.mocks';\n\nexport default {\n title: 'Customer Service/ArticleList',\n component: ArticleList,\n subcomponents: { ArticleSummary, ArticleListHeader },\n parameters: {\n layout: 'fullscreen'\n }\n};\n\nregisterIcon(thumbsUpSolidIcon, thumbsDownSolidIcon, helpIcon);\n\nexport const FirstArticleList = () => {\n const [query, setQuery] = useState('');\n const [currentPage, setCurrentPage] = useState(1);\n const [categoryFilter, setCategoryFilter] = useState<{ id: string; text: string } \| undefined>(\n undefined\n );\n const [categoriesList, setCategoriesList] = useState<MenuProps['items']>(\n ArticleListMockData.categoriesList.map(({ id, name, level, category }) => {\n return {\n id,\n primary: name,\n secondary: [level, category],\n selected: false\n };\n })\n );\n\n const handleArticleLinkClick = (event: MouseEvent) => {\n event.preventDefault();\n };\n\n const ALHeader = {\n icon: <Icon name='help' />,\n headerText: 'Knowledge articles',\n count: 5,\n primary: {\n search: (\n <SearchInput\n value={query}\n onChange={(event: { target: { value: SetStateAction<string> } }) =>\n setQuery(event.target.value)\n }\n onSearchChange={action('Search query')}\n onSearchSubmit={action('Search submit')}\n placeholder='Search…'\n />\n ),\n actions: [\n { text: 'Option Number 1', id: '1a' },\n { text: 'Option Number 2', id: '2a' }\n ],\n followedFilter: (\n <Flex container={{ gap: 1 }}>\n <MenuButton\n variant='simple'\n menu={{\n items: [\n {\n primary: 'Filter 1',\n id: 'f1a'\n },\n {\n primary: 'Filter 2',\n id: 'f2a'\n }\n ]\n }}\n icon='filter'\n text='filter'\n iconOnly\n />\n </Flex>\n )\n },\n secondary: (\n <>\n <FormField label='Category'>\n <ComboBox\n selected={{ items: categoryFilter }}\n placeholder='Filter by category'\n menu={{\n items: categoriesList,\n onItemClick: id => {\n const newList = menuHelpers.selectItem(categoriesList, id, 'single-select');\n const { primary: itemText } = menuHelpers.getSelected(newList)[0];\n setCategoriesList(newList);\n setCategoryFilter({ text: itemText, id });\n }\n }}\n />\n </FormField>\n <Select label='Sort by'>\n {ArticleListMockData.sortByOptions.map(opt => (\n <Option key={opt}>{opt}</Option>\n ))}\n </Select>\n </>\n )\n };\n return (\n <div\n style={{\n width: '31.25rem',\n maxHeight: '100vh'\n }}\n >\n <ArticleList\n skeletonize={false}\n header={\n <ArticleListHeader\n icon={ALHeader.icon}\n count={ALHeader.count}\n headerText={ALHeader.headerText}\n primary={ALHeader.primary}\n secondary={ALHeader.secondary}\n onSubmit={action('Filter details submitted')}\n />\n }\n footer={\n <Flex container={{ alignItems: 'center', justify: 'end' }} item={{ grow: 1 }}>\n <Pagination\n total={70}\n pageNumber={currentPage}\n onPageChange={pageNumber => {\n setCurrentPage(pageNumber);\n }}\n />\n </Flex>\n }\n >\n {ArticleListMockData.articleList.map((dataItem, id) => {\n return (\n <ArticleSummary\n key={id.toString()}\n header={\n <Link\n href='design.pega.com'\n data-article-id={dataItem.articleId}\n onClick={handleArticleLinkClick}\n >\n {dataItem.header}\n </Link>\n }\n content={<Text>{dataItem.abstract}</Text>}\n articleID={`article-${id}`}\n meta={[\n <Text>{dataItem.meta.category}</Text>,\n dataItem.meta.publishedDate,\n <Flex container={{ gap: 2, alignItems: 'center' }}>\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Icon name='thumbs-up-solid' />\n <Text>({dataItem.meta.likes})</Text>\n </Flex>\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Icon name='thumbs-down-solid' />\n <Text>({dataItem.meta.disLikes})</Text>\n </Flex>\n </Flex>\n ]}\n />\n );\n })}\n </ArticleList>\n </div>\n );\n};\n\nexport const ArticleListWithSkeleton = () => (\n <div\n style={{\n maxWidth: '31.25rem',\n maxHeight: '100vh'\n }}\n >\n <ArticleList skeletonize />\n </div>\n);\n"]}
1	+ {"version":3,"file":"ArticleList.stories.jsx","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, MouseEvent, SetStateAction } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Meta } from '@storybook/react';\n\nimport {\n ComboBox,\n Flex,\n FormField,\n Icon,\n Link,\n MenuButton,\n Pagination,\n SearchInput,\n Select,\n Option,\n Text,\n menuHelpers,\n MenuProps,\n registerIcon\n} from '@pega/cosmos-react-core';\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 * as helpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/help.icon';\nimport { ArticleList, ArticleSummary, ArticleListHeader } from '@pega/cosmos-react-cs';\n\nimport { ArticleListMockData } from './ArticleList.mocks';\n\nexport default {\n title: 'Customer Service/ArticleList',\n component: ArticleList,\n subcomponents: { ArticleSummary, ArticleListHeader },\n parameters: {\n layout: 'fullscreen'\n }\n} as Meta;\n\nregisterIcon(thumbsUpSolidIcon, thumbsDownSolidIcon, helpIcon);\n\nexport const FirstArticleList = () => {\n const [query, setQuery] = useState('');\n const [currentPage, setCurrentPage] = useState(1);\n const [categoryFilter, setCategoryFilter] = useState<{ id: string; text: string } \| undefined>(\n undefined\n );\n const [categoriesList, setCategoriesList] = useState<MenuProps['items']>(\n ArticleListMockData.categoriesList.map(({ id, name, level, category }) => {\n return {\n id,\n primary: name,\n secondary: [level, category],\n selected: false\n };\n })\n );\n\n const handleArticleLinkClick = (event: MouseEvent) => {\n event.preventDefault();\n };\n\n const ALHeader = {\n icon: <Icon name='help' />,\n headerText: 'Knowledge articles',\n count: 5,\n primary: {\n search: (\n <SearchInput\n value={query}\n onChange={(event: { target: { value: SetStateAction<string> } }) =>\n setQuery(event.target.value)\n }\n onSearchChange={action('Search query')}\n onSearchSubmit={action('Search submit')}\n placeholder='Search…'\n />\n ),\n actions: [\n { text: 'Option Number 1', id: '1a' },\n { text: 'Option Number 2', id: '2a' }\n ],\n followedFilter: (\n <Flex container={{ gap: 1 }}>\n <MenuButton\n variant='simple'\n menu={{\n items: [\n {\n primary: 'Filter 1',\n id: 'f1a'\n },\n {\n primary: 'Filter 2',\n id: 'f2a'\n }\n ]\n }}\n icon='filter'\n text='filter'\n iconOnly\n />\n </Flex>\n )\n },\n secondary: (\n <>\n <FormField label='Category'>\n <ComboBox\n selected={{ items: categoryFilter }}\n placeholder='Filter by category'\n menu={{\n items: categoriesList,\n onItemClick: id => {\n const newList = menuHelpers.selectItem(categoriesList, id, 'single-select');\n const { primary: itemText } = menuHelpers.getSelected(newList)[0];\n setCategoriesList(newList);\n setCategoryFilter({ text: itemText, id });\n }\n }}\n />\n </FormField>\n <Select label='Sort by'>\n {ArticleListMockData.sortByOptions.map(opt => (\n <Option key={opt}>{opt}</Option>\n ))}\n </Select>\n </>\n )\n };\n return (\n <div\n style={{\n width: '31.25rem',\n maxHeight: '100vh'\n }}\n >\n <ArticleList\n skeletonize={false}\n header={\n <ArticleListHeader\n icon={ALHeader.icon}\n count={ALHeader.count}\n headerText={ALHeader.headerText}\n primary={ALHeader.primary}\n secondary={ALHeader.secondary}\n onSubmit={action('Filter details submitted')}\n />\n }\n footer={\n <Flex container={{ alignItems: 'center', justify: 'end' }} item={{ grow: 1 }}>\n <Pagination\n total={70}\n pageNumber={currentPage}\n onPageChange={pageNumber => {\n setCurrentPage(pageNumber);\n }}\n />\n </Flex>\n }\n >\n {ArticleListMockData.articleList.map((dataItem, id) => {\n return (\n <ArticleSummary\n key={id.toString()}\n header={\n <Link\n href='design.pega.com'\n data-article-id={dataItem.articleId}\n onClick={handleArticleLinkClick}\n >\n {dataItem.header}\n </Link>\n }\n content={<Text>{dataItem.abstract}</Text>}\n articleID={`article-${id}`}\n meta={[\n <Text>{dataItem.meta.category}</Text>,\n dataItem.meta.publishedDate,\n <Flex container={{ gap: 2, alignItems: 'center' }}>\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Icon name='thumbs-up-solid' />\n <Text>({dataItem.meta.likes})</Text>\n </Flex>\n <Flex container={{ gap: 1, alignItems: 'center' }}>\n <Icon name='thumbs-down-solid' />\n <Text>({dataItem.meta.disLikes})</Text>\n </Flex>\n </Flex>\n ]}\n />\n );\n })}\n </ArticleList>\n </div>\n );\n};\n\nexport const ArticleListWithSkeleton = () => (\n <div\n style={{\n maxWidth: '31.25rem',\n maxHeight: '100vh'\n }}\n >\n <ArticleList skeletonize />\n </div>\n);\n"]}

package/jsx/cs/CSCaseView/CSAppShell.stories.d.ts CHANGED Viewed

@@ -1,41 +1,7 @@
-import { Story } from '@storybook/react';
+import { Meta, Story } from '@storybook/react';
 import { InteractionTimerStoryProps } from '../InteractionTimer/InteractionTimer.stories';
-declare const _default: {
-    title: string;
-    parameters: {
-        layout: string;
-    };
-    args: {
-        isDraggable: boolean;
-        hasInteractionNotifications: boolean;
-        enableSla: boolean;
-    };
-    argTypes: {
-        isDraggable: {
-            control: {
-                type: string;
-            };
-        };
-        hasInteractionNotifications: {
-            control: {
-                type: string;
-            };
-        };
-        enableSla: {
-            control: {
-                type: string;
-            };
-        };
-    };
-};
+declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
-export declare type LoginError = string;
-export interface LoginFormProps {
-    ctiLinkOptions: {
-        [key: string]: string;
-    };
-    onLogin: (ctiLinkId: keyof LoginFormProps['ctiLinkOptions'], agentId: string, password: string) => Promise<LoginError | undefined>;
-}
 interface CSAppShellProps {
     isDraggable?: boolean;
     hasInteractionNotifications?: InteractionTimerStoryProps['hasNotifications'];

package/jsx/cs/CSCaseView/CSAppShell.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CSAppShell.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/CSCaseView/CSAppShell.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;~~AA2BzC~~,OAAO,EAEL,0BAA0B,EAC3B,MAAM,8CAA8C,CAAC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAQtD,~~wBAeE~~;~~AAEF~~,~~oBAAY,~~UAAU,GAAG,MAAM,CAAC;AAEhC,MAAM,WAAW,cAAc;IAC7B,cAAc,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IAC1C,OAAO,EAAE,CACP,SAAS,EAAE,MAAM,cAAc,CAAC,gBAAgB,CAAC,EACjD,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,KACb,OAAO,CAAC,UAAU,GAAG,SAAS,CAAC,CAAC;CACtC;AAoED,UAAU,eAAe;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,2BAA2B,CAAC,EAAE,0BAA0B,CAAC,kBAAkB,CAAC,CAAC;IAC7E,SAAS,CAAC,EAAE,0BAA0B,CAAC,WAAW,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,eAAe,CAoS7C,CAAC"}
1	+ {"version":3,"file":"CSAppShell.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/CSCaseView/CSAppShell.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AA0B/C,OAAO,EAEL,0BAA0B,EAC3B,MAAM,8CAA8C,CAAC;;AAQtD,wBAeU;AAEV,UAAU,eAAe;IACvB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,2BAA2B,CAAC,EAAE,0BAA0B,CAAC,kBAAkB,CAAC,CAAC;IAC7E,SAAS,CAAC,EAAE,0BAA0B,CAAC,WAAW,CAAC,CAAC;CACrD;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,eAAe,CAoS7C,CAAC"}

package/jsx/cs/CSCaseView/CSAppShell.stories.jsx CHANGED Viewed

@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react';
 import { action } from '@storybook/addon-actions';
-import { createUID, Status, TwoColumnPage, Icon, registerIcon, Button, Form, Flex, Input, Select, Option, Banner } from '@pega/cosmos-react-core';
+import { createUID, Status, TwoColumnPage, Icon, registerIcon, Button, Form, Flex, Input, Select, Option } from '@pega/cosmos-react-core';
 import * as chatSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chat-solid.icon';
 import { CallControlPanelIcon } from '@pega/cosmos-react-cs';
 import { AppShellDemo } from '../../core/AppShell/AppShell.stories';
@@ -9,11 +9,11 @@ import { TasksDemo } from '../../work/Tasks/Tasks.stories';
 import { FeedDemo } from '../../social/Feed/Feed.stories';
 import { EmailDemo } from '../../social/Email/Email.stories';
 import { StandardChat } from '../../social/Chat/Chat.stories';
-import { TaskManager as TaskManagerStory } from '../TaskManager/TaskManager.stories';
+import { TaskManagerDemo } from '../TaskManager/TaskManager.stories';
 import { InteractionTimerDemo as InteractionTimerStory } from '../InteractionTimer/InteractionTimer.stories';
 import { CallControlPanelDemo } from '../CallControlPanel/CallControlPanel.stories';
 import { userStatusOptions } from '../CallControlPanel/CallControlPanel.mocks';
-import { AppShellMockData } from './CSCaseView.mocks';
+import { AppShellMockData, CallLoginForm } from './CSCaseView.mocks';
 registerIcon(chatSolidIcon);
 export default {
     title: 'Customer Service/CS App Shell',
@@ -31,33 +31,6 @@ export default {
         enableSla: { control: { type: 'boolean' } }
     }
 };
-const CallLoginForm = ({ ctiLinkOptions, onLogin }) => {
-    const [agentId, setAgentId] = useState('');
-    const [password, setPassword] = useState('');
-    const [extension, setExtension] = useState('');
-    const [ctiLinkId, setCTILinkId] = useState(Object.keys(ctiLinkOptions)[0]);
-    const [errorMessage, setErrorMessage] = useState();
-    const canSubmit = agentId && password && ctiLinkId && extension;
-    const actions = (<>
-      <Button name='cancel' variant='secondary'>
-        Cancel
-      </Button>
-      <Button name='submit' type='submit' variant='primary' disabled={!canSubmit} onClick={(e) => {
-            e.preventDefault();
-            onLogin(ctiLinkId, agentId, password).then(setErrorMessage);
-        }}>
-        Login
-      </Button>
-    </>);
-    return (<Form actions={actions} banners={errorMessage ? <Banner id='error' variant='urgent' messages={[errorMessage]}/> : undefined}>
-      <Select required label='CTI link' onChange={e => setCTILinkId(e.target.value)}>
-        {Object.entries(ctiLinkOptions).map(([id, label]) => (<Option value={id}>{label}</Option>))}
-      </Select>
-      <Input required label='Agent ID' value={agentId} onChange={(e) => setAgentId(e.target.value)}/>
-      <Input type='password' required label='Password' value={password} onChange={(e) => setPassword(e.target.value)}/>
-      <Input required label='Extension' value={extension} onChange={(e) => setExtension(e.target.value)}/>
-    </Form>);
-};
 export const CSAppShell = (args) => {
     const CaseData = AppShellMockData;
     const home = <TwoColumnPage a={<FeedDemo />} b={<TasksDemo />} title='Welcome, Sara Davis'/>;
@@ -117,7 +90,7 @@ export const CSAppShell = (args) => {
                     title: 'Chat'
                 };
             }
-            setMainContent(<CaseViewDemo caseId={caseId} heading={heading} parentCases={[]} actions={demoActions} primaryFields={primaryFields} secondaryFields={secondaryFields} tabs={tabs} stages={false} tasksWidget={<TaskManagerStory />} persistentUtility={persistentUtility} showUtilities={false} showFollowedIcon={false} defaultCollapsedUtilities/>);
+            setMainContent(<CaseViewDemo caseId={caseId} heading={heading} parentCases={[]} actions={demoActions} primaryFields={primaryFields} secondaryFields={secondaryFields} tabs={tabs} stages={false} tasksWidget={<TaskManagerDemo />} persistentUtility={persistentUtility} showUtilities={false} showFollowedIcon={false} defaultCollapsedUtilities/>);
         }
     };
     const setActiveItem = (key) => {
@@ -140,7 +113,7 @@ export const CSAppShell = (args) => {
         const key = createUID();
         const createdAt = new Date().getTime();
         const newCase = {
-            visual: (<InteractionTimerStory createdAt={createdAt} icon={icon} showTimer={args.enableSla} hasNotifications={args.hasInteractionNotifications} meta={args.enableSla ? '0:00' : createLink.meta}/>),
+            visual: (<InteractionTimerStory icon={icon} showTimer={args.enableSla} hasNotifications={args.hasInteractionNotifications} meta={args.enableSla ? '0:00' : createLink.meta}/>),
             primary: customerName || 'Unknown customer',
             secondary,
             createdAt,
@@ -269,7 +242,7 @@ export const CSAppShell = (args) => {
             }
             setActiveItem(name);
         }}/>
-      {callPanelVisible && (<CallControlPanelDemo status={agentStatus.id} onStatusChange={setAgentStatus} isDraggable={args.isDraggable}/>)}
+      {callPanelVisible && (<CallControlPanelDemo heading='Agent' status={agentStatus.id} onStatusChange={setAgentStatus} isDraggable={args.isDraggable}/>)}
     </>);
 };
 //# sourceMappingURL=CSAppShell.stories.jsx.map

package/jsx/cs/CSCaseView/CSAppShell.stories.jsx.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CSAppShell.stories.jsx","sourceRoot":"","sources":["../../../src/cs/CSCaseView/CSAppShell.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useState, MouseEvent, ChangeEvent, FunctionComponent } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Story } from '@storybook/react';\n\nimport {\n AppShellProps,\n createUID,\n Status,\n TwoColumnPage,\n Icon,\n registerIcon,\n Button,\n Form,\n Flex,\n Input,\n Select,\n Option,\n Banner\n} from '@pega/cosmos-react-core';\nimport * as chatSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chat-solid.icon';\nimport { CallControlPanelIcon, UserAvailabilityStatusOption } from '@pega/cosmos-react-cs';\n\nimport { AppShellDemo } from '../../core/AppShell/AppShell.stories';\nimport { CaseViewDemo } from '../../work/CaseView/CaseView.stories';\nimport { TasksDemo } from '../../work/Tasks/Tasks.stories';\nimport { FeedDemo } from '../../social/Feed/Feed.stories';\nimport { EmailDemo } from '../../social/Email/Email.stories';\nimport { StandardChat } from '../../social/Chat/Chat.stories';\nimport { TaskManager as TaskManagerStory } from '../TaskManager/TaskManager.stories';\nimport {\n InteractionTimerDemo as InteractionTimerStory,\n InteractionTimerStoryProps\n} from '../InteractionTimer/InteractionTimer.stories';\nimport { CallControlPanelDemo } from '../CallControlPanel/CallControlPanel.stories';\nimport { userStatusOptions } from '../CallControlPanel/CallControlPanel.mocks';\n\nimport { AppShellMockData } from './CSCaseView.mocks';\n\nregisterIcon(chatSolidIcon);\n\nexport default {\n title: 'Customer Service/CS App Shell',\n parameters: {\n layout: 'fullscreen'\n },\n args: {\n isDraggable: true,\n hasInteractionNotifications: true,\n enableSla: true\n },\n argTypes: {\n isDraggable: { control: { type: 'boolean' } },\n hasInteractionNotifications: { control: { type: 'boolean' } },\n enableSla: { control: { type: 'boolean' } }\n }\n};\n\nexport type LoginError = string;\n\nexport interface LoginFormProps {\n ctiLinkOptions: { [key: string]: string };\n onLogin: (\n ctiLinkId: keyof LoginFormProps['ctiLinkOptions'],\n agentId: string,\n password: string\n ) => Promise<LoginError \| undefined>;\n}\n\nconst CallLoginForm: FunctionComponent<LoginFormProps> = ({\n ctiLinkOptions,\n onLogin\n}: LoginFormProps) => {\n const [agentId, setAgentId] = useState<string>('');\n const [password, setPassword] = useState<string>('');\n const [extension, setExtension] = useState<string>('');\n const [ctiLinkId, setCTILinkId] = useState<string>(Object.keys(ctiLinkOptions)[0]);\n const [errorMessage, setErrorMessage] = useState<string>();\n\n const canSubmit = agentId && password && ctiLinkId && extension;\n\n const actions = (\n <>\n <Button name='cancel' variant='secondary'>\n Cancel\n </Button>\n <Button\n name='submit'\n type='submit'\n variant='primary'\n disabled={!canSubmit}\n onClick={(e: MouseEvent) => {\n e.preventDefault();\n onLogin(ctiLinkId!, agentId, password).then(setErrorMessage);\n }}\n >\n Login\n </Button>\n </>\n );\n\n return (\n <Form\n actions={actions}\n banners={\n errorMessage ? <Banner id='error' variant='urgent' messages={[errorMessage]} /> : undefined\n }\n >\n <Select required label='CTI link' onChange={e => setCTILinkId(e.target.value)}>\n {Object.entries(ctiLinkOptions).map(([id, label]) => (\n <Option value={id}>{label}</Option>\n ))}\n </Select>\n <Input\n required\n label='Agent ID'\n value={agentId}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setAgentId(e.target.value)}\n />\n <Input\n type='password'\n required\n label='Password'\n value={password}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setPassword(e.target.value)}\n />\n <Input\n required\n label='Extension'\n value={extension}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setExtension(e.target.value)}\n />\n </Form>\n );\n};\ninterface CSAppShellProps {\n isDraggable?: boolean;\n hasInteractionNotifications?: InteractionTimerStoryProps['hasNotifications'];\n enableSla?: InteractionTimerStoryProps['showTimer'];\n}\n\nexport const CSAppShell: Story<CSAppShellProps> = (args: CSAppShellProps) => {\n const CaseData = AppShellMockData as any;\n\n const home = <TwoColumnPage a={<FeedDemo />} b={<TasksDemo />} title='Welcome, Sara Davis' />;\n\n const [mainContent, setMainContent] = useState(home);\n const [caseID, setCaseID] = useState(1001);\n const [agentStatus, setAgentStatus] = useState<UserAvailabilityStatusOption>(\n userStatusOptions[0] as UserAvailabilityStatusOption\n );\n const [callPanelVisible, setCallPanelVisible] = useState(false);\n const [cases, setCases] = useState<AppShellProps['cases']>([]);\n const [links, setLinks] = useState<AppShellProps['links']>([\n {\n id: '01',\n name: 'Home',\n href: '#home',\n icon: 'home-solid'\n }\n ]);\n\n const tabs = [\n { name: 'Customer notes', id: 'Pulse' },\n { name: 'Accounts', id: 'Accounts' }\n ];\n\n const demoActions = [\n {\n text: 'Change stage',\n id: createUID(),\n onClick: action('Clicked on change stage')\n },\n {\n text: 'Wrap up',\n id: createUID(),\n onClick: action('Clicked on Wrap up')\n },\n {\n text: 'Exit interaction',\n id: createUID(),\n onClick: action('Clicked on exit interaction')\n }\n ];\n\n const RenderCaseView = (name: string) => {\n if (name) {\n const { caseId, heading, primaryFields, secondaryFields: secondaryField } = CaseData[name];\n const secondaryFields = secondaryField.map((field: any) => {\n if (field.name === 'Status') {\n return { ...field, value: <Status variant='success'>{field.value}</Status> };\n }\n return field;\n });\n let persistentUtility;\n if (name === 'Mail Interaction') {\n persistentUtility = {\n content: <EmailDemo hideSuggestions />,\n title: 'Email'\n };\n } else if (name === 'Chat Interaction') {\n persistentUtility = {\n content: <StandardChat chatWidth='100%' />,\n title: 'Chat'\n };\n }\n setMainContent(\n <CaseViewDemo\n caseId={caseId}\n heading={heading}\n parentCases={[]}\n actions={demoActions}\n primaryFields={primaryFields}\n secondaryFields={secondaryFields}\n tabs={tabs}\n stages={false}\n tasksWidget={<TaskManagerStory />}\n persistentUtility={persistentUtility}\n showUtilities={false}\n showFollowedIcon={false}\n defaultCollapsedUtilities\n />\n );\n }\n };\n\n const setActiveItem = (key: string) => {\n setCases((prevCases = []) => {\n return prevCases.map(caseItem => {\n return { ...caseItem, active: caseItem.id === key };\n });\n });\n setLinks((prevLinks = []) => {\n return prevLinks.map(link => {\n return {\n ...link,\n active: link.name === key\n };\n });\n });\n };\n\n const createInteraction = (createLink: {\n primary: string;\n secondary?: string;\n icon: string;\n meta: string;\n customerName?: string;\n }) => {\n const { primary, secondary, icon, customerName } = createLink;\n const key: string = createUID();\n const createdAt = new Date().getTime();\n const newCase = {\n visual: (\n <InteractionTimerStory\n createdAt={createdAt}\n icon={icon as string}\n showTimer={args.enableSla}\n hasNotifications={args.hasInteractionNotifications}\n meta={args.enableSla ? '0:00' : createLink.meta}\n />\n ),\n primary: customerName \|\| 'Unknown customer',\n secondary,\n createdAt,\n id: key,\n active: true,\n onClick: () => {\n setActiveItem(key);\n RenderCaseView(primary);\n },\n onDismiss: (e: any) => {\n setActiveItem('Home');\n e.stopPropagation();\n setCases((prevCases = []) => prevCases.filter(caseItem => caseItem.id !== key));\n setMainContent(home);\n }\n };\n setCases((prevCases = []) => [...prevCases, newCase]);\n setActiveItem(key);\n setCaseID(caseID + 1);\n RenderCaseView(primary);\n };\n\n const createLinks = [\n {\n primary: 'Phone Interaction',\n secondary: 'Received 20s ago',\n icon: 'phone-solid',\n meta: 'FH',\n customerName: 'Ginger Ventura'\n },\n {\n primary: 'Chat Interaction',\n secondary: 'Sent 2h ago',\n icon: 'chat-solid',\n meta: 'SC',\n customerName: 'Sara Davis'\n },\n {\n primary: 'Mail Interaction',\n secondary: 'Received 20s ago',\n icon: 'mail-solid',\n meta: 'JB',\n customerName: 'John Brown'\n }\n ].map(item => {\n const { primary, icon } = item;\n return {\n name: primary,\n icon,\n href: '',\n onClick: () => {\n createInteraction(item);\n }\n };\n });\n\n useEffect(() => {\n createInteraction({\n primary: 'Phone Interaction',\n secondary: 'Received 20s ago',\n icon: 'phone-solid',\n meta: 'GV',\n customerName: 'Ginger Ventura'\n });\n }, []);\n const actions = (\n <>\n <Button\n name='Cancel'\n variant='secondary'\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n action('Click')(`${e.currentTarget.name}:${e.type}`);\n }}\n >\n Cancel\n </Button>\n <Button name='Submit' type='submit' variant='primary'>\n Log in\n </Button>\n </>\n );\n const chatSettings = (\n <Flex container={{ direction: 'column', gap: 2, pad: 2 }} item={{ grow: 1 }}>\n <Form actions={actions}>\n <Input name='agentId' label='Agent Id' autoComplete='off' />\n\n <Input name='password' type='password' label='Password' autoComplete='off' />\n <Select label='Make me'>\n <Option>Available</Option>\n <Option>Unavailable</Option>\n </Select>\n </Form>\n </Flex>\n );\n\n const utils = [\n {\n name: 'Chat settings',\n visual: <Icon name='chat-solid' />,\n drawerView: chatSettings,\n drawerHeader: 'Pega Chat Log In'\n },\n {\n name: 'Call panel',\n visual: (\n <CallControlPanelIcon\n status={agentStatus.status}\n label={agentStatus.label}\n variant='icon'\n panelVisible={callPanelVisible}\n />\n ),\n ...(agentStatus.status === 'offline'\n ? {\n drawerView: (\n <Flex container={{ direction: 'column', gap: 2, pad: 2 }} item={{ grow: 1 }}>\n <CallLoginForm\n ctiLinkOptions={{\n valid: 'It will be accepted',\n invalid: 'This will raise an error'\n }}\n onLogin={ctiLink => {\n if (ctiLink === 'invalid') return Promise.resolve('Login incorrect');\n setAgentStatus(userStatusOptions[1] as UserAvailabilityStatusOption);\n setCallPanelVisible(true);\n return Promise.resolve(undefined);\n }}\n />\n </Flex>\n ),\n drawerHeader: 'Pega Call Log In'\n }\n : {\n onClick: () => setCallPanelVisible(isVisible => !isVisible)\n })\n }\n ];\n\n const appInfo = {\n href: 'https://www.pega.com/',\n imageSrc:\n 'https://www.clipartmax.com/png/middle/345-3454195_account-executive-civilian-pega-logo-png.png',\n fullImageSrc: 'Full Image Source',\n appName: 'CS AppShell'\n };\n\n return (\n <>\n <AppShellDemo\n main={mainContent}\n appInfo={appInfo}\n cases={cases}\n createLinks={createLinks}\n caseLinks={links}\n utils={utils}\n onLinkClick={(name: string) => {\n if (name === 'Home') {\n setMainContent(home);\n }\n setActiveItem(name);\n }}\n />\n {callPanelVisible && (\n <CallControlPanelDemo\n status={agentStatus.id}\n onStatusChange={setAgentStatus}\n isDraggable={args.isDraggable}\n />\n )}\n </>\n );\n};\n"]}
1	+ {"version":3,"file":"CSAppShell.stories.jsx","sourceRoot":"","sources":["../../../src/cs/CSCaseView/CSAppShell.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useState, MouseEvent } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Meta, Story } from '@storybook/react';\n\nimport {\n AppShellProps,\n createUID,\n Status,\n TwoColumnPage,\n Icon,\n registerIcon,\n Button,\n Form,\n Flex,\n Input,\n Select,\n Option\n} from '@pega/cosmos-react-core';\nimport * as chatSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/chat-solid.icon';\nimport { CallControlPanelIcon, UserAvailabilityStatusOption } from '@pega/cosmos-react-cs';\n\nimport { AppShellDemo } from '../../core/AppShell/AppShell.stories';\nimport { CaseViewDemo } from '../../work/CaseView/CaseView.stories';\nimport { TasksDemo } from '../../work/Tasks/Tasks.stories';\nimport { FeedDemo } from '../../social/Feed/Feed.stories';\nimport { EmailDemo } from '../../social/Email/Email.stories';\nimport { StandardChat } from '../../social/Chat/Chat.stories';\nimport { TaskManagerDemo } from '../TaskManager/TaskManager.stories';\nimport {\n InteractionTimerDemo as InteractionTimerStory,\n InteractionTimerStoryProps\n} from '../InteractionTimer/InteractionTimer.stories';\nimport { CallControlPanelDemo } from '../CallControlPanel/CallControlPanel.stories';\nimport { userStatusOptions } from '../CallControlPanel/CallControlPanel.mocks';\n\nimport { AppShellMockData, CallLoginForm } from './CSCaseView.mocks';\n\nregisterIcon(chatSolidIcon);\n\nexport default {\n title: 'Customer Service/CS App Shell',\n parameters: {\n layout: 'fullscreen'\n },\n args: {\n isDraggable: true,\n hasInteractionNotifications: true,\n enableSla: true\n },\n argTypes: {\n isDraggable: { control: { type: 'boolean' } },\n hasInteractionNotifications: { control: { type: 'boolean' } },\n enableSla: { control: { type: 'boolean' } }\n }\n} as Meta;\n\ninterface CSAppShellProps {\n isDraggable?: boolean;\n hasInteractionNotifications?: InteractionTimerStoryProps['hasNotifications'];\n enableSla?: InteractionTimerStoryProps['showTimer'];\n}\n\nexport const CSAppShell: Story<CSAppShellProps> = (args: CSAppShellProps) => {\n const CaseData = AppShellMockData as any;\n\n const home = <TwoColumnPage a={<FeedDemo />} b={<TasksDemo />} title='Welcome, Sara Davis' />;\n\n const [mainContent, setMainContent] = useState(home);\n const [caseID, setCaseID] = useState(1001);\n const [agentStatus, setAgentStatus] = useState<UserAvailabilityStatusOption>(\n userStatusOptions[0] as UserAvailabilityStatusOption\n );\n const [callPanelVisible, setCallPanelVisible] = useState(false);\n const [cases, setCases] = useState<AppShellProps['cases']>([]);\n const [links, setLinks] = useState<AppShellProps['links']>([\n {\n id: '01',\n name: 'Home',\n href: '#home',\n icon: 'home-solid'\n }\n ]);\n\n const tabs = [\n { name: 'Customer notes', id: 'Pulse' },\n { name: 'Accounts', id: 'Accounts' }\n ];\n\n const demoActions = [\n {\n text: 'Change stage',\n id: createUID(),\n onClick: action('Clicked on change stage')\n },\n {\n text: 'Wrap up',\n id: createUID(),\n onClick: action('Clicked on Wrap up')\n },\n {\n text: 'Exit interaction',\n id: createUID(),\n onClick: action('Clicked on exit interaction')\n }\n ];\n\n const RenderCaseView = (name: string) => {\n if (name) {\n const { caseId, heading, primaryFields, secondaryFields: secondaryField } = CaseData[name];\n const secondaryFields = secondaryField.map((field: any) => {\n if (field.name === 'Status') {\n return { ...field, value: <Status variant='success'>{field.value}</Status> };\n }\n return field;\n });\n let persistentUtility;\n if (name === 'Mail Interaction') {\n persistentUtility = {\n content: <EmailDemo hideSuggestions />,\n title: 'Email'\n };\n } else if (name === 'Chat Interaction') {\n persistentUtility = {\n content: <StandardChat chatWidth='100%' />,\n title: 'Chat'\n };\n }\n setMainContent(\n <CaseViewDemo\n caseId={caseId}\n heading={heading}\n parentCases={[]}\n actions={demoActions}\n primaryFields={primaryFields}\n secondaryFields={secondaryFields}\n tabs={tabs}\n stages={false}\n tasksWidget={<TaskManagerDemo />}\n persistentUtility={persistentUtility}\n showUtilities={false}\n showFollowedIcon={false}\n defaultCollapsedUtilities\n />\n );\n }\n };\n\n const setActiveItem = (key: string) => {\n setCases((prevCases = []) => {\n return prevCases.map(caseItem => {\n return { ...caseItem, active: caseItem.id === key };\n });\n });\n setLinks((prevLinks = []) => {\n return prevLinks.map(link => {\n return {\n ...link,\n active: link.name === key\n };\n });\n });\n };\n\n const createInteraction = (createLink: {\n primary: string;\n secondary?: string;\n icon: string;\n meta: string;\n customerName?: string;\n }) => {\n const { primary, secondary, icon, customerName } = createLink;\n const key: string = createUID();\n const createdAt = new Date().getTime();\n const newCase = {\n visual: (\n <InteractionTimerStory\n icon={icon as string}\n showTimer={args.enableSla}\n hasNotifications={args.hasInteractionNotifications}\n meta={args.enableSla ? '0:00' : createLink.meta}\n />\n ),\n primary: customerName \|\| 'Unknown customer',\n secondary,\n createdAt,\n id: key,\n active: true,\n onClick: () => {\n setActiveItem(key);\n RenderCaseView(primary);\n },\n onDismiss: (e: any) => {\n setActiveItem('Home');\n e.stopPropagation();\n setCases((prevCases = []) => prevCases.filter(caseItem => caseItem.id !== key));\n setMainContent(home);\n }\n };\n setCases((prevCases = []) => [...prevCases, newCase]);\n setActiveItem(key);\n setCaseID(caseID + 1);\n RenderCaseView(primary);\n };\n\n const createLinks = [\n {\n primary: 'Phone Interaction',\n secondary: 'Received 20s ago',\n icon: 'phone-solid',\n meta: 'FH',\n customerName: 'Ginger Ventura'\n },\n {\n primary: 'Chat Interaction',\n secondary: 'Sent 2h ago',\n icon: 'chat-solid',\n meta: 'SC',\n customerName: 'Sara Davis'\n },\n {\n primary: 'Mail Interaction',\n secondary: 'Received 20s ago',\n icon: 'mail-solid',\n meta: 'JB',\n customerName: 'John Brown'\n }\n ].map(item => {\n const { primary, icon } = item;\n return {\n name: primary,\n icon,\n href: '',\n onClick: () => {\n createInteraction(item);\n }\n };\n });\n\n useEffect(() => {\n createInteraction({\n primary: 'Phone Interaction',\n secondary: 'Received 20s ago',\n icon: 'phone-solid',\n meta: 'GV',\n customerName: 'Ginger Ventura'\n });\n }, []);\n const actions = (\n <>\n <Button\n name='Cancel'\n variant='secondary'\n onClick={(e: MouseEvent<HTMLButtonElement>) => {\n action('Click')(`${e.currentTarget.name}:${e.type}`);\n }}\n >\n Cancel\n </Button>\n <Button name='Submit' type='submit' variant='primary'>\n Log in\n </Button>\n </>\n );\n const chatSettings = (\n <Flex container={{ direction: 'column', gap: 2, pad: 2 }} item={{ grow: 1 }}>\n <Form actions={actions}>\n <Input name='agentId' label='Agent Id' autoComplete='off' />\n\n <Input name='password' type='password' label='Password' autoComplete='off' />\n <Select label='Make me'>\n <Option>Available</Option>\n <Option>Unavailable</Option>\n </Select>\n </Form>\n </Flex>\n );\n\n const utils = [\n {\n name: 'Chat settings',\n visual: <Icon name='chat-solid' />,\n drawerView: chatSettings,\n drawerHeader: 'Pega Chat Log In'\n },\n {\n name: 'Call panel',\n visual: (\n <CallControlPanelIcon\n status={agentStatus.status}\n label={agentStatus.label}\n variant='icon'\n panelVisible={callPanelVisible}\n />\n ),\n ...(agentStatus.status === 'offline'\n ? {\n drawerView: (\n <Flex container={{ direction: 'column', gap: 2, pad: 2 }} item={{ grow: 1 }}>\n <CallLoginForm\n ctiLinkOptions={{\n valid: 'It will be accepted',\n invalid: 'This will raise an error'\n }}\n onLogin={ctiLink => {\n if (ctiLink === 'invalid') return Promise.resolve('Login incorrect');\n setAgentStatus(userStatusOptions[1] as UserAvailabilityStatusOption);\n setCallPanelVisible(true);\n return Promise.resolve(undefined);\n }}\n />\n </Flex>\n ),\n drawerHeader: 'Pega Call Log In'\n }\n : {\n onClick: () => setCallPanelVisible(isVisible => !isVisible)\n })\n }\n ];\n\n const appInfo = {\n href: 'https://www.pega.com/',\n imageSrc:\n 'https://www.clipartmax.com/png/middle/345-3454195_account-executive-civilian-pega-logo-png.png',\n fullImageSrc: 'Full Image Source',\n appName: 'CS AppShell'\n };\n\n return (\n <>\n <AppShellDemo\n main={mainContent}\n appInfo={appInfo}\n cases={cases}\n createLinks={createLinks}\n caseLinks={links}\n utils={utils}\n onLinkClick={(name: string) => {\n if (name === 'Home') {\n setMainContent(home);\n }\n setActiveItem(name);\n }}\n />\n {callPanelVisible && (\n <CallControlPanelDemo\n heading='Agent'\n status={agentStatus.id}\n onStatusChange={setAgentStatus}\n isDraggable={args.isDraggable}\n />\n )}\n </>\n );\n};\n"]}

package/jsx/cs/CSCaseView/CSCaseView.mocks.d.ts CHANGED Viewed

@@ -1,3 +1,12 @@
+import { FunctionComponent } from 'react';
+export declare type LoginError = string;
+export interface LoginFormProps {
+    ctiLinkOptions: {
+        [key: string]: string;
+    };
+    onLogin: (ctiLinkId: keyof LoginFormProps['ctiLinkOptions'], agentId: string, password: string) => Promise<LoginError | undefined>;
+}
+export declare const CallLoginForm: FunctionComponent<LoginFormProps>;
 export declare const AppShellMockData: {
     notifications: {
         id: string;

package/jsx/cs/CSCaseView/CSCaseView.mocks.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CSCaseView.mocks.d.ts","sourceRoot":"","sources":["../../../src/cs/CSCaseView/CSCaseView.mocks.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmO5B,CAAC"}
1	+ {"version":3,"file":"CSCaseView.mocks.d.ts","sourceRoot":"","sources":["../../../src/cs/CSCaseView/CSCaseView.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,iBAAiB,EAAY,MAAM,OAAO,CAAC;AAIjE,oBAAY,UAAU,GAAG,MAAM,CAAC;AAEhC,MAAM,WAAW,cAAc;IAC7B,cAAc,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IAC1C,OAAO,EAAE,CACP,SAAS,EAAE,MAAM,cAAc,CAAC,gBAAgB,CAAC,EACjD,OAAO,EAAE,MAAM,EACf,QAAQ,EAAE,MAAM,KACb,OAAO,CAAC,UAAU,GAAG,SAAS,CAAC,CAAC;CACtC;AAED,eAAO,MAAM,aAAa,EAAE,iBAAiB,CAAC,cAAc,CAiE3D,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmO5B,CAAC"}

package/jsx/cs/CSCaseView/{CSCaseView.mocks.js → CSCaseView.mocks.jsx} RENAMED Viewed

@@ -1,3 +1,32 @@
+import { useState } from 'react';
+import { Banner, Button, Form, Input, Option, Select } from '@pega/cosmos-react-core';
+export const CallLoginForm = ({ ctiLinkOptions, onLogin }) => {
+    const [agentId, setAgentId] = useState('');
+    const [password, setPassword] = useState('');
+    const [extension, setExtension] = useState('');
+    const [ctiLinkId, setCTILinkId] = useState(Object.keys(ctiLinkOptions)[0]);
+    const [errorMessage, setErrorMessage] = useState();
+    const canSubmit = agentId && password && ctiLinkId && extension;
+    const actions = (<>
+      <Button name='cancel' variant='secondary'>
+        Cancel
+      </Button>
+      <Button name='submit' type='submit' variant='primary' disabled={!canSubmit} onClick={(e) => {
+            e.preventDefault();
+            onLogin(ctiLinkId, agentId, password).then(setErrorMessage);
+        }}>
+        Login
+      </Button>
+    </>);
+    return (<Form actions={actions} banners={errorMessage ? <Banner id='error' variant='urgent' messages={[errorMessage]}/> : undefined}>
+      <Select required label='CTI link' onChange={e => setCTILinkId(e.target.value)}>
+        {Object.entries(ctiLinkOptions).map(([id, label]) => (<Option value={id}>{label}</Option>))}
+      </Select>
+      <Input required label='Agent ID' value={agentId} onChange={(e) => setAgentId(e.target.value)}/>
+      <Input type='password' required label='Password' value={password} onChange={(e) => setPassword(e.target.value)}/>
+      <Input required label='Extension' value={extension} onChange={(e) => setExtension(e.target.value)}/>
+    </Form>);
+};
 export const AppShellMockData = {
     notifications: [
         {
@@ -221,4 +250,4 @@ export const AppShellMockData = {
         ]
     }
 };
-//# sourceMappingURL=CSCaseView.mocks.js.map
+//# sourceMappingURL=CSCaseView.mocks.jsx.map

package/jsx/cs/CSCaseView/CSCaseView.mocks.jsx.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"CSCaseView.mocks.jsx","sourceRoot":"","sources":["../../../src/cs/CSCaseView/CSCaseView.mocks.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAkC,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAatF,MAAM,CAAC,MAAM,aAAa,GAAsC,CAAC,EAC/D,cAAc,EACd,OAAO,EACQ,EAAE,EAAE;IACnB,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IACnD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IACrD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAS,EAAE,CAAC,CAAC;IACvD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAS,MAAM,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACnF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,EAAU,CAAC;IAE3D,MAAM,SAAS,GAAG,OAAO,IAAI,QAAQ,IAAI,SAAS,IAAI,SAAS,CAAC;IAEhE,MAAM,OAAO,GAAG,CACd,EACE;MAAA,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,WAAW,CACvC;;MACF,EAAE,MAAM,CACR;MAAA,CAAC,MAAM,CACL,IAAI,CAAC,QAAQ,CACb,IAAI,CAAC,QAAQ,CACb,OAAO,CAAC,SAAS,CACjB,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CACrB,OAAO,CAAC,CAAC,CAAC,CAAa,EAAE,EAAE;YACzB,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,OAAO,CAAC,SAAU,EAAE,OAAO,EAAE,QAAQ,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC;QAC/D,CAAC,CAAC,CAEF;;MACF,EAAE,MAAM,CACV;IAAA,GAAG,CACJ,CAAC;IAEF,OAAO,CACL,CAAC,IAAI,CACH,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,OAAO,CAAC,CACN,YAAY,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,EAAG,CAAC,CAAC,CAAC,SAAS,CAC5F,CAED;MAAA,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAC5E;QAAA,CAAC,MAAM,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,KAAK,CAAC,EAAE,EAAE,CAAC,CACnD,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC,CACpC,CAAC,CACJ;MAAA,EAAE,MAAM,CACR;MAAA,CAAC,KAAK,CACJ,QAAQ,CACR,KAAK,CAAC,UAAU,CAChB,KAAK,CAAC,CAAC,OAAO,CAAC,CACf,QAAQ,CAAC,CAAC,CAAC,CAAgC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAE7E;MAAA,CAAC,KAAK,CACJ,IAAI,CAAC,UAAU,CACf,QAAQ,CACR,KAAK,CAAC,UAAU,CAChB,KAAK,CAAC,CAAC,QAAQ,CAAC,CAChB,QAAQ,CAAC,CAAC,CAAC,CAAgC,EAAE,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAE9E;MAAA,CAAC,KAAK,CACJ,QAAQ,CACR,KAAK,CAAC,WAAW,CACjB,KAAK,CAAC,CAAC,SAAS,CAAC,CACjB,QAAQ,CAAC,CAAC,CAAC,CAAgC,EAAE,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAEjF;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG;IAC9B,aAAa,EAAE;QACb;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EACL,4FAA4F;YAC9F,SAAS,EAAE,WAAW;YACtB,MAAM,EAAE,aAAa;YACrB,MAAM,EAAE,IAAI;SACb;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EAAE,oFAAoF;YAC7F,MAAM,EAAE,eAAe;YACvB,SAAS,EAAE,WAAW;YACtB,MAAM,EAAE,IAAI;SACb;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EACL,wHAAwH;YAC1H,SAAS,EAAE,WAAW;YACtB,MAAM,EAAE,aAAa;YACrB,MAAM,EAAE,IAAI;SACb;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EAAE,+DAA+D;YACxE,SAAS,EAAE,EAAE;YACb,MAAM,EAAE,cAAc;YACtB,MAAM,EAAE,IAAI;SACb;KACF;IACD,OAAO,EAAE;QACP;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EAAE,8DAA8D;YACvE,SAAS,EAAE,WAAW;SACvB;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EAAE,oDAAoD;YAC7D,SAAS,EAAE,WAAW;SACvB;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EACL,0FAA0F;YAC5F,SAAS,EAAE,WAAW;SACvB;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EAAE,8DAA8D;YACvE,SAAS,EAAE,WAAW;SACvB;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EAAE,oDAAoD;YAC7D,SAAS,EAAE,WAAW;SACvB;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EACL,0FAA0F;YAC5F,SAAS,EAAE,WAAW;SACvB;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EAAE,8DAA8D;YACvE,SAAS,EAAE,WAAW;SACvB;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EAAE,oDAAoD;YAC7D,SAAS,EAAE,WAAW;SACvB;QACD;YACE,EAAE,EAAE,KAAK;YACT,OAAO,EACL,0FAA0F;YAC5F,SAAS,EAAE,WAAW;SACvB;KACF;IACD,mBAAmB,EAAE;QACnB,MAAM,EAAE,UAAU;QAClB,OAAO,EAAE,gBAAgB;QACzB,aAAa,EAAE;YACb;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,gBAAgB;gBACtB,KAAK,EAAE,MAAM;aACd;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,kBAAkB;gBACxB,KAAK,EAAE,OAAO;aACf;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,YAAY;gBAClB,KAAK,EAAE,KAAK;aACb;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,QAAQ;gBACd,KAAK,EAAE,MAAM;aACd;SACF;QACD,eAAe,EAAE;YACf;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,QAAQ;gBACd,KAAK,EAAE,UAAU;aAClB;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,WAAW;gBACjB,KAAK,EAAE,OAAO;aACf;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,gBAAgB;gBACtB,KAAK,EAAE,WAAW;aACnB;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,SAAS;gBACf,KAAK,EAAE,sBAAsB;aAC9B;SACF;KACF;IACD,kBAAkB,EAAE;QAClB,MAAM,EAAE,UAAU;QAClB,OAAO,EAAE,YAAY;QACrB,aAAa,EAAE;YACb;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,gBAAgB;gBACtB,KAAK,EAAE,QAAQ;aAChB;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,kBAAkB;gBACxB,KAAK,EAAE,MAAM;aACd;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,YAAY;gBAClB,KAAK,EAAE,MAAM;aACd;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,QAAQ;gBACd,KAAK,EAAE,MAAM;aACd;SACF;QACD,eAAe,EAAE;YACf;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,QAAQ;gBACd,KAAK,EAAE,UAAU;aAClB;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,WAAW;gBACjB,KAAK,EAAE,OAAO;aACf;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,gBAAgB;gBACtB,KAAK,EAAE,YAAY;aACpB;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,SAAS;gBACf,KAAK,EAAE,WAAW;aACnB;SACF;KACF;IACD,kBAAkB,EAAE;QAClB,MAAM,EAAE,UAAU;QAClB,OAAO,EAAE,YAAY;QACrB,aAAa,EAAE;YACb;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,gBAAgB;gBACtB,KAAK,EAAE,QAAQ;aAChB;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,kBAAkB;gBACxB,KAAK,EAAE,MAAM;aACd;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,YAAY;gBAClB,KAAK,EAAE,QAAQ;aAChB;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,QAAQ;gBACd,KAAK,EAAE,MAAM;aACd;SACF;QACD,eAAe,EAAE;YACf;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,QAAQ;gBACd,KAAK,EAAE,UAAU;aAClB;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,WAAW;gBACjB,KAAK,EAAE,OAAO;aACf;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,gBAAgB;gBACtB,KAAK,EAAE,YAAY;aACpB;YACD;gBACE,EAAE,EAAE,GAAG;gBACP,IAAI,EAAE,SAAS;gBACf,KAAK,EAAE,WAAW;aACnB;SACF;KACF;CACF,CAAC","sourcesContent":["import { ChangeEvent, FunctionComponent, useState } from 'react';\n\nimport { Banner, Button, Form, Input, Option, Select } from '@pega/cosmos-react-core';\n\nexport type LoginError = string;\n\nexport interface LoginFormProps {\n ctiLinkOptions: { [key: string]: string };\n onLogin: (\n ctiLinkId: keyof LoginFormProps['ctiLinkOptions'],\n agentId: string,\n password: string\n ) => Promise<LoginError | undefined>;\n}\n\nexport const CallLoginForm: FunctionComponent<LoginFormProps> = ({\n ctiLinkOptions,\n onLogin\n}: LoginFormProps) => {\n const [agentId, setAgentId] = useState<string>('');\n const [password, setPassword] = useState<string>('');\n const [extension, setExtension] = useState<string>('');\n const [ctiLinkId, setCTILinkId] = useState<string>(Object.keys(ctiLinkOptions)[0]);\n const [errorMessage, setErrorMessage] = useState<string>();\n\n const canSubmit = agentId && password && ctiLinkId && extension;\n\n const actions = (\n <>\n <Button name='cancel' variant='secondary'>\n Cancel\n </Button>\n <Button\n name='submit'\n type='submit'\n variant='primary'\n disabled={!canSubmit}\n onClick={(e: MouseEvent) => {\n e.preventDefault();\n onLogin(ctiLinkId!, agentId, password).then(setErrorMessage);\n }}\n >\n Login\n </Button>\n </>\n );\n\n return (\n <Form\n actions={actions}\n banners={\n errorMessage ? <Banner id='error' variant='urgent' messages={[errorMessage]} /> : undefined\n }\n >\n <Select required label='CTI link' onChange={e => setCTILinkId(e.target.value)}>\n {Object.entries(ctiLinkOptions).map(([id, label]) => (\n <Option value={id}>{label}</Option>\n ))}\n </Select>\n <Input\n required\n label='Agent ID'\n value={agentId}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setAgentId(e.target.value)}\n />\n <Input\n type='password'\n required\n label='Password'\n value={password}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setPassword(e.target.value)}\n />\n <Input\n required\n label='Extension'\n value={extension}\n onChange={(e: ChangeEvent<HTMLInputElement>) => setExtension(e.target.value)}\n />\n </Form>\n );\n};\n\nexport const AppShellMockData = {\n notifications: [\n {\n id: '123',\n primary:\n \"Dean Thomas mentioned your team in a bug 'Button does not initiate onClick event handler'.\",\n secondary: 'BUG-12345',\n visual: 'Dean Thomas',\n unread: true\n },\n {\n id: '456',\n primary: \"Seth DeAngelo mentioned your team in a bug 'Text variant h1 renders as h3 in DOM'.\",\n visual: 'Seth DeAngelo',\n secondary: 'BUG-12345',\n unread: true\n },\n {\n id: '789',\n primary:\n \"Janet Moore mentioned your team in a bug 'Tree expanded state does not match the state that was set on the component'.\",\n secondary: 'BUG-12345',\n visual: 'Janet Moore',\n unread: true\n },\n {\n id: '000',\n primary: 'You have been awarded Employee of the Month! Congratulations!',\n secondary: '',\n visual: 'Cindy Turner',\n unread: true\n }\n ],\n recents: [\n {\n id: '123',\n primary: \"BUG-12345: 'Button does not initiate onClick event handler'.\",\n secondary: 'BUG-12345'\n },\n {\n id: '456',\n primary: \"BUG-54321: 'Text variant h1 renders as h3 in DOM'.\",\n secondary: 'BUG-00000'\n },\n {\n id: '789',\n primary:\n \"BUG-00000: 'Tree expanded state does not match the state that was set on the component'.\",\n secondary: 'BUG-00000'\n },\n {\n id: '111',\n primary: \"BUG-12345: 'Button does not initiate onClick event handler'.\",\n secondary: 'BUG-12345'\n },\n {\n id: '222',\n primary: \"BUG-54321: 'Text variant h1 renders as h3 in DOM'.\",\n secondary: 'BUG-00000'\n },\n {\n id: '333',\n primary:\n \"BUG-00000: 'Tree expanded state does not match the state that was set on the component'.\",\n secondary: 'BUG-00000'\n },\n {\n id: '444',\n primary: \"BUG-12345: 'Button does not initiate onClick event handler'.\",\n secondary: 'BUG-12345'\n },\n {\n id: '555',\n primary: \"BUG-54321: 'Text variant h1 renders as h3 in DOM'.\",\n secondary: 'BUG-00000'\n },\n {\n id: '666',\n primary:\n \"BUG-00000: 'Tree expanded state does not match the state that was set on the component'.\",\n secondary: 'BUG-00000'\n }\n ],\n 'Phone Interaction': {\n caseId: 'Customer',\n heading: 'Ginger Ventura',\n primaryFields: [\n {\n id: '0',\n name: 'Lifetime value',\n value: 'Gold'\n },\n {\n id: '1',\n name: 'Interaction type',\n value: 'Phone'\n },\n {\n id: '2',\n name: 'Churn risk',\n value: 'Low'\n },\n {\n id: '3',\n name: 'Status',\n value: 'Open'\n }\n ],\n secondaryFields: [\n {\n id: '0',\n name: 'Status',\n value: 'Verified'\n },\n {\n id: '1',\n name: 'Web login',\n value: 'Today'\n },\n {\n id: '2',\n name: 'Customer since',\n value: 'July 2018'\n },\n {\n id: '3',\n name: 'Address',\n value: '2213b Gormand street'\n }\n ]\n },\n 'Chat Interaction': {\n caseId: 'Customer',\n heading: 'Sara Davis',\n primaryFields: [\n {\n id: '0',\n name: 'Lifetime value',\n value: 'Silver'\n },\n {\n id: '1',\n name: 'Interaction type',\n value: 'Chat'\n },\n {\n id: '2',\n name: 'Churn risk',\n value: 'High'\n },\n {\n id: '3',\n name: 'Status',\n value: 'Open'\n }\n ],\n secondaryFields: [\n {\n id: '0',\n name: 'Status',\n value: 'Verified'\n },\n {\n id: '1',\n name: 'Web login',\n value: 'Today'\n },\n {\n id: '2',\n name: 'Customer since',\n value: 'March 2005'\n },\n {\n id: '3',\n name: 'Address',\n value: '340 River'\n }\n ]\n },\n 'Mail Interaction': {\n caseId: 'Customer',\n heading: 'John Brown',\n primaryFields: [\n {\n id: '0',\n name: 'Lifetime value',\n value: 'Bronze'\n },\n {\n id: '1',\n name: 'Interaction type',\n value: 'Mail'\n },\n {\n id: '2',\n name: 'Churn risk',\n value: 'Medium'\n },\n {\n id: '3',\n name: 'Status',\n value: 'Open'\n }\n ],\n secondaryFields: [\n {\n id: '0',\n name: 'Status',\n value: 'Verified'\n },\n {\n id: '1',\n name: 'Web login',\n value: 'Today'\n },\n {\n id: '2',\n name: 'Customer since',\n value: 'March 1995'\n },\n {\n id: '3',\n name: 'Address',\n value: '340 River'\n }\n ]\n }\n};\n"]}

package/jsx/cs/CallControlPanel/CallControlPanel.stories.d.ts CHANGED Viewed

@@ -1,13 +1,13 @@
-/// <reference types="react" />
 import { Meta, Story } from '@storybook/react';
 import { UserAvailabilityStatusOption } from '@pega/cosmos-react-cs';
 declare const _default: Meta<import("@storybook/react").Args>;
 export default _default;
 interface CallControlPanelStoryProps {
+    heading: string;
     isDraggable?: boolean;
     status?: UserAvailabilityStatusOption['id'];
     onStatusChange?: (newStatus: UserAvailabilityStatusOption) => void;
 }
 export declare const CallControlPanelDemo: Story<CallControlPanelStoryProps>;
-export declare const NewCallDemo: () => JSX.Element;
+export declare const NewCallDemo: Story;
 //# sourceMappingURL=CallControlPanel.stories.d.ts.map

package/jsx/cs/CallControlPanel/CallControlPanel.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CallControlPanel.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.stories.tsx"],"names":[],"mappings":"~~;AAGA~~,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAIL,4BAA4B,EAC7B,MAAM,uBAAuB,CAAC;;AAI/B,~~wBASU~~;AAEV,UAAU,0BAA0B;IAClC,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,4BAA4B,CAAC,IAAI,CAAC,CAAC;IAC5C,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,4BAA4B,KAAK,IAAI,CAAC;CACpE;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,0BAA0B,~~CAgMlE~~,CAAC;AAEF,eAAO,MAAM,WAAW,~~mBAcvB~~,CAAC"}
1	+ {"version":3,"file":"CallControlPanel.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/CallControlPanel/CallControlPanel.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAIL,4BAA4B,EAC7B,MAAM,uBAAuB,CAAC;;AAI/B,wBAWU;AAEV,UAAU,0BAA0B;IAClC,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,MAAM,CAAC,EAAE,4BAA4B,CAAC,IAAI,CAAC,CAAC;IAC5C,cAAc,CAAC,EAAE,CAAC,SAAS,EAAE,4BAA4B,KAAK,IAAI,CAAC;CACpE;AAED,eAAO,MAAM,oBAAoB,EAAE,KAAK,CAAC,0BAA0B,CA+LlE,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAczB,CAAC"}