npm - @pega/cosmos-react-work - Versions diffs - 5.0.0-dev.1.0 → 5.0.0-dev.10.0 - Mend

@pega/cosmos-react-work 5.0.0-dev.1.0 → 5.0.0-dev.10.0

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 (212) hide show

package/lib/components/ArticleList/ArticleBuddy.js ADDED Viewed

@@ -0,0 +1,68 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import styled, { css } from 'styled-components';
+import { Text, Actions, Flex, defaultThemeProp, useI18n, Link, calculateFontSize, Progress, Button, useConfiguration, formatNumber, useLiveLog, TextArea, AIButton, ErrorState } from '@pega/cosmos-react-core';
+import { isExternalLink, isInternalArticle } from './ArticleList.types';
+export const StyledDisclaimerHeader = styled(Text)(({ theme: { base: { spacing, palette } } }) => {
+    return css `
+      font-weight: bold;
+      border-block-start: 0.0625rem solid ${palette['border-line']};
+      padding-block: ${spacing};
+    `;
+});
+StyledDisclaimerHeader.defaultProps = defaultThemeProp;
+export const StyledDisclaimerText = styled(Text)(({ theme: { base: { 'font-size': fontSize, 'font-scale': fontScale, spacing } } }) => {
+    const systemFontSize = calculateFontSize(fontSize, fontScale).xs;
+    return css `
+      font-style: italic;
+      font-size: ${systemFontSize};
+      margin-block-end: calc(2.5 * ${spacing});
+    `;
+});
+StyledDisclaimerText.defaultProps = defaultThemeProp;
+export const StyledBuddyContainer = styled.div(({ theme: { base: { spacing } } }) => {
+    return css `
+      padding: calc(2 * ${spacing});
+      overflow-y: auto;
+      max-height: inherit;
+      height: 100%;
+    `;
+});
+StyledBuddyContainer.defaultProps = defaultThemeProp;
+const StyledBuddyArticleHeader = styled.header ``;
+const ArticleBuddy = ({ query, onClear, onSubmit, title, content, actions, references, disclaimer, loading = false, error = false, ...restProps }) => {
+    const t = useI18n();
+    const { locale } = useConfiguration();
+    const { announcePolite } = useLiveLog();
+    useEffect(() => {
+        if (content) {
+            announcePolite({
+                message: t('result_available'),
+                type: 'acknowledgement'
+            });
+        }
+    }, [content]);
+    return (_jsxs(Flex, { ...restProps, as: StyledBuddyContainer, container: { direction: 'column', gap: 1 }, "aria-busy": loading ? true : undefined, children: [_jsx(TextArea, { ...query, autoResize: false, onKeyDown: (e) => {
+                    if (e.key === 'Enter' && !e.shiftKey) {
+                        e.preventDefault();
+                        if (query.value?.trim()) {
+                            onSubmit();
+                        }
+                    }
+                } }), _jsxs(Flex, { container: { gap: 1, justify: 'end' }, children: [query.value && onClear && (_jsx(Button, { variant: 'link', onClick: () => {
+                            onClear();
+                        }, children: t('clear') })), _jsx(AIButton, { label: t('ask'), disabled: loading, onClick: () => {
+                            onSubmit();
+                        } })] }), loading && _jsx(Progress, { visible: !!loading, placement: 'block', message: t('loading') }), !loading && title && content && (_jsxs(_Fragment, { children: [_jsxs("article", { children: [_jsxs(Flex, { container: { alignItems: 'start' }, item: { grow: 1 }, children: [_jsx(Flex, { container: { pad: [1, undefined] }, item: { grow: 1 }, as: StyledBuddyArticleHeader, children: _jsx(Text, { variant: 'h3', children: title }) }), actions && _jsx(Actions, { items: actions })] }), _jsx(Flex, { container: true, item: { grow: 1 }, children: content })] }), references && (_jsxs(Flex, { container: { direction: 'column', gap: 1, pad: [undefined, 1] }, children: [_jsx(Text, { variant: 'h3', children: t('references') }), references?.map(reference => {
+                                return (_jsxs(Flex, { container: true, children: [_jsxs(Flex, { container: { alignItems: 'start', gap: 1 }, item: { grow: 1 }, children: [isExternalLink(reference) && (_jsx(Link, { href: reference.href, target: '_blank', children: reference.name }, reference.id)), isInternalArticle(reference) && (_jsx(Button, { variant: 'link', onClick: (e) => reference.onClick(reference.id, e), children: reference.name }))] }), reference.confidence && (_jsx(Flex, { container: { alignItems: 'start' }, item: { grow: 0 }, children: _jsx(Text, { children: formatNumber(reference.confidence, {
+                                                    locale,
+                                                    options: {
+                                                        style: 'unit',
+                                                        unit: 'percent',
+                                                        maximumFractionDigits: 0
+                                                    }
+                                                }) }) }))] }, reference.id));
+                            })] }))] })), error && !content && !loading && (_jsx(Flex, { container: { justify: 'center', pad: 1, gap: 1 }, children: _jsx(ErrorState, { message: t('error_message') }) })), disclaimer && (_jsxs(Flex, { container: { direction: 'column', pad: [1] }, children: [_jsx(StyledDisclaimerHeader, { children: t('disclaimer') }), _jsx(StyledDisclaimerText, { children: disclaimer })] }))] }));
+};
+export default ArticleBuddy;
+//# sourceMappingURL=ArticleBuddy.js.map

package/lib/components/ArticleList/ArticleBuddy.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ArticleBuddy.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleBuddy.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect } from 'react';\nimport type { FunctionComponent, MouseEvent, KeyboardEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Text,\n Actions,\n Flex,\n defaultThemeProp,\n useI18n,\n Link,\n calculateFontSize,\n Progress,\n Button,\n useConfiguration,\n formatNumber,\n useLiveLog,\n TextArea,\n AIButton,\n ErrorState\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\n\nimport { isExternalLink, isInternalArticle } from './ArticleList.types';\nimport type { ArticleBuddyProps } from './ArticleList.types';\n\nexport const StyledDisclaimerHeader = styled(Text)(\n ({\n theme: {\n base: { spacing, palette }\n }\n }) => {\n return css`\n font-weight: bold;\n border-block-start: 0.0625rem solid ${palette['border-line']};\n padding-block: ${spacing};\n `;\n }\n);\n\nStyledDisclaimerHeader.defaultProps = defaultThemeProp;\n\nexport const StyledDisclaimerText = styled(Text)(\n ({\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale, spacing }\n }\n }) => {\n const systemFontSize = calculateFontSize(fontSize, fontScale).xs;\n return css`\n font-style: italic;\n font-size: ${systemFontSize};\n margin-block-end: calc(2.5 * ${spacing});\n `;\n }\n);\n\nStyledDisclaimerText.defaultProps = defaultThemeProp;\n\nexport const StyledBuddyContainer = styled.div(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n padding: calc(2 * ${spacing});\n overflow-y: auto;\n max-height: inherit;\n height: 100%;\n `;\n }\n);\n\nStyledBuddyContainer.defaultProps = defaultThemeProp;\n\nconst StyledBuddyArticleHeader = styled.header``;\n\nconst ArticleBuddy: FunctionComponent<ArticleBuddyProps & ForwardProps> = ({\n query,\n onClear,\n onSubmit,\n title,\n content,\n actions,\n references,\n disclaimer,\n loading = false,\n error = false,\n ...restProps\n}) => {\n const t = useI18n();\n const { locale } = useConfiguration();\n const { announcePolite } = useLiveLog();\n useEffect(() => {\n if (content) {\n announcePolite({\n message: t('result_available'),\n type: 'acknowledgement'\n });\n }\n }, [content]);\n\n return (\n <Flex\n {...restProps}\n as={StyledBuddyContainer}\n container={{ direction: 'column', gap: 1 }}\n aria-busy={loading ? true : undefined}\n >\n <TextArea\n {...query}\n autoResize={false}\n onKeyDown={(e: KeyboardEvent<HTMLTextAreaElement>) => {\n if (e.key === 'Enter' && !e.shiftKey) {\n e.preventDefault();\n if (query.value?.trim()) {\n onSubmit();\n }\n }\n }}\n />\n <Flex container={{ gap: 1, justify: 'end' }}>\n {query.value && onClear && (\n <Button\n variant='link'\n onClick={() => {\n onClear();\n }}\n >\n {t('clear')}\n </Button>\n )}\n <AIButton\n label={t('ask')}\n disabled={loading}\n onClick={() => {\n onSubmit();\n }}\n />\n </Flex>\n\n {loading && <Progress visible={!!loading} placement='block' message={t('loading')} />}\n {!loading && title && content && (\n <>\n <article>\n <Flex container={{ alignItems: 'start' }} item={{ grow: 1 }}>\n <Flex\n container={{ pad: [1, undefined] }}\n item={{ grow: 1 }}\n as={StyledBuddyArticleHeader}\n >\n <Text variant='h3'>{title}</Text>\n </Flex>\n\n {actions && <Actions items={actions} />}\n </Flex>\n <Flex container item={{ grow: 1 }}>\n {content}\n </Flex>\n </article>\n {references && (\n <Flex container={{ direction: 'column', gap: 1, pad: [undefined, 1] }}>\n <Text variant='h3'>{t('references')}</Text>\n {references?.map(reference => {\n return (\n <Flex container key={reference.id}>\n <Flex container={{ alignItems: 'start', gap: 1 }} item={{ grow: 1 }}>\n {isExternalLink(reference) && (\n <Link href={reference.href} target='_blank' key={reference.id}>\n {reference.name}\n </Link>\n )}\n {isInternalArticle(reference) && (\n <Button\n variant='link'\n onClick={(e: MouseEvent<HTMLButtonElement>) =>\n reference.onClick(reference.id, e)\n }\n >\n {reference.name}\n </Button>\n )}\n </Flex>\n {reference.confidence && (\n <Flex container={{ alignItems: 'start' }} item={{ grow: 0 }}>\n <Text>\n {formatNumber(reference.confidence, {\n locale,\n options: {\n style: 'unit',\n unit: 'percent',\n maximumFractionDigits: 0\n }\n })}\n </Text>\n </Flex>\n )}\n </Flex>\n );\n })}\n </Flex>\n )}\n </>\n )}\n {error && !content && !loading && (\n <Flex container={{ justify: 'center', pad: 1, gap: 1 }}>\n <ErrorState message={t('error_message')} />\n </Flex>\n )}\n\n {disclaimer && (\n <Flex container={{ direction: 'column', pad: [1] }}>\n <StyledDisclaimerHeader>{t('disclaimer')}</StyledDisclaimerHeader>\n <StyledDisclaimerText>{disclaimer}</StyledDisclaimerText>\n </Flex>\n )}\n </Flex>\n );\n};\n\nexport default ArticleBuddy;\n"]}

package/lib/components/ArticleList/ArticleList.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { ArticleListProps } from './ArticleList.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '@pega/cosmos-react-core';
+import type { ArticleListProps } from './ArticleList.types';
 declare const ArticleList: FunctionComponent<ArticleListProps & ForwardProps>;
 export default ArticleList;
 //# sourceMappingURL=ArticleList.d.ts.map

package/lib/components/ArticleList/ArticleList.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleList.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.tsx"],"names":[],"mappings":"~~AAAA~~,OAAO,~~EACL~~,iBAAiB,~~EASlB~~,MAAM,OAAO,CAAC;~~AAGf~~,OAAO,~~EAIL~~,YAAY,~~EASb~~,MAAM,yBAAyB,CAAC;~~AAIjC~~,OAAO,~~EAEL~~,gBAAgB,EAGjB,MAAM,qBAAqB,CAAC;~~AAuC7B~~,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,~~CA2MnE~~,CAAC;AAEF,eAAe,WAAW,CAAC"}
1	+ {"version":3,"file":"ArticleList.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAmC,MAAM,OAAO,CAAC;AAehF,OAAO,KAAK,EAAE,YAAY,EAAO,MAAM,yBAAyB,CAAC;AAIjE,OAAO,KAAK,EAEV,gBAAgB,EAGjB,MAAM,qBAAqB,CAAC;AA2C7B,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAgOnE,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/components/ArticleList/ArticleList.js CHANGED Viewed

@@ -6,6 +6,7 @@ import { Flex, useI18n, defaultThemeProp, TabPanel, Tabs, EmptyState, Progress,
 import ArticleListFilter from './ArticleListFilter';
 import ArticleSummary from './ArticleSummary';
 import ArticleListHeader from './ArticleListHeader';
+import ArticleBuddy from './ArticleBuddy';
 const StyledSummaryList = styled.ul(({ theme }) => {
     return css `
     max-height: calc(100vh - 8 * ${theme.base.spacing});
@@ -15,6 +16,9 @@ const StyledSummaryList = styled.ul(({ theme }) => {
     overflow-y: auto;
     border-end-start-radius: ${theme.base['border-radius']};
     border-end-end-radius: ${theme.base['border-radius']};
+    > li[role='article'] {
+      padding-block: ${theme.base.spacing};
+    }
   `;
 });
 StyledSummaryList.defaultProps = defaultThemeProp;
@@ -31,14 +35,13 @@ StyledArticleTabPanel.defaultProps = defaultThemeProp;
 const StyledArticleList = styled.article(({ theme }) => {
     return css `
     height: 100%;
-    padding-block: 0;
     background: ${theme.base.palette['primary-background']};
     border-radius: ${theme.components.card['border-radius']};
   `;
 });
 StyledArticleList.defaultProps = defaultThemeProp;
 const ArticleList = forwardRef(function ArticleList(props, ref) {
-    const { header, suggested, followed, search, onTabClick, activeTab, loading = false, loadingMore = false, onQuickFilterClick, onLoadMore, ...restProps } = props;
+    const { header, suggested, followed, search, buddy, onTabClick, activeTab, loading = false, loadingMore = false, onQuickFilterClick, onLoadMore, ...restProps } = props;
     const t = useI18n();
     const { announcePolite } = useLiveLog();
     const articleContentRefs = useRef([]);
@@ -68,8 +71,13 @@ const ArticleList = forwardRef(function ArticleList(props, ref) {
                 count: followed?.count,
                 content: followed?.articles ?? []
             });
+        if (buddy)
+            tabsArr.push({
+                id: 'Buddy',
+                name: buddy.title
+            });
         return tabsArr;
-    }, [suggested, followed, search]);
+    }, [suggested, followed, search, buddy]);
     const listUlRef = tabs.reduce((acc, tab) => {
         return { ...acc, [tab.id]: createRef() };
     }, {});
@@ -108,24 +116,23 @@ const ArticleList = forwardRef(function ArticleList(props, ref) {
     }, ':scope > li[role="article"]');
     const articleContent = ({ content, tabId, headerTitle }) => {
         return (_jsxs(_Fragment, { children: [activeTab === t('search') && search && _jsx(ArticleListFilter, { ...search }), activeTab === t('followed') && followed && _jsx(ArticleListFilter, { ...followed }), loading && (_jsx(Progress, { visible: !!loading, placement: 'block', message: t('loading'), liveConfig: { contextualLabel: headerTitle ?? t('article_list_label_a11y') } })), !loading &&
-                    (content.length > 0 ? (_jsxs(Flex, { container: { direction: 'column', gap: 0.5, pad: [1, 2] }, as: StyledSummaryList, role: 'feed', ref: listUlRef[tabId], children: [content.map(summaryItem => (_createElement(ArticleSummary, { ...summaryItem, key: summaryItem.articleId, onQuickFilterClick: onQuickFilterClick }))), loadingMore && _jsx(Progress, { placement: 'block' })] })) : (_jsx(EmptyState, {})))] }));
+                    (content.length > 0 ? (_jsxs(Flex, { container: { direction: 'column', gap: 0.5, pad: [1.5, 2] }, as: StyledSummaryList, role: 'feed', ref: listUlRef[tabId], children: [content.map(summaryItem => (_createElement(ArticleSummary, { ...summaryItem, key: summaryItem.articleId, onQuickFilterClick: onQuickFilterClick }))), loadingMore && _jsx(Progress, { placement: 'block' })] })) : (_jsx(EmptyState, {})))] }));
     };
     return (_jsxs(Flex, { ...restProps, container: {
-            direction: 'column',
-            pad: [0.5, undefined]
-        }, as: StyledArticleList, "aria-label": t('article_list_label_a11y'), ref: ref, ...(loading ? { 'aria-busy': true } : undefined), children: [header && (_jsx(ArticleListHeader, { icon: header.icon, title: header.title, actions: header.actions })), tabs.length === 1 &&
-                articleContent({
-                    content: tabs[0].content,
+            direction: 'column'
+        }, as: StyledArticleList, "aria-label": t('article_list_label_a11y'), ref: ref, "aria-busy": loading ? true : undefined, children: [header && (_jsx(ArticleListHeader, { icon: header.icon, title: header.title, actions: header.actions })), tabs.length === 1 && (_jsx(_Fragment, { children: tabs[0].id === 'Buddy' && buddy ? (_jsx(ArticleBuddy, { ...buddy.content })) : (articleContent({
+                    content: tabs[0]?.content || [],
                     tabId: tabs[0].id,
                     headerTitle: header?.title
-                }), tabs.length > 1 && (_jsxs(_Fragment, { children: [_jsx(Tabs, { ref: tabsRef, tabs: tabs, onTabClick: (name, e) => {
+                })) })), tabs.length > 1 && (_jsxs(_Fragment, { children: [_jsx(Tabs, { ref: tabsRef, tabs: tabs, onTabClick: (name, e) => {
                             if (document.activeElement instanceof HTMLElement) {
                                 activeElementRef.current = document.activeElement;
                                 onTabClick?.(name, e);
                             }
                         }, currentTabId: activeTab }), tabs.map(({ id, content }) => {
-                        return (_jsx(TabPanel, { tabId: id, currentTabId: activeTab, as: activeTab === id ? StyledArticleTabPanel : undefined, children: activeTab === id &&
-                                articleContent({ content, tabId: id, headerTitle: header?.title }) }, id));
+                        return (_jsx(TabPanel, { tabId: id, currentTabId: activeTab, as: activeTab === id ? StyledArticleTabPanel : undefined, children: activeTab === 'Buddy' && buddy ? (_jsx(ArticleBuddy, { ...buddy.content })) : (_jsx(_Fragment, { children: activeTab === id &&
+                                    content &&
+                                    articleContent({ content, tabId: id, headerTitle: header?.title }) })) }, id));
                     })] }))] }));
 });
 export default ArticleList;

package/lib/components/ArticleList/ArticleList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleList.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n forwardRef,\n Ref,\n PropsWithoutRef,\n useMemo,\n useEffect,\n useRef,\n RefObject,\n createRef\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Flex,\n useI18n,\n defaultThemeProp,\n ForwardProps,\n TabPanel,\n Tabs,\n Tab,\n EmptyState,\n Progress,\n getFocusables,\n useLiveLog,\n useItemIntersection\n} from '@pega/cosmos-react-core';\n\nimport ArticleListFilter from './ArticleListFilter';\nimport ArticleSummary from './ArticleSummary';\nimport {\n ArticleListTabId,\n ArticleListProps,\n ArticleSummaryProps,\n ArticleListHeaderProps\n} from './ArticleList.types';\nimport ArticleListHeader from './ArticleListHeader';\n\nconst StyledSummaryList = styled.ul(({ theme }) => {\n return css`\n max-height: calc(100vh - 8 * ${theme.base.spacing});\n flex-grow: 1;\n height: 100%;\n list-style-type: none;\n overflow-y: auto;\n border-end-start-radius: ${theme.base['border-radius']};\n border-end-end-radius: ${theme.base['border-radius']};\n `;\n});\n\nStyledSummaryList.defaultProps = defaultThemeProp;\n\nconst StyledArticleTabPanel = styled.div(({ theme }) => {\n return css`\n display: flex;\n flex-direction: column;\n min-height: 0;\n flex: 1 1;\n gap: ${theme.base.spacing};\n `;\n});\n\nStyledArticleTabPanel.defaultProps = defaultThemeProp;\n\nconst StyledArticleList = styled.article(({ theme }) => {\n return css`\n height: 100%;\n padding-block: 0;\n background: ${theme.base.palette['primary-background']};\n border-radius: ${theme.components.card['border-radius']};\n `;\n});\nStyledArticleList.defaultProps = defaultThemeProp;\n\nconst ArticleList: FunctionComponent<ArticleListProps & ForwardProps> = forwardRef(\n function ArticleList(props: PropsWithoutRef<ArticleListProps>, ref: Ref<HTMLDivElement>) {\n const {\n header,\n suggested,\n followed,\n search,\n onTabClick,\n activeTab,\n loading = false,\n loadingMore = false,\n onQuickFilterClick,\n onLoadMore,\n ...restProps\n } = props;\n const t = useI18n();\n const { announcePolite } = useLiveLog();\n\n const articleContentRefs = useRef<HTMLDivElement[]>([]);\n const activeTabContentRef = useRef<HTMLDivElement \| null>(null);\n const tabsRef = useRef<HTMLButtonElement>(null);\n const activeElementRef = useRef<HTMLElement \| null>(null);\n\n const tabs = useMemo(() => {\n const tabsArr: (Tab & {\n content: ArticleSummaryProps[];\n id: ArticleListTabId;\n })[] = [];\n\n if (suggested)\n tabsArr.push({\n id: 'Suggested',\n name: t('suggested'),\n count: suggested?.count,\n content: suggested.articles ?? []\n });\n\n if (search)\n tabsArr.push({\n id: 'Search',\n name: t('search'),\n count: search?.count,\n content: search?.articles ?? []\n });\n\n if (followed)\n tabsArr.push({\n id: 'Followed',\n name: t('followed'),\n count: followed?.count,\n content: followed?.articles ?? []\n });\n\n return tabsArr;\n }, [suggested, followed, search]);\n\n const listUlRef: { [id: string]: RefObject<HTMLElement> } = tabs.reduce((acc, tab) => {\n return { ...acc, [tab.id]: createRef() };\n }, {});\n\n useEffect(() => {\n if (tabsRef.current && getFocusables(tabsRef)?.length > 0)\n activeElementRef.current = getFocusables(tabsRef)[0];\n else {\n activeTabContentRef.current =\n articleContentRefs.current[tabs.findIndex(({ id }) => id === activeTab)];\n if (activeTabContentRef && getFocusables(activeTabContentRef)?.length > 0) {\n activeElementRef.current = getFocusables(activeTabContentRef)[0];\n }\n }\n }, []);\n\n useEffect(() => {\n if (!loading) {\n const currentTabContent = tabs.find(tab => tab.id === activeTab)?.content;\n announcePolite({\n type: 'status',\n message:\n currentTabContent && currentTabContent?.length > 0\n ? `${header?.title \|\| t('article_list_label_a11y')} ${t('loaded')}`\n : t('no_items')\n });\n }\n }, [loading]);\n\n const getItemLength = (tabName: string): number => {\n const currentTab = tabs.find(item => item.id === tabName);\n if (!currentTab \|\| !currentTab.content) {\n return 0;\n }\n return currentTab.content.length - 1;\n };\n\n useItemIntersection(\n listUlRef[activeTab],\n getItemLength(activeTab),\n () => {\n if (!loadingMore) onLoadMore?.();\n },\n ':scope > li[role=\"article\"]'\n );\n\n const articleContent = ({\n content,\n tabId,\n headerTitle\n }: {\n count?: Tab['count'];\n content: ArticleSummaryProps[];\n headerTitle?: ArticleListHeaderProps['title'];\n tabId: ArticleListTabId;\n }) => {\n return (\n <>\n {activeTab === t('search') && search && <ArticleListFilter {...search} />}\n {activeTab === t('followed') && followed && <ArticleListFilter {...followed} />}\n {loading && (\n <Progress\n visible={!!loading}\n placement='block'\n message={t('loading')}\n liveConfig={{ contextualLabel: headerTitle ?? t('article_list_label_a11y') }}\n />\n )}\n {!loading &&\n (content.length > 0 ? (\n <Flex\n container={{ direction: 'column', gap: 0.5, pad: [1, 2] }}\n as={StyledSummaryList}\n role='feed'\n ref={listUlRef[tabId]}\n >\n {content.map(summaryItem => (\n <ArticleSummary\n {...summaryItem}\n key={summaryItem.articleId}\n onQuickFilterClick={onQuickFilterClick}\n />\n ))}\n {loadingMore && <Progress placement='block' />}\n </Flex>\n ) : (\n <EmptyState />\n ))}\n </>\n );\n };\n\n return (\n <Flex\n {...restProps}\n container={{\n direction: 'column',\n pad: [0.5, undefined]\n }}\n as={StyledArticleList}\n aria-label={t('article_list_label_a11y')}\n ref={ref}\n {...(loading ? { 'aria-busy': true } : undefined)}\n >\n {header && (\n <ArticleListHeader icon={header.icon} title={header.title} actions={header.actions} />\n )}\n\n {tabs.length === 1 &&\n articleContent({\n content: tabs[0].content,\n tabId: tabs[0].id,\n headerTitle: header?.title\n })}\n\n {/* When multiple tabs present. */}\n {tabs.length > 1 && (\n <>\n <Tabs\n ref={tabsRef}\n tabs={tabs}\n onTabClick={(name, e) => {\n if (document.activeElement instanceof HTMLElement) {\n activeElementRef.current = document.activeElement;\n onTabClick?.(name, e);\n }\n }}\n currentTabId={activeTab}\n />\n {tabs.map(({ id, content }) => {\n return (\n <TabPanel\n key={id}\n tabId={id}\n currentTabId={activeTab}\n as={activeTab === id ? StyledArticleTabPanel : undefined}\n >\n {activeTab === id &&\n articleContent({ content, tabId: id, headerTitle: header?.title })}\n </TabPanel>\n );\n })}\n </>\n )}\n </Flex>\n );\n }\n);\n\nexport default ArticleList;\n"]}
1	+ {"version":3,"file":"ArticleList.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useMemo, useEffect, useRef, createRef } from 'react';\nimport type { FunctionComponent, Ref, PropsWithoutRef, RefObject } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Flex,\n useI18n,\n defaultThemeProp,\n TabPanel,\n Tabs,\n EmptyState,\n Progress,\n getFocusables,\n useLiveLog,\n useItemIntersection\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps, Tab } from '@pega/cosmos-react-core';\n\nimport ArticleListFilter from './ArticleListFilter';\nimport ArticleSummary from './ArticleSummary';\nimport type {\n ArticleListTabId,\n ArticleListProps,\n ArticleSummaryProps,\n ArticleListHeaderProps\n} from './ArticleList.types';\nimport ArticleListHeader from './ArticleListHeader';\nimport ArticleBuddy from './ArticleBuddy';\n\nconst StyledSummaryList = styled.ul(({ theme }) => {\n return css`\n max-height: calc(100vh - 8 * ${theme.base.spacing});\n flex-grow: 1;\n height: 100%;\n list-style-type: none;\n overflow-y: auto;\n border-end-start-radius: ${theme.base['border-radius']};\n border-end-end-radius: ${theme.base['border-radius']};\n > li[role='article'] {\n padding-block: ${theme.base.spacing};\n }\n `;\n});\n\nStyledSummaryList.defaultProps = defaultThemeProp;\n\nconst StyledArticleTabPanel = styled.div(({ theme }) => {\n return css`\n display: flex;\n flex-direction: column;\n min-height: 0;\n flex: 1 1;\n gap: ${theme.base.spacing};\n `;\n});\n\nStyledArticleTabPanel.defaultProps = defaultThemeProp;\n\nconst StyledArticleList = styled.article(({ theme }) => {\n return css`\n height: 100%;\n background: ${theme.base.palette['primary-background']};\n border-radius: ${theme.components.card['border-radius']};\n `;\n});\n\nStyledArticleList.defaultProps = defaultThemeProp;\n\nconst ArticleList: FunctionComponent<ArticleListProps & ForwardProps> = forwardRef(\n function ArticleList(props: PropsWithoutRef<ArticleListProps>, ref: Ref<HTMLDivElement>) {\n const {\n header,\n suggested,\n followed,\n search,\n buddy,\n onTabClick,\n activeTab,\n loading = false,\n loadingMore = false,\n onQuickFilterClick,\n onLoadMore,\n ...restProps\n } = props;\n const t = useI18n();\n const { announcePolite } = useLiveLog();\n\n const articleContentRefs = useRef<HTMLDivElement[]>([]);\n const activeTabContentRef = useRef<HTMLDivElement \| null>(null);\n const tabsRef = useRef<HTMLButtonElement>(null);\n const activeElementRef = useRef<HTMLElement \| null>(null);\n\n const tabs = useMemo(() => {\n const tabsArr: (Tab & {\n content?: ArticleSummaryProps[];\n id: ArticleListTabId;\n })[] = [];\n\n if (suggested)\n tabsArr.push({\n id: 'Suggested',\n name: t('suggested'),\n count: suggested?.count,\n content: suggested.articles ?? []\n });\n\n if (search)\n tabsArr.push({\n id: 'Search',\n name: t('search'),\n count: search?.count,\n content: search?.articles ?? []\n });\n\n if (followed)\n tabsArr.push({\n id: 'Followed',\n name: t('followed'),\n count: followed?.count,\n content: followed?.articles ?? []\n });\n\n if (buddy)\n tabsArr.push({\n id: 'Buddy',\n name: buddy.title\n });\n\n return tabsArr;\n }, [suggested, followed, search, buddy]);\n\n const listUlRef: { [id: string]: RefObject<HTMLElement> } = tabs.reduce((acc, tab) => {\n return { ...acc, [tab.id]: createRef() };\n }, {});\n\n useEffect(() => {\n if (tabsRef.current && getFocusables(tabsRef)?.length > 0)\n activeElementRef.current = getFocusables(tabsRef)[0];\n else {\n activeTabContentRef.current =\n articleContentRefs.current[tabs.findIndex(({ id }) => id === activeTab)];\n if (activeTabContentRef && getFocusables(activeTabContentRef)?.length > 0) {\n activeElementRef.current = getFocusables(activeTabContentRef)[0];\n }\n }\n }, []);\n\n useEffect(() => {\n if (!loading) {\n const currentTabContent = tabs.find(tab => tab.id === activeTab)?.content;\n announcePolite({\n type: 'status',\n message:\n currentTabContent && currentTabContent?.length > 0\n ? `${header?.title \|\| t('article_list_label_a11y')} ${t('loaded')}`\n : t('no_items')\n });\n }\n }, [loading]);\n\n const getItemLength = (tabName: string): number => {\n const currentTab = tabs.find(item => item.id === tabName);\n if (!currentTab \|\| !currentTab.content) {\n return 0;\n }\n return currentTab.content.length - 1;\n };\n\n useItemIntersection(\n listUlRef[activeTab],\n getItemLength(activeTab),\n () => {\n if (!loadingMore) onLoadMore?.();\n },\n ':scope > li[role=\"article\"]'\n );\n\n const articleContent = ({\n content,\n tabId,\n headerTitle\n }: {\n count?: Tab['count'];\n content: ArticleSummaryProps[];\n headerTitle?: ArticleListHeaderProps['title'];\n tabId: ArticleListTabId;\n }) => {\n return (\n <>\n {activeTab === t('search') && search && <ArticleListFilter {...search} />}\n {activeTab === t('followed') && followed && <ArticleListFilter {...followed} />}\n {loading && (\n <Progress\n visible={!!loading}\n placement='block'\n message={t('loading')}\n liveConfig={{ contextualLabel: headerTitle ?? t('article_list_label_a11y') }}\n />\n )}\n {!loading &&\n (content.length > 0 ? (\n <Flex\n container={{ direction: 'column', gap: 0.5, pad: [1.5, 2] }}\n as={StyledSummaryList}\n role='feed'\n ref={listUlRef[tabId]}\n >\n {content.map(summaryItem => (\n <ArticleSummary\n {...summaryItem}\n key={summaryItem.articleId}\n onQuickFilterClick={onQuickFilterClick}\n />\n ))}\n {loadingMore && <Progress placement='block' />}\n </Flex>\n ) : (\n <EmptyState />\n ))}\n </>\n );\n };\n\n return (\n <Flex\n {...restProps}\n container={{\n direction: 'column'\n }}\n as={StyledArticleList}\n aria-label={t('article_list_label_a11y')}\n ref={ref}\n aria-busy={loading ? true : undefined}\n >\n {header && (\n <ArticleListHeader icon={header.icon} title={header.title} actions={header.actions} />\n )}\n\n {tabs.length === 1 && (\n <>\n {tabs[0].id === 'Buddy' && buddy ? (\n <ArticleBuddy {...buddy.content} />\n ) : (\n articleContent({\n content: tabs[0]?.content \|\| [],\n tabId: tabs[0].id,\n headerTitle: header?.title\n })\n )}\n </>\n )}\n\n {/* When multiple tabs present. */}\n\n {tabs.length > 1 && (\n <>\n <Tabs\n ref={tabsRef}\n tabs={tabs}\n onTabClick={(name, e) => {\n if (document.activeElement instanceof HTMLElement) {\n activeElementRef.current = document.activeElement;\n onTabClick?.(name, e);\n }\n }}\n currentTabId={activeTab}\n />\n {tabs.map(({ id, content }) => {\n return (\n <TabPanel\n key={id}\n tabId={id}\n currentTabId={activeTab}\n as={activeTab === id ? StyledArticleTabPanel : undefined}\n >\n {activeTab === 'Buddy' && buddy ? (\n <ArticleBuddy {...buddy.content} />\n ) : (\n <>\n {activeTab === id &&\n content &&\n articleContent({ content, tabId: id, headerTitle: header?.title })}\n </>\n )}\n </TabPanel>\n );\n })}\n </>\n )}\n </Flex>\n );\n }\n);\n\nexport default ArticleList;\n"]}

package/lib/components/ArticleList/ArticleList.types.d.ts CHANGED Viewed

@@ -1,6 +1,7 @@
-import { MouseEvent, MouseEventHandler } from 'react';
-import { Action, BaseProps, ComboBoxProps, OmitStrict, RequireAtLeastOne, SearchInputProps } from '@pega/cosmos-react-core';
-import { ArticleMetaProps } from '../Article/ArticleMeta';
+import type { MouseEvent, MouseEventHandler, ReactNode } from 'react';
+import type { Action, BaseProps, ComboBoxProps, OmitStrict, RequireAtLeastOne, SearchInputProps, TextAreaProps } from '@pega/cosmos-react-core';
+import type { ArticleRatingProps } from '../Article/ArticleRating';
+import type { ArticleMetaProps } from '../Article/ArticleMeta';
 export interface ArticleSummaryProps extends BaseProps {
     /** Unique id of article */
     articleId: string;
@@ -16,11 +17,59 @@ export interface ArticleSummaryProps extends BaseProps {
     primaryActions?: Action[];
     /** A list of elements to be rendered within a MetaList. */
     meta?: ArticleMetaProps;
-    /** Quick filters to filter articles */
+    /** Rating - likes and dislikes of the article.  */
+    feedback?: OmitStrict<ArticleRatingProps, 'onReaction'> & {
+        onReaction: (articleId: ArticleSummaryProps['articleId'], reaction: ArticleRatingProps['reaction']) => void;
+    };
+    /** Quick filters to filter articles. */
     quickFilters?: QuickFilter[];
     /** callback fired when quick filter is clicked */
     onQuickFilterClick?: ArticleListProps['onQuickFilterClick'];
 }
+export interface BaseReferenceProps {
+    id: string;
+    name: string;
+    confidence?: number;
+}
+export type ExternalLinkProps = BaseReferenceProps & {
+    type: 'link';
+    href: string;
+};
+export type InternalArticleProps = BaseReferenceProps & {
+    type: 'object';
+    onClick: (id: BaseReferenceProps['id'], e: MouseEvent<HTMLButtonElement>) => void;
+};
+type Reference = ExternalLinkProps | InternalArticleProps;
+export interface ArticleBuddyProps {
+    /** search params */
+    query: OmitStrict<TextAreaProps, 'displayCharCount' | 'resizable' | 'hardStop' | 'maxLength' | 'minLength'>;
+    /** callback to fetch the search result */
+    onSubmit: () => void;
+    /** callback to clear the textArea */
+    onClear: () => void;
+    /** title of the search content */
+    title?: string;
+    /** Main body of search content */
+    content?: ReactNode;
+    /** Action for share and copy */
+    actions?: Action[];
+    /** References with confidence level */
+    references?: Reference[];
+    /** Disclaimer for the genAI response */
+    disclaimer?: string;
+    /**
+     * Optionally renders an indeterminate progress indicator while result are being fetched.
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * error state
+     * @default false
+     */
+    error?: boolean;
+}
+export declare const isExternalLink: (reference: Reference) => reference is ExternalLinkProps;
+export declare const isInternalArticle: (reference: Reference) => reference is InternalArticleProps;
 export interface Articles {
     /** List of articles */
     articles: ArticleSummaryProps[];
@@ -58,6 +107,10 @@ export type ArticleListProps = RequireAtLeastOne<{
     followed?: Articles;
     /** Data of search articles */
     search?: Articles;
+    buddy?: {
+        title: string;
+        content: ArticleBuddyProps;
+    };
     /** current active tab whose list has to be rendered */
     activeTab: string;
     /** Callback fired when tab is clicked */
@@ -76,12 +129,13 @@ export type ArticleListProps = RequireAtLeastOne<{
     onQuickFilterClick?: (quickFilterParam: QuickFilter, event: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
     /** Callback to fetch more rows */
     onLoadMore?: () => void;
-}, 'suggested' | 'followed' | 'search'>;
+}, 'suggested' | 'followed' | 'search' | 'buddy'>;
 export interface QuickFilter {
     /** Unique id of quick Filter */
     id: string;
     /** Name of quick Filter */
     name: string;
 }
-export type ArticleListTabId = 'Suggested' | 'Followed' | 'Search';
+export type ArticleListTabId = 'Suggested' | 'Followed' | 'Search' | 'Buddy';
+export {};
 //# sourceMappingURL=ArticleList.types.d.ts.map

package/lib/components/ArticleList/ArticleList.types.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleList.types.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;~~AAEtD~~,OAAO,~~EACL~~,MAAM,EACN,SAAS,EACT,aAAa,EACb,UAAU,EACV,iBAAiB,EACjB,gBAAgB,~~EACjB~~,MAAM,yBAAyB,CAAC;AAEjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;~~AAE1D~~,MAAM,WAAW,mBAAoB,SAAQ,SAAS;IACpD,2BAA2B;IAC3B,SAAS,EAAE,MAAM,CAAC;IAClB,6EAA6E;IAC7E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,sBAAsB;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,mDAAmD;IACnD,YAAY,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAChG,+DAA+D;IAC/D,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,2DAA2D;IAC3D,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,~~uCAAuC~~;~~IACvC~~,YAAY,CAAC,EAAE,WAAW,EAAE,CAAC;IAC7B,kDAAkD;IAClD,kBAAkB,CAAC,EAAE,gBAAgB,CAAC,oBAAoB,CAAC,CAAC;CAC7D;AAED,MAAM,WAAW,QAAQ;IACvB,uBAAuB;IACvB,QAAQ,EAAE,mBAAmB,EAAE,CAAC;IAChC,wBAAwB;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yCAAyC;IACzC,WAAW,EAAE,UAAU,CACrB,gBAAgB,EACd,aAAa,GACb,gBAAgB,GAChB,eAAe,GACf,gBAAgB,GAChB,oBAAoB,GACpB,gBAAgB,CACnB,CAAC;IACF,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,UAAU,CACnB,aAAa,EACX,IAAI,GACJ,aAAa,GACb,UAAU,GACV,UAAU,GACV,UAAU,GACV,QAAQ,GACR,MAAM,GACN,SAAS,GACT,gBAAgB,CACnB,CAAC;IACF,yCAAyC;IACzC,MAAM,CAAC,EAAE,UAAU,CACjB,aAAa,EACX,IAAI,GACJ,aAAa,GACb,UAAU,GACV,UAAU,GACV,UAAU,GACV,QAAQ,GACR,MAAM,GACN,MAAM,GACN,SAAS,GACT,gBAAgB,GAChB,UAAU,GACV,OAAO,CACV,CAAC;IACF,kDAAkD;IAClD,YAAY,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACpD,uCAAuC;IACvC,YAAY,CAAC,EAAE,WAAW,EAAE,CAAC;IAC7B,0DAA0D;IAC1D,uBAAuB,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/C,yCAAyC;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,WAAW,sBAAsB;IACrC,4BAA4B;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,+BAA+B;IAC/B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,uDAAuD;IACvD,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB;AAED,MAAM,MAAM,gBAAgB,GAAG,iBAAiB,CAC9C;IACE,2CAA2C;IAC3C,MAAM,CAAC,EAAE,sBAAsB,CAAC;IAChC,iCAAiC;IACjC,SAAS,CAAC,EAAE,IAAI,CAAC,QAAQ,EAAE,UAAU,GAAG,OAAO,CAAC,CAAC;IACjD,gCAAgC;IAChC,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,8BAA8B;IAC9B,MAAM,CAAC,EAAE,QAAQ,CAAC;IAClB,uDAAuD;IACvD,SAAS,EAAE,MAAM,CAAC;IAClB,yCAAyC;IACzC,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KAAK,IAAI,CAAC;IAC/F;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,kDAAkD;IAClD,kBAAkB,CAAC,EAAE,CACnB,gBAAgB,EAAE,WAAW,EAC7B,KAAK,EAAE,UAAU,CAAC,iBAAiB,GAAG,iBAAiB,CAAC,KACrD,IAAI,CAAC;IACV,kCAAkC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB,EACD,WAAW,GAAG,UAAU,GAAG,QAAQ,~~CACpC~~,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,gCAAgC;IAChC,EAAE,EAAE,MAAM,CAAC;IACX,2BAA2B;IAC3B,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,MAAM,gBAAgB,GAAG,WAAW,GAAG,UAAU,GAAG,QAAQ,CAAC"}
1	+ {"version":3,"file":"ArticleList.types.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.types.ts"],"names":[],"mappings":"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"}

package/lib/components/ArticleList/ArticleList.types.js CHANGED Viewed

@@ -1,2 +1,7 @@
-export {};
+export const isExternalLink = (reference) => {
+    return reference.type === 'link';
+};
+export const isInternalArticle = (reference) => {
+    return reference.type === 'object';
+};
 //# sourceMappingURL=ArticleList.types.js.map

package/lib/components/ArticleList/ArticleList.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleList.types.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.types.ts"],"names":[],"mappings":"","sourcesContent":["import { MouseEvent, MouseEventHandler } from 'react';\n\nimport {\n Action,\n BaseProps,\n ComboBoxProps,\n OmitStrict,\n RequireAtLeastOne,\n SearchInputProps\n} from '@pega/cosmos-react-core';\n\nimport { ArticleMetaProps } from '../Article/ArticleMeta';\n\nexport interface ArticleSummaryProps extends BaseProps {\n /** Unique id of article /\n articleId: string;\n /* URL or DOM id to navigate to. This will render the nav item as a link. /\n href?: string;\n /* Article title /\n title: string;\n /* Article content /\n abstract: string;\n /* Callback fired when article title is clicked /\n onTitleClick?: (id?: string, event?: MouseEvent<HTMLButtonElement \| HTMLAnchorElement>) => void;\n /* Primary actions which needs to be displayed with an icon /\n primaryActions?: Action[];\n /* A list of elements to be rendered within a MetaList. /\n meta?: ArticleMetaProps;\n /* Quick filters to filter articles /\n quickFilters?: QuickFilter[];\n /* callback fired when quick filter is clicked /\n onQuickFilterClick?: ArticleListProps['onQuickFilterClick'];\n}\n\nexport interface Articles {\n /* List of articles /\n articles: ArticleSummaryProps[];\n /* count of articles /\n count?: number;\n /* Props related to the Search Input. /\n searchInput: OmitStrict<\n SearchInputProps,\n \| 'placeholder'\n \| 'onSearchSubmit'\n \| 'searchResults'\n \| 'recentSearches'\n \| 'advancedSearchLink'\n \| 'resultsPopover'\n >;\n /* Props related to the Category Input. /\n category?: OmitStrict<\n ComboBoxProps,\n \| 'id'\n \| 'labelHidden'\n \| 'required'\n \| 'disabled'\n \| 'readOnly'\n \| 'status'\n \| 'info'\n \| 'actions'\n \| 'additionalInfo'\n >;\n /* Props related to the SortBy Input. /\n sortBy?: OmitStrict<\n ComboBoxProps,\n \| 'id'\n \| 'labelHidden'\n \| 'required'\n \| 'disabled'\n \| 'readOnly'\n \| 'status'\n \| 'info'\n \| 'mode'\n \| 'actions'\n \| 'additionalInfo'\n \| 'onChange'\n \| 'value'\n >;\n /* Callback fired when clear button is clicked /\n onClearClick?: MouseEventHandler<HTMLButtonElement>;\n /* Quick filters to filter articles /\n quickFilters?: QuickFilter[];\n /* Callback fired when applied quick filter is removed /\n handleQuickFilterRemove?: (id: string) => void;\n /* Prop to enable show / hide results /\n showResults?: boolean;\n}\n\nexport interface ArticleListHeaderProps {\n /* Title of article list /\n title: string;\n /* Article list header icon /\n icon?: string;\n /* Actions which needs to be displayed with an icon /\n actions?: Action[];\n}\n\nexport type ArticleListProps = RequireAtLeastOne<\n {\n /* Props related to article list header /\n header?: ArticleListHeaderProps;\n /* Data of suggested articles /\n suggested?: Pick<Articles, 'articles' \| 'count'>;\n /* Data of followed articles /\n followed?: Articles;\n /* Data of search articles /\n search?: Articles;\n /* current active tab whose list has to be rendered /\n activeTab: string;\n /* Callback fired when tab is clicked /\n onTabClick?: (name: string, event?: MouseEvent<HTMLButtonElement \| HTMLAnchorElement>) => void;\n /\n Optionally renders an indeterminate progress indicator while articles are being fetched.\n * @default false\n /\n loading?: boolean;\n /\n Optionally renders an indeterminate progress indicator while progressively fetching articles\n * @default false\n /\n loadingMore?: boolean;\n /* callback fired when quick filter is clicked /\n onQuickFilterClick?: (\n quickFilterParam: QuickFilter,\n event: MouseEvent<HTMLButtonElement \| HTMLAnchorElement>\n ) => void;\n /* Callback to fetch more rows /\n onLoadMore?: () => void;\n },\n 'suggested' \| 'followed' \| 'search'\n>;\n\nexport interface QuickFilter {\n /* Unique id of quick Filter /\n id: string;\n /* Name of quick Filter */\n name: string;\n}\n\nexport type ArticleListTabId = 'Suggested' \| 'Followed' \| 'Search';\n"]}
1	+ {"version":3,"file":"ArticleList.types.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.types.ts"],"names":[],"mappings":"AAyFA,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,SAAoB,EAAkC,EAAE;IACrF,OAAO,SAAS,CAAC,IAAI,KAAK,MAAM,CAAC;AACnC,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,SAAoB,EAAqC,EAAE;IAC3F,OAAO,SAAS,CAAC,IAAI,KAAK,QAAQ,CAAC;AACrC,CAAC,CAAC","sourcesContent":["import type { MouseEvent, MouseEventHandler, ReactNode } from 'react';\n\nimport type {\n Action,\n BaseProps,\n ComboBoxProps,\n OmitStrict,\n RequireAtLeastOne,\n SearchInputProps,\n TextAreaProps\n} from '@pega/cosmos-react-core';\n\nimport type { ArticleRatingProps } from '../Article/ArticleRating';\nimport type { ArticleMetaProps } from '../Article/ArticleMeta';\n\nexport interface ArticleSummaryProps extends BaseProps {\n /** Unique id of article /\n articleId: string;\n /* URL or DOM id to navigate to. This will render the nav item as a link. /\n href?: string;\n /* Article title /\n title: string;\n /* Article content /\n abstract: string;\n /* Callback fired when article title is clicked /\n onTitleClick?: (id?: string, event?: MouseEvent<HTMLButtonElement \| HTMLAnchorElement>) => void;\n /* Primary actions which needs to be displayed with an icon /\n primaryActions?: Action[];\n /* A list of elements to be rendered within a MetaList. /\n meta?: ArticleMetaProps;\n /* Rating - likes and dislikes of the article. /\n feedback?: OmitStrict<ArticleRatingProps, 'onReaction'> & {\n onReaction: (\n articleId: ArticleSummaryProps['articleId'],\n reaction: ArticleRatingProps['reaction']\n ) => void;\n };\n /* Quick filters to filter articles. /\n quickFilters?: QuickFilter[];\n /* callback fired when quick filter is clicked /\n onQuickFilterClick?: ArticleListProps['onQuickFilterClick'];\n}\n\nexport interface BaseReferenceProps {\n id: string;\n name: string;\n confidence?: number;\n}\n\nexport type ExternalLinkProps = BaseReferenceProps & { type: 'link'; href: string };\n\nexport type InternalArticleProps = BaseReferenceProps & {\n type: 'object';\n onClick: (id: BaseReferenceProps['id'], e: MouseEvent<HTMLButtonElement>) => void;\n};\n\ntype Reference = ExternalLinkProps \| InternalArticleProps;\nexport interface ArticleBuddyProps {\n /* search params /\n query: OmitStrict<\n TextAreaProps,\n 'displayCharCount' \| 'resizable' \| 'hardStop' \| 'maxLength' \| 'minLength'\n >;\n /* callback to fetch the search result /\n onSubmit: () => void;\n /* callback to clear the textArea /\n onClear: () => void;\n /* title of the search content /\n title?: string;\n /* Main body of search content /\n content?: ReactNode;\n /* Action for share and copy /\n actions?: Action[];\n /* References with confidence level /\n references?: Reference[];\n /* Disclaimer for the genAI response /\n disclaimer?: string;\n /\n Optionally renders an indeterminate progress indicator while result are being fetched.\n * @default false\n /\n loading?: boolean;\n /\n error state\n * @default false\n /\n error?: boolean;\n}\n\nexport const isExternalLink = (reference: Reference): reference is ExternalLinkProps => {\n return reference.type === 'link';\n};\n\nexport const isInternalArticle = (reference: Reference): reference is InternalArticleProps => {\n return reference.type === 'object';\n};\n\nexport interface Articles {\n /* List of articles /\n articles: ArticleSummaryProps[];\n /* count of articles /\n count?: number;\n /* Props related to the Search Input. /\n searchInput: OmitStrict<\n SearchInputProps,\n \| 'placeholder'\n \| 'onSearchSubmit'\n \| 'searchResults'\n \| 'recentSearches'\n \| 'advancedSearchLink'\n \| 'resultsPopover'\n >;\n /* Props related to the Category Input. /\n category?: OmitStrict<\n ComboBoxProps,\n \| 'id'\n \| 'labelHidden'\n \| 'required'\n \| 'disabled'\n \| 'readOnly'\n \| 'status'\n \| 'info'\n \| 'actions'\n \| 'additionalInfo'\n >;\n /* Props related to the SortBy Input. /\n sortBy?: OmitStrict<\n ComboBoxProps,\n \| 'id'\n \| 'labelHidden'\n \| 'required'\n \| 'disabled'\n \| 'readOnly'\n \| 'status'\n \| 'info'\n \| 'mode'\n \| 'actions'\n \| 'additionalInfo'\n \| 'onChange'\n \| 'value'\n >;\n /* Callback fired when clear button is clicked /\n onClearClick?: MouseEventHandler<HTMLButtonElement>;\n /* Quick filters to filter articles /\n quickFilters?: QuickFilter[];\n /* Callback fired when applied quick filter is removed /\n handleQuickFilterRemove?: (id: string) => void;\n /* Prop to enable show / hide results /\n showResults?: boolean;\n}\n\nexport interface ArticleListHeaderProps {\n /* Title of article list /\n title: string;\n /* Article list header icon /\n icon?: string;\n /* Actions which needs to be displayed with an icon /\n actions?: Action[];\n}\n\nexport type ArticleListProps = RequireAtLeastOne<\n {\n /* Props related to article list header /\n header?: ArticleListHeaderProps;\n /* Data of suggested articles /\n suggested?: Pick<Articles, 'articles' \| 'count'>;\n /* Data of followed articles /\n followed?: Articles;\n /* Data of search articles /\n search?: Articles;\n buddy?: {\n title: string;\n content: ArticleBuddyProps;\n };\n /* current active tab whose list has to be rendered /\n activeTab: string;\n /* Callback fired when tab is clicked /\n onTabClick?: (name: string, event?: MouseEvent<HTMLButtonElement \| HTMLAnchorElement>) => void;\n /\n Optionally renders an indeterminate progress indicator while articles are being fetched.\n * @default false\n /\n loading?: boolean;\n /\n Optionally renders an indeterminate progress indicator while progressively fetching articles\n * @default false\n /\n loadingMore?: boolean;\n /* callback fired when quick filter is clicked /\n onQuickFilterClick?: (\n quickFilterParam: QuickFilter,\n event: MouseEvent<HTMLButtonElement \| HTMLAnchorElement>\n ) => void;\n /* Callback to fetch more rows /\n onLoadMore?: () => void;\n },\n 'suggested' \| 'followed' \| 'search' \| 'buddy'\n>;\n\nexport interface QuickFilter {\n /* Unique id of quick Filter /\n id: string;\n /* Name of quick Filter */\n name: string;\n}\n\nexport type ArticleListTabId = 'Suggested' \| 'Followed' \| 'Search' \| 'Buddy';\n"]}

package/lib/components/ArticleList/ArticleListFilter.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { ArticleListProps } from './ArticleList.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '@pega/cosmos-react-core';
+import type { ArticleListProps } from './ArticleList.types';
 declare const ArticleListFilter: FunctionComponent<ArticleListProps['search'] & ForwardProps>;
 export default ArticleListFilter;
 //# sourceMappingURL=ArticleListFilter.d.ts.map

package/lib/components/ArticleList/ArticleListFilter.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleListFilter.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleListFilter.tsx"],"names":[],"mappings":"~~AAAA~~,OAAO,EAAE,iBAAiB,~~EAAqB~~,MAAM,OAAO,CAAC;~~AAG7D~~,OAAO,~~EAOL~~,YAAY,~~EAIb~~,MAAM,yBAAyB,CAAC;~~AAGjC~~,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;~~AA8CvD~~,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,QAAQ,CAAC,GAAG,YAAY,CA2DnF,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
1	+ {"version":3,"file":"ArticleListFilter.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleListFilter.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAc/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAG5D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AA8C5D,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,QAAQ,CAAC,GAAG,YAAY,CA2DnF,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/ArticleList/ArticleListFilter.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleListFilter.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleListFilter.tsx"],"names":[],"mappings":";AAAA,OAAO,~~EAAqB~~,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;~~AAC7D~~,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,MAAM,EACN,IAAI,EACJ,WAAW,EACX,OAAO,EACP,gBAAgB,EAChB,QAAQ,~~EAER~~,iBAAiB,EACjB,IAAI,EACJ,UAAU,EACX,MAAM,yBAAyB,CAAC;~~AACjC~~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","sourcesContent":["import { ~~FunctionComponent,~~ useEffect, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Flex,\n SearchInput,\n useI18n,\n defaultThemeProp,\n ComboBox,\n ~~ForwardProps,\n~~ StyledSearchInput,\n Text,\n Selectable\n} from '@pega/cosmos-react-core';\nimport { StyledFormContent } from '@pega/cosmos-react-core/lib/components/MultiStepForm/MultiStepForm';\n\nimport { ArticleListProps } from './ArticleList.types';\n\nconst StyledClearButton = styled(Button)(({ theme }) => {\n return css`\n margin-block-start: calc(4.5 * ${theme.base.spacing});\n `;\n});\nStyledClearButton.defaultProps = defaultThemeProp;\n\nconst StyledFilterContainer = styled(Flex)`\n flex-grow: 1;\n`;\n\nconst StyledSelectable = styled(Selectable)(({ theme }) => {\n return css`\n line-height: calc(2 * ${theme.base.spacing});\n margin: calc(0.25 * ${theme.base.spacing});\n `;\n});\nStyledSelectable.defaultProps = defaultThemeProp;\n\nconst StyledSearchFilters = styled.div(({ theme }) => {\n return css`\n width: 100%;\n padding-block-start: ${theme.base.spacing};\n padding-inline: calc(2 * ${theme.base.spacing});\n\n > div:last-child {\n margin: 0;\n }\n\n ${StyledFormContent} {\n gap: ${theme.base.spacing};\n }\n\n ${StyledFilterContainer} > div {\n margin-top: calc(1.5 * ${theme.base.spacing});\n width: 100%;\n }\n ${StyledSearchInput} {\n flex-grow: 1;\n }\n `;\n});\nStyledSearchFilters.defaultProps = defaultThemeProp;\n\nconst ArticleListFilter: FunctionComponent<ArticleListProps['search'] & ForwardProps> = (\n props: ArticleListProps['search']\n) => {\n const {\n searchInput,\n category,\n sortBy,\n onClearClick,\n articles,\n quickFilters = [],\n showResults = false,\n handleQuickFilterRemove,\n ...restProps\n } = props \|\| {};\n const t = useI18n();\n const searchResults = t('results_count', [articles?.length ?? 0]);\n\n const quickFiltersRef = useRef<HTMLButtonElement[]>([]);\n\n useEffect(() => {\n if (quickFilters.length > 0 && quickFiltersRef.current.length > 0) {\n quickFiltersRef.current[quickFilters.length - 1]?.focus();\n }\n }, [articles]);\n\n return (\n <StyledSearchFilters {...restProps}>\n <Flex container={{ alignItems: 'center', gap: 1, pad: [0.5, undefined] }}>\n <SearchInput {...searchInput} />\n </Flex>\n {quickFilters.map(({ id, name }, i) => (\n <StyledSelectable\n id={id}\n ref={(el: HTMLButtonElement) => {\n quickFiltersRef.current[i] = el;\n }}\n onRemove={handleQuickFilterRemove ? () => handleQuickFilterRemove?.(id) : undefined}\n onClick={handleQuickFilterRemove ? () => handleQuickFilterRemove?.(id) : undefined}\n >\n {name}\n </StyledSelectable>\n ))}\n <StyledFilterContainer container={{ gap: 1, alignItems: 'start' }}>\n {category && <ComboBox {...category} />}\n {sortBy && <ComboBox {...sortBy} />}\n {onClearClick && (\n <StyledClearButton\n variant='link'\n label={t('clear')}\n aria-label={t('clear_filters')}\n onClick={onClearClick}\n >\n {t('clear')}\n </StyledClearButton>\n )}\n </StyledFilterContainer>\n {showResults && <Text variant='secondary'>{searchResults}</Text>}\n </StyledSearchFilters>\n );\n};\n\nexport default ArticleListFilter;\n"]}
1	+ {"version":3,"file":"ArticleListFilter.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleListFilter.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n Flex,\n SearchInput,\n useI18n,\n defaultThemeProp,\n ComboBox,\n StyledSearchInput,\n Text,\n Selectable\n} from '@pega/cosmos-react-core';\nimport type { ForwardProps } from '@pega/cosmos-react-core';\nimport { StyledFormContent } from '@pega/cosmos-react-core/lib/components/MultiStepForm/MultiStepForm';\n\nimport type { ArticleListProps } from './ArticleList.types';\n\nconst StyledClearButton = styled(Button)(({ theme }) => {\n return css`\n margin-block-start: calc(4.5 * ${theme.base.spacing});\n `;\n});\nStyledClearButton.defaultProps = defaultThemeProp;\n\nconst StyledFilterContainer = styled(Flex)`\n flex-grow: 1;\n`;\n\nconst StyledSelectable = styled(Selectable)(({ theme }) => {\n return css`\n line-height: calc(2 * ${theme.base.spacing});\n margin: calc(0.25 * ${theme.base.spacing});\n `;\n});\nStyledSelectable.defaultProps = defaultThemeProp;\n\nconst StyledSearchFilters = styled.div(({ theme }) => {\n return css`\n width: 100%;\n padding-block-start: ${theme.base.spacing};\n padding-inline: calc(2 * ${theme.base.spacing});\n\n > div:last-child {\n margin: 0;\n }\n\n ${StyledFormContent} {\n gap: ${theme.base.spacing};\n }\n\n ${StyledFilterContainer} > div {\n margin-top: calc(1.5 * ${theme.base.spacing});\n width: 100%;\n }\n ${StyledSearchInput} {\n flex-grow: 1;\n }\n `;\n});\nStyledSearchFilters.defaultProps = defaultThemeProp;\n\nconst ArticleListFilter: FunctionComponent<ArticleListProps['search'] & ForwardProps> = (\n props: ArticleListProps['search']\n) => {\n const {\n searchInput,\n category,\n sortBy,\n onClearClick,\n articles,\n quickFilters = [],\n showResults = false,\n handleQuickFilterRemove,\n ...restProps\n } = props \|\| {};\n const t = useI18n();\n const searchResults = t('results_count', [articles?.length ?? 0]);\n\n const quickFiltersRef = useRef<HTMLButtonElement[]>([]);\n\n useEffect(() => {\n if (quickFilters.length > 0 && quickFiltersRef.current.length > 0) {\n quickFiltersRef.current[quickFilters.length - 1]?.focus();\n }\n }, [articles]);\n\n return (\n <StyledSearchFilters {...restProps}>\n <Flex container={{ alignItems: 'center', gap: 1, pad: [0.5, undefined] }}>\n <SearchInput {...searchInput} />\n </Flex>\n {quickFilters.map(({ id, name }, i) => (\n <StyledSelectable\n id={id}\n ref={(el: HTMLButtonElement) => {\n quickFiltersRef.current[i] = el;\n }}\n onRemove={handleQuickFilterRemove ? () => handleQuickFilterRemove?.(id) : undefined}\n onClick={handleQuickFilterRemove ? () => handleQuickFilterRemove?.(id) : undefined}\n >\n {name}\n </StyledSelectable>\n ))}\n <StyledFilterContainer container={{ gap: 1, alignItems: 'start' }}>\n {category && <ComboBox {...category} />}\n {sortBy && <ComboBox {...sortBy} />}\n {onClearClick && (\n <StyledClearButton\n variant='link'\n label={t('clear')}\n aria-label={t('clear_filters')}\n onClick={onClearClick}\n >\n {t('clear')}\n </StyledClearButton>\n )}\n </StyledFilterContainer>\n {showResults && <Text variant='secondary'>{searchResults}</Text>}\n </StyledSearchFilters>\n );\n};\n\nexport default ArticleListFilter;\n"]}

package/lib/components/ArticleList/ArticleListHeader.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ArticleListHeaderProps } from './ArticleList.types';
+import type { FunctionComponent } from 'react';
+import type { ArticleListHeaderProps } from './ArticleList.types';
+export declare const StyledArticleListHeader: import("styled-components").StyledComponent<FunctionComponent<import("@pega/cosmos-react-core").FlexProps & import("@pega/cosmos-react-core").ForwardProps>, import("styled-components").DefaultTheme, {}, never>;
 declare const ArticleListHeader: FunctionComponent<ArticleListHeaderProps>;
 export default ArticleListHeader;
 //# sourceMappingURL=ArticleListHeader.d.ts.map

package/lib/components/ArticleList/ArticleListHeader.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleListHeader.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleListHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;~~AAK1C~~,OAAO,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;~~AAuB7D~~,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,CAQhE,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
1	+ {"version":3,"file":"ArticleListHeader.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleListHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAK/C,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAElE,eAAO,MAAM,uBAAuB,mNAAiB,CAAC;AAuBtD,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,CAQhE,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/lib/components/ArticleList/ArticleListHeader.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import styled, { css } from 'styled-components';
 import { Flex, Icon, Actions, Text, defaultThemeProp } from '@pega/cosmos-react-core';
+export const StyledArticleListHeader = styled(Flex) ``;
 const StyledHeaderText = styled(Text) `
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -14,7 +15,7 @@ const StyledIcon = styled(Icon)(({ theme: { base: { spacing } } }) => {
 });
 StyledIcon.defaultProps = defaultThemeProp;
 const ArticleListHeader = ({ icon, title, actions }) => {
-    return (_jsxs(Flex, { container: { alignItems: 'center', gap: 1, pad: 2 }, children: [icon && _jsx(StyledIcon, { name: icon }), _jsx(StyledHeaderText, { variant: 'h2', children: title }), actions && _jsx(Actions, { items: actions })] }));
+    return (_jsxs(Flex, { as: StyledArticleListHeader, container: { alignItems: 'center', gap: 1, pad: [1.5, 2] }, children: [icon && _jsx(StyledIcon, { name: icon }), _jsx(StyledHeaderText, { variant: 'h2', children: title }), actions && _jsx(Actions, { items: actions })] }));
 };
 export default ArticleListHeader;
 //# sourceMappingURL=ArticleListHeader.js.map

package/lib/components/ArticleList/ArticleListHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleListHeader.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleListHeader.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAItF,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;CAKpC,CAAC;AAEF,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAC7B,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;4BACc,OAAO;KAC9B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,iBAAiB,GAA8C,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IAChG,OAAO,CACL,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,~~aACtD~~,IAAI,IAAI,KAAC,UAAU,IAAC,IAAI,EAAE,IAAI,GAAI,EACnC,KAAC,gBAAgB,IAAC,OAAO,EAAC,IAAI,YAAE,KAAK,GAAoB,EACxD,OAAO,IAAI,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,GAAI,IAClC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Flex, Icon, Actions, Text, defaultThemeProp } from '@pega/cosmos-react-core';\n\nimport { ArticleListHeaderProps } from './ArticleList.types';\n\nconst StyledHeaderText = styled(Text)`\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n flex-grow: 1;\n`;\n\nconst StyledIcon = styled(Icon)(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n min-width: calc(3 * ${spacing});\n `;\n }\n);\n\nStyledIcon.defaultProps = defaultThemeProp;\n\nconst ArticleListHeader: FunctionComponent<ArticleListHeaderProps> = ({ icon, title, actions }) => {\n return (\n <Flex container={{ alignItems: 'center', gap: 1, pad: 2 }}>\n {icon && <StyledIcon name={icon} />}\n <StyledHeaderText variant='h2'>{title}</StyledHeaderText>\n {actions && <Actions items={actions} />}\n </Flex>\n );\n};\n\nexport default ArticleListHeader;\n"]}
1	+ {"version":3,"file":"ArticleListHeader.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleListHeader.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAItF,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA,EAAE,CAAC;AAEtD,MAAM,gBAAgB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;;;;CAKpC,CAAC;AAEF,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,CAC7B,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,OAAO,EAAE,EAClB,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;4BACc,OAAO;KAC9B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,iBAAiB,GAA8C,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE;IAChG,OAAO,CACL,MAAC,IAAI,IAAC,EAAE,EAAE,uBAAuB,EAAE,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,aAC1F,IAAI,IAAI,KAAC,UAAU,IAAC,IAAI,EAAE,IAAI,GAAI,EACnC,KAAC,gBAAgB,IAAC,OAAO,EAAC,IAAI,YAAE,KAAK,GAAoB,EACxD,OAAO,IAAI,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,GAAI,IAClC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import type { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Flex, Icon, Actions, Text, defaultThemeProp } from '@pega/cosmos-react-core';\n\nimport type { ArticleListHeaderProps } from './ArticleList.types';\n\nexport const StyledArticleListHeader = styled(Flex)``;\n\nconst StyledHeaderText = styled(Text)`\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n flex-grow: 1;\n`;\n\nconst StyledIcon = styled(Icon)(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n min-width: calc(3 * ${spacing});\n `;\n }\n);\n\nStyledIcon.defaultProps = defaultThemeProp;\n\nconst ArticleListHeader: FunctionComponent<ArticleListHeaderProps> = ({ icon, title, actions }) => {\n return (\n <Flex as={StyledArticleListHeader} container={{ alignItems: 'center', gap: 1, pad: [1.5, 2] }}>\n {icon && <StyledIcon name={icon} />}\n <StyledHeaderText variant='h2'>{title}</StyledHeaderText>\n {actions && <Actions items={actions} />}\n </Flex>\n );\n};\n\nexport default ArticleListHeader;\n"]}

package/lib/components/ArticleList/ArticleSummary.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import { FunctionComponent } from 'react';
-import { ForwardProps } from '@pega/cosmos-react-core';
-import { ArticleSummaryProps } from './ArticleList.types';
+import type { FunctionComponent } from 'react';
+import type { ForwardProps } from '@pega/cosmos-react-core';
+import type { ArticleSummaryProps } from './ArticleList.types';
 export declare const StyledQuickFilters: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
 declare const ArticleSummary: FunctionComponent<ArticleSummaryProps & ForwardProps>;
 export default ArticleSummary;

package/lib/components/ArticleList/ArticleSummary.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ArticleSummary.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;~~AAG1C~~,OAAO,~~EAML~~,YAAY,~~EAMb~~,MAAM,yBAAyB,CAAC;~~AASjC~~,OAAO,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;~~AAqC1D~~,eAAO,MAAM,kBAAkB,yGAW7B,CAAC;AAGH,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,~~CAkDzE~~,CAAC;AAEF,eAAe,cAAc,CAAC"}
1	+ {"version":3,"file":"ArticleSummary.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleSummary.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAe/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAU5D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAqC/D,eAAO,MAAM,kBAAkB,yGAW7B,CAAC;AAGH,QAAA,MAAM,cAAc,EAAE,iBAAiB,CAAC,mBAAmB,GAAG,YAAY,CAsEzE,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/components/ArticleList/ArticleSummary.js CHANGED Viewed

@@ -6,6 +6,7 @@ import { StyledCardHeader } from '@pega/cosmos-react-core/lib/components/Card/Ca
 import { StyledCardContent } from '@pega/cosmos-react-core/lib/components/Card/CardContent';
 import { StyledCardFooter } from '@pega/cosmos-react-core/lib/components/Card/CardFooter';
 import { StyledBareButton } from '@pega/cosmos-react-core/lib/components/Button/BareButton';
+import ArticleRating from '../Article/ArticleRating';
 import ArticleMeta from '../Article/ArticleMeta';
 const ArticleCard = styled(StyledCard)(({ theme: { base: { spacing, palette } } }) => {
     return css `
@@ -46,11 +47,17 @@ export const StyledQuickFilters = styled.div(({ theme }) => {
 });
 StyledQuickFilters.defaultProps = defaultThemeProp;
 const ArticleSummary = (props) => {
-    const { articleId, href, title, abstract, onTitleClick, primaryActions, meta, quickFilters, onQuickFilterClick, ...restProps } = props;
-    return (_jsxs(ArticleCard, { as: 'li', role: 'article', ...restProps, children: [_jsxs(CardHeader, { container: { alignItems: 'start', justify: 'between' }, children: [_jsx(Link, { href: href ?? '/', onClick: onTitleClick, children: title }), primaryActions?.length && _jsx(Actions, { items: primaryActions })] }), _jsx(CardContent, { children: _jsx(Text, { children: abstract }) }), _jsxs(CardFooter, { children: [meta && _jsx(ArticleMeta, { ...meta }), quickFilters && quickFilters.length > 0 && (_jsx(Flex, { container: { gap: 0.5, pad: [0.5, undefined], wrap: 'wrap' }, item: {
+    const { articleId, href, title, abstract, onTitleClick, primaryActions, meta, quickFilters, onQuickFilterClick, feedback, ...restProps } = props;
+    return (_jsxs(ArticleCard, { as: 'li', role: 'article', ...restProps, children: [_jsxs(CardHeader, { container: { alignItems: 'start', justify: 'between' }, children: [_jsx(Link, { href: href ?? '/', onClick: onTitleClick, children: title }), primaryActions?.length && _jsx(Actions, { items: primaryActions })] }), _jsx(CardContent, { children: _jsx(Text, { children: abstract }) }), _jsxs(CardFooter, { children: [feedback && (_jsx(Flex, { container: { pad: [0.5, undefined] }, item: {
                             grow: 1,
                             basis: '100%'
-                        }, as: StyledQuickFilters, children: quickFilters.map(({ id, name }) => (_jsx(Tag, { onClick: onQuickFilterClick ? e => onQuickFilterClick?.({ id, name }, e) : undefined, children: `#${name}` }))) }))] })] }, articleId));
+                        }, children: _jsx(ArticleRating, { ...feedback,
+                            onReaction: reaction => {
+                                feedback?.onReaction(articleId, reaction);
+                            } }) })), meta && _jsx(ArticleMeta, { ...meta }), quickFilters && quickFilters.length > 0 && (_jsx(Flex, { container: { gap: 0.5, wrap: 'wrap', pad: [undefined, undefined, 0.5] }, item: {
+                            grow: 1,
+                            basis: '100%'
+                        }, as: StyledQuickFilters, children: quickFilters.map(({ id, name }) => (_jsx(Tag, { onClick: onQuickFilterClick ? e => onQuickFilterClick?.({ id, name }, e) : undefined, children: `#${name}` }, id))) }))] })] }));
 };
 export default ArticleSummary;
 //# sourceMappingURL=ArticleSummary.js.map