@pega/cosmos-react-build 9.0.0-build.11.4 → 9.0.0-build.11.6
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.
- package/lib/components/PageBanner/PageBanner.d.ts.map +1 -1
- package/lib/components/PageBanner/PageBanner.js +6 -2
- package/lib/components/PageBanner/PageBanner.js.map +1 -1
- package/lib/components/PageTemplates/PageTemplate.styles.d.ts.map +1 -1
- package/lib/components/PageTemplates/PageTemplate.styles.js +4 -0
- package/lib/components/PageTemplates/PageTemplate.styles.js.map +1 -1
- package/lib/components/SummaryCard/SummaryCard.d.ts.map +1 -1
- package/lib/components/SummaryCard/SummaryCard.js +13 -1
- package/lib/components/SummaryCard/SummaryCard.js.map +1 -1
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageBanner.d.ts","sourceRoot":"","sources":["../../../src/components/PageBanner/PageBanner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAqBlE,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAItF,UAAU,MAAM;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CAC/C;AAED,MAAM,WAAW,eAAgB,SAAQ,cAAc,EAAE,UAAU;IACjE,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACtC,IAAI,CAAC,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;CACH;AAED,eAAO,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"PageBanner.d.ts","sourceRoot":"","sources":["../../../src/components/PageBanner/PageBanner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAqBlE,OAAO,KAAK,EAAE,UAAU,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAItF,UAAU,MAAM;IACd,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CAC/C;AAED,MAAM,WAAW,eAAgB,SAAQ,cAAc,EAAE,UAAU;IACjE,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,OAAO,CAAC,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACtC,IAAI,CAAC,EAAE;QACL,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;CACH;AAED,eAAO,MAAM,gBAAgB,yGA0C3B,CAAC;AAIH,eAAO,MAAM,oBAAoB,yGAOhC,CAAC;AAEF,eAAO,MAAM,aAAa,yGAEzB,CAAC;;;;AAiEF,wBAA6D"}
|
|
@@ -1,13 +1,17 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import styled, { css } from 'styled-components';
|
|
3
|
-
import { readableColor } from 'polished';
|
|
3
|
+
import { readableColor, transparentize } from 'polished';
|
|
4
4
|
import { Flex, Grid, Image, Text, Button, defaultThemeProp, tryCatch, StyledButton, Link, StyledLink, useBreakpoint, ShowMoreLess, StyledShowMoreLessButton, useTestIds, withTestIds } from '@pega/cosmos-react-core';
|
|
5
5
|
import { getPageBannerTestIds } from './PageBanner.test-ids';
|
|
6
6
|
export const StyledPageBanner = styled.div(({ theme }) => {
|
|
7
|
-
const { base: { palette: { 'brand-primary': brandBackground }, 'font-weight': fontWeight, 'content-width': contentWidth } } = theme;
|
|
7
|
+
const { base: { spacing, palette: { 'brand-primary': brandBackground, 'secondary-background': secondaryBackground }, 'font-weight': fontWeight, 'content-width': contentWidth } } = theme;
|
|
8
8
|
const color = tryCatch(() => readableColor(brandBackground));
|
|
9
9
|
return css `
|
|
10
10
|
background: ${brandBackground};
|
|
11
|
+
border: solid 0.0625rem ${transparentize(0.5, secondaryBackground)};
|
|
12
|
+
border-block-end-color: rgba(0, 0, 0, 0.1);
|
|
13
|
+
border-inline-end-color: rgba(0, 0, 0, 0.1);
|
|
14
|
+
backdrop-filter: blur(calc(0.25 * ${spacing}));
|
|
11
15
|
color: ${color};
|
|
12
16
|
|
|
13
17
|
h1:focus-visible {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageBanner.js","sourceRoot":"","sources":["../../../src/components/PageBanner/PageBanner.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"PageBanner.js","sourceRoot":"","sources":["../../../src/components/PageBanner/PageBanner.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { FunctionComponent, MouseEventHandler } from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor, transparentize } from 'polished';\n\nimport {\n Flex,\n Grid,\n Image,\n Text,\n Button,\n defaultThemeProp,\n tryCatch,\n StyledButton,\n Link,\n StyledLink,\n useBreakpoint,\n ShowMoreLess,\n StyledShowMoreLessButton,\n useTestIds,\n withTestIds\n} from '@pega/cosmos-react-core';\nimport type { ImageProps, NoChildrenProp, TestIdProp } from '@pega/cosmos-react-core';\n\nimport { getPageBannerTestIds } from './PageBanner.test-ids';\n\ninterface Action {\n label: string;\n onClick: MouseEventHandler<HTMLButtonElement>;\n}\n\nexport interface PageBannerProps extends NoChildrenProp, TestIdProp {\n title: string;\n description: string;\n image?: ImageProps;\n actions?: [Action] | [Action, Action];\n link?: {\n label: string;\n href: string;\n };\n}\n\nexport const StyledPageBanner = styled.div(({ theme }) => {\n const {\n base: {\n spacing,\n palette: { 'brand-primary': brandBackground, 'secondary-background': secondaryBackground },\n 'font-weight': fontWeight,\n 'content-width': contentWidth\n }\n } = theme;\n\n const color = tryCatch(() => readableColor(brandBackground));\n\n return css`\n background: ${brandBackground};\n border: solid 0.0625rem ${transparentize(0.5, secondaryBackground)};\n border-block-end-color: rgba(0, 0, 0, 0.1);\n border-inline-end-color: rgba(0, 0, 0, 0.1);\n backdrop-filter: blur(calc(0.25 * ${spacing}));\n color: ${color};\n\n h1:focus-visible {\n outline: transparent;\n box-shadow: ${theme.base.shadow.focus};\n }\n\n ${StyledButton} {\n width: max-content;\n }\n\n ${StyledButton} + ${StyledButton} {\n margin-inline-start: 0;\n }\n\n ${StyledLink}, ${StyledShowMoreLessButton} {\n font-weight: ${fontWeight['semi-bold']};\n color: ${color};\n }\n\n p {\n max-width: ${contentWidth.xl};\n }\n `;\n});\n\nStyledPageBanner.defaultProps = defaultThemeProp;\n\nexport const StyledImageContainer = styled.div`\n min-width: 100%;\n\n img {\n object-fit: contain;\n max-height: 10rem;\n }\n`;\n\nexport const StyledActions = styled.div`\n margin-block-start: auto;\n`;\n\nconst PageBanner: FunctionComponent<PageBannerProps> = ({\n testId,\n title,\n description,\n image,\n actions,\n link\n}) => {\n const testIds = useTestIds(testId, getPageBannerTestIds);\n const isMediumOrAbove = useBreakpoint('md');\n const isSmallOrAbove = useBreakpoint('sm');\n\n return (\n <Grid\n container={{\n cols: isSmallOrAbove && image ? '1fr 25%' : '1fr',\n pad: isMediumOrAbove ? [0, 8, 0, 3] : [0, 3],\n gap: isMediumOrAbove ? 8 : 4\n }}\n as={StyledPageBanner}\n >\n <Flex container={{ direction: 'column', pad: [2, 0], gap: 1 }}>\n <Text data-testid={testIds.title} variant='h1'>\n {title}\n </Text>\n <ShowMoreLess lines={3}>\n <Text data-testid={testIds.description} as='p'>\n {description}\n </Text>\n </ShowMoreLess>\n {!isSmallOrAbove && image && (\n <Flex as={StyledImageContainer} container={{ justify: 'center', alignItems: 'center' }}>\n <Image {...image} />\n </Flex>\n )}\n {(actions || link) && (\n <Flex\n data-testid={testIds.actions}\n as={StyledActions}\n container={{ alignItems: 'center', pad: [1, 0, 0, 0], gap: 1, wrap: 'wrap' }}\n >\n {actions?.map(action => (\n <Button key={action.label} onClick={action.onClick}>\n {action.label}\n </Button>\n ))}\n {link && (\n <Link data-testid={testIds.link} href={link.href}>\n {link.label}\n </Link>\n )}\n </Flex>\n )}\n </Flex>\n {isSmallOrAbove && image && (\n <Flex as={StyledImageContainer} container={{ justify: 'end', alignItems: 'center' }}>\n <Image {...image} data-testId={testIds.image} />\n </Flex>\n )}\n </Grid>\n );\n};\n\nexport default withTestIds(PageBanner, getPageBannerTestIds);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageTemplate.styles.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplate.styles.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,IAAI,EAEJ,MAAM,EAOP,MAAM,yBAAyB,CAAC;AAWjC,eAAO,MAAM,gBAAgB,yGAiD3B,CAAC;AAIH,eAAO,MAAM,aAAa,kNAEzB,CAAC;AAGF,eAAO,MAAM,iBAAiB,yGAO5B,CAAC;AAKH,eAAO,MAAM,mBAAmB,yGA+B/B,CAAC;AAIF,eAAO,MAAM,+BAA+B,kNAW1C,CAAC;AAKH,eAAO,MAAM,kBAAkB,yGAa9B,CAAC;AAGF,eAAO,MAAM,YAAY,
|
|
1
|
+
{"version":3,"file":"PageTemplate.styles.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplate.styles.ts"],"names":[],"mappings":"AAGA,OAAO,EACL,IAAI,EAEJ,MAAM,EAOP,MAAM,yBAAyB,CAAC;AAWjC,eAAO,MAAM,gBAAgB,yGAiD3B,CAAC;AAIH,eAAO,MAAM,aAAa,kNAEzB,CAAC;AAGF,eAAO,MAAM,iBAAiB,yGAO5B,CAAC;AAKH,eAAO,MAAM,mBAAmB,yGA+B/B,CAAC;AAIF,eAAO,MAAM,+BAA+B,kNAW1C,CAAC;AAKH,eAAO,MAAM,kBAAkB,yGAa9B,CAAC;AAGF,eAAO,MAAM,YAAY,yGAcvB,CAAC;AAIH,eAAO,MAAM,oBAAoB,yGAEhC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,OAAO,IAG3C,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,OAAO,IAQ9B,CAAC;AAEH,eAAO,MAAM,uBAAuB,EAAE,OAAO,MAoB3C,CAAC;AAIH,eAAO,MAAM,0BAA0B;yBAAqC,OAAO;SAUlF,CAAC"}
|
|
@@ -118,6 +118,10 @@ export const StyledHeader = styled.div(({ theme }) => {
|
|
|
118
118
|
background: ${transparentize(0.95, theme.base.palette['foreground-color'])};
|
|
119
119
|
border-radius: ${theme.base['border-radius']};
|
|
120
120
|
padding: calc(2 * ${theme.base.spacing});
|
|
121
|
+
border: solid 0.0625rem ${transparentize(0.5, theme.base.palette['secondary-background'])};
|
|
122
|
+
border-block-end-color: rgba(0, 0, 0, 0.1);
|
|
123
|
+
border-inline-end-color: rgba(0, 0, 0, 0.1);
|
|
124
|
+
backdrop-filter: blur(calc(0.25 * ${theme.base.spacing}));
|
|
121
125
|
|
|
122
126
|
h1:focus-visible {
|
|
123
127
|
box-shadow: ${theme.base.shadow['focus-inset']};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageTemplate.styles.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplate.styles.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"PageTemplate.styles.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplate.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C,OAAO,EACL,IAAI,EACJ,gBAAgB,EAChB,MAAM,EACN,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,wBAAwB,EACxB,IAAI,EACJ,WAAW,EACZ,MAAM,yBAAyB,CAAC;AACjC,OAAO,EACL,YAAY,EACZ,uBAAuB,EACxB,MAAM,sDAAsD,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,yDAAyD,CAAC;AACrF,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAEvE,OAAO,EAAE,gBAAgB,EAAE,MAAM,2CAA2C,CAAC;AAE7E,qBAAqB;AACrB,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACvD,MAAM,EACJ,IAAI,EAAE,EACJ,aAAa,EAAE,UAAU,EACzB,eAAe,EAAE,YAAY,EAC7B,eAAe,EAAE,YAAY,EAC7B,OAAO,EACP,OAAO,EAAE,EAAE,kBAAkB,EAAE,KAAK,EAAE,EACvC,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;kBACM,cAAc,CAAC,IAAI,EAAE,KAAK,CAAC;qBACxB,YAAY;2BACN,OAAO;;;;eAInB,KAAK;;;;;;;MAOd,YAAY;eACH,KAAK;;;MAGd,YAAY,MAAM,YAAY;;;;MAI9B,UAAU,KAAK,wBAAwB;qBACxB,UAAU,CAAC,WAAW,CAAC;eAC7B,KAAK;;;;mBAID,YAAY,CAAC,EAAE;;;MAG5B,WAAW;;;;;;GAMd,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;CAExC,CAAC;AAEF,gBAAgB;AAChB,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxD,OAAO,GAAG,CAAA;iBACK,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,EAAE;;;;GAI5C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,wBAAwB;AACxB,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAC3C,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EAAE,EACJ,OAAO,EACP,OAAO,EAAE,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,EACrD,EACF,EACF,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;oBACM,iBAAiB;;;QAG7B,YAAY;QACZ,UAAU;yCACuB,OAAO;;;QAGxC,gBAAgB;4BACI,OAAO;;;QAG3B,uBAAuB;;;;QAIvB,iBAAiB;mCACU,OAAO;;KAErC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,CAAC,MAAM,+BAA+B,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxE,MAAM,EACJ,IAAI,EAAE,EAAE,eAAe,EAAE,YAAY,EAAE,OAAO,EAAE,EACjD,GAAG,KAAK,CAAC;IACV,OAAO,GAAG,CAAA;iBACK,YAAY,CAAC,EAAE;;;gCAGA,OAAO;;GAEpC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,+BAA+B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEhE,uBAAuB;AACvB,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,CAAA;;IAExC,gBAAgB;;;;IAIhB,wBAAwB;;;;IAIxB,gBAAgB;;;CAGnB,CAAC;AAEF,wBAAwB;AACxB,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACnD,OAAO,GAAG,CAAA;kBACM,cAAc,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;qBACzD,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;wBACxB,KAAK,CAAC,IAAI,CAAC,OAAO;8BACZ,cAAc,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,sBAAsB,CAAC,CAAC;;;wCAGrD,KAAK,CAAC,IAAI,CAAC,OAAO;;;oBAGtC,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC;;GAEjD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,MAAM,CAAC,MAAM,oBAAoB,GAAG,MAAM,CAAC,GAAG,CAAA;;CAE7C,CAAC;AAEF,MAAM,CAAC,MAAM,sBAAsB,GAAgB,MAAM,CAAC,IAAI,CAAC,CAAA;;IAE3D,gBAAgB;CACnB,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAgB,MAAM,CAAC,IAAI,CAAC,CAA4B,CAAC,EAC9E,YAAY,EACb,EAAE,EAAE;IACH,OAAO,GAAG,CAAA;;;MAGN,YAAY,IAAI,gBAAgB;GACnC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,uBAAuB,GAAkB,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,EAAE;IAC3E,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,EAAE,EAChE,UAAU,EAAE,EAAE,IAAI,EAAE,EACrB,EACF,GAAG,KAAK,CAAC;IAEV,MAAM,SAAS,GAAG,iBAAiB,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAEzD,OAAO,GAAG,CAAA;iBACK,SAAS,CAAC,IAAI,CAAC,EAAE,CAAC,WAAW,CAAa,CAAC;mBACzC,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC;;MAEnC,gBAAgB;;;oBAGF,MAAM,CAAC,aAAa,CAAC;;GAEtC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,0BAA0B,GAAG,MAAM,CAAC,GAAG,CAClD,CAAC,EAAE,KAAK,EAAE,mBAAmB,EAAE,EAAE,EAAE;IACjC,OAAO,GAAG,CAAA;2BACa,mBAAmB,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC;;QAE/D,YAAY;uBACG,KAAK,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,WAAW,CAAC;;KAExD,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,0BAA0B,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\nimport { transparentize } from 'polished';\n\nimport {\n Text,\n defaultThemeProp,\n Button,\n StyledPageHeader,\n StyledButton,\n StyledLink,\n StyledShowMoreLessButton,\n Flex,\n StyledImage\n} from '@pega/cosmos-react-core';\nimport {\n StyledBanner,\n StyledBannerMessageList\n} from '@pega/cosmos-react-core/lib/components/Banner/Banner';\nimport { StyledTabs } from '@pega/cosmos-react-core/lib/components/Tabs/Tabs.styles';\nimport { calculateFontSize } from '@pega/cosmos-react-core/lib/styles';\nimport type { FontSize } from '@pega/cosmos-react-core/lib/styles';\nimport { ellipsisOverflow } from '@pega/cosmos-react-core/lib/styles/mixins';\n\n// Page banner styles\nexport const StyledPageBanner = styled.div(({ theme }) => {\n const {\n base: {\n 'font-weight': fontWeight,\n 'content-width': contentWidth,\n 'border-radius': borderRadius,\n spacing,\n palette: { 'foreground-color': color }\n }\n } = theme;\n\n return css`\n background: ${transparentize(0.95, color)};\n border-radius: ${borderRadius};\n padding-block-start: ${spacing};\n\n &,\n h1 {\n color: ${color};\n }\n\n h1:focus-visible {\n outline: transparent;\n }\n\n ${StyledButton} {\n color: ${color};\n }\n\n ${StyledButton} + ${StyledButton} {\n margin-inline-start: 0;\n }\n\n ${StyledLink}, ${StyledShowMoreLessButton} {\n font-weight: ${fontWeight['semi-bold']};\n color: ${color};\n }\n\n p {\n max-width: ${contentWidth.xl};\n }\n\n ${StyledImage} {\n object-fit: contain;\n max-height: 10rem;\n justify-self: center;\n align-self: center;\n }\n `;\n});\n\nStyledPageBanner.defaultProps = defaultThemeProp;\n\nexport const StyledActions = styled(Flex)`\n margin-block-start: auto;\n`;\n\n// Common styles\nexport const StyledDescription = styled.div(({ theme }) => {\n return css`\n max-width: ${theme.base['content-width'].lg};\n * {\n overflow: hidden;\n }\n `;\n});\n\nStyledDescription.defaultProps = defaultThemeProp;\n\n// Inventory page styles\nexport const StyledInventoryPage = styled.div(\n ({\n theme: {\n base: {\n spacing,\n palette: { 'primary-background': primaryBackground }\n }\n }\n }) => {\n return css`\n background: ${primaryBackground};\n height: 100%;\n\n ${StyledBanner},\n ${StyledTabs} {\n margin-block-start: calc(1.5 * ${spacing});\n }\n\n ${StyledPageHeader} {\n padding: calc(2 * ${spacing});\n }\n\n ${StyledBannerMessageList} {\n max-height: 25vh;\n overflow: auto;\n }\n ${StyledDescription} {\n margin-block-start: calc(${spacing} * 1.5);\n }\n `;\n }\n);\n\nStyledInventoryPage.defaultProps = defaultThemeProp;\n\nexport const StyledInventoryPageTitleWrapper = styled(Flex)(({ theme }) => {\n const {\n base: { 'content-width': contentWidth, spacing }\n } = theme;\n return css`\n max-width: ${contentWidth.xl};\n\n h1 {\n margin-inline-end: calc(${spacing} * 2);\n }\n `;\n});\n\nStyledInventoryPageTitleWrapper.defaultProps = defaultThemeProp;\n\n// overview page styles\nexport const StyledOverviewPage = styled.div`\n /* remove the default padding set by header */\n ${StyledPageHeader} {\n padding: 0;\n }\n\n ${StyledShowMoreLessButton} {\n max-width: fit-content;\n }\n\n ${StyledPageBanner} {\n background: none;\n }\n`;\n\n// Construct page styles\nexport const StyledHeader = styled.div(({ theme }) => {\n return css`\n background: ${transparentize(0.95, theme.base.palette['foreground-color'])};\n border-radius: ${theme.base['border-radius']};\n padding: calc(2 * ${theme.base.spacing});\n border: solid 0.0625rem ${transparentize(0.5, theme.base.palette['secondary-background'])};\n border-block-end-color: rgba(0, 0, 0, 0.1);\n border-inline-end-color: rgba(0, 0, 0, 0.1);\n backdrop-filter: blur(calc(0.25 * ${theme.base.spacing}));\n\n h1:focus-visible {\n box-shadow: ${theme.base.shadow['focus-inset']};\n }\n `;\n});\n\nStyledHeader.defaultProps = defaultThemeProp;\n\nexport const StyledTitleContainer = styled.div`\n width: calc(100% - 3rem);\n`;\n\nexport const StyledTextWithEllipsis: typeof Text = styled(Text)`\n display: block;\n ${ellipsisOverflow}\n`;\n\nexport const StyledText: typeof Text = styled(Text)<{ showEllipsis: boolean }>(({\n showEllipsis\n}) => {\n return css`\n width: 100%;\n white-space: nowrap;\n ${showEllipsis && ellipsisOverflow}\n `;\n});\n\nexport const StyledPrimaryMetaButton: typeof Button = styled(Button)(props => {\n const {\n theme: {\n base: { 'font-size': fontSize, 'font-scale': fontScale, shadow },\n components: { text }\n }\n } = props;\n\n const fontSizes = calculateFontSize(fontSize, fontScale);\n\n return css`\n font-size: ${fontSizes[text.h1['font-size'] as FontSize]};\n font-weight: ${text.h1['font-weight']};\n width: 100%;\n ${ellipsisOverflow}\n\n &:not([disabled]):focus {\n box-shadow: ${shadow['focus-inset']};\n }\n `;\n});\n\nStyledPrimaryMetaButton.defaultProps = defaultThemeProp;\n\nexport const StyledPrimaryActionWrapper = styled.div<{ hasAdditionalAction: boolean }>(\n ({ theme, hasAdditionalAction }) => {\n return css`\n margin-inline-end: ${hasAdditionalAction ? theme.base.spacing : 0};\n\n ${StyledButton} {\n font-weight: ${theme.base['font-weight']['semi-bold']};\n }\n `;\n }\n);\n\nStyledPrimaryActionWrapper.defaultProps = defaultThemeProp;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SummaryCard.d.ts","sourceRoot":"","sources":["../../../src/components/SummaryCard/SummaryCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"SummaryCard.d.ts","sourceRoot":"","sources":["../../../src/components/SummaryCard/SummaryCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAI5C,OAAO,EACL,IAAI,EAGJ,IAAI,EAIL,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,UAAU,EACV,WAAW,EACZ,MAAM,yBAAyB,CAAC;AAGjC,MAAM,WAAW,gBAAiB,SAAQ,cAAc;IACtD,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;IAC9D,IAAI,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,UAAU,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,CAAC,CAAC;CACxE;AAED,eAAO,MAAM,WAAW,EAAE,OAAO,IAIhC,CAAC;AAEF,eAAO,MAAM,iBAAiB,EAAE,OAAO,IAsBrC,CAAC;AAIH,QAAA,MAAM,WAAW,EAAE,EAAE,CAAC,gBAAgB,CAkBrC,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import styled, { css } from 'styled-components';
|
|
3
|
+
import { transparentize } from 'polished';
|
|
3
4
|
import { Text, Flex, MetaList, Card, Avatar, defaultThemeProp, ShowMoreLess } from '@pega/cosmos-react-core';
|
|
4
5
|
import BareRoleButton from '@pega/cosmos-react-core/lib/components/Button/BareRoleButton';
|
|
5
6
|
export const StyledTitle = styled(Text) `
|
|
@@ -11,11 +12,22 @@ export const StyledSummaryCard = styled(Card)(({ theme }) => {
|
|
|
11
12
|
return css `
|
|
12
13
|
padding: calc(2 * ${theme.base.spacing});
|
|
13
14
|
overflow-y: auto;
|
|
15
|
+
background: ${transparentize(0.3, theme.base.palette['secondary-background'])};
|
|
16
|
+
border: solid 0.0625rem ${transparentize(0.9, theme.base.palette['foreground-color'])};
|
|
17
|
+
backdrop-filter: blur(calc(0.0625 * ${theme.base.spacing}));
|
|
18
|
+
box-shadow: 0 ${theme.base.spacing} ${theme.base.spacing} calc(-0.5 * ${theme.base.spacing})
|
|
19
|
+
rgba(0, 0, 0, 0.1);
|
|
20
|
+
transition:
|
|
21
|
+
transform 0.3s cubic-bezier(0.175, 0.885, 0, 1),
|
|
22
|
+
box-shadow 0.3s cubic-bezier(0.175, 0.885, 0, 1),
|
|
23
|
+
backdrop-filter 0.3s cubic-bezier(0.175, 0.885, 0, 1);
|
|
14
24
|
|
|
15
25
|
&:hover,
|
|
16
26
|
&:focus {
|
|
17
27
|
cursor: pointer;
|
|
18
|
-
box-shadow: ${theme.base.shadow.focus};
|
|
28
|
+
box-shadow: ${theme.base.shadow.focus}, ${theme.base.shadow.high};
|
|
29
|
+
transform: scale(1.01);
|
|
30
|
+
backdrop-filter: blur(calc(0.125 * ${theme.base.spacing}));
|
|
19
31
|
}
|
|
20
32
|
`;
|
|
21
33
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SummaryCard.js","sourceRoot":"","sources":["../../../src/components/SummaryCard/SummaryCard.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;
|
|
1
|
+
{"version":3,"file":"SummaryCard.js","sourceRoot":"","sources":["../../../src/components/SummaryCard/SummaryCard.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAE1C,OAAO,EACL,IAAI,EACJ,IAAI,EACJ,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,gBAAgB,EAChB,YAAY,EACb,MAAM,yBAAyB,CAAC;AAOjC,OAAO,cAAc,MAAM,8DAA8D,CAAC;AAW1F,MAAM,CAAC,MAAM,WAAW,GAAgB,MAAM,CAAC,IAAI,CAAC,CAAA;;;;CAInD,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAgB,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACvE,OAAO,GAAG,CAAA;wBACY,KAAK,CAAC,IAAI,CAAC,OAAO;;kBAExB,cAAc,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,sBAAsB,CAAC,CAAC;8BACnD,cAAc,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,kBAAkB,CAAC,CAAC;0CAC/C,KAAK,CAAC,IAAI,CAAC,OAAO;oBACxC,KAAK,CAAC,IAAI,CAAC,OAAO,IAAI,KAAK,CAAC,IAAI,CAAC,OAAO,gBAAgB,KAAK,CAAC,IAAI,CAAC,OAAO;;;;;;;;;;oBAU1E,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,KAAK,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI;;2CAE3B,KAAK,CAAC,IAAI,CAAC,OAAO;;GAE1D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,WAAW,GAAyB,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,EAAE;IAC9F,OAAO,CACL,MAAC,cAAc,IACb,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,EACjE,EAAE,EAAE,iBAAiB,EAErB,OAAO,EAAE,CAAC,CAA6B,EAAE,EAAE,CAAC,OAAO,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,aAE5D,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,EAAE,CAAC,EAAE,aACjD,MAAM,IAAI,KAAC,MAAM,OAAK,MAAM,EAAE,KAAK,EAAC,UAAU,EAAC,IAAI,EAAE,KAAK,GAAI,EAC/D,KAAC,WAAW,IAAC,OAAO,EAAC,IAAI,YAAE,KAAK,GAAe,IAC1C,EACP,KAAC,IAAI,IAAC,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,YACrB,KAAC,YAAY,IAAC,KAAK,EAAE,CAAC,YAAG,WAAW,GAAgB,GAC/C,EACP,KAAC,QAAQ,IAAC,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,GAAI,KAVtC,EAAE,CAWQ,CAClB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import type { FC, MouseEvent } from 'react';\nimport styled, { css } from 'styled-components';\nimport { transparentize } from 'polished';\n\nimport {\n Text,\n Flex,\n MetaList,\n Card,\n Avatar,\n defaultThemeProp,\n ShowMoreLess\n} from '@pega/cosmos-react-core';\nimport type {\n MetaListProps,\n NoChildrenProp,\n OmitStrict,\n AvatarProps\n} from '@pega/cosmos-react-core';\nimport BareRoleButton from '@pega/cosmos-react-core/lib/components/Button/BareRoleButton';\n\nexport interface SummaryCardProps extends NoChildrenProp {\n id: string;\n title: string;\n description?: string;\n onClick?: (id: string, e: MouseEvent<HTMLDivElement>) => void;\n meta: MetaListProps['items'];\n visual?: OmitStrict<AvatarProps, 'name' | 'shape' | 'size' | 'status'>;\n}\n\nexport const StyledTitle: typeof Text = styled(Text)`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nexport const StyledSummaryCard: typeof Card = styled(Card)(({ theme }) => {\n return css`\n padding: calc(2 * ${theme.base.spacing});\n overflow-y: auto;\n background: ${transparentize(0.3, theme.base.palette['secondary-background'])};\n border: solid 0.0625rem ${transparentize(0.9, theme.base.palette['foreground-color'])};\n backdrop-filter: blur(calc(0.0625 * ${theme.base.spacing}));\n box-shadow: 0 ${theme.base.spacing} ${theme.base.spacing} calc(-0.5 * ${theme.base.spacing})\n rgba(0, 0, 0, 0.1);\n transition:\n transform 0.3s cubic-bezier(0.175, 0.885, 0, 1),\n box-shadow 0.3s cubic-bezier(0.175, 0.885, 0, 1),\n backdrop-filter 0.3s cubic-bezier(0.175, 0.885, 0, 1);\n\n &:hover,\n &:focus {\n cursor: pointer;\n box-shadow: ${theme.base.shadow.focus}, ${theme.base.shadow.high};\n transform: scale(1.01);\n backdrop-filter: blur(calc(0.125 * ${theme.base.spacing}));\n }\n `;\n});\n\nStyledSummaryCard.defaultProps = defaultThemeProp;\n\nconst SummaryCard: FC<SummaryCardProps> = ({ id, title, description, visual, meta, onClick }) => {\n return (\n <BareRoleButton\n container={{ direction: 'column', rowGap: 2, justify: 'between' }}\n as={StyledSummaryCard}\n key={id}\n onClick={(e: MouseEvent<HTMLDivElement>) => onClick?.(id, e)}\n >\n <Flex container={{ alignItems: 'center', colGap: 1 }}>\n {visual && <Avatar {...visual} shape='squircle' name={title} />}\n <StyledTitle variant='h3'>{title}</StyledTitle>\n </Flex>\n <Flex item={{ grow: 1 }}>\n <ShowMoreLess lines={1}>{description}</ShowMoreLess>\n </Flex>\n <MetaList items={meta} wrapItems={false} />\n </BareRoleButton>\n );\n};\n\nexport default SummaryCard;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-build",
|
|
3
|
-
"version": "9.0.0-build.11.
|
|
3
|
+
"version": "9.0.0-build.11.6",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE",
|
|
5
5
|
"author": "Pegasystems",
|
|
6
6
|
"sideEffects": false,
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
"build": "tsc -b tsconfig.build.json"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@pega/cosmos-react-core": "9.0.0-build.11.
|
|
18
|
-
"@pega/cosmos-react-dnd": "9.0.0-build.11.
|
|
19
|
-
"@pega/cosmos-react-rte": "9.0.0-build.11.
|
|
17
|
+
"@pega/cosmos-react-core": "9.0.0-build.11.6",
|
|
18
|
+
"@pega/cosmos-react-dnd": "9.0.0-build.11.6",
|
|
19
|
+
"@pega/cosmos-react-rte": "9.0.0-build.11.6",
|
|
20
20
|
"@types/codemirror": "^5.60.15",
|
|
21
21
|
"@types/dagre": "^0.7.46",
|
|
22
22
|
"@types/react": "^17.0.62 || ^18.3.3",
|