@pega/cosmos-react-demos 4.0.0-dev.9.1 → 4.0.0

package/jsx/cs/ArticleList/ArticleList.mocks.js

@@ -1,102 +0,0 @@
-export const ArticleListMockData = {
-    articleList: [
-        {
-            articleId: '1',
-            header: 'Bear claw jujubes pastry jujubes chocolate bar chupa ',
-            abstract: 'At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.',
-            meta: {
-                category: 'Banking and Retail',
-                publishedDate: '12/12/2019',
-                likes: 3500,
-                disLikes: 85
-            }
-        },
-        {
-            articleId: '2',
-            header: 'Oat cake jujubes pudding macaroon apple pie biscuit liquorice',
-            abstract: 'Candy cotton candy tiramisu danish halvah pie. Macaroon chupa chups chupa chups tiramisu bear claw liquorice croissant. Powder tart chupa chups.',
-            meta: {
-                category: 'Retail',
-                publishedDate: '12/12/2019',
-                likes: 47,
-                disLikes: 15
-            }
-        },
-        {
-            articleId: '3',
-            header: 'Cookie jelly-o lemon drops gingerbread chocolate marzipan sweet',
-            abstract: 'Ice cream dragée ice cream bear claw. Bonbon icing marshmallow fruitcake. Carrot cake chocolate cake pie dessert ',
-            meta: {
-                category: 'Finance',
-                publishedDate: '12/12/2019',
-                likes: 89,
-                disLikes: 33
-            }
-        },
-        {
-            articleId: '4',
-            header: 'Tootsie roll tiramisu jujubes gingerbread macaroon',
-            abstract: 'Pudding bear claw sweet sugar plum jelly wafer. Jelly beans chocolate bar jelly-o jelly dessert. Danish toffee lollipop t',
-            meta: {
-                category: 'Insurance',
-                publishedDate: '12/12/2019',
-                likes: 950,
-                disLikes: 2
-            }
-        },
-        {
-            articleId: '5',
-            header: 'Bear claw jujubes pastry jujubes chocolate bar chupa ',
-            abstract: 'At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.',
-            meta: {
-                category: 'Banking and Retail',
-                publishedDate: '12/12/2019',
-                likes: 3500,
-                disLikes: 85
-            }
-        },
-        {
-            articleId: '6',
-            header: 'Oat cake jujubes pudding macaroon apple pie biscuit liquorice',
-            abstract: 'Candy cotton candy tiramisu danish halvah pie. Macaroon chupa chups chupa chups tiramisu bear claw liquorice croissant. Powder tart chupa chups.',
-            meta: {
-                category: 'Retail',
-                publishedDate: '12/12/2019',
-                likes: 47,
-                disLikes: 15
-            }
-        },
-        {
-            articleId: '7',
-            header: 'Cookie jelly-o lemon drops gingerbread chocolate marzipan sweet',
-            abstract: 'Ice cream dragée ice cream bear claw. Bonbon icing marshmallow fruitcake. Carrot cake chocolate cake pie dessert ',
-            meta: {
-                category: 'Finance',
-                publishedDate: '12/12/2019',
-                likes: 89,
-                disLikes: 33
-            }
-        },
-        {
-            articleId: '8',
-            header: 'Tootsie roll tiramisu jujubes gingerbread macaroon',
-            abstract: 'Pudding bear claw sweet sugar plum jelly wafer. Jelly beans chocolate bar jelly-o jelly dessert. Danish toffee lollipop t',
-            meta: {
-                category: 'Insurance',
-                publishedDate: '12/12/2019',
-                likes: 950,
-                disLikes: 2
-            }
-        }
-    ],
-    categoriesList: [
-        { id: '1', name: 'Education', level: 'Experts', category: 'Loans' },
-        { id: '2', name: 'Auto loan', level: 'Experts', category: 'Loans' },
-        { id: '3', name: 'Credit card', level: 'Intermediate', category: 'Banking' },
-        { id: '4', name: 'General Q & A', level: 'Intermediate', category: 'Others' },
-        { id: '5', name: 'Debit card', level: 'Intermediate', category: 'Banking' },
-        { id: '6', name: 'Retail banking', level: 'Intermediate', category: 'Banking' }
-    ],
-    sortByOptions: ['Top rated', 'Recently published', 'Suggested']
-};
-//# sourceMappingURL=ArticleList.mocks.js.map

package/jsx/cs/ArticleList/ArticleList.mocks.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ArticleList.mocks.js","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.mocks.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,WAAW,EAAE;QACX;YACE,SAAS,EAAE,GAAG;YACd,MAAM,EAAE,uDAAuD;YAC/D,QAAQ,EACN,ySAAyS;YAC3S,IAAI,EAAE;gBACJ,QAAQ,EAAE,oBAAoB;gBAC9B,aAAa,EAAE,YAAY;gBAC3B,KAAK,EAAE,IAAI;gBACX,QAAQ,EAAE,EAAE;aACb;SACF;QACD;YACE,SAAS,EAAE,GAAG;YACd,MAAM,EAAE,+DAA+D;YACvE,QAAQ,EACN,kJAAkJ;YACpJ,IAAI,EAAE;gBACJ,QAAQ,EAAE,QAAQ;gBAClB,aAAa,EAAE,YAAY;gBAC3B,KAAK,EAAE,EAAE;gBACT,QAAQ,EAAE,EAAE;aACb;SACF;QACD;YACE,SAAS,EAAE,GAAG;YACd,MAAM,EAAE,iEAAiE;YACzE,QAAQ,EACN,mHAAmH;YACrH,IAAI,EAAE;gBACJ,QAAQ,EAAE,SAAS;gBACnB,aAAa,EAAE,YAAY;gBAC3B,KAAK,EAAE,EAAE;gBACT,QAAQ,EAAE,EAAE;aACb;SACF;QACD;YACE,SAAS,EAAE,GAAG;YACd,MAAM,EAAE,oDAAoD;YAC5D,QAAQ,EACN,2HAA2H;YAC7H,IAAI,EAAE;gBACJ,QAAQ,EAAE,WAAW;gBACrB,aAAa,EAAE,YAAY;gBAC3B,KAAK,EAAE,GAAG;gBACV,QAAQ,EAAE,CAAC;aACZ;SACF;QACD;YACE,SAAS,EAAE,GAAG;YACd,MAAM,EAAE,uDAAuD;YAC/D,QAAQ,EACN,ySAAyS;YAC3S,IAAI,EAAE;gBACJ,QAAQ,EAAE,oBAAoB;gBAC9B,aAAa,EAAE,YAAY;gBAC3B,KAAK,EAAE,IAAI;gBACX,QAAQ,EAAE,EAAE;aACb;SACF;QACD;YACE,SAAS,EAAE,GAAG;YACd,MAAM,EAAE,+DAA+D;YACvE,QAAQ,EACN,kJAAkJ;YACpJ,IAAI,EAAE;gBACJ,QAAQ,EAAE,QAAQ;gBAClB,aAAa,EAAE,YAAY;gBAC3B,KAAK,EAAE,EAAE;gBACT,QAAQ,EAAE,EAAE;aACb;SACF;QACD;YACE,SAAS,EAAE,GAAG;YACd,MAAM,EAAE,iEAAiE;YACzE,QAAQ,EACN,mHAAmH;YACrH,IAAI,EAAE;gBACJ,QAAQ,EAAE,SAAS;gBACnB,aAAa,EAAE,YAAY;gBAC3B,KAAK,EAAE,EAAE;gBACT,QAAQ,EAAE,EAAE;aACb;SACF;QACD;YACE,SAAS,EAAE,GAAG;YACd,MAAM,EAAE,oDAAoD;YAC5D,QAAQ,EACN,2HAA2H;YAC7H,IAAI,EAAE;gBACJ,QAAQ,EAAE,WAAW;gBACrB,aAAa,EAAE,YAAY;gBAC3B,KAAK,EAAE,GAAG;gBACV,QAAQ,EAAE,CAAC;aACZ;SACF;KACF;IACD,cAAc,EAAE;QACd,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE;QACnE,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE;QACnE,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,cAAc,EAAE,QAAQ,EAAE,SAAS,EAAE;QAC5E,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,cAAc,EAAE,QAAQ,EAAE,QAAQ,EAAE;QAC7E,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,cAAc,EAAE,QAAQ,EAAE,SAAS,EAAE;QAC3E,EAAE,EAAE,EAAE,GAAG,EAAE,IAAI,EAAE,gBAAgB,EAAE,KAAK,EAAE,cAAc,EAAE,QAAQ,EAAE,SAAS,EAAE;KAChF;IACD,aAAa,EAAE,CAAC,WAAW,EAAE,oBAAoB,EAAE,WAAW,CAAC;CAChE,CAAC","sourcesContent":["export const ArticleListMockData = {\n  articleList: [\n    {\n      articleId: '1',\n      header: 'Bear claw jujubes pastry jujubes chocolate bar chupa ',\n      abstract:\n        'At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.',\n      meta: {\n        category: 'Banking and Retail',\n        publishedDate: '12/12/2019',\n        likes: 3500,\n        disLikes: 85\n      }\n    },\n    {\n      articleId: '2',\n      header: 'Oat cake jujubes pudding macaroon apple pie biscuit liquorice',\n      abstract:\n        'Candy cotton candy tiramisu danish halvah pie. Macaroon chupa chups chupa chups tiramisu bear claw liquorice croissant. Powder tart chupa chups.',\n      meta: {\n        category: 'Retail',\n        publishedDate: '12/12/2019',\n        likes: 47,\n        disLikes: 15\n      }\n    },\n    {\n      articleId: '3',\n      header: 'Cookie jelly-o lemon drops gingerbread chocolate marzipan sweet',\n      abstract:\n        'Ice cream dragée ice cream bear claw. Bonbon icing marshmallow fruitcake. Carrot cake chocolate cake pie dessert ',\n      meta: {\n        category: 'Finance',\n        publishedDate: '12/12/2019',\n        likes: 89,\n        disLikes: 33\n      }\n    },\n    {\n      articleId: '4',\n      header: 'Tootsie roll tiramisu jujubes gingerbread macaroon',\n      abstract:\n        'Pudding bear claw sweet sugar plum jelly wafer. Jelly beans chocolate bar jelly-o jelly dessert. Danish toffee lollipop t',\n      meta: {\n        category: 'Insurance',\n        publishedDate: '12/12/2019',\n        likes: 950,\n        disLikes: 2\n      }\n    },\n    {\n      articleId: '5',\n      header: 'Bear claw jujubes pastry jujubes chocolate bar chupa ',\n      abstract:\n        'At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga.',\n      meta: {\n        category: 'Banking and Retail',\n        publishedDate: '12/12/2019',\n        likes: 3500,\n        disLikes: 85\n      }\n    },\n    {\n      articleId: '6',\n      header: 'Oat cake jujubes pudding macaroon apple pie biscuit liquorice',\n      abstract:\n        'Candy cotton candy tiramisu danish halvah pie. Macaroon chupa chups chupa chups tiramisu bear claw liquorice croissant. Powder tart chupa chups.',\n      meta: {\n        category: 'Retail',\n        publishedDate: '12/12/2019',\n        likes: 47,\n        disLikes: 15\n      }\n    },\n    {\n      articleId: '7',\n      header: 'Cookie jelly-o lemon drops gingerbread chocolate marzipan sweet',\n      abstract:\n        'Ice cream dragée ice cream bear claw. Bonbon icing marshmallow fruitcake. Carrot cake chocolate cake pie dessert ',\n      meta: {\n        category: 'Finance',\n        publishedDate: '12/12/2019',\n        likes: 89,\n        disLikes: 33\n      }\n    },\n    {\n      articleId: '8',\n      header: 'Tootsie roll tiramisu jujubes gingerbread macaroon',\n      abstract:\n        'Pudding bear claw sweet sugar plum jelly wafer. Jelly beans chocolate bar jelly-o jelly dessert. Danish toffee lollipop t',\n      meta: {\n        category: 'Insurance',\n        publishedDate: '12/12/2019',\n        likes: 950,\n        disLikes: 2\n      }\n    }\n  ],\n  categoriesList: [\n    { id: '1', name: 'Education', level: 'Experts', category: 'Loans' },\n    { id: '2', name: 'Auto loan', level: 'Experts', category: 'Loans' },\n    { id: '3', name: 'Credit card', level: 'Intermediate', category: 'Banking' },\n    { id: '4', name: 'General Q & A', level: 'Intermediate', category: 'Others' },\n    { id: '5', name: 'Debit card', level: 'Intermediate', category: 'Banking' },\n    { id: '6', name: 'Retail banking', level: 'Intermediate', category: 'Banking' }\n  ],\n  sortByOptions: ['Top rated', 'Recently published', 'Suggested']\n};\n"]}

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

@@ -1,6 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const ArticleListDemo: Story;
-export declare const ArticleListWithSkeleton: Story;
-//# sourceMappingURL=ArticleList.stories.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"ArticleList.stories.d.ts","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.stories.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;;AAyB/C,wBAOU;AAIV,eAAO,MAAM,eAAe,EAAE,KAwJ7B,CAAC;AAEF,eAAO,MAAM,uBAAuB,EAAE,KASrC,CAAC"}

package/jsx/cs/ArticleList/ArticleList.stories.jsx

@@ -1,111 +0,0 @@
-import { useState } from 'react';
-import { action } from '@storybook/addon-actions';
-import { ComboBox, Flex, FormField, Icon, Link, MenuButton, Pagination, SearchInput, Select, Option, Text, menuHelpers, registerIcon } from '@pega/cosmos-react-core';
-import * as thumbsUpSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-up-solid.icon';
-import * as thumbsDownSolidIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/thumbs-down-solid.icon';
-import * as helpIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/help.icon';
-import { ArticleList, ArticleSummary, ArticleListHeader } from '@pega/cosmos-react-cs';
-import { ArticleListMockData } from './ArticleList.mocks';
-export default {
-    title: 'Customer Service/ArticleList',
-    component: ArticleList,
-    subcomponents: { ArticleSummary, ArticleListHeader },
-    parameters: {
-        layout: 'fullscreen'
-    }
-};
-registerIcon(thumbsUpSolidIcon, thumbsDownSolidIcon, helpIcon);
-export const ArticleListDemo = () => {
-    const [query, setQuery] = useState('');
-    const [currentPage, setCurrentPage] = useState(1);
-    const [categoryFilter, setCategoryFilter] = useState(undefined);
-    const [categoriesList, setCategoriesList] = useState(ArticleListMockData.categoriesList.map(({ id, name, level, category }) => {
-        return {
-            id,
-            primary: name,
-            secondary: [level, category],
-            selected: false
-        };
-    }));
-    const handleArticleLinkClick = (event) => {
-        event.preventDefault();
-    };
-    const ALHeader = {
-        icon: <Icon name='help'/>,
-        headerText: 'Knowledge articles',
-        count: 5,
-        primary: {
-            search: (<SearchInput value={query} onSearchChange={setQuery} onSearchSubmit={action('Search submit')} placeholder='Search…'/>),
-            actions: [
-                { text: 'Option Number 1', id: '1a' },
-                { text: 'Option Number 2', id: '2a' }
-            ],
-            followedFilter: (<Flex container={{ gap: 1 }}>
-          <MenuButton variant='simple' menu={{
-                    items: [
-                        {
-                            primary: 'Filter 1',
-                            id: 'f1a'
-                        },
-                        {
-                            primary: 'Filter 2',
-                            id: 'f2a'
-                        }
-                    ]
-                }} icon='filter' text='filter' iconOnly/>
-        </Flex>)
-        },
-        secondary: (<>
-        <FormField label='Category'>
-          <ComboBox selected={{ items: categoryFilter }} placeholder='Filter by category' menu={{
-                items: categoriesList,
-                onItemClick: id => {
-                    const newList = menuHelpers.selectItem(categoriesList, id, 'single-select');
-                    const { primary: itemText } = menuHelpers.getSelected(newList)[0];
-                    setCategoriesList(newList);
-                    setCategoryFilter({ text: itemText, id });
-                }
-            }}/>
-        </FormField>
-        <Select label='Sort by'>
-          {ArticleListMockData.sortByOptions.map(opt => (<Option key={opt}>{opt}</Option>))}
-        </Select>
-      </>)
-    };
-    return (<div style={{
-            width: '31.25rem',
-            maxHeight: '100vh'
-        }}>
-      <ArticleList skeletonize={false} header={<ArticleListHeader icon={ALHeader.icon} count={ALHeader.count} headerText={ALHeader.headerText} primary={ALHeader.primary} secondary={ALHeader.secondary} onSubmit={action('Filter details submitted')}/>} footer={<Flex container={{ alignItems: 'center', justify: 'end' }} item={{ grow: 1 }}>
-            <Pagination total={70} pageNumber={currentPage} onPageChange={pageNumber => {
-                setCurrentPage(pageNumber);
-            }}/>
-          </Flex>}>
-        {ArticleListMockData.articleList.map((dataItem, id) => {
-            return (<ArticleSummary key={id.toString()} header={<Link href='design.pega.com' data-article-id={dataItem.articleId} onClick={handleArticleLinkClick}>
-                  {dataItem.header}
-                </Link>} content={<Text>{dataItem.abstract}</Text>} articleID={`article-${id}`} meta={[
-                    <Text>{dataItem.meta.category}</Text>,
-                    dataItem.meta.publishedDate,
-                    <Flex container={{ gap: 2, alignItems: 'center' }}>
-                  <Flex container={{ gap: 1, alignItems: 'center' }}>
-                    <Icon name='thumbs-up-solid'/>
-                    <Text>({dataItem.meta.likes})</Text>
-                  </Flex>
-                  <Flex container={{ gap: 1, alignItems: 'center' }}>
-                    <Icon name='thumbs-down-solid'/>
-                    <Text>({dataItem.meta.disLikes})</Text>
-                  </Flex>
-                </Flex>
-                ]}/>);
-        })}
-      </ArticleList>
-    </div>);
-};
-export const ArticleListWithSkeleton = () => (<div style={{
-        maxWidth: '31.25rem',
-        maxHeight: '100vh'
-    }}>
-    <ArticleList skeletonize/>
-  </div>);
-//# sourceMappingURL=ArticleList.stories.jsx.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"ArticleList.stories.jsx","sourceRoot":"","sources":["../../../src/cs/ArticleList/ArticleList.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, MouseEvent } from 'react';\nimport { action } from '@storybook/addon-actions';\nimport { Meta, Story } 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 ArticleListDemo: Story = () => {\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          onSearchChange={setQuery}\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: Story = () => (\n  <div\n    style={{\n      maxWidth: '31.25rem',\n      maxHeight: '100vh'\n    }}\n  >\n    <ArticleList skeletonize />\n  </div>\n);\n"]}

package/jsx/social/Chat/RepeatingView.mocks.d.ts

@@ -1,14 +0,0 @@
-import { RepeatingViewRow } from '@pega/cosmos-react-social';
-export interface Contact extends RepeatingViewRow {
-    name: {
-        title: string;
-        first: string;
-        last: string;
-    };
-    phone: string;
-    picture: {
-        thumbnail: string;
-    };
-}
-export declare const FetchContactsAPI: (results: number, abortController: AbortController) => Promise<Contact[]>;
-//# sourceMappingURL=RepeatingView.mocks.d.ts.map

package/jsx/social/Chat/RepeatingView.mocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RepeatingView.mocks.d.ts","sourceRoot":"","sources":["../../../src/social/Chat/RepeatingView.mocks.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,2BAA2B,CAAC;AAE7D,MAAM,WAAW,OAAQ,SAAQ,gBAAgB;IAC/C,IAAI,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAC;IACrD,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE;QAAE,SAAS,EAAE,MAAM,CAAA;KAAE,CAAC;CAChC;AAED,eAAO,MAAM,gBAAgB,EAAE,CAC7B,OAAO,EAAE,MAAM,EACf,eAAe,EAAE,eAAe,KAC7B,OAAO,CAAC,OAAO,EAAE,CAWrB,CAAC"}

package/jsx/social/Chat/RepeatingView.mocks.js

@@ -1,11 +0,0 @@
-export const FetchContactsAPI = (results, abortController) => {
-    return fetch(`https://randomuser.me/api?results=${results}`, {
-        signal: abortController.signal
-    })
-        .then(res => res.json())
-        .then((data) => [...data.results].map(item => ({
-        ...item,
-        id: Math.floor(Math.random() * Math.floor(500000)).toString()
-    })));
-};
-//# sourceMappingURL=RepeatingView.mocks.js.map

package/jsx/social/Chat/RepeatingView.mocks.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RepeatingView.mocks.js","sourceRoot":"","sources":["../../../src/social/Chat/RepeatingView.mocks.ts"],"names":[],"mappings":"AAQA,MAAM,CAAC,MAAM,gBAAgB,GAGH,CAAC,OAAO,EAAE,eAAe,EAAE,EAAE;IACrD,OAAO,KAAK,CAAC,qCAAqC,OAAO,EAAE,EAAE;QAC3D,MAAM,EAAE,eAAe,CAAC,MAAM;KAC/B,CAAC;SACC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,IAAI,EAAE,CAAC;SACvB,IAAI,CAAC,CAAC,IAAS,EAAE,EAAE,CAClB,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;QAC7B,GAAG,IAAI;QACP,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,EAAE;KAC9D,CAAC,CAAC,CACJ,CAAC;AACN,CAAC,CAAC","sourcesContent":["import { RepeatingViewRow } from '@pega/cosmos-react-social';\n\nexport interface Contact extends RepeatingViewRow {\n  name: { title: string; first: string; last: string };\n  phone: string;\n  picture: { thumbnail: string };\n}\n\nexport const FetchContactsAPI: (\n  results: number,\n  abortController: AbortController\n) => Promise<Contact[]> = (results, abortController) => {\n  return fetch(`https://randomuser.me/api?results=${results}`, {\n    signal: abortController.signal\n  })\n    .then(res => res.json())\n    .then((data: any) =>\n      [...data.results].map(item => ({\n        ...item,\n        id: Math.floor(Math.random() * Math.floor(500000)).toString()\n      }))\n    );\n};\n"]}

package/jsx/social/Chat/RepeatingView.stories.d.ts

@@ -1,9 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import { RepeatingViewProps } from '@pega/cosmos-react-social';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-interface RepeatingViewStoryProps {
-    scrollDirection: RepeatingViewProps['scrollDirection'];
-}
-export declare const RepeatingViewSample: Story<RepeatingViewStoryProps>;
-//# sourceMappingURL=RepeatingView.stories.d.ts.map

package/jsx/social/Chat/RepeatingView.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RepeatingView.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Chat/RepeatingView.stories.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAG/C,OAAO,EAAiB,kBAAkB,EAAE,MAAM,2BAA2B,CAAC;;AAK9E,wBAGU;AAEV,UAAU,uBAAuB;IAC/B,eAAe,EAAE,kBAAkB,CAAC,iBAAiB,CAAC,CAAC;CACxD;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,uBAAuB,CAgF9D,CAAC"}

package/jsx/social/Chat/RepeatingView.stories.jsx

@@ -1,60 +0,0 @@
-import { useCallback, useState, useEffect, useMemo } from 'react';
-import { Avatar, SummaryItem } from '@pega/cosmos-react-core';
-import { RepeatingView } from '@pega/cosmos-react-social';
-import { StyledContactsBook } from './RepeatingView.styles';
-import { FetchContactsAPI } from './RepeatingView.mocks';
-export default {
-    title: 'Social/Chat/RepeatingView',
-    component: RepeatingView
-};
-export const RepeatingViewSample = (args) => {
-    const INITIAL_CHUNK_SIZE = 50;
-    const APPEND_CHUNK_SIZE = 25;
-    const FETCH_AHEAD_OFFSET = 10;
-    const TOTAL_RECORDS = Math.max(INITIAL_CHUNK_SIZE, 100);
-    const [rows, setRows] = useState({
-        data: [],
-        isLoading: true
-    });
-    const abortController = useMemo(() => {
-        return new AbortController();
-    }, []);
-    useEffect(() => {
-        FetchContactsAPI(INITIAL_CHUNK_SIZE, abortController).then((newRows) => {
-            setRows(prevRows => ({
-                isLoading: false,
-                data: [...prevRows.data, ...newRows]
-            }));
-        });
-        return () => {
-            abortController.abort();
-        };
-    }, []);
-    const loadMore = useCallback(() => {
-        if (!rows.isLoading) {
-            setRows(prevRows => ({
-                ...prevRows,
-                isLoading: true
-            }));
-            FetchContactsAPI(APPEND_CHUNK_SIZE, abortController).then((newRows) => {
-                setRows(prevRows => ({
-                    isLoading: false,
-                    data: [...prevRows.data, ...newRows]
-                }));
-            });
-        }
-    }, [rows, setRows]);
-    return (<RepeatingView as={StyledContactsBook} loading={rows.isLoading} rows={rows.data} style={{ height: '40rem', maxHeight: '100vh' }} loadMore={loadMore} offset={rows.data.length === TOTAL_RECORDS ? -1 : rows.data.length - FETCH_AHEAD_OFFSET} scrollDirection={args.scrollDirection}>
-      {row => {
-            const { name: { title, first, last }, phone, picture: { thumbnail } } = row;
-            return (<SummaryItem primary={[title, first, last].join(' ')} visual={<Avatar imageSrc={thumbnail} name={[title, first, last].join(' ')} shape='circle' size='l'/>} secondary={phone}/>);
-        }}
-    </RepeatingView>);
-};
-RepeatingViewSample.args = {
-    scrollDirection: 'top-to-bottom'
-};
-RepeatingViewSample.argTypes = {
-    scrollDirection: { options: ['top-to-bottom', 'bottom-to-top'], control: { type: 'select' } }
-};
-//# sourceMappingURL=RepeatingView.stories.jsx.map

package/jsx/social/Chat/RepeatingView.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"RepeatingView.stories.jsx","sourceRoot":"","sources":["../../../src/social/Chat/RepeatingView.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAGlE,OAAO,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC9D,OAAO,EAAE,aAAa,EAAsB,MAAM,2BAA2B,CAAC;AAE9E,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAW,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAElE,eAAe;IACb,KAAK,EAAE,2BAA2B;IAClC,SAAS,EAAE,aAAa;CACjB,CAAC;AAMV,MAAM,CAAC,MAAM,mBAAmB,GAAmC,CACjE,IAA6B,EAC7B,EAAE;IACF,MAAM,kBAAkB,GAAG,EAAE,CAAC;IAC9B,MAAM,iBAAiB,GAAG,EAAE,CAAC;IAC7B,MAAM,kBAAkB,GAAG,EAAE,CAAC;IAC9B,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,kBAAkB,EAAE,GAAG,CAAC,CAAC;IAExD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAG7B;QACD,IAAI,EAAE,EAAE;QACR,SAAS,EAAE,IAAI;KAChB,CAAC,CAAC;IAEH,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE;QACnC,OAAO,IAAI,eAAe,EAAE,CAAC;IAC/B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,gBAAgB,CAAC,kBAAkB,EAAE,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,OAAkB,EAAE,EAAE;YAChF,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;gBACnB,SAAS,EAAE,KAAK;gBAChB,IAAI,EAAE,CAAC,GAAG,QAAQ,CAAC,IAAI,EAAE,GAAG,OAAO,CAAC;aACrC,CAAC,CAAC,CAAC;QACN,CAAC,CAAC,CAAC;QACH,OAAO,GAAG,EAAE;YACV,eAAe,CAAC,KAAK,EAAE,CAAC;QAC1B,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE;QAChC,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE;YACnB,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;gBACnB,GAAG,QAAQ;gBACX,SAAS,EAAE,IAAI;aAChB,CAAC,CAAC,CAAC;YACJ,gBAAgB,CAAC,iBAAiB,EAAE,eAAe,CAAC,CAAC,IAAI,CAAC,CAAC,OAAkB,EAAE,EAAE;gBAC/E,OAAO,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;oBACnB,SAAS,EAAE,KAAK;oBAChB,IAAI,EAAE,CAAC,GAAG,QAAQ,CAAC,IAAI,EAAE,GAAG,OAAO,CAAC;iBACrC,CAAC,CAAC,CAAC;YACN,CAAC,CAAC,CAAC;SACJ;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC;IAEpB,OAAO,CACL,CAAC,aAAa,CACZ,EAAE,CAAC,CAAC,kBAAkB,CAAC,CACvB,OAAO,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CACxB,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAChB,KAAK,CAAC,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,CAC/C,QAAQ,CAAC,CAAC,QAAQ,CAAC,CACnB,MAAM,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,KAAK,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,MAAM,GAAG,kBAAkB,CAAC,CACxF,eAAe,CAAC,CAAC,IAAI,CAAC,eAAe,CAAC,CAEtC;MAAA,CAAC,GAAG,CAAC,EAAE;YACL,MAAM,EACJ,IAAI,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,EAC5B,KAAK,EACL,OAAO,EAAE,EAAE,SAAS,EAAE,EACvB,GAAG,GAAc,CAAC;YACnB,OAAO,CACL,CAAC,WAAW,CACV,OAAO,CAAC,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CACxC,MAAM,CAAC,CACL,CAAC,MAAM,CACL,QAAQ,CAAC,CAAC,SAAS,CAAC,CACpB,IAAI,CAAC,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,IAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CACrC,KAAK,CAAC,QAAQ,CACd,IAAI,CAAC,GAAG,EACR,CACH,CACD,SAAS,CAAC,CAAC,KAAK,CAAC,EACjB,CACH,CAAC;QACJ,CAAC,CACH;IAAA,EAAE,aAAa,CAAC,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,mBAAmB,CAAC,IAAI,GAAG;IACzB,eAAe,EAAE,eAAe;CACjC,CAAC;AAEF,mBAAmB,CAAC,QAAQ,GAAG;IAC7B,eAAe,EAAE,EAAE,OAAO,EAAE,CAAC,eAAe,EAAE,eAAe,CAAC,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;CAC9F,CAAC","sourcesContent":["import { useCallback, useState, useEffect, useMemo } from 'react';\nimport { Meta, Story } from '@storybook/react';\n\nimport { Avatar, SummaryItem } from '@pega/cosmos-react-core';\nimport { RepeatingView, RepeatingViewProps } from '@pega/cosmos-react-social';\n\nimport { StyledContactsBook } from './RepeatingView.styles';\nimport { Contact, FetchContactsAPI } from './RepeatingView.mocks';\n\nexport default {\n  title: 'Social/Chat/RepeatingView',\n  component: RepeatingView\n} as Meta;\n\ninterface RepeatingViewStoryProps {\n  scrollDirection: RepeatingViewProps['scrollDirection'];\n}\n\nexport const RepeatingViewSample: Story<RepeatingViewStoryProps> = (\n  args: RepeatingViewStoryProps\n) => {\n  const INITIAL_CHUNK_SIZE = 50;\n  const APPEND_CHUNK_SIZE = 25;\n  const FETCH_AHEAD_OFFSET = 10;\n  const TOTAL_RECORDS = Math.max(INITIAL_CHUNK_SIZE, 100);\n\n  const [rows, setRows] = useState<{\n    data: Contact[];\n    isLoading: boolean;\n  }>({\n    data: [],\n    isLoading: true\n  });\n\n  const abortController = useMemo(() => {\n    return new AbortController();\n  }, []);\n\n  useEffect(() => {\n    FetchContactsAPI(INITIAL_CHUNK_SIZE, abortController).then((newRows: Contact[]) => {\n      setRows(prevRows => ({\n        isLoading: false,\n        data: [...prevRows.data, ...newRows]\n      }));\n    });\n    return () => {\n      abortController.abort();\n    };\n  }, []);\n\n  const loadMore = useCallback(() => {\n    if (!rows.isLoading) {\n      setRows(prevRows => ({\n        ...prevRows,\n        isLoading: true\n      }));\n      FetchContactsAPI(APPEND_CHUNK_SIZE, abortController).then((newRows: Contact[]) => {\n        setRows(prevRows => ({\n          isLoading: false,\n          data: [...prevRows.data, ...newRows]\n        }));\n      });\n    }\n  }, [rows, setRows]);\n\n  return (\n    <RepeatingView\n      as={StyledContactsBook}\n      loading={rows.isLoading}\n      rows={rows.data}\n      style={{ height: '40rem', maxHeight: '100vh' }}\n      loadMore={loadMore}\n      offset={rows.data.length === TOTAL_RECORDS ? -1 : rows.data.length - FETCH_AHEAD_OFFSET}\n      scrollDirection={args.scrollDirection}\n    >\n      {row => {\n        const {\n          name: { title, first, last },\n          phone,\n          picture: { thumbnail }\n        } = row as Contact;\n        return (\n          <SummaryItem\n            primary={[title, first, last].join(' ')}\n            visual={\n              <Avatar\n                imageSrc={thumbnail}\n                name={[title, first, last].join(' ')}\n                shape='circle'\n                size='l'\n              />\n            }\n            secondary={phone}\n          />\n        );\n      }}\n    </RepeatingView>\n  );\n};\n\nRepeatingViewSample.args = {\n  scrollDirection: 'top-to-bottom'\n};\n\nRepeatingViewSample.argTypes = {\n  scrollDirection: { options: ['top-to-bottom', 'bottom-to-top'], control: { type: 'select' } }\n};\n"]}

package/jsx/social/Chat/RepeatingView.styles.d.ts

@@ -1,2 +0,0 @@
-export declare const StyledContactsBook: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
-//# sourceMappingURL=RepeatingView.styles.d.ts.map

package/jsx/social/Chat/RepeatingView.styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"RepeatingView.styles.d.ts","sourceRoot":"","sources":["../../../src/social/Chat/RepeatingView.styles.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,kBAAkB,yGAgB7B,CAAC"}

package/jsx/social/Chat/RepeatingView.styles.js

@@ -1,22 +0,0 @@
-import styled, { css } from 'styled-components';
-import { defaultThemeProp } from '@pega/cosmos-react-core';
-import { StyledRepeatingView, StyledRepeatingViewItem } from '@pega/cosmos-react-social';
-export const StyledContactsBook = styled(StyledRepeatingView)(({ theme }) => {
-    const bdrColor = theme.base.palette['border-line'];
-    return css `
-    width: 25rem;
-    position: absolute;
-    top: 0;
-    left: 50%;
-    transform: translate(-50%, 0%);
-    z-index: 1;
-    border: 0.0625rem solid ${bdrColor};
-    background-color: ${theme.base.palette['primary-background']};
-    ${StyledRepeatingViewItem} {
-      border-bottom: 0.0625rem solid ${bdrColor};
-      padding: calc(0.5 * ${theme.base.spacing});
-    }
-  `;
-});
-StyledContactsBook.defaultProps = defaultThemeProp;
-//# sourceMappingURL=RepeatingView.styles.js.map

package/jsx/social/Chat/RepeatingView.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"RepeatingView.styles.js","sourceRoot":"","sources":["../../../src/social/Chat/RepeatingView.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAE,mBAAmB,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAEzF,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1E,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;IACnD,OAAO,GAAG,CAAA;;;;;;;8BAOkB,QAAQ;wBACd,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;MAC1D,uBAAuB;uCACU,QAAQ;4BACnB,KAAK,CAAC,IAAI,CAAC,OAAO;;GAE3C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\nimport { StyledRepeatingView, StyledRepeatingViewItem } from '@pega/cosmos-react-social';\n\nexport const StyledContactsBook = styled(StyledRepeatingView)(({ theme }) => {\n  const bdrColor = theme.base.palette['border-line'];\n  return css`\n    width: 25rem;\n    position: absolute;\n    top: 0;\n    left: 50%;\n    transform: translate(-50%, 0%);\n    z-index: 1;\n    border: 0.0625rem solid ${bdrColor};\n    background-color: ${theme.base.palette['primary-background']};\n    ${StyledRepeatingViewItem} {\n      border-bottom: 0.0625rem solid ${bdrColor};\n      padding: calc(0.5 * ${theme.base.spacing});\n    }\n  `;\n});\n\nStyledContactsBook.defaultProps = defaultThemeProp;\n"]}

package/jsx/social/Feed/FeedNewPost.stories.d.ts

@@ -1,10 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import { FeedNewPostProps } from '@pega/cosmos-react-social';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-interface FeedNewPostDemoProps {
-    onPost?: FeedNewPostProps['onPost'];
-    renderFeed?: boolean;
-}
-export declare const FeedNewPostDemo: Story<FeedNewPostDemoProps>;
-//# sourceMappingURL=FeedNewPost.stories.d.ts.map

package/jsx/social/Feed/FeedNewPost.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FeedNewPost.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/FeedNewPost.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAI/C,OAAO,EAGL,gBAAgB,EAGjB,MAAM,2BAA2B,CAAC;;AAKnC,wBAGU;AAEV,UAAU,oBAAoB;IAC5B,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,oBAAoB,CAuHvD,CAAC"}

package/jsx/social/Feed/FeedNewPost.stories.jsx

@@ -1,81 +0,0 @@
-import { useState, useEffect } from 'react';
-import { useUID } from '@pega/cosmos-react-core';
-import { Feed, FeedNewPost } from '@pega/cosmos-react-social';
-import { availableRecipients, caseMentions, userMentions } from './Feed.mocks';
-export default {
-    title: 'Social/Feed/FeedNewPost',
-    component: FeedNewPost
-};
-export const FeedNewPostDemo = ({ onPost = () => { }, renderFeed = true }) => {
-    const key = useUID();
-    const [searchResults, setSearchResults] = useState([]);
-    const [attachments, setAttachments] = useState([]);
-    const [filterValue, setFilterValue] = useState('');
-    const [itemsToRender, setItemsToRender] = useState(availableRecipients);
-    const onSearch = ({ type, search, mentionType }) => {
-        if (type === 'mention') {
-            const availableMentions = mentionType === 'case' ? caseMentions : userMentions;
-            const mentions = availableMentions
-                .filter((user) => {
-                const names = user.primary.toLowerCase().split(' ');
-                const searchWords = search.toLowerCase().split(' ');
-                return !!searchWords.every((word) => names.find((name) => name.startsWith(word)));
-            })
-                .map(({ id, primary, secondary, visual, href }) => {
-                return {
-                    id,
-                    primary,
-                    secondary,
-                    visual,
-                    href
-                };
-            });
-            setSearchResults(mentions);
-        }
-        else {
-            setSearchResults(['cosmos', 'hashtag', 'pega']
-                .filter(tag => {
-                return tag.toLowerCase().includes(search.toLowerCase());
-            })
-                .map(tag => ({ id: tag, primary: tag })));
-        }
-    };
-    const onFilesAdded = (files) => {
-        files.forEach(file => {
-            if (file.type.split('/')[0] === 'image')
-                file.thumbnail = URL.createObjectURL(file);
-            if (file.size / 1000000 > 100) {
-                file.meta = 'File size cannot exceed 100MB';
-                file.error = true;
-            }
-            file.onDelete = () => {
-                setAttachments(current => {
-                    return current.filter(x => x.name !== file.name);
-                });
-            };
-        });
-        setAttachments(current => [...current, ...files]);
-    };
-    useEffect(() => {
-        const timeout = setTimeout(() => {
-            const newItems = availableRecipients.filter(({ primary, secondary }) => {
-                return (primary.toLowerCase().includes(filterValue) ||
-                    secondary.find(x => x.toLowerCase().includes(filterValue)));
-            });
-            setItemsToRender(newItems);
-        }, 500);
-        return () => {
-            clearTimeout(timeout);
-        };
-    }, [filterValue]);
-    const newPost = (<FeedNewPost id={key} attachments={attachments} interactionInfo={{
-            textAreaPlaceholder: 'Start a conversation',
-            postLabel: 'Post'
-        }} onFilesAdded={onFilesAdded} onPost={postEvent => {
-            onPost?.(postEvent);
-            setAttachments([]);
-            postEvent.clear();
-        }} recipients={itemsToRender} onRecipientSearch={(newSearch) => setFilterValue(newSearch)}/>);
-    return renderFeed ? (<Feed title='Pulse' searchTypes={['user', 'case']} onDecoratorSearch={onSearch} searchResults={searchResults} userInfo={{ username: 'demo_user', fullname: 'Demo User' }} newPostRegion={newPost}/>) : (newPost);
-};
-//# sourceMappingURL=FeedNewPost.stories.jsx.map

package/jsx/social/Feed/FeedNewPost.stories.jsx.map

@@ -1 +0,0 @@
-{"version":3,"file":"FeedNewPost.stories.jsx","sourceRoot":"","sources":["../../../src/social/Feed/FeedNewPost.stories.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Meta, Story } from '@storybook/react';\nimport { useState, useEffect } from 'react';\n\nimport { MenuItemProps, useUID } from '@pega/cosmos-react-core';\nimport {\n  Feed,\n  FeedNewPost,\n  FeedNewPostProps,\n  RecipientOption,\n  AttachedFiles\n} from '@pega/cosmos-react-social';\nimport { GlimpseProps } from '@pega/cosmos-react-work';\n\nimport { availableRecipients, caseMentions, userMentions } from './Feed.mocks';\n\nexport default {\n  title: 'Social/Feed/FeedNewPost',\n  component: FeedNewPost\n} as Meta;\n\ninterface FeedNewPostDemoProps {\n  onPost?: FeedNewPostProps['onPost'];\n  renderFeed?: boolean;\n}\n\nexport const FeedNewPostDemo: Story<FeedNewPostDemoProps> = ({\n  onPost = () => {},\n  renderFeed = true\n}: FeedNewPostDemoProps) => {\n  const key = useUID();\n  const [searchResults, setSearchResults] = useState<MenuItemProps[]>([]);\n  const [attachments, setAttachments] = useState<AttachedFiles[]>([]);\n  const [filterValue, setFilterValue] = useState('');\n  const [itemsToRender, setItemsToRender] = useState<RecipientOption[]>(availableRecipients);\n\n  const onSearch = ({\n    type,\n    search,\n    mentionType\n  }: {\n    type: 'mention' | 'tag';\n    search: string;\n    mentionType: string;\n  }) => {\n    if (type === 'mention') {\n      const availableMentions = mentionType === 'case' ? caseMentions : userMentions;\n\n      const mentions: MenuItemProps[] = availableMentions\n        .filter((user: GlimpseProps) => {\n          const names = user.primary.toLowerCase().split(' ');\n          const searchWords = search.toLowerCase().split(' ');\n          return !!searchWords.every((word: string) =>\n            names.find((name: string) => name.startsWith(word))\n          );\n        })\n        .map(({ id, primary, secondary, visual, href }) => {\n          return {\n            id,\n            primary,\n            secondary,\n            visual,\n            href\n          };\n        });\n      setSearchResults(mentions);\n    } else {\n      setSearchResults(\n        ['cosmos', 'hashtag', 'pega']\n          .filter(tag => {\n            return tag.toLowerCase().includes(search.toLowerCase());\n          })\n          .map(tag => ({ id: tag, primary: tag }))\n      );\n    }\n  };\n\n  const onFilesAdded = (files: AttachedFiles[]) => {\n    files.forEach(file => {\n      if (file.type.split('/')[0] === 'image') file.thumbnail = URL.createObjectURL(file);\n\n      if (file.size / 1000000 > 100) {\n        file.meta = 'File size cannot exceed 100MB';\n        file.error = true;\n      }\n\n      file.onDelete = () => {\n        setAttachments(current => {\n          return current.filter(x => x.name !== file.name);\n        });\n      };\n    });\n\n    setAttachments(current => [...current, ...files]);\n  };\n\n  useEffect(() => {\n    // Synthetic delay to mimic async request\n    const timeout = setTimeout(() => {\n      const newItems = availableRecipients.filter(({ primary, secondary }) => {\n        return (\n          primary.toLowerCase().includes(filterValue) ||\n          secondary.find(x => x.toLowerCase().includes(filterValue))\n        );\n      });\n\n      setItemsToRender(newItems);\n    }, 500);\n\n    return () => {\n      clearTimeout(timeout);\n    };\n  }, [filterValue]);\n\n  const newPost = (\n    <FeedNewPost\n      id={key}\n      attachments={attachments}\n      interactionInfo={{\n        textAreaPlaceholder: 'Start a conversation',\n        postLabel: 'Post'\n      }}\n      onFilesAdded={onFilesAdded}\n      onPost={postEvent => {\n        onPost?.(postEvent);\n        setAttachments([]);\n        postEvent.clear();\n      }}\n      recipients={itemsToRender}\n      onRecipientSearch={(newSearch: string) => setFilterValue(newSearch)}\n    />\n  );\n\n  return renderFeed ? (\n    <Feed\n      title='Pulse'\n      searchTypes={['user', 'case']}\n      onDecoratorSearch={onSearch}\n      searchResults={searchResults}\n      userInfo={{ username: 'demo_user', fullname: 'Demo User' }}\n      newPostRegion={newPost}\n    />\n  ) : (\n    newPost\n  );\n};\n"]}

package/jsx/social/Feed/FeedPost.stories.d.ts

@@ -1,8 +0,0 @@
-import { Meta, Story } from '@storybook/react';
-import { FeedPostDemoProps } from './Feed.mocks';
-declare const _default: Meta<import("@storybook/react").Args>;
-export default _default;
-export declare const FeedPostDemo: Story<FeedPostDemoProps>;
-export declare const FeedPostWithPresence: Story;
-export declare const FeedPostWithJSX: Story;
-//# sourceMappingURL=FeedPost.stories.d.ts.map

package/jsx/social/Feed/FeedPost.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"FeedPost.stories.d.ts","sourceRoot":"","sources":["../../../src/social/Feed/FeedPost.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,kBAAkB,CAAC;AAwB/C,OAAO,EAKL,iBAAiB,EAClB,MAAM,cAAc,CAAC;;AAEtB,wBAGU;AAEV,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,iBAAiB,CAwTjD,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,KAElC,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAgD7B,CAAC"}