@pega/cosmos-react-work 5.0.0-dev.8.0 → 5.0.0-dev.8.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"Article.d.ts","sourceRoot":"","sources":["../../../src/components/Article/Article.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAetE,OAAO,KAAK,EACV,aAAa,EACb,SAAS,EACT,YAAY,EACZ,cAAc,EACd,UAAU,EACX,MAAM,yBAAyB,CAAC;AAIjC,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,kCAAkC,CAAC;AAI/E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAE1D,OAAO,KAAK,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAEjF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAItD,KAAK,gBAAgB,GAAG,CACtB,SAAS,EAAE,gBAAgB,CAAC,WAAW,CAAC,EACxC,QAAQ,EAAE,kBAAkB,CAAC,UAAU,CAAC,KACrC,IAAI,CAAC;AAEV,MAAM,WAAW,gBAAiB,SAAQ,SAAS,EAAE,cAAc;IACjE,SAAS,EAAE,MAAM,CAAC;IAClB,mEAAmE;IACnE,MAAM,CAAC,EAAE,sBAAsB,CAAC;IAChC,kCAAkC;IAClC,cAAc,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;KACrD,CAAC;IACF,+DAA+D;IAC/D,cAAc,CAAC,EAAE;QACf,qDAAqD;QACrD,EAAE,EAAE,MAAM,CAAC;QACX,iFAAiF;QACjF,KAAK,EAAE,MAAM,CAAC;QACd,yCAAyC;QACzC,IAAI,EAAE,MAAM,CAAC;QACb,2EAA2E;QAC3E,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;KACjE,EAAE,CAAC;IACJ,gEAAgE;IAChE,gBAAgB,CAAC,EAAE;QACjB,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;QACxB,IAAI,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;QAC/B,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;KACnC,EAAE,CAAC;IACJ,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,yBAAyB;IACzB,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,UAAU,CAAC,kBAAkB,EAAE,YAAY,CAAC,GAAG;QACxD,UAAU,EAAE,gBAAgB,CAAC;KAC9B,CAAC;IACF,sBAAsB;IACtB,OAAO,EAAE,SAAS,CAAC;IACnB,aAAa;IACb,MAAM,CAAC,EAAE,UAAU,CAAC,kBAAkB,EAAE,UAAU,CAAC,GAAG;QACpD,QAAQ,CAAC,EAAE,UAAU,CAAC,qBAAqB,EAAE,YAAY,CAAC,GAAG;YAC3D,UAAU,EAAE,gBAAgB,CAAC;SAC9B,CAAC;KACH,CAAC;IACF,2CAA2C;IAC3C,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,MAAM,YAAY,GACpB,CAAC,gBAAgB,GAAG;IAAE,OAAO,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,GACxC,CAAC,OAAO,CAAC,gBAAgB,CAAC,GAAG;IAAE,OAAO,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC;AA6DpD,QAAA,MAAM,OAAO,EAAE,iBAAiB,CAAC,YAAY,GAAG,YAAY,CAqI3D,CAAC;AAEF,eAAe,OAAO,CAAC"}
1
+ {"version":3,"file":"Article.d.ts","sourceRoot":"","sources":["../../../src/components/Article/Article.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAetE,OAAO,KAAK,EACV,aAAa,EACb,SAAS,EACT,YAAY,EACZ,cAAc,EACd,UAAU,EACX,MAAM,yBAAyB,CAAC;AAIjC,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,kCAAkC,CAAC;AAI/E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAE1D,OAAO,KAAK,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAEjF,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,eAAe,CAAC;AAItD,KAAK,gBAAgB,GAAG,CACtB,SAAS,EAAE,gBAAgB,CAAC,WAAW,CAAC,EACxC,QAAQ,EAAE,kBAAkB,CAAC,UAAU,CAAC,KACrC,IAAI,CAAC;AAEV,MAAM,WAAW,gBAAiB,SAAQ,SAAS,EAAE,cAAc;IACjE,SAAS,EAAE,MAAM,CAAC;IAClB,mEAAmE;IACnE,MAAM,CAAC,EAAE,sBAAsB,CAAC;IAChC,kCAAkC;IAClC,cAAc,CAAC,EAAE;QACf,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;KACrD,CAAC;IACF,+DAA+D;IAC/D,cAAc,CAAC,EAAE;QACf,qDAAqD;QACrD,EAAE,EAAE,MAAM,CAAC;QACX,iFAAiF;QACjF,KAAK,EAAE,MAAM,CAAC;QACd,yCAAyC;QACzC,IAAI,EAAE,MAAM,CAAC;QACb,2EAA2E;QAC3E,OAAO,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,UAAU,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;KACjE,EAAE,CAAC;IACJ,gEAAgE;IAChE,gBAAgB,CAAC,EAAE;QACjB,EAAE,EAAE,aAAa,CAAC,IAAI,CAAC,CAAC;QACxB,IAAI,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;QAC/B,OAAO,EAAE,aAAa,CAAC,SAAS,CAAC,CAAC;KACnC,EAAE,CAAC;IACJ,oBAAoB;IACpB,KAAK,EAAE,MAAM,CAAC;IACd,yBAAyB;IACzB,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,6CAA6C;IAC7C,QAAQ,CAAC,EAAE,UAAU,CAAC,kBAAkB,EAAE,YAAY,CAAC,GAAG;QACxD,UAAU,EAAE,gBAAgB,CAAC;KAC9B,CAAC;IACF,sBAAsB;IACtB,OAAO,EAAE,SAAS,CAAC;IACnB,aAAa;IACb,MAAM,CAAC,EAAE,UAAU,CAAC,kBAAkB,EAAE,UAAU,CAAC,GAAG;QACpD,QAAQ,CAAC,EAAE,UAAU,CAAC,qBAAqB,EAAE,YAAY,CAAC,GAAG;YAC3D,UAAU,EAAE,gBAAgB,CAAC;SAC9B,CAAC;KACH,CAAC;IACF,2CAA2C;IAC3C,OAAO,EAAE,OAAO,CAAC;CAClB;AAED,MAAM,MAAM,YAAY,GACpB,CAAC,gBAAgB,GAAG;IAAE,OAAO,CAAC,EAAE,KAAK,CAAA;CAAE,CAAC,GACxC,CAAC,OAAO,CAAC,gBAAgB,CAAC,GAAG;IAAE,OAAO,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC;AAgEpD,QAAA,MAAM,OAAO,EAAE,iBAAiB,CAAC,YAAY,GAAG,YAAY,CAqI3D,CAAC;AAEF,eAAe,OAAO,CAAC"}
@@ -4,7 +4,7 @@ import styled, { css } from 'styled-components';
4
4
  import { registerIcon, Flex, MenuButton, Text, defaultThemeProp, Button, Icon, Progress, useI18n, useDirection } from '@pega/cosmos-react-core';
5
5
  import * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';
6
6
  import * as caretRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-right.icon';
7
- import ArticleListHeader from '../ArticleList/ArticleListHeader';
7
+ import ArticleListHeader, { StyledArticleListHeader } from '../ArticleList/ArticleListHeader';
8
8
  import ArticleRating from './ArticleRating';
9
9
  import ArticleFooter from './ArticleFooter';
10
10
  import ArticleMeta from './ArticleMeta';
@@ -13,9 +13,12 @@ const StyledArticleWrapper = styled.div(props => {
13
13
  const { theme } = props;
14
14
  return css `
15
15
  background: ${theme.base.palette['primary-background']};
16
- padding: calc(1.5 * ${theme.base.spacing});
17
16
  border-radius: calc(0.5 * ${theme.base['border-radius']});
18
17
  max-height: inherit;
18
+
19
+ ${StyledArticleListHeader} {
20
+ padding: 0 0 calc(0.5 * ${theme.base.spacing});
21
+ }
19
22
  `;
20
23
  });
21
24
  const StyledArticleHeader = styled.header `
@@ -62,14 +65,14 @@ const Article = (props) => {
62
65
  backButtonRef.current?.focus();
63
66
  }
64
67
  }, [loading]);
65
- return (_jsxs(Flex, { ...restProps, container: { direction: 'column', gap: 1 }, as: StyledArticleWrapper, "aria-busy": loading ? true : undefined, children: [header && _jsx(ArticleListHeader, { ...header }), (backNavigation || primaryActions || secondaryActions) && (_jsxs(Flex, { container: { alignItems: 'start' }, item: { grow: 1 }, children: [_jsx(Flex, { container: { pad: [1, undefined, undefined] }, item: { grow: 1 }, children: _jsxs(Button, { as: StyledBackNavButton, onClick: backNavigation?.onClick, variant: 'link', ref: backButtonRef, children: [ltr && _jsx(Icon, { name: `caret-${start}` }), backNavigation?.title, rtl && _jsx(Icon, { name: `caret-${end}` })] }) }), !loading && (_jsxs(_Fragment, { children: [primaryActions?.map(({ id, label, onClick, icon }) => {
68
+ return (_jsxs(Flex, { ...restProps, container: { direction: 'column', gap: 1, pad: [1.5, 2] }, as: StyledArticleWrapper, "aria-busy": loading ? true : undefined, children: [header && _jsx(ArticleListHeader, { ...header }), (backNavigation || primaryActions || secondaryActions) && (_jsxs(Flex, { container: { alignItems: 'start' }, item: { grow: 1 }, children: [_jsx(Flex, { container: { pad: [1, undefined, undefined] }, item: { grow: 1 }, children: _jsxs(Button, { as: StyledBackNavButton, onClick: backNavigation?.onClick, variant: 'link', ref: backButtonRef, children: [ltr && _jsx(Icon, { name: `caret-${start}` }), backNavigation?.title, rtl && _jsx(Icon, { name: `caret-${end}` })] }) }), !loading && (_jsxs(_Fragment, { children: [primaryActions?.map(({ id, label, onClick, icon }) => {
66
69
  return (_jsx(Button, { onClick: (e) => onClick(id, e), variant: 'simple', label: label, icon: true, children: _jsx(Icon, { name: icon }) }, id));
67
70
  }), secondaryActions && (_jsx(MenuButton, { variant: 'simple', text: t('actions'), icon: 'more', iconOnly: true, menu: {
68
71
  items: secondaryActions.map(({ text, ...rest }) => ({
69
72
  ...rest,
70
73
  primary: text
71
74
  }))
72
- } }))] }))] })), !loading && (_jsxs(_Fragment, { children: [_jsx(Flex, { container: true, as: StyledArticleHeader, children: _jsx(Text, { variant: 'h2', children: title }) }), feedback && (_jsx(ArticleRating, { ...feedback,
75
+ } }))] }))] })), !loading && (_jsxs(_Fragment, { children: [_jsx(Flex, { container: true, as: StyledArticleHeader, children: _jsx(Text, { variant: header ? 'h3' : 'h2', children: title }) }), feedback && (_jsx(ArticleRating, { ...feedback,
73
76
  onReaction: reaction => {
74
77
  feedback?.onReaction(articleId, reaction);
75
78
  } })), meta && (_jsx(Flex, { container: true, item: { shrink: 0 }, children: _jsx(ArticleMeta, { ...meta }) })), _jsx(StyledArticleContent, { children: content }), footer && (_jsx(ArticleFooter, { ...restFooter, ...(footerFeedback
@@ -1 +1 @@
1
- {"version":3,"file":"Article.js","sourceRoot":"","sources":["../../../src/components/Article/Article.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { ReactNode, FunctionComponent, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n registerIcon,\n Flex,\n MenuButton,\n Text,\n defaultThemeProp,\n Button,\n Icon,\n Progress,\n useI18n,\n useDirection\n} from '@pega/cosmos-react-core';\nimport type {\n MenuItemProps,\n BaseProps,\n ForwardProps,\n NoChildrenProp,\n OmitStrict\n} from '@pega/cosmos-react-core';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport * as caretRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-right.icon';\n\nimport type { ArticleListHeaderProps } from '../ArticleList/ArticleList.types';\nimport ArticleListHeader from '../ArticleList/ArticleListHeader';\n\nimport ArticleRating from './ArticleRating';\nimport type { ArticleRatingProps } from './ArticleRating';\nimport ArticleFooter from './ArticleFooter';\nimport type { ArticleFooterFeedback, ArticleFooterProps } from './ArticleFooter';\nimport ArticleMeta from './ArticleMeta';\nimport type { ArticleMetaProps } from './ArticleMeta';\n\nregisterIcon(caretRightIcon, caretLeftIcon);\n\ntype OnReactionWithId = (\n articleId: BaseArticleProps['articleId'],\n reaction: ArticleRatingProps['reaction']\n) => void;\n\nexport interface BaseArticleProps extends BaseProps, NoChildrenProp {\n articleId: string;\n /** Header to show icon , title and any actions on the container */\n header?: ArticleListHeaderProps;\n /** Control for navigating back */\n backNavigation?: {\n title: string;\n onClick: (e: MouseEvent<HTMLButtonElement>) => void;\n };\n /** Primary actions which needs to be displayed with an icon */\n primaryActions?: {\n /** Unique id for action, used in onClick callback */\n id: string;\n /** Label for this action, shown in tooltip and used for generating aria-label */\n label: string;\n /** Icon to be displayed in the button */\n icon: string;\n /** Callback triggered when a user clicks of presses enter on the action */\n onClick: (id: string, e: MouseEvent<HTMLButtonElement>) => void;\n }[];\n /** Secondary actions that needs to be pushed under more icon */\n secondaryActions?: {\n id: MenuItemProps['id'];\n text: MenuItemProps['primary'];\n onClick: MenuItemProps['onClick'];\n }[];\n /** Article title */\n title: string;\n /** Array of meta data */\n meta?: ArticleMetaProps;\n /** like and dislike status of the article */\n feedback?: OmitStrict<ArticleRatingProps, 'onReaction'> & {\n onReaction: OnReactionWithId;\n };\n /** Article content */\n content: ReactNode;\n /** Footer */\n footer?: OmitStrict<ArticleFooterProps, 'feedback'> & {\n feedback?: OmitStrict<ArticleFooterFeedback, 'onReaction'> & {\n onReaction: OnReactionWithId;\n };\n };\n /** Prop to check visibility of skeleton */\n loading: boolean;\n}\n\nexport type ArticleProps =\n | (BaseArticleProps & { loading?: false })\n | (Partial<BaseArticleProps> & { loading: true });\n\nconst StyledArticleWrapper = styled.div(props => {\n const { theme } = props;\n return css`\n background: ${theme.base.palette['primary-background']};\n padding: calc(1.5 * ${theme.base.spacing});\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n max-height: inherit;\n `;\n});\n\nconst StyledArticleHeader = styled.header`\n flex-shrink: 0;\n`;\n\nconst StyledArticleContent = styled.div(props => {\n const {\n theme,\n theme: {\n base: { spacing }\n }\n } = props;\n\n return css`\n flex-grow: 1;\n overflow-y: auto;\n padding: 0 calc(1.5 * ${spacing});\n margin: 0 calc(-1.5 * ${spacing});\n ul,\n ol {\n padding-left: calc(3 * ${spacing});\n }\n a {\n color: ${theme.components.link.color};\n }\n * {\n margin: revert;\n }\n `;\n});\n\nconst StyledBackNavButton = styled(Button)(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n display: flex;\n align-items: start;\n gap: calc(0.5 * ${spacing});\n margin-inline-end: calc(1.5 * ${spacing});\n `;\n }\n);\n\nStyledArticleContent.defaultProps = defaultThemeProp;\nStyledArticleWrapper.defaultProps = defaultThemeProp;\nStyledBackNavButton.defaultProps = defaultThemeProp;\n\nconst Article: FunctionComponent<ArticleProps & ForwardProps> = (props: ArticleProps) => {\n const {\n articleId,\n header,\n meta,\n title,\n backNavigation,\n content,\n primaryActions,\n secondaryActions,\n footer,\n loading,\n feedback,\n ...restProps\n } = props;\n\n const { feedback: footerFeedback, ...restFooter } = footer ?? {};\n const { rtl, ltr, end, start } = useDirection();\n\n const t = useI18n();\n const backButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (!loading) {\n backButtonRef.current?.focus();\n }\n }, [loading]);\n\n return (\n <Flex\n {...restProps}\n container={{ direction: 'column', gap: 1 }}\n as={StyledArticleWrapper}\n aria-busy={loading ? true : undefined}\n >\n {header && <ArticleListHeader {...header} />}\n {(backNavigation || primaryActions || secondaryActions) && (\n <Flex container={{ alignItems: 'start' }} item={{ grow: 1 }}>\n <Flex container={{ pad: [1, undefined, undefined] }} item={{ grow: 1 }}>\n <Button\n as={StyledBackNavButton}\n onClick={backNavigation?.onClick}\n variant='link'\n ref={backButtonRef}\n >\n {ltr && <Icon name={`caret-${start}`} />}\n {backNavigation?.title}\n {rtl && <Icon name={`caret-${end}`} />}\n </Button>\n </Flex>\n\n {!loading && (\n <>\n {primaryActions?.map(({ id, label, onClick, icon }) => {\n return (\n <Button\n key={id}\n onClick={(e: MouseEvent<HTMLButtonElement>) => onClick(id, e)}\n variant='simple'\n label={label}\n icon\n >\n <Icon name={icon} />\n </Button>\n );\n })}\n {secondaryActions && (\n <MenuButton\n variant='simple'\n text={t('actions')}\n icon='more'\n iconOnly\n menu={{\n items: secondaryActions.map(({ text, ...rest }) => ({\n ...rest,\n primary: text\n }))\n }}\n />\n )}\n </>\n )}\n </Flex>\n )}\n {!loading && (\n <>\n <Flex container as={StyledArticleHeader}>\n <Text variant='h2'>{title}</Text>\n </Flex>\n\n {feedback && (\n <ArticleRating\n {...{\n ...feedback,\n onReaction: reaction => {\n feedback?.onReaction(articleId, reaction);\n }\n }}\n />\n )}\n\n {meta && (\n <Flex container item={{ shrink: 0 }}>\n <ArticleMeta {...meta} />\n </Flex>\n )}\n <StyledArticleContent>{content}</StyledArticleContent>\n\n {footer && (\n <ArticleFooter\n {...restFooter}\n {...(footerFeedback\n ? {\n feedback: {\n ...footerFeedback,\n onReaction: reaction => {\n footerFeedback?.onReaction(articleId, reaction);\n }\n }\n }\n : undefined)}\n />\n )}\n </>\n )}\n <Progress\n visible={!!loading}\n placement='block'\n message={t('loading')}\n liveConfig={{ contextualLabel: title ?? t('article_label_a11y') }}\n />\n </Flex>\n );\n};\n\nexport default Article;\n"]}
1
+ {"version":3,"file":"Article.js","sourceRoot":"","sources":["../../../src/components/Article/Article.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { ReactNode, FunctionComponent, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n registerIcon,\n Flex,\n MenuButton,\n Text,\n defaultThemeProp,\n Button,\n Icon,\n Progress,\n useI18n,\n useDirection\n} from '@pega/cosmos-react-core';\nimport type {\n MenuItemProps,\n BaseProps,\n ForwardProps,\n NoChildrenProp,\n OmitStrict\n} from '@pega/cosmos-react-core';\nimport * as caretLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-left.icon';\nimport * as caretRightIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/caret-right.icon';\n\nimport type { ArticleListHeaderProps } from '../ArticleList/ArticleList.types';\nimport ArticleListHeader, { StyledArticleListHeader } from '../ArticleList/ArticleListHeader';\n\nimport ArticleRating from './ArticleRating';\nimport type { ArticleRatingProps } from './ArticleRating';\nimport ArticleFooter from './ArticleFooter';\nimport type { ArticleFooterFeedback, ArticleFooterProps } from './ArticleFooter';\nimport ArticleMeta from './ArticleMeta';\nimport type { ArticleMetaProps } from './ArticleMeta';\n\nregisterIcon(caretRightIcon, caretLeftIcon);\n\ntype OnReactionWithId = (\n articleId: BaseArticleProps['articleId'],\n reaction: ArticleRatingProps['reaction']\n) => void;\n\nexport interface BaseArticleProps extends BaseProps, NoChildrenProp {\n articleId: string;\n /** Header to show icon , title and any actions on the container */\n header?: ArticleListHeaderProps;\n /** Control for navigating back */\n backNavigation?: {\n title: string;\n onClick: (e: MouseEvent<HTMLButtonElement>) => void;\n };\n /** Primary actions which needs to be displayed with an icon */\n primaryActions?: {\n /** Unique id for action, used in onClick callback */\n id: string;\n /** Label for this action, shown in tooltip and used for generating aria-label */\n label: string;\n /** Icon to be displayed in the button */\n icon: string;\n /** Callback triggered when a user clicks of presses enter on the action */\n onClick: (id: string, e: MouseEvent<HTMLButtonElement>) => void;\n }[];\n /** Secondary actions that needs to be pushed under more icon */\n secondaryActions?: {\n id: MenuItemProps['id'];\n text: MenuItemProps['primary'];\n onClick: MenuItemProps['onClick'];\n }[];\n /** Article title */\n title: string;\n /** Array of meta data */\n meta?: ArticleMetaProps;\n /** like and dislike status of the article */\n feedback?: OmitStrict<ArticleRatingProps, 'onReaction'> & {\n onReaction: OnReactionWithId;\n };\n /** Article content */\n content: ReactNode;\n /** Footer */\n footer?: OmitStrict<ArticleFooterProps, 'feedback'> & {\n feedback?: OmitStrict<ArticleFooterFeedback, 'onReaction'> & {\n onReaction: OnReactionWithId;\n };\n };\n /** Prop to check visibility of skeleton */\n loading: boolean;\n}\n\nexport type ArticleProps =\n | (BaseArticleProps & { loading?: false })\n | (Partial<BaseArticleProps> & { loading: true });\n\nconst StyledArticleWrapper = styled.div(props => {\n const { theme } = props;\n return css`\n background: ${theme.base.palette['primary-background']};\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n max-height: inherit;\n\n ${StyledArticleListHeader} {\n padding: 0 0 calc(0.5 * ${theme.base.spacing});\n }\n `;\n});\n\nconst StyledArticleHeader = styled.header`\n flex-shrink: 0;\n`;\n\nconst StyledArticleContent = styled.div(props => {\n const {\n theme,\n theme: {\n base: { spacing }\n }\n } = props;\n\n return css`\n flex-grow: 1;\n overflow-y: auto;\n padding: 0 calc(1.5 * ${spacing});\n margin: 0 calc(-1.5 * ${spacing});\n ul,\n ol {\n padding-left: calc(3 * ${spacing});\n }\n a {\n color: ${theme.components.link.color};\n }\n * {\n margin: revert;\n }\n `;\n});\n\nconst StyledBackNavButton = styled(Button)(\n ({\n theme: {\n base: { spacing }\n }\n }) => {\n return css`\n display: flex;\n align-items: start;\n gap: calc(0.5 * ${spacing});\n margin-inline-end: calc(1.5 * ${spacing});\n `;\n }\n);\n\nStyledArticleContent.defaultProps = defaultThemeProp;\nStyledArticleWrapper.defaultProps = defaultThemeProp;\nStyledBackNavButton.defaultProps = defaultThemeProp;\n\nconst Article: FunctionComponent<ArticleProps & ForwardProps> = (props: ArticleProps) => {\n const {\n articleId,\n header,\n meta,\n title,\n backNavigation,\n content,\n primaryActions,\n secondaryActions,\n footer,\n loading,\n feedback,\n ...restProps\n } = props;\n\n const { feedback: footerFeedback, ...restFooter } = footer ?? {};\n const { rtl, ltr, end, start } = useDirection();\n\n const t = useI18n();\n const backButtonRef = useRef<HTMLButtonElement>(null);\n\n useEffect(() => {\n if (!loading) {\n backButtonRef.current?.focus();\n }\n }, [loading]);\n\n return (\n <Flex\n {...restProps}\n container={{ direction: 'column', gap: 1, pad: [1.5, 2] }}\n as={StyledArticleWrapper}\n aria-busy={loading ? true : undefined}\n >\n {header && <ArticleListHeader {...header} />}\n {(backNavigation || primaryActions || secondaryActions) && (\n <Flex container={{ alignItems: 'start' }} item={{ grow: 1 }}>\n <Flex container={{ pad: [1, undefined, undefined] }} item={{ grow: 1 }}>\n <Button\n as={StyledBackNavButton}\n onClick={backNavigation?.onClick}\n variant='link'\n ref={backButtonRef}\n >\n {ltr && <Icon name={`caret-${start}`} />}\n {backNavigation?.title}\n {rtl && <Icon name={`caret-${end}`} />}\n </Button>\n </Flex>\n\n {!loading && (\n <>\n {primaryActions?.map(({ id, label, onClick, icon }) => {\n return (\n <Button\n key={id}\n onClick={(e: MouseEvent<HTMLButtonElement>) => onClick(id, e)}\n variant='simple'\n label={label}\n icon\n >\n <Icon name={icon} />\n </Button>\n );\n })}\n {secondaryActions && (\n <MenuButton\n variant='simple'\n text={t('actions')}\n icon='more'\n iconOnly\n menu={{\n items: secondaryActions.map(({ text, ...rest }) => ({\n ...rest,\n primary: text\n }))\n }}\n />\n )}\n </>\n )}\n </Flex>\n )}\n {!loading && (\n <>\n <Flex container as={StyledArticleHeader}>\n <Text variant={header ? 'h3' : 'h2'}>{title}</Text>\n </Flex>\n\n {feedback && (\n <ArticleRating\n {...{\n ...feedback,\n onReaction: reaction => {\n feedback?.onReaction(articleId, reaction);\n }\n }}\n />\n )}\n\n {meta && (\n <Flex container item={{ shrink: 0 }}>\n <ArticleMeta {...meta} />\n </Flex>\n )}\n <StyledArticleContent>{content}</StyledArticleContent>\n\n {footer && (\n <ArticleFooter\n {...restFooter}\n {...(footerFeedback\n ? {\n feedback: {\n ...footerFeedback,\n onReaction: reaction => {\n footerFeedback?.onReaction(articleId, reaction);\n }\n }\n }\n : undefined)}\n />\n )}\n </>\n )}\n <Progress\n visible={!!loading}\n placement='block'\n message={t('loading')}\n liveConfig={{ contextualLabel: title ?? t('article_label_a11y') }}\n />\n </Flex>\n );\n};\n\nexport default Article;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"ArticleBuddy.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleBuddy.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAc,MAAM,OAAO,CAAC;AAmB3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAG5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D,eAAO,MAAM,sBAAsB,iLAYlC,CAAC;AAIF,eAAO,MAAM,oBAAoB,iLAahC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAahC,CAAC;AAMF,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,YAAY,CA4GrE,CAAC;AAEF,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"ArticleBuddy.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleBuddy.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAAc,MAAM,OAAO,CAAC;AAmB3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAG5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAE7D,eAAO,MAAM,sBAAsB,iLAYlC,CAAC;AAIF,eAAO,MAAM,oBAAoB,iLAahC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAahC,CAAC;AAMF,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,YAAY,CA8GrE,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -43,14 +43,14 @@ const ArticleBuddy = ({ searchInput, title, content, actions, references, discla
43
43
  }
44
44
  }, [content]);
45
45
  return (_jsxs(Flex, { ...restProps, as: StyledBuddyContainer, container: { direction: 'column', gap: 1 }, "aria-busy": loading ? true : undefined, children: [_jsx(SearchInput, { ...searchInput }), 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, undefined] }, item: { grow: 1, shrink: 0 }, 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 => {
46
- 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: title }, reference.id)), isInternalArticle(reference) && (_jsx(Button, { variant: 'link', onClick: (e) => reference.onClick(reference.id, e), children: reference.name }))] }), _jsx(Flex, { container: { alignItems: 'start' }, item: { grow: 0 }, children: _jsx(Text, { children: formatNumber(reference.confidence, {
46
+ 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, {
47
47
  locale,
48
48
  options: {
49
49
  style: 'unit',
50
50
  unit: 'percent',
51
51
  maximumFractionDigits: 0
52
52
  }
53
- }) }) })] }, reference.id));
53
+ }) }) }))] }, reference.id));
54
54
  })] }))] })), !loading && (!title || !content) && (_jsx(Flex, { container: { direction: 'column', pad: [2, undefined] }, children: _jsx(EmptyState, {}) })), disclaimer && (_jsxs(Flex, { container: { direction: 'column', pad: [1] }, children: [_jsx(StyledDisclaimerHeader, { children: t('disclaimer') }), _jsx(StyledDisclaimerText, { children: disclaimer })] }))] }));
55
55
  };
56
56
  export default ArticleBuddy;
@@ -1 +1 @@
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 } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Text,\n Actions,\n Flex,\n defaultThemeProp,\n SearchInput,\n EmptyState,\n useI18n,\n Link,\n calculateFontSize,\n Progress,\n Button,\n useConfiguration,\n formatNumber,\n useLiveLog\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 searchInput,\n title,\n content,\n actions,\n references,\n disclaimer,\n loading = false,\n ...restProps\n}) => {\n const t = useI18n();\n const { locale } = useConfiguration();\n const { announcePolite } = useLiveLog();\n\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 <SearchInput {...searchInput} />\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, undefined] }}\n item={{ grow: 1, shrink: 0 }}\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 {title}\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 <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 </Flex>\n );\n })}\n </Flex>\n )}\n </>\n )}\n\n {!loading && (!title || !content) && (\n <Flex container={{ direction: 'column', pad: [2, undefined] }}>\n <EmptyState />\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"]}
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 } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Text,\n Actions,\n Flex,\n defaultThemeProp,\n SearchInput,\n EmptyState,\n useI18n,\n Link,\n calculateFontSize,\n Progress,\n Button,\n useConfiguration,\n formatNumber,\n useLiveLog\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 searchInput,\n title,\n content,\n actions,\n references,\n disclaimer,\n loading = false,\n ...restProps\n}) => {\n const t = useI18n();\n const { locale } = useConfiguration();\n const { announcePolite } = useLiveLog();\n\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 <SearchInput {...searchInput} />\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, undefined] }}\n item={{ grow: 1, shrink: 0 }}\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\n {!loading && (!title || !content) && (\n <Flex container={{ direction: 'column', pad: [2, undefined] }}>\n <EmptyState />\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"]}
@@ -1 +1 @@
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;AAiD7B,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAyOnE,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;AAgD7B,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAwOnE,CAAC;AAEF,eAAe,WAAW,CAAC"}
@@ -35,7 +35,6 @@ StyledArticleTabPanel.defaultProps = defaultThemeProp;
35
35
  const StyledArticleList = styled.article(({ theme }) => {
36
36
  return css `
37
37
  height: 100%;
38
- padding-block: 0;
39
38
  background: ${theme.base.palette['primary-background']};
40
39
  border-radius: ${theme.components.card['border-radius']};
41
40
  > div[role='tablist'] {
@@ -125,8 +124,7 @@ const ArticleList = forwardRef(function ArticleList(props, ref) {
125
124
  (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, {})))] }));
126
125
  };
127
126
  return (_jsxs(Flex, { ...restProps, container: {
128
- direction: 'column',
129
- pad: [0.5, undefined]
127
+ direction: 'column'
130
128
  }, 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 })) : (articleContent({
131
129
  content: tabs[0]?.content || [],
132
130
  tabId: tabs[0].id,
@@ -1 +1 @@
1
- {"version":3,"file":"ArticleList.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.tsx"],"names":[],"mappings":";;AAAA,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE1E,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,IAAI,EACJ,OAAO,EACP,gBAAgB,EAChB,QAAQ,EACR,IAAI,EACJ,UAAU,EACV,QAAQ,EACR,aAAa,EACb,UAAU,EACV,mBAAmB,EACpB,MAAM,yBAAyB,CAAC;AAGjC,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AACpD,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAO9C,OAAO,iBAAiB,MAAM,qBAAqB,CAAC;AACpD,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAE1C,MAAM,iBAAiB,GAAG,MAAM,CAAC,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAChD,OAAO,GAAG,CAAA;mCACuB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;+BAKtB,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;6BAC7B,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;;uBAEjC,KAAK,CAAC,IAAI,CAAC,OAAO;;GAEtC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACrD,OAAO,GAAG,CAAA;;;;;WAKD,KAAK,CAAC,IAAI,CAAC,OAAO;GAC1B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,iBAAiB,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACrD,OAAO,GAAG,CAAA;;;kBAGM,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;qBACrC,KAAK,CAAC,UAAU,CAAC,IAAI,CAAC,eAAe,CAAC;;;gCAG3B,KAAK,CAAC,IAAI,CAAC,OAAO;;;GAG/C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,WAAW,GAAuD,UAAU,CAChF,SAAS,WAAW,CAAC,KAAwC,EAAE,GAAwB;IACrF,MAAM,EACJ,MAAM,EACN,SAAS,EACT,QAAQ,EACR,MAAM,EACN,KAAK,EACL,UAAU,EACV,SAAS,EACT,OAAO,GAAG,KAAK,EACf,WAAW,GAAG,KAAK,EACnB,kBAAkB,EAClB,UAAU,EACV,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,CAAC;IAExC,MAAM,kBAAkB,GAAG,MAAM,CAAmB,EAAE,CAAC,CAAC;IACxD,MAAM,mBAAmB,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IAChE,MAAM,OAAO,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAC;IAChD,MAAM,gBAAgB,GAAG,MAAM,CAAqB,IAAI,CAAC,CAAC;IAE1D,MAAM,IAAI,GAAG,OAAO,CAAC,GAAG,EAAE;QACxB,MAAM,OAAO,GAGN,EAAE,CAAC;QAEV,IAAI,SAAS;YACX,OAAO,CAAC,IAAI,CAAC;gBACX,EAAE,EAAE,WAAW;gBACf,IAAI,EAAE,CAAC,CAAC,WAAW,CAAC;gBACpB,KAAK,EAAE,SAAS,EAAE,KAAK;gBACvB,OAAO,EAAE,SAAS,CAAC,QAAQ,IAAI,EAAE;aAClC,CAAC,CAAC;QAEL,IAAI,MAAM;YACR,OAAO,CAAC,IAAI,CAAC;gBACX,EAAE,EAAE,QAAQ;gBACZ,IAAI,EAAE,CAAC,CAAC,QAAQ,CAAC;gBACjB,KAAK,EAAE,MAAM,EAAE,KAAK;gBACpB,OAAO,EAAE,MAAM,EAAE,QAAQ,IAAI,EAAE;aAChC,CAAC,CAAC;QAEL,IAAI,QAAQ;YACV,OAAO,CAAC,IAAI,CAAC;gBACX,EAAE,EAAE,UAAU;gBACd,IAAI,EAAE,CAAC,CAAC,UAAU,CAAC;gBACnB,KAAK,EAAE,QAAQ,EAAE,KAAK;gBACtB,OAAO,EAAE,QAAQ,EAAE,QAAQ,IAAI,EAAE;aAClC,CAAC,CAAC;QAEL,IAAI,KAAK;YACP,OAAO,CAAC,IAAI,CAAC;gBACX,EAAE,EAAE,OAAO;gBACX,IAAI,EAAE,CAAC,CAAC,OAAO,CAAC;aACjB,CAAC,CAAC;QAEL,OAAO,OAAO,CAAC;IACjB,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC;IAEzC,MAAM,SAAS,GAA6C,IAAI,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE;QACnF,OAAO,EAAE,GAAG,GAAG,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE,CAAC;IAC3C,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,OAAO,CAAC,OAAO,IAAI,aAAa,CAAC,OAAO,CAAC,EAAE,MAAM,GAAG,CAAC;YACvD,gBAAgB,CAAC,OAAO,GAAG,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC;aAClD;YACH,mBAAmB,CAAC,OAAO;gBACzB,kBAAkB,CAAC,OAAO,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,KAAK,SAAS,CAAC,CAAC,CAAC;YAC3E,IAAI,mBAAmB,IAAI,aAAa,CAAC,mBAAmB,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE;gBACzE,gBAAgB,CAAC,OAAO,GAAG,aAAa,CAAC,mBAAmB,CAAC,CAAC,CAAC,CAAC,CAAC;aAClE;SACF;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO,EAAE;YACZ,MAAM,iBAAiB,GAAG,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,KAAK,SAAS,CAAC,EAAE,OAAO,CAAC;YAC1E,cAAc,CAAC;gBACb,IAAI,EAAE,QAAQ;gBACd,OAAO,EACL,iBAAiB,IAAI,iBAAiB,EAAE,MAAM,GAAG,CAAC;oBAChD,CAAC,CAAC,GAAG,MAAM,EAAE,KAAK,IAAI,CAAC,CAAC,yBAAyB,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,EAAE;oBACnE,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC;aACpB,CAAC,CAAC;SACJ;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,aAAa,GAAG,CAAC,OAAe,EAAU,EAAE;QAChD,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,OAAO,CAAC,CAAC;QAC1D,IAAI,CAAC,UAAU,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE;YACtC,OAAO,CAAC,CAAC;SACV;QACD,OAAO,UAAU,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC;IACvC,CAAC,CAAC;IAEF,mBAAmB,CACjB,SAAS,CAAC,SAAS,CAAC,EACpB,aAAa,CAAC,SAAS,CAAC,EACxB,GAAG,EAAE;QACH,IAAI,CAAC,WAAW;YAAE,UAAU,EAAE,EAAE,CAAC;IACnC,CAAC,EACD,6BAA6B,CAC9B,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,EACtB,OAAO,EACP,KAAK,EACL,WAAW,EAMZ,EAAE,EAAE;QACH,OAAO,CACL,8BACG,SAAS,KAAK,CAAC,CAAC,QAAQ,CAAC,IAAI,MAAM,IAAI,KAAC,iBAAiB,OAAK,MAAM,GAAI,EACxE,SAAS,KAAK,CAAC,CAAC,UAAU,CAAC,IAAI,QAAQ,IAAI,KAAC,iBAAiB,OAAK,QAAQ,GAAI,EAC9E,OAAO,IAAI,CACV,KAAC,QAAQ,IACP,OAAO,EAAE,CAAC,CAAC,OAAO,EAClB,SAAS,EAAC,OAAO,EACjB,OAAO,EAAE,CAAC,CAAC,SAAS,CAAC,EACrB,UAAU,EAAE,EAAE,eAAe,EAAE,WAAW,IAAI,CAAC,CAAC,yBAAyB,CAAC,EAAE,GAC5E,CACH,EACA,CAAC,OAAO;oBACP,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACpB,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC,CAAC,EAAE,EAC3D,EAAE,EAAE,iBAAiB,EACrB,IAAI,EAAC,MAAM,EACX,GAAG,EAAE,SAAS,CAAC,KAAK,CAAC,aAEpB,OAAO,CAAC,GAAG,CAAC,WAAW,CAAC,EAAE,CAAC,CAC1B,eAAC,cAAc,OACT,WAAW,EACf,GAAG,EAAE,WAAW,CAAC,SAAS,EAC1B,kBAAkB,EAAE,kBAAkB,GACtC,CACH,CAAC,EACD,WAAW,IAAI,KAAC,QAAQ,IAAC,SAAS,EAAC,OAAO,GAAG,IACzC,CACR,CAAC,CAAC,CAAC,CACF,KAAC,UAAU,KAAG,CACf,CAAC,IACH,CACJ,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CACL,MAAC,IAAI,OACC,SAAS,EACb,SAAS,EAAE;YACT,SAAS,EAAE,QAAQ;YACnB,GAAG,EAAE,CAAC,GAAG,EAAE,SAAS,CAAC;SACtB,EACD,EAAE,EAAE,iBAAiB,gBACT,CAAC,CAAC,yBAAyB,CAAC,EACxC,GAAG,EAAE,GAAG,eACG,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,aAEpC,MAAM,IAAI,CACT,KAAC,iBAAiB,IAAC,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,CAAC,OAAO,GAAI,CACvF,EAEA,IAAI,CAAC,MAAM,KAAK,CAAC,IAAI,CACpB,4BACG,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,KAAK,OAAO,IAAI,KAAK,CAAC,CAAC,CAAC,CACjC,KAAC,YAAY,OAAK,KAAK,GAAI,CAC5B,CAAC,CAAC,CAAC,CACF,cAAc,CAAC;oBACb,OAAO,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE,OAAO,IAAI,EAAE;oBAC/B,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE;oBACjB,WAAW,EAAE,MAAM,EAAE,KAAK;iBAC3B,CAAC,CACH,GACA,CACJ,EAIA,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAClB,8BACE,KAAC,IAAI,IACH,GAAG,EAAE,OAAO,EACZ,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;4BACtB,IAAI,QAAQ,CAAC,aAAa,YAAY,WAAW,EAAE;gCACjD,gBAAgB,CAAC,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC;gCAClD,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;6BACvB;wBACH,CAAC,EACD,YAAY,EAAE,SAAS,GACvB,EACD,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;wBAC5B,OAAO,CACL,KAAC,QAAQ,IAEP,KAAK,EAAE,EAAE,EACT,YAAY,EAAE,SAAS,EACvB,EAAE,EAAE,SAAS,KAAK,EAAE,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS,YAEvD,SAAS,KAAK,OAAO,CAAC,CAAC,CAAC,CACvB,KAAC,YAAY,IACX,WAAW,EAAE,KAAK,EAAE,WAAW,IAAI,EAAE,EACrC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,EAAE,EACzB,OAAO,EAAE,KAAK,EAAE,OAAO,IAAI,EAAE,EAC7B,OAAO,EAAE,KAAK,EAAE,OAAO,EACvB,UAAU,EAAE,KAAK,EAAE,UAAU,EAC7B,UAAU,EAAE,KAAK,EAAE,UAAU,EAC7B,OAAO,EAAE,KAAK,EAAE,OAAO,GACvB,CACH,CAAC,CAAC,CAAC,CACF,4BACG,SAAS,KAAK,EAAE;oCACf,OAAO;oCACP,cAAc,CAAC,EAAE,OAAO,EAAE,KAAK,EAAE,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,GACnE,CACJ,IArBI,EAAE,CAsBE,CACZ,CAAC;oBACJ,CAAC,CAAC,IACD,CACJ,IACI,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC","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 padding-block: 0;\n background: ${theme.base.palette['primary-background']};\n border-radius: ${theme.components.card['border-radius']};\n > div[role='tablist'] {\n button[role='tab'] {\n padding: 0 calc(1.5 * ${theme.base.spacing});\n }\n }\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: t('buddy')\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 pad: [0.5, undefined]\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} />\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' ? (\n <ArticleBuddy\n searchInput={buddy?.searchInput ?? {}}\n title={buddy?.title ?? ''}\n actions={buddy?.actions ?? []}\n content={buddy?.content}\n disclaimer={buddy?.disclaimer}\n references={buddy?.references}\n loading={buddy?.loading}\n />\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"]}
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 > div[role='tablist'] {\n button[role='tab'] {\n padding: 0 calc(1.5 * ${theme.base.spacing});\n }\n }\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: t('buddy')\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} />\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' ? (\n <ArticleBuddy\n searchInput={buddy?.searchInput ?? {}}\n title={buddy?.title ?? ''}\n actions={buddy?.actions ?? []}\n content={buddy?.content}\n disclaimer={buddy?.disclaimer}\n references={buddy?.references}\n loading={buddy?.loading}\n />\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"]}
@@ -29,7 +29,7 @@ export interface ArticleSummaryProps extends BaseProps {
29
29
  export interface BaseReferenceProps {
30
30
  id: string;
31
31
  name: string;
32
- confidence: number;
32
+ confidence?: number;
33
33
  }
34
34
  export type ExternalLinkProps = BaseReferenceProps & {
35
35
  type: 'link';
@@ -1 +1 @@
1
- {"version":3,"file":"ArticleList.types.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ArticleList.types.d.ts","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.types.ts"],"names":[],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"ArticleList.types.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.types.ts"],"names":[],"mappings":"AAgFA,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} 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;\n\nexport interface ArticleBuddyProps {\n /** search input params */\n searchInput: OmitStrict<\n SearchInputProps,\n 'searchResults' | 'recentSearches' | 'advancedSearchLink' | 'resultsPopover'\n >;\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\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\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?: ArticleBuddyProps;\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"]}
1
+ {"version":3,"file":"ArticleList.types.js","sourceRoot":"","sources":["../../../src/components/ArticleList/ArticleList.types.ts"],"names":[],"mappings":"AAgFA,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} 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;\n\nexport interface ArticleBuddyProps {\n /** search input params */\n searchInput: OmitStrict<\n SearchInputProps,\n 'searchResults' | 'recentSearches' | 'advancedSearchLink' | 'resultsPopover'\n >;\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\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\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?: ArticleBuddyProps;\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"]}
@@ -1,5 +1,6 @@
1
1
  import type { FunctionComponent } from 'react';
2
2
  import type { ArticleListHeaderProps } from './ArticleList.types';
3
+ 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>;
3
4
  declare const ArticleListHeader: FunctionComponent<ArticleListHeaderProps>;
4
5
  export default ArticleListHeader;
5
6
  //# sourceMappingURL=ArticleListHeader.d.ts.map
@@ -1 +1 @@
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;AAuBlE,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"}
@@ -1,6 +1,7 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import styled, { css } from 'styled-components';
3
3
  import { Flex, Icon, Actions, Text, defaultThemeProp } from '@pega/cosmos-react-core';
4
+ export const StyledArticleListHeader = styled(Flex) ``;
4
5
  const StyledHeaderText = styled(Text) `
5
6
  text-overflow: ellipsis;
6
7
  white-space: nowrap;
@@ -14,7 +15,7 @@ const StyledIcon = styled(Icon)(({ theme: { base: { spacing } } }) => {
14
15
  });
15
16
  StyledIcon.defaultProps = defaultThemeProp;
16
17
  const ArticleListHeader = ({ icon, title, actions }) => {
17
- return (_jsxs(Flex, { 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 })] }));
18
+ 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 })] }));
18
19
  };
19
20
  export default ArticleListHeader;
20
21
  //# sourceMappingURL=ArticleListHeader.js.map
@@ -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,GAAG,EAAE,CAAC,CAAC,EAAE,aAC7D,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\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: [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"]}
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"]}
@@ -1 +1 @@
1
- {"version":3,"file":"Stakeholders.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAA8B,MAAM,OAAO,CAAC;AAiB3E,OAAO,KAAK,EAEV,YAAY,EAIb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EAAQ,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAmBpE,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,YAAY,CA0UrE,CAAC;AAEF,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"Stakeholders.d.ts","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,iBAAiB,EAA8B,MAAM,OAAO,CAAC;AAkB3E,OAAO,KAAK,EAEV,YAAY,EAIb,MAAM,yBAAyB,CAAC;AAEjC,OAAO,KAAK,EAAQ,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAsCpE,QAAA,MAAM,YAAY,EAAE,iBAAiB,CAAC,iBAAiB,GAAG,YAAY,CA4UrE,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -1,21 +1,37 @@
1
1
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { forwardRef, useRef, useEffect, useMemo, useState, useCallback } from 'react';
3
- import styled from 'styled-components';
4
- import { SummaryList, useI18n, Button, ViewAll, Modal, Popover, Flex, Text, useModalManager, useOuterEvent, Progress, useAfterInitialEffect } from '@pega/cosmos-react-core';
3
+ import styled, { css } from 'styled-components';
4
+ import { SummaryList, useI18n, Button, ViewAll, Modal, Popover, Flex, Text, useModalManager, useOuterEvent, Progress, useAfterInitialEffect, defaultThemeProp } from '@pega/cosmos-react-core';
5
5
  import StakeholderForm from './StakeholderForm';
6
6
  const StyledStakeholders = styled(SummaryList) ``;
7
- const StyledEditFormWrap = styled.div `
8
- position: relative;
9
- min-height: 8rem;
7
+ const StyledEditFormWrap = styled.div(({ theme }) => {
8
+ return css `
9
+ position: relative;
10
+ min-height: 8rem;
11
+ overflow: auto;
12
+ padding-block: calc(${theme.base.spacing} / 2);
13
+ padding-inline: calc(2 * ${theme.base.spacing});
10
14
 
11
- &[aria-busy='true'] > :nth-child(2) {
12
- visibility: hidden;
13
- }
14
- `;
15
+ &[aria-busy='true'] > :nth-child(2) {
16
+ visibility: hidden;
17
+ }
18
+ `;
19
+ });
20
+ StyledEditFormWrap.defaultProps = defaultThemeProp;
15
21
  const StyledPopover = styled(Popover) `
16
22
  width: 40ch;
17
23
  min-height: 12rem;
18
24
  `;
25
+ const StyledContainer = styled(Flex)(({ theme }) => {
26
+ return css `
27
+ max-height: inherit;
28
+ > h3 {
29
+ padding-block-start: calc(2 * ${theme.base.spacing});
30
+ padding-inline: calc(2 * ${theme.base.spacing});
31
+ }
32
+ `;
33
+ });
34
+ StyledContainer.defaultProps = defaultThemeProp;
19
35
  const Stakeholders = forwardRef(function Stakeholders({ items: itemsProp, count, loading, onAddNew, form, onViewAll, viewAll, error, ...restProps }, ref) {
20
36
  const { create: createModal } = useModalManager();
21
37
  const t = useI18n();
@@ -117,7 +133,7 @@ const Stakeholders = forwardRef(function Stakeholders({ items: itemsProp, count,
117
133
  }
118
134
  let editPopover = null;
119
135
  if (popoverTarget) {
120
- editPopover = (_jsx(StyledPopover, { ref: popoverRef, target: popoverTarget.button, placement: 'auto', role: 'dialog', children: _jsxs(Flex, { container: { direction: 'column', gap: 2, pad: 2 }, children: [_jsx(Text, { variant: 'h3', children: t('edit_stakeholder') }), _jsxs(StyledEditFormWrap, { "aria-busy": form.loading ? 'true' : 'false', children: [_jsx(Progress, { placement: 'local', visible: form.loading, message: progressMsgRef.current }), (!form.loading || progressMsgRef.current === t('submitting')) && (_jsx(StakeholderForm, { roles: form.roles, currentRole: form.currentRole, renderer: form.renderer, rendererProps: form.rendererProps, setSelectedRoleNameRef: setSelectedRoleNameRef }))] }), formActions && _jsx(Flex, { container: { justify: 'between' }, children: formActions })] }) }));
136
+ editPopover = (_jsx(StyledPopover, { ref: popoverRef, target: popoverTarget.button, placement: 'auto', role: 'dialog', children: _jsxs(StyledContainer, { container: { direction: 'column', gap: 2 }, children: [_jsx(Text, { variant: 'h3', children: t('edit_stakeholder') }), _jsxs(StyledEditFormWrap, { "aria-busy": form.loading ? 'true' : 'false', children: [_jsx(Progress, { placement: 'local', visible: form.loading, message: progressMsgRef.current }), (!form.loading || progressMsgRef.current === t('submitting')) && (_jsx(StakeholderForm, { roles: form.roles, currentRole: form.currentRole, renderer: form.renderer, rendererProps: form.rendererProps, setSelectedRoleNameRef: setSelectedRoleNameRef }))] }), formActions && (_jsx(Flex, { container: { justify: 'between', pad: [undefined, 2, 2] }, children: formActions }))] }) }));
121
137
  }
122
138
  // Content for the modal either for adding new or viewing all.
123
139
  let modalContent = null;
@@ -1 +1 @@
1
- {"version":3,"file":"Stakeholders.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect, useMemo, useState, useCallback } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, ReactNode } from 'react';\nimport styled from 'styled-components';\n\nimport {\n SummaryList,\n useI18n,\n Button,\n ViewAll,\n Modal,\n Popover,\n Flex,\n Text,\n useModalManager,\n useOuterEvent,\n Progress,\n useAfterInitialEffect\n} from '@pega/cosmos-react-core';\nimport type {\n Action,\n ForwardProps,\n ModalMethods,\n ModalProps,\n OmitStrict\n} from '@pega/cosmos-react-core';\n\nimport type { Role, StakeholdersProps } from './Stakeholders.types';\nimport StakeholderForm from './StakeholderForm';\n\nconst StyledStakeholders = styled(SummaryList)``;\n\nconst StyledEditFormWrap = styled.div`\n position: relative;\n min-height: 8rem;\n\n &[aria-busy='true'] > :nth-child(2) {\n visibility: hidden;\n }\n`;\n\nconst StyledPopover = styled(Popover)`\n width: 40ch;\n min-height: 12rem;\n`;\n\nconst Stakeholders: FunctionComponent<StakeholdersProps & ForwardProps> = forwardRef(\n function Stakeholders(\n {\n items: itemsProp,\n count,\n loading,\n onAddNew,\n form,\n onViewAll,\n viewAll,\n error,\n ...restProps\n }: PropsWithoutRef<StakeholdersProps>,\n ref: StakeholdersProps['ref']\n ) {\n const { create: createModal } = useModalManager();\n const t = useI18n();\n const modalMethods = useRef<ModalMethods>();\n const [mode, setMode] = useState<undefined | 'add' | 'viewAll'>();\n const [editing, setEditing] = useState(false);\n const [viewAllSearchValue, setViewAllSearchValue] = useState('');\n const popoverRef = useRef<HTMLDivElement>(null);\n const progressMsgRef = useRef(t('loading'));\n\n // Why? Don't think this should trigger a re-render. We just need the value when we invoke callback props.\n const selectedRoleNameRef = useRef<Role['name'] | undefined>();\n // Setter for the ref. Avoids a re-render.\n const setSelectedRoleNameRef = useCallback((selectedRoleName?: Role['name']) => {\n selectedRoleNameRef.current = selectedRoleName;\n }, []);\n\n const [popoverTarget, setPopoverTarget] = useState<{\n portal: HTMLLIElement;\n button: HTMLButtonElement | null;\n } | null>(null);\n\n const itemElsRef = useRef<{ itemEls: HTMLLIElement[]; viewAllItemEls: HTMLLIElement[] }>({\n itemEls: [],\n viewAllItemEls: []\n });\n\n // This function merges the pre-defined actions(add & edit) to the item object.\n const mergeItemActions = (\n items: StakeholdersProps['items'] | NonNullable<StakeholdersProps['viewAll']>['items']\n ) => {\n return items.map(({ onEdit, onRemove, ...rest }, i) => {\n let itemActions: Action[] = [];\n const elArray = itemElsRef.current[mode === 'viewAll' ? 'viewAllItemEls' : 'itemEls'];\n\n if (onEdit) {\n itemActions = [\n {\n id: 'edit',\n text: t('edit'),\n icon: 'pencil',\n onClick: () => {\n setEditing(true);\n setPopoverTarget({\n portal: elArray[i],\n button: elArray[i].querySelector<HTMLButtonElement>(\n 'button[aria-haspopup=\"menu\"]'\n )\n });\n\n onEdit?.();\n }\n }\n ];\n }\n\n if (onRemove) {\n itemActions = [\n ...itemActions,\n {\n id: 'remove',\n text: t('remove'),\n icon: 'trash',\n onClick: () => {\n onRemove?.();\n }\n }\n ];\n }\n\n return {\n ...rest,\n ref: (el: HTMLLIElement) => {\n elArray[i] = el;\n },\n actions: itemActions\n };\n });\n };\n\n const closePopover = () => {\n if (!popoverTarget || (form.loading && progressMsgRef.current === t('submitting'))) return;\n popoverTarget.button?.focus();\n setPopoverTarget(null);\n setEditing(false);\n progressMsgRef.current = t('loading');\n };\n\n let formContent: ReactNode = null;\n if (\n (mode === 'add' || editing) &&\n (!form.loading || progressMsgRef.current === t('submitting'))\n ) {\n formContent = (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n );\n }\n\n // Actions used for add and edit both in the modal and the popover.\n let formActions: ReactNode = null;\n if (\n (mode === 'add' || editing) &&\n (!form.loading || progressMsgRef.current === t('submitting'))\n ) {\n const closeForm = () => {\n if (mode === 'add') {\n modalMethods.current?.dismiss();\n } else {\n closePopover();\n }\n };\n\n formActions = (\n <>\n <Button\n disabled={form.loading}\n onClick={() => {\n form.onDismiss({ closeForm });\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n disabled={form.loading}\n type='submit'\n variant='primary'\n onClick={() => {\n progressMsgRef.current = t('submitting');\n form.onSubmit({\n selectedRoleName: selectedRoleNameRef.current,\n closeForm\n });\n }}\n >\n {t('submit')}\n </Button>\n </>\n );\n }\n\n let editPopover: ReactNode = null;\n if (popoverTarget) {\n editPopover = (\n <StyledPopover\n ref={popoverRef}\n target={popoverTarget.button}\n placement='auto'\n role='dialog'\n >\n <Flex container={{ direction: 'column', gap: 2, pad: 2 }}>\n <Text variant='h3'>{t('edit_stakeholder')}</Text>\n <StyledEditFormWrap aria-busy={form.loading ? 'true' : 'false'}>\n <Progress placement='local' visible={form.loading} message={progressMsgRef.current} />\n {(!form.loading || progressMsgRef.current === t('submitting')) && (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n )}\n </StyledEditFormWrap>\n {formActions && <Flex container={{ justify: 'between' }}>{formActions}</Flex>}\n </Flex>\n </StyledPopover>\n );\n }\n\n // Content for the modal either for adding new or viewing all.\n let modalContent: ReactNode = null;\n if (mode === 'add') modalContent = formContent;\n\n if (!viewAll.loading && (mode === 'viewAll' || (editing && modalMethods.current))) {\n modalContent = (\n <>\n <ViewAll\n items={mergeItemActions(viewAll.items)}\n actions={[\n {\n id: 'addStakeHolder',\n text: 'Add new',\n onClick: () => {\n setMode('add');\n onAddNew?.();\n }\n }\n ]}\n searchInputProps={\n viewAll.onSearch\n ? {\n value: viewAllSearchValue,\n onSearchChange: (value: string) => {\n setViewAllSearchValue(value);\n viewAll?.onSearch?.(value);\n }\n }\n : undefined\n }\n />\n {/* Edit popover triggered from a modal must be rendered within modal content to render in correct DOM position. */}\n {editPopover}\n </>\n );\n }\n\n useEffect(() => {\n if (!mode) {\n modalMethods.current = undefined;\n return;\n }\n\n const modalProps: OmitStrict<ModalProps, 'heading'> = {\n progress:\n (mode === 'add' && form.loading) || viewAll.loading\n ? { message: progressMsgRef.current }\n : undefined,\n count: mode === 'viewAll' ? count : undefined,\n children: modalContent,\n actions: mode === 'add' ? formActions : undefined,\n onRequestDismiss:\n form.loading && progressMsgRef.current === t('submitting') ? () => false : undefined\n };\n\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n } else if (mode === 'add' || mode === 'viewAll') {\n modalMethods.current = createModal(Modal, {\n ...modalProps,\n heading: mode === 'add' ? t('add_stakeholders') : t('view_stakeholders'),\n onAfterClose: () => {\n if (mode === 'add') {\n form.onAfterClose?.();\n } else {\n setViewAllSearchValue('');\n viewAll.onAfterClose?.();\n }\n\n progressMsgRef.current = t('loading');\n setMode(undefined);\n }\n });\n }\n }, [mode, modalContent, form.loading, formActions, count, viewAll.loading]);\n\n // Using mousedown instead of click since drag selecting an input's value within the popover, then releasing outside the popover triggers outer click.\n useOuterEvent('mousedown', [popoverRef], closePopover);\n\n const onKeydown = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n closePopover();\n }\n };\n\n useEffect(() => {\n if (!popoverTarget) return;\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, [popoverTarget]);\n\n useAfterInitialEffect(() => {\n if (!popoverTarget) form.onAfterClose?.();\n }, [popoverTarget]);\n\n return (\n <>\n <StyledStakeholders\n {...restProps}\n ref={ref}\n icon='person'\n name={t('view_stakeholders')}\n headingTag='h3'\n loading={loading}\n count={count}\n error={error}\n items={useMemo(\n () => mergeItemActions(itemsProp.slice(0, 3)),\n [mergeItemActions, itemsProp]\n )}\n actions={\n onAddNew\n ? [\n {\n text: t('add'),\n id: 'add_new',\n icon: 'plus',\n onClick() {\n setMode('add');\n onAddNew?.();\n }\n }\n ]\n : undefined\n }\n onViewAll={\n onViewAll && count && count > 3\n ? () => {\n setMode('viewAll');\n onViewAll?.();\n }\n : undefined\n }\n />\n {/* When edit is opened outside of the view all modal. */}\n {editPopover && mode !== 'viewAll' ? editPopover : null}\n </>\n );\n }\n);\n\nexport default Stakeholders;\n"]}
1
+ {"version":3,"file":"Stakeholders.js","sourceRoot":"","sources":["../../../src/components/Stakeholders/Stakeholders.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useRef, useEffect, useMemo, useState, useCallback } from 'react';\nimport type { FunctionComponent, PropsWithoutRef, ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n SummaryList,\n useI18n,\n Button,\n ViewAll,\n Modal,\n Popover,\n Flex,\n Text,\n useModalManager,\n useOuterEvent,\n Progress,\n useAfterInitialEffect,\n defaultThemeProp\n} from '@pega/cosmos-react-core';\nimport type {\n Action,\n ForwardProps,\n ModalMethods,\n ModalProps,\n OmitStrict\n} from '@pega/cosmos-react-core';\n\nimport type { Role, StakeholdersProps } from './Stakeholders.types';\nimport StakeholderForm from './StakeholderForm';\n\nconst StyledStakeholders = styled(SummaryList)``;\n\nconst StyledEditFormWrap = styled.div(({ theme }) => {\n return css`\n position: relative;\n min-height: 8rem;\n overflow: auto;\n padding-block: calc(${theme.base.spacing} / 2);\n padding-inline: calc(2 * ${theme.base.spacing});\n\n &[aria-busy='true'] > :nth-child(2) {\n visibility: hidden;\n }\n `;\n});\n\nStyledEditFormWrap.defaultProps = defaultThemeProp;\n\nconst StyledPopover = styled(Popover)`\n width: 40ch;\n min-height: 12rem;\n`;\n\nconst StyledContainer = styled(Flex)(({ theme }) => {\n return css`\n max-height: inherit;\n > h3 {\n padding-block-start: calc(2 * ${theme.base.spacing});\n padding-inline: calc(2 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledContainer.defaultProps = defaultThemeProp;\n\nconst Stakeholders: FunctionComponent<StakeholdersProps & ForwardProps> = forwardRef(\n function Stakeholders(\n {\n items: itemsProp,\n count,\n loading,\n onAddNew,\n form,\n onViewAll,\n viewAll,\n error,\n ...restProps\n }: PropsWithoutRef<StakeholdersProps>,\n ref: StakeholdersProps['ref']\n ) {\n const { create: createModal } = useModalManager();\n const t = useI18n();\n const modalMethods = useRef<ModalMethods>();\n const [mode, setMode] = useState<undefined | 'add' | 'viewAll'>();\n const [editing, setEditing] = useState(false);\n const [viewAllSearchValue, setViewAllSearchValue] = useState('');\n const popoverRef = useRef<HTMLDivElement>(null);\n const progressMsgRef = useRef(t('loading'));\n\n // Why? Don't think this should trigger a re-render. We just need the value when we invoke callback props.\n const selectedRoleNameRef = useRef<Role['name'] | undefined>();\n // Setter for the ref. Avoids a re-render.\n const setSelectedRoleNameRef = useCallback((selectedRoleName?: Role['name']) => {\n selectedRoleNameRef.current = selectedRoleName;\n }, []);\n\n const [popoverTarget, setPopoverTarget] = useState<{\n portal: HTMLLIElement;\n button: HTMLButtonElement | null;\n } | null>(null);\n\n const itemElsRef = useRef<{ itemEls: HTMLLIElement[]; viewAllItemEls: HTMLLIElement[] }>({\n itemEls: [],\n viewAllItemEls: []\n });\n\n // This function merges the pre-defined actions(add & edit) to the item object.\n const mergeItemActions = (\n items: StakeholdersProps['items'] | NonNullable<StakeholdersProps['viewAll']>['items']\n ) => {\n return items.map(({ onEdit, onRemove, ...rest }, i) => {\n let itemActions: Action[] = [];\n const elArray = itemElsRef.current[mode === 'viewAll' ? 'viewAllItemEls' : 'itemEls'];\n\n if (onEdit) {\n itemActions = [\n {\n id: 'edit',\n text: t('edit'),\n icon: 'pencil',\n onClick: () => {\n setEditing(true);\n setPopoverTarget({\n portal: elArray[i],\n button: elArray[i].querySelector<HTMLButtonElement>(\n 'button[aria-haspopup=\"menu\"]'\n )\n });\n\n onEdit?.();\n }\n }\n ];\n }\n\n if (onRemove) {\n itemActions = [\n ...itemActions,\n {\n id: 'remove',\n text: t('remove'),\n icon: 'trash',\n onClick: () => {\n onRemove?.();\n }\n }\n ];\n }\n\n return {\n ...rest,\n ref: (el: HTMLLIElement) => {\n elArray[i] = el;\n },\n actions: itemActions\n };\n });\n };\n\n const closePopover = () => {\n if (!popoverTarget || (form.loading && progressMsgRef.current === t('submitting'))) return;\n popoverTarget.button?.focus();\n setPopoverTarget(null);\n setEditing(false);\n progressMsgRef.current = t('loading');\n };\n\n let formContent: ReactNode = null;\n if (\n (mode === 'add' || editing) &&\n (!form.loading || progressMsgRef.current === t('submitting'))\n ) {\n formContent = (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n );\n }\n\n // Actions used for add and edit both in the modal and the popover.\n let formActions: ReactNode = null;\n if (\n (mode === 'add' || editing) &&\n (!form.loading || progressMsgRef.current === t('submitting'))\n ) {\n const closeForm = () => {\n if (mode === 'add') {\n modalMethods.current?.dismiss();\n } else {\n closePopover();\n }\n };\n\n formActions = (\n <>\n <Button\n disabled={form.loading}\n onClick={() => {\n form.onDismiss({ closeForm });\n }}\n >\n {t('cancel')}\n </Button>\n <Button\n disabled={form.loading}\n type='submit'\n variant='primary'\n onClick={() => {\n progressMsgRef.current = t('submitting');\n form.onSubmit({\n selectedRoleName: selectedRoleNameRef.current,\n closeForm\n });\n }}\n >\n {t('submit')}\n </Button>\n </>\n );\n }\n\n let editPopover: ReactNode = null;\n if (popoverTarget) {\n editPopover = (\n <StyledPopover\n ref={popoverRef}\n target={popoverTarget.button}\n placement='auto'\n role='dialog'\n >\n <StyledContainer container={{ direction: 'column', gap: 2 }}>\n <Text variant='h3'>{t('edit_stakeholder')}</Text>\n <StyledEditFormWrap aria-busy={form.loading ? 'true' : 'false'}>\n <Progress placement='local' visible={form.loading} message={progressMsgRef.current} />\n {(!form.loading || progressMsgRef.current === t('submitting')) && (\n <StakeholderForm\n roles={form.roles}\n currentRole={form.currentRole}\n renderer={form.renderer}\n rendererProps={form.rendererProps}\n setSelectedRoleNameRef={setSelectedRoleNameRef}\n />\n )}\n </StyledEditFormWrap>\n {formActions && (\n <Flex container={{ justify: 'between', pad: [undefined, 2, 2] }}>{formActions}</Flex>\n )}\n </StyledContainer>\n </StyledPopover>\n );\n }\n\n // Content for the modal either for adding new or viewing all.\n let modalContent: ReactNode = null;\n if (mode === 'add') modalContent = formContent;\n\n if (!viewAll.loading && (mode === 'viewAll' || (editing && modalMethods.current))) {\n modalContent = (\n <>\n <ViewAll\n items={mergeItemActions(viewAll.items)}\n actions={[\n {\n id: 'addStakeHolder',\n text: 'Add new',\n onClick: () => {\n setMode('add');\n onAddNew?.();\n }\n }\n ]}\n searchInputProps={\n viewAll.onSearch\n ? {\n value: viewAllSearchValue,\n onSearchChange: (value: string) => {\n setViewAllSearchValue(value);\n viewAll?.onSearch?.(value);\n }\n }\n : undefined\n }\n />\n {/* Edit popover triggered from a modal must be rendered within modal content to render in correct DOM position. */}\n {editPopover}\n </>\n );\n }\n\n useEffect(() => {\n if (!mode) {\n modalMethods.current = undefined;\n return;\n }\n\n const modalProps: OmitStrict<ModalProps, 'heading'> = {\n progress:\n (mode === 'add' && form.loading) || viewAll.loading\n ? { message: progressMsgRef.current }\n : undefined,\n count: mode === 'viewAll' ? count : undefined,\n children: modalContent,\n actions: mode === 'add' ? formActions : undefined,\n onRequestDismiss:\n form.loading && progressMsgRef.current === t('submitting') ? () => false : undefined\n };\n\n if (modalMethods.current) {\n modalMethods.current.update(modalProps);\n } else if (mode === 'add' || mode === 'viewAll') {\n modalMethods.current = createModal(Modal, {\n ...modalProps,\n heading: mode === 'add' ? t('add_stakeholders') : t('view_stakeholders'),\n onAfterClose: () => {\n if (mode === 'add') {\n form.onAfterClose?.();\n } else {\n setViewAllSearchValue('');\n viewAll.onAfterClose?.();\n }\n\n progressMsgRef.current = t('loading');\n setMode(undefined);\n }\n });\n }\n }, [mode, modalContent, form.loading, formActions, count, viewAll.loading]);\n\n // Using mousedown instead of click since drag selecting an input's value within the popover, then releasing outside the popover triggers outer click.\n useOuterEvent('mousedown', [popoverRef], closePopover);\n\n const onKeydown = (e: KeyboardEvent) => {\n if (e.key === 'Escape') {\n closePopover();\n }\n };\n\n useEffect(() => {\n if (!popoverTarget) return;\n document.addEventListener('keydown', onKeydown);\n return () => {\n document.removeEventListener('keydown', onKeydown);\n };\n }, [popoverTarget]);\n\n useAfterInitialEffect(() => {\n if (!popoverTarget) form.onAfterClose?.();\n }, [popoverTarget]);\n\n return (\n <>\n <StyledStakeholders\n {...restProps}\n ref={ref}\n icon='person'\n name={t('view_stakeholders')}\n headingTag='h3'\n loading={loading}\n count={count}\n error={error}\n items={useMemo(\n () => mergeItemActions(itemsProp.slice(0, 3)),\n [mergeItemActions, itemsProp]\n )}\n actions={\n onAddNew\n ? [\n {\n text: t('add'),\n id: 'add_new',\n icon: 'plus',\n onClick() {\n setMode('add');\n onAddNew?.();\n }\n }\n ]\n : undefined\n }\n onViewAll={\n onViewAll && count && count > 3\n ? () => {\n setMode('viewAll');\n onViewAll?.();\n }\n : undefined\n }\n />\n {/* When edit is opened outside of the view all modal. */}\n {editPopover && mode !== 'viewAll' ? editPopover : null}\n </>\n );\n }\n);\n\nexport default Stakeholders;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-work",
3
- "version": "5.0.0-dev.8.0",
3
+ "version": "5.0.0-dev.8.2",
4
4
  "repository": {
5
5
  "type": "git",
6
6
  "url": "https://github.com/pegasystems/cosmos-react.git",
@@ -20,7 +20,7 @@
20
20
  "build": "tsc -b"
21
21
  },
22
22
  "dependencies": {
23
- "@pega/cosmos-react-core": "5.0.0-dev.8.0",
23
+ "@pega/cosmos-react-core": "5.0.0-dev.8.2",
24
24
  "@types/react": "^17.0.62",
25
25
  "@types/react-dom": "^17.0.20",
26
26
  "@types/styled-components": "^5.1.26",