@pega/cosmos-react-work 9.0.0-build.20.9 → 9.0.0-build.21.1

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.
@@ -62,7 +62,7 @@ export const StyledAppAnnouncement = styled.article(props => {
62
62
 
63
63
  p,
64
64
  ul {
65
- padding-top: calc(2 * ${spacing});
65
+ padding-block-start: calc(1.5 * ${spacing});
66
66
  line-height: 1.4;
67
67
  }
68
68
 
@@ -1 +1 @@
1
- {"version":3,"file":"AppAnnouncement.js","sourceRoot":"","sources":["../../../src/components/AppAnnouncement/AppAnnouncement.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,MAAM,EACN,YAAY,EACZ,IAAI,EACJ,IAAI,EACJ,YAAY,EACZ,OAAO,EACP,gBAAgB,EAChB,YAAY,EACZ,wBAAwB,EACxB,IAAI,EACL,MAAM,yBAAyB,CAAC;AAMjC,OAAO,KAAK,SAAS,MAAM,8DAA8D,CAAC;AAE1F,YAAY,CAAC,SAAS,CAAC,CAAC;AAwBxB,MAAM,mBAAmB,GAAG,MAAM,CAAC,MAAM,CAAA;;;CAGxC,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,MAAM,CAAC,OAAO,CAEjD,KAAK,CAAC,EAAE;IACR,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,EACzB,UAAU,EAAE,EACV,IAAI,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,EACvC,YAAY,EAAE,EAAE,UAAU,EAAE,kBAAkB,EAAE,eAAe,EAAE,EAClE,EACF,EACD,KAAK,EACN,GAAG,KAAK,CAAC;IAEV,MAAM,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAC/B,MAAM,KAAK,GAAG,wBAAwB,CAAC,UAAU,EAAE,eAAe,CAAC,CAAC;IAEpE,OAAO,GAAG,CAAA;wBACY,OAAO;kBACb,UAAU;qBACP,YAAY;aACpB,KAAK;;;MAGZ,KAAK,CAAC,WAAW,IAAI,mBAAmB;;;yBAGrB,KAAK;6BACD,GAAG;;;;;;;;;;;0BAWN,OAAO;;;;;;;;MAQ3B,mBAAmB;;;;;;;;;;sBAUH,MAAM,CAAC,KAAK;;;;;;;;;;gCAUF,OAAO;;;;;yCAKE,OAAO;;;;;8BAKlB,OAAO;;;;QAI7B,YAAY;+BACW,OAAO;;;;;wBAKd,MAAM,CAAC,KAAK;;;;GAIjC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,eAAe,GAA0D,UAAU,CACvF,SAAS,eAAe,CACtB,KAA4C,EAC5C,GAAgC;IAEhC,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EACJ,OAAO,EACP,WAAW,EACX,OAAO,EACP,YAAY,EACZ,YAAY,GAAG,CAAC,CAAC,yCAAyC,CAAC,EAC3D,KAAK,EACL,SAAS,EACT,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,OAAO,CACL,MAAC,qBAAqB,OAAK,SAAS,EAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,aACzD,SAAS,IAAI,CACZ,KAAC,MAAM,IACL,EAAE,EAAE,mBAAmB,EACvB,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,OAAO,EAAE,SAAS,gBACN,CAAC,CAAC,4CAA4C,CAAC,YAE3D,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,GAAG,GACd,CACV,EACD,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,OAAO,IAAI,CAAC,CAAC,sCAAsC,CAAC,GAAQ,EAChF,0BACG,WAAW,IAAI,KAAC,IAAI,IAAC,EAAE,EAAC,GAAG,EAAC,OAAO,EAAE,WAAW,GAAI,EACpD,OAAO,IAAI,CACV,uBACG,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;4BAC3B,OAAO;4BACL,oDAAoD;4BACpD,uBACE,KAAC,IAAI,IAAC,OAAO,EAAE,IAAI,GAAI,IADhB,KAAK,CAET,CACN,CAAC;wBACJ,CAAC,CAAC,GACC,CACN,EACA,YAAY,IAAI,CACf,KAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAE,YAAY,EAAE,MAAM,EAAC,QAAQ,YAC5D,YAAY,GACN,CACV,IACG,IACgB,CACzB,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,eAAe,CAAC","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n StyledButton,\n Text,\n Icon,\n registerIcon,\n useI18n,\n defaultThemeProp,\n useDirection,\n calculateForegroundColor,\n HTML\n} from '@pega/cosmos-react-core';\nimport type {\n BaseProps,\n ForwardRefForwardPropsComponent,\n NoChildrenProp\n} from '@pega/cosmos-react-core';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\n\nregisterIcon(timesIcon);\n\nexport interface AppAnnouncementProps extends BaseProps, NoChildrenProp {\n /** Heading text for the announcement. */\n heading?: string;\n /** Description text for the announcement. */\n description?: string;\n /** Announcement details to be displayed in form of bulleted list. */\n details?: string[];\n /** Url to open with What's new link. */\n whatsNewLink?: string;\n /** Content to populate the announcement button. */\n whatsNewText?: string;\n /** An image source for the decorative background. */\n image?: string;\n /**\n * Whether to fit AppAnnouncement widget in the parent element.\n */\n fitToParent?: boolean;\n /** Callback when user dismisses the announcements. */\n onDismiss?: () => void;\n ref?: Ref<HTMLElement>;\n}\n\nconst StyledDismissButton = styled.button`\n font-size: 1.25rem;\n border: none;\n`;\n\nexport const StyledAppAnnouncement = styled.article<\n Pick<AppAnnouncementProps, 'image' | 'fitToParent'>\n>(props => {\n const {\n theme: {\n base: { shadow, spacing },\n components: {\n card: { 'border-radius': borderRadius },\n announcement: { background, 'foreground-color': foregroundColor }\n }\n },\n image\n } = props;\n\n const { end } = useDirection();\n const color = calculateForegroundColor(background, foregroundColor);\n\n return css`\n padding: calc(2 * ${spacing});\n background: ${background};\n border-radius: ${borderRadius};\n color: ${color};\n position: relative;\n\n ${props.fitToParent && 'block-size: 100%;'};\n\n &::after {\n background: url('${image}') no-repeat;\n background-position: ${end} bottom;\n background-size: contain;\n background-origin: content-box;\n opacity: 0.2;\n content: '';\n display: block;\n position: absolute;\n width: 50%;\n height: 100%;\n inset-inline-end: 0;\n bottom: 0;\n padding: calc(2 * ${spacing});\n }\n\n h2 {\n position: relative;\n z-index: 2;\n }\n\n ${StyledDismissButton} {\n position: absolute;\n top: 0.75rem;\n inset-inline-end: 0.75rem;\n color: inherit;\n z-index: 3;\n &:enabled:hover {\n background: #ffffff19;\n }\n &:enabled:focus {\n box-shadow: ${shadow.focus};\n }\n }\n\n > div {\n position: relative;\n z-index: 2;\n\n p,\n ul {\n padding-top: calc(2 * ${spacing});\n line-height: 1.4;\n }\n\n ul {\n padding-inline-start: calc(2 * ${spacing});\n }\n\n li {\n &:not(:last-child) {\n margin-block-end: ${spacing};\n }\n }\n\n ${StyledButton} {\n margin-top: calc(2 * ${spacing});\n white-space: normal;\n\n &:enabled:focus,\n &:not([disabled]):focus {\n box-shadow: ${shadow.focus};\n }\n }\n }\n `;\n});\n\nStyledAppAnnouncement.defaultProps = defaultThemeProp;\n\nconst AppAnnouncement: ForwardRefForwardPropsComponent<AppAnnouncementProps> = forwardRef(\n function AppAnnouncement(\n props: PropsWithoutRef<AppAnnouncementProps>,\n ref: AppAnnouncementProps['ref']\n ) {\n const t = useI18n();\n const {\n heading,\n description,\n details,\n whatsNewLink,\n whatsNewText = t('app_announcement_whats_new_button_label'),\n image,\n onDismiss,\n ...restProps\n } = props;\n\n return (\n <StyledAppAnnouncement {...restProps} ref={ref} image={image}>\n {onDismiss && (\n <Button\n as={StyledDismissButton}\n variant='simple'\n icon\n onClick={onDismiss}\n aria-label={t('app_announcement_dismiss_button_label_a11y')}\n >\n <Icon name='times' />\n </Button>\n )}\n <Text variant='h2'>{heading || t('app_announcement_details_list_header')}</Text>\n <div>\n {description && <HTML as='p' content={description} />}\n {details && (\n <ul>\n {details.map((item, index) => {\n return (\n // eslint-disable-next-line react/no-array-index-key\n <li key={index}>\n <HTML content={item} />\n </li>\n );\n })}\n </ul>\n )}\n {whatsNewLink && (\n <Button variant='secondary' href={whatsNewLink} target='_blank'>\n {whatsNewText}\n </Button>\n )}\n </div>\n </StyledAppAnnouncement>\n );\n }\n);\n\nexport default AppAnnouncement;\n"]}
1
+ {"version":3,"file":"AppAnnouncement.js","sourceRoot":"","sources":["../../../src/components/AppAnnouncement/AppAnnouncement.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n Button,\n StyledButton,\n Text,\n Icon,\n registerIcon,\n useI18n,\n defaultThemeProp,\n useDirection,\n calculateForegroundColor,\n HTML\n} from '@pega/cosmos-react-core';\nimport type {\n BaseProps,\n ForwardRefForwardPropsComponent,\n NoChildrenProp\n} from '@pega/cosmos-react-core';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\n\nregisterIcon(timesIcon);\n\nexport interface AppAnnouncementProps extends BaseProps, NoChildrenProp {\n /** Heading text for the announcement. */\n heading?: string;\n /** Description text for the announcement. */\n description?: string;\n /** Announcement details to be displayed in form of bulleted list. */\n details?: string[];\n /** Url to open with What's new link. */\n whatsNewLink?: string;\n /** Content to populate the announcement button. */\n whatsNewText?: string;\n /** An image source for the decorative background. */\n image?: string;\n /**\n * Whether to fit AppAnnouncement widget in the parent element.\n */\n fitToParent?: boolean;\n /** Callback when user dismisses the announcements. */\n onDismiss?: () => void;\n ref?: Ref<HTMLElement>;\n}\n\nconst StyledDismissButton = styled.button`\n font-size: 1.25rem;\n border: none;\n`;\n\nexport const StyledAppAnnouncement = styled.article<\n Pick<AppAnnouncementProps, 'image' | 'fitToParent'>\n>(props => {\n const {\n theme: {\n base: { shadow, spacing },\n components: {\n card: { 'border-radius': borderRadius },\n announcement: { background, 'foreground-color': foregroundColor }\n }\n },\n image\n } = props;\n\n const { end } = useDirection();\n const color = calculateForegroundColor(background, foregroundColor);\n\n return css`\n padding: calc(2 * ${spacing});\n background: ${background};\n border-radius: ${borderRadius};\n color: ${color};\n position: relative;\n\n ${props.fitToParent && 'block-size: 100%;'};\n\n &::after {\n background: url('${image}') no-repeat;\n background-position: ${end} bottom;\n background-size: contain;\n background-origin: content-box;\n opacity: 0.2;\n content: '';\n display: block;\n position: absolute;\n width: 50%;\n height: 100%;\n inset-inline-end: 0;\n bottom: 0;\n padding: calc(2 * ${spacing});\n }\n\n h2 {\n position: relative;\n z-index: 2;\n }\n\n ${StyledDismissButton} {\n position: absolute;\n top: 0.75rem;\n inset-inline-end: 0.75rem;\n color: inherit;\n z-index: 3;\n &:enabled:hover {\n background: #ffffff19;\n }\n &:enabled:focus {\n box-shadow: ${shadow.focus};\n }\n }\n\n > div {\n position: relative;\n z-index: 2;\n\n p,\n ul {\n padding-block-start: calc(1.5 * ${spacing});\n line-height: 1.4;\n }\n\n ul {\n padding-inline-start: calc(2 * ${spacing});\n }\n\n li {\n &:not(:last-child) {\n margin-block-end: ${spacing};\n }\n }\n\n ${StyledButton} {\n margin-top: calc(2 * ${spacing});\n white-space: normal;\n\n &:enabled:focus,\n &:not([disabled]):focus {\n box-shadow: ${shadow.focus};\n }\n }\n }\n `;\n});\n\nStyledAppAnnouncement.defaultProps = defaultThemeProp;\n\nconst AppAnnouncement: ForwardRefForwardPropsComponent<AppAnnouncementProps> = forwardRef(\n function AppAnnouncement(\n props: PropsWithoutRef<AppAnnouncementProps>,\n ref: AppAnnouncementProps['ref']\n ) {\n const t = useI18n();\n const {\n heading,\n description,\n details,\n whatsNewLink,\n whatsNewText = t('app_announcement_whats_new_button_label'),\n image,\n onDismiss,\n ...restProps\n } = props;\n\n return (\n <StyledAppAnnouncement {...restProps} ref={ref} image={image}>\n {onDismiss && (\n <Button\n as={StyledDismissButton}\n variant='simple'\n icon\n onClick={onDismiss}\n aria-label={t('app_announcement_dismiss_button_label_a11y')}\n >\n <Icon name='times' />\n </Button>\n )}\n <Text variant='h2'>{heading || t('app_announcement_details_list_header')}</Text>\n <div>\n {description && <HTML as='p' content={description} />}\n {details && (\n <ul>\n {details.map((item, index) => {\n return (\n // eslint-disable-next-line react/no-array-index-key\n <li key={index}>\n <HTML content={item} />\n </li>\n );\n })}\n </ul>\n )}\n {whatsNewLink && (\n <Button variant='secondary' href={whatsNewLink} target='_blank'>\n {whatsNewText}\n </Button>\n )}\n </div>\n </StyledAppAnnouncement>\n );\n }\n);\n\nexport default AppAnnouncement;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"SearchResult.d.ts","sourceRoot":"","sources":["../../../src/components/SearchResults/SearchResult.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AAyB/D,QAAA,MAAM,YAAY,GAAI,gDAOnB,iBAAiB,KAAG,GAAG,CAAC,OAe1B,CAAC;AAEF,eAAe,YAAY,CAAC"}
1
+ {"version":3,"file":"SearchResult.d.ts","sourceRoot":"","sources":["../../../src/components/SearchResults/SearchResult.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,uBAAuB,CAAC;AA8B/D,QAAA,MAAM,YAAY,GAAI,gDAOnB,iBAAiB,KAAG,GAAG,CAAC,OAe1B,CAAC;AAEF,eAAe,YAAY,CAAC"}
@@ -4,13 +4,18 @@ import { defaultThemeProp, Text, MetaList, Link, Flex, StyledPopover, calculateF
4
4
  const StyledSearchResult = styled.article(({ theme }) => {
5
5
  const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);
6
6
  return css `
7
- h2 ${StyledPopover} {
8
- font-size: ${fontSize.s};
9
- font-weight: ${theme.base['font-weight'].normal};
10
- }
11
7
  padding-block-end: calc(2 * ${theme.base.spacing});
12
8
  border-bottom: 0.0125rem solid ${theme.base.palette['border-line']};
13
9
 
10
+ h2 {
11
+ word-break: break-word;
12
+
13
+ ${StyledPopover} {
14
+ font-size: ${fontSize.s};
15
+ font-weight: ${theme.base['font-weight'].normal};
16
+ }
17
+ }
18
+
14
19
  &:last-of-type {
15
20
  border-bottom: none;
16
21
  }
@@ -1 +1 @@
1
- {"version":3,"file":"SearchResult.js","sourceRoot":"","sources":["../../../src/components/SearchResults/SearchResult.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,gBAAgB,EAChB,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,aAAa,EACb,iBAAiB,EACjB,uBAAuB,EACvB,IAAI,EACJ,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;AAIjC,MAAM,kBAAkB,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACtD,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IAEtF,OAAO,GAAG,CAAA;SACH,aAAa;mBACH,QAAQ,CAAC,CAAC;qBACR,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,MAAM;;kCAEnB,KAAK,CAAC,IAAI,CAAC,OAAO;qCACf,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;;;;;GAKnE,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;CAErC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EACpB,KAAK,EACL,IAAI,EACJ,WAAW,EACX,IAAI,GAAG,EAAE,EACT,MAAM,EACN,EAAE,EACgB,EAAe,EAAE;IACnC,OAAO,CACL,MAAC,IAAI,IAAC,EAAE,EAAE,kBAAkB,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACtE,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,aACtC,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAChB,MAAC,IAAI,OAAK,IAAI,aACX,MAAM,CAAC,CAAC,CAAC,uBAAuB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAC,IAAI,cAAE,KAAK,GAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,EACvF,KAAC,kBAAkB,cAAE,MAAM,EAAE,EAAE,GAAsB,IAChD,GACF,EACN,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,KAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,GAAI,IACtC,EACN,WAAW,IAAI,KAAC,iBAAiB,IAAC,WAAW,EAAC,GAAG,YAAE,WAAW,GAAqB,IAC/E,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport {\n defaultThemeProp,\n Text,\n MetaList,\n Link,\n Flex,\n StyledPopover,\n calculateFontSize,\n replaceMatchWithElement,\n Mark,\n VisuallyHiddenText\n} from '@pega/cosmos-react-core';\n\nimport type { SearchResultProps } from './SearchResults.types';\n\nconst StyledSearchResult = styled.article(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n h2 ${StyledPopover} {\n font-size: ${fontSize.s};\n font-weight: ${theme.base['font-weight'].normal};\n }\n padding-block-end: calc(2 * ${theme.base.spacing});\n border-bottom: 0.0125rem solid ${theme.base.palette['border-line']};\n\n &:last-of-type {\n border-bottom: none;\n }\n `;\n});\n\nStyledSearchResult.defaultProps = defaultThemeProp;\n\nconst StyledDescription = styled(Text)`\n word-break: break-word;\n`;\n\nconst SearchResult = ({\n title,\n link,\n description,\n meta = [],\n accent,\n id\n}: SearchResultProps): JSX.Element => {\n return (\n <Flex as={StyledSearchResult} container={{ direction: 'column', gap: 1 }}>\n <Flex container={{ direction: 'column' }}>\n <Text variant='h2'>\n <Link {...link}>\n {accent ? replaceMatchWithElement(title, accent, match => <Mark>{match}</Mark>) : title}\n <VisuallyHiddenText>{` - ${id}`}</VisuallyHiddenText>\n </Link>\n </Text>\n {!!meta.length && <MetaList items={meta} />}\n </Flex>\n {description && <StyledDescription forwardedAs='p'>{description}</StyledDescription>}\n </Flex>\n );\n};\n\nexport default SearchResult;\n"]}
1
+ {"version":3,"file":"SearchResult.js","sourceRoot":"","sources":["../../../src/components/SearchResults/SearchResult.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,gBAAgB,EAChB,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,IAAI,EACJ,aAAa,EACb,iBAAiB,EACjB,uBAAuB,EACvB,IAAI,EACJ,kBAAkB,EACnB,MAAM,yBAAyB,CAAC;AAIjC,MAAM,kBAAkB,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACtD,MAAM,QAAQ,GAAG,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;IAEtF,OAAO,GAAG,CAAA;kCACsB,KAAK,CAAC,IAAI,CAAC,OAAO;qCACf,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;;;;;QAK9D,aAAa;qBACA,QAAQ,CAAC,CAAC;uBACR,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,MAAM;;;;;;;GAOpD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,iBAAiB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;CAErC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EACpB,KAAK,EACL,IAAI,EACJ,WAAW,EACX,IAAI,GAAG,EAAE,EACT,MAAM,EACN,EAAE,EACgB,EAAe,EAAE;IACnC,OAAO,CACL,MAAC,IAAI,IAAC,EAAE,EAAE,kBAAkB,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aACtE,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,aACtC,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAChB,MAAC,IAAI,OAAK,IAAI,aACX,MAAM,CAAC,CAAC,CAAC,uBAAuB,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,KAAC,IAAI,cAAE,KAAK,GAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,EACvF,KAAC,kBAAkB,cAAE,MAAM,EAAE,EAAE,GAAsB,IAChD,GACF,EACN,CAAC,CAAC,IAAI,CAAC,MAAM,IAAI,KAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,GAAI,IACtC,EACN,WAAW,IAAI,KAAC,iBAAiB,IAAC,WAAW,EAAC,GAAG,YAAE,WAAW,GAAqB,IAC/E,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\n\nimport {\n defaultThemeProp,\n Text,\n MetaList,\n Link,\n Flex,\n StyledPopover,\n calculateFontSize,\n replaceMatchWithElement,\n Mark,\n VisuallyHiddenText\n} from '@pega/cosmos-react-core';\n\nimport type { SearchResultProps } from './SearchResults.types';\n\nconst StyledSearchResult = styled.article(({ theme }) => {\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n padding-block-end: calc(2 * ${theme.base.spacing});\n border-bottom: 0.0125rem solid ${theme.base.palette['border-line']};\n\n h2 {\n word-break: break-word;\n\n ${StyledPopover} {\n font-size: ${fontSize.s};\n font-weight: ${theme.base['font-weight'].normal};\n }\n }\n\n &:last-of-type {\n border-bottom: none;\n }\n `;\n});\n\nStyledSearchResult.defaultProps = defaultThemeProp;\n\nconst StyledDescription = styled(Text)`\n word-break: break-word;\n`;\n\nconst SearchResult = ({\n title,\n link,\n description,\n meta = [],\n accent,\n id\n}: SearchResultProps): JSX.Element => {\n return (\n <Flex as={StyledSearchResult} container={{ direction: 'column', gap: 1 }}>\n <Flex container={{ direction: 'column' }}>\n <Text variant='h2'>\n <Link {...link}>\n {accent ? replaceMatchWithElement(title, accent, match => <Mark>{match}</Mark>) : title}\n <VisuallyHiddenText>{` - ${id}`}</VisuallyHiddenText>\n </Link>\n </Text>\n {!!meta.length && <MetaList items={meta} />}\n </Flex>\n {description && <StyledDescription forwardedAs='p'>{description}</StyledDescription>}\n </Flex>\n );\n};\n\nexport default SearchResult;\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pega/cosmos-react-work",
3
- "version": "9.0.0-build.20.9",
3
+ "version": "9.0.0-build.21.1",
4
4
  "license": "SEE LICENSE IN LICENSE",
5
5
  "author": "Pegasystems",
6
6
  "sideEffects": false,
@@ -14,8 +14,8 @@
14
14
  "build": "tsc -b tsconfig.build.json"
15
15
  },
16
16
  "dependencies": {
17
- "@pega/cosmos-react-core": "9.0.0-build.20.9",
18
- "@pega/cosmos-react-rte": "9.0.0-build.20.9",
17
+ "@pega/cosmos-react-core": "9.0.0-build.21.1",
18
+ "@pega/cosmos-react-rte": "9.0.0-build.21.1",
19
19
  "@types/react": "^17.0.62 || ^18.3.3",
20
20
  "@types/react-dom": "^17.0.20 || ^18.3.0",
21
21
  "polished": "^4.1.0",