@pega/cosmos-react-work 3.0.0-dev.23.0 → 3.0.0-dev.23.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.
- package/lib/components/CaseView/CaseSummary.js +2 -2
- package/lib/components/CaseView/CaseSummary.js.map +1 -1
- package/lib/components/CaseView/CaseView.styles.d.ts.map +1 -1
- package/lib/components/CaseView/CaseView.styles.js +0 -8
- package/lib/components/CaseView/CaseView.styles.js.map +1 -1
- package/lib/components/Stages/StageGlimpse.js +1 -1
- package/lib/components/Stages/StageGlimpse.js.map +1 -1
- package/package.json +2 -2
|
@@ -6,8 +6,8 @@ import { StyledCaseSummary, StyledCaseSummaryInfo } from './CaseView.styles';
|
|
|
6
6
|
import { useCaseViewContext } from './CaseView.context';
|
|
7
7
|
registerIcon(arrowMicroLeftIcon);
|
|
8
8
|
const CaseSummary = () => {
|
|
9
|
-
const { summary, tabs } = useCaseViewContext();
|
|
10
|
-
return (_jsxs(Flex, { as: StyledCaseSummary, container: { direction: 'column' }, item: { shrink: 0 }, children: [_jsx(CaseHeader, {}), (summary || tabs.items.length > 1) && (_jsxs(StyledCaseSummaryInfo, { children: [summary, tabs.items.length > 1 && (_jsx(Tabs, { type: 'vertical', tabs: tabs.items, onTabClick: tabs.onClick, currentTabId: tabs.currentTabId }))] }))] }));
|
|
9
|
+
const { summary, tabs, aboveMD, isPreview } = useCaseViewContext();
|
|
10
|
+
return (_jsxs(Flex, { as: StyledCaseSummary, container: { direction: 'column' }, item: { shrink: 0 }, children: [_jsx(CaseHeader, {}), aboveMD && !isPreview && (summary || tabs.items.length > 1) && (_jsxs(StyledCaseSummaryInfo, { children: [summary, tabs.items.length > 1 && (_jsx(Tabs, { type: 'vertical', tabs: tabs.items, onTabClick: tabs.onClick, currentTabId: tabs.currentTabId }))] }))] }));
|
|
11
11
|
};
|
|
12
12
|
export default CaseSummary;
|
|
13
13
|
//# sourceMappingURL=CaseSummary.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CaseSummary.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseSummary.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACnE,OAAO,KAAK,kBAAkB,MAAM,yEAAyE,CAAC;AAE9G,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAExD,YAAY,CAAC,kBAAkB,CAAC,CAAC;AAEjC,MAAM,WAAW,GAAO,GAAG,EAAE;IAC3B,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,kBAAkB,EAAE,CAAC;
|
|
1
|
+
{"version":3,"file":"CaseSummary.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseSummary.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AACnE,OAAO,KAAK,kBAAkB,MAAM,yEAAyE,CAAC;AAE9G,OAAO,UAAU,MAAM,cAAc,CAAC;AACtC,OAAO,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAC7E,OAAO,EAAE,kBAAkB,EAAE,MAAM,oBAAoB,CAAC;AAExD,YAAY,CAAC,kBAAkB,CAAC,CAAC;AAEjC,MAAM,WAAW,GAAO,GAAG,EAAE;IAC3B,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAEnE,OAAO,CACL,MAAC,IAAI,IAAC,EAAE,EAAE,iBAAiB,EAAE,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,IAAI,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE,aAClF,KAAC,UAAU,KAAG,EAEb,OAAO,IAAI,CAAC,SAAS,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,IAAI,CAC9D,MAAC,qBAAqB,eACnB,OAAO,EAEP,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IAAI,CACxB,KAAC,IAAI,IACH,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,IAAI,CAAC,KAAK,EAChB,UAAU,EAAE,IAAI,CAAC,OAAO,EACxB,YAAY,EAAE,IAAI,CAAC,YAAY,GAC/B,CACH,IACqB,CACzB,IACI,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import { FC } from 'react';\n\nimport { Flex, Tabs, registerIcon } from '@pega/cosmos-react-core';\nimport * as arrowMicroLeftIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/arrow-micro-left.icon';\n\nimport CaseHeader from './CaseHeader';\nimport { StyledCaseSummary, StyledCaseSummaryInfo } from './CaseView.styles';\nimport { useCaseViewContext } from './CaseView.context';\n\nregisterIcon(arrowMicroLeftIcon);\n\nconst CaseSummary: FC = () => {\n const { summary, tabs, aboveMD, isPreview } = useCaseViewContext();\n\n return (\n <Flex as={StyledCaseSummary} container={{ direction: 'column' }} item={{ shrink: 0 }}>\n <CaseHeader />\n\n {aboveMD && !isPreview && (summary || tabs.items.length > 1) && (\n <StyledCaseSummaryInfo>\n {summary}\n\n {tabs.items.length > 1 && (\n <Tabs\n type='vertical'\n tabs={tabs.items}\n onTabClick={tabs.onClick}\n currentTabId={tabs.currentTabId}\n />\n )}\n </StyledCaseSummaryInfo>\n )}\n </Flex>\n );\n};\n\nexport default CaseSummary;\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CaseView.styles.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"AAsBA,eAAO,MAAM,uBAAuB,yGAelC,CAAC;AAIH,eAAO,MAAM,gBAAgB,4GAc3B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAkB7B,CAAC;AAIH,eAAO,MAAM,oBAAoB,2GAShC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAiC/B,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAIhC,CAAC;AAIH,eAAO,MAAM,qBAAqB,
|
|
1
|
+
{"version":3,"file":"CaseView.styles.d.ts","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"AAsBA,eAAO,MAAM,uBAAuB,yGAelC,CAAC;AAIH,eAAO,MAAM,gBAAgB,4GAc3B,CAAC;AAIH,eAAO,MAAM,kBAAkB,yGAkB7B,CAAC;AAIH,eAAO,MAAM,oBAAoB,2GAShC,CAAC;AAIF,eAAO,MAAM,oBAAoB,yGAiC/B,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAIhC,CAAC;AAIH,eAAO,MAAM,qBAAqB,yGAKhC,CAAC;AAIH,eAAO,MAAM,0BAA0B,qOA0BrC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAqC5B,CAAC;AAIH,eAAO,MAAM,cAAc,yGAiBzB,CAAC;AAIH,eAAO,MAAM,gBAAgB,4GAM3B,CAAC;AAIH,eAAO,MAAM,eAAe,yGAY1B,CAAC;AAIH,eAAO,MAAM,aAAa,yGAgBxB,CAAC;AAIH,eAAO,MAAM,gBAAgB,yGAU3B,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAOlC,CAAC;AAIH,eAAO,MAAM,uBAAuB,yGAUlC,CAAC;AAIH,eAAO,MAAM,WAAW,yGAGvB,CAAC;AAEF,eAAO,MAAM,cAAc,yGAiBzB,CAAC"}
|
|
@@ -106,17 +106,9 @@ export const StyledPromotedActions = styled.div(({ theme }) => {
|
|
|
106
106
|
});
|
|
107
107
|
StyledPromotedActions.defaultProps = defaultThemeProp;
|
|
108
108
|
export const StyledCaseSummaryInfo = styled.div(() => {
|
|
109
|
-
const { summaryExpanded, aboveMD } = useCaseViewContext();
|
|
110
109
|
return css `
|
|
111
|
-
display: none;
|
|
112
110
|
overflow: auto;
|
|
113
111
|
flex: 1;
|
|
114
|
-
|
|
115
|
-
${aboveMD &&
|
|
116
|
-
summaryExpanded &&
|
|
117
|
-
css `
|
|
118
|
-
display: block;
|
|
119
|
-
`}
|
|
120
112
|
`;
|
|
121
113
|
});
|
|
122
114
|
StyledCaseSummaryInfo.defaultProps = defaultThemeProp;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CaseView.styles.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { hideVisually, parseToHsl, readableColor, transparentize } from 'polished';\n\nimport {\n Button,\n calculateFontSize,\n defaultThemeProp,\n StyledBreadcrumbs,\n StyledButton,\n StyledFieldValue,\n StyledFieldValueList,\n StyledIcon,\n StyledPopover,\n StyledText,\n StyledTooltip,\n tryCatch,\n FontSize\n} from '@pega/cosmos-react-core';\nimport { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\n\nimport { useCaseViewContext } from './CaseView.context';\n\nexport const StyledCaseSummaryFields = styled.div(({ theme }) => {\n const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n padding: calc(2 * ${theme.base.spacing});\n\n > ${StyledFieldValueList}:first-child {\n grid-template-columns: 16ch auto;\n\n ${StyledFieldValue} {\n font-size: ${fontSizes[theme.components.text.h1['font-size'] as FontSize]};\n font-weight: ${theme.components.text.h1['font-weight']};\n }\n }\n `;\n});\n\nStyledCaseSummaryFields.defaultProps = defaultThemeProp;\n\nexport const StyledCaseHeader = styled.header(({ theme }) => {\n const color = tryCatch(() => readableColor(theme.base.palette['brand-primary']));\n\n return css`\n background-color: ${theme.base.palette['brand-primary']};\n color: ${color};\n padding: calc(2 * ${theme.base.spacing});\n position: relative;\n\n ${StyledMenu} {\n color: ${theme.base.palette['foreground-color']};\n z-index: ${theme.base['z-index'].popover + 1};\n }\n `;\n});\n\nStyledCaseHeader.defaultProps = defaultThemeProp;\n\nexport const StyledCaseIconWrap = styled.div(({ theme }) => {\n const spacing = theme.base.spacing;\n const borderRadius = theme.base['border-radius'];\n const backgroundColor = tryCatch(() => {\n const { lightness } = parseToHsl(theme.base.palette['brand-primary']);\n return lightness > 0.35 ? 'rgba(0, 0, 0, 0.2)' : 'rgba(255, 255, 255, 0.2)';\n });\n\n return css`\n background: ${backgroundColor};\n border-radius: calc(${borderRadius} / 2);\n width: calc(5 * ${spacing});\n height: calc(5 * ${spacing});\n ${StyledIcon} {\n font-size: calc(3 * ${spacing});\n margin: auto;\n }\n `;\n});\n\nStyledCaseIconWrap.defaultProps = defaultThemeProp;\n\nexport const StyledFollowIconWrap = styled.label`\n font-size: 1.25rem;\n input {\n ${hideVisually}\n }\n\n input:focus + svg {\n box-shadow: ${({ theme }) => theme.base.shadow['focus-inverted']};\n }\n`;\n\nStyledFollowIconWrap.defaultProps = defaultThemeProp;\n\nexport const StyledCaseHeaderText = styled.div(({ theme }) => {\n const color = readableColor(theme.base.palette['brand-primary']);\n const transparentColor = tryCatch(() => transparentize(0.2, color));\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n return css`\n word-break: break-word;\n\n ${StyledBreadcrumbs} {\n > a,\n > span,\n > button,\n > svg {\n color: ${transparentColor};\n font-size: ${fontSize.s};\n font-weight: normal;\n }\n\n > a,\n > button {\n &:focus {\n box-shadow: ${theme.base.shadow['focus-inverted']};\n }\n }\n\n ${StyledPopover}:not(${StyledTooltip}) {\n color: ${theme.base.palette['foreground-color']};\n }\n }\n\n > ${StyledText} > ${StyledButton} {\n color: ${color};\n }\n `;\n});\n\nStyledCaseHeaderText.defaultProps = defaultThemeProp;\n\nexport const StyledPromotedActions = styled.div(({ theme }) => {\n return css`\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n `;\n});\n\nStyledPromotedActions.defaultProps = defaultThemeProp;\n\nexport const StyledCaseSummaryInfo = styled.div(() => {\n const { summaryExpanded, aboveMD } = useCaseViewContext();\n\n return css`\n display: none;\n overflow: auto;\n flex: 1;\n\n ${aboveMD &&\n summaryExpanded &&\n css`\n display: block;\n `}\n `;\n});\n\nStyledCaseSummaryInfo.defaultProps = defaultThemeProp;\n\nexport const StyledExpandCollapseButton = styled(Button)(({ theme }) => {\n const { summaryExpanded } = useCaseViewContext();\n\n return css`\n position: absolute;\n z-index: 1;\n bottom: 0;\n inset-inline-start: ${summaryExpanded ? 'calc(100% - 0.75rem)' : '0'};\n border-radius: ${summaryExpanded ? '1.5rem' : '0 1.5rem 1.5rem 0'};\n box-shadow: ${theme.base.shadow.low};\n border: none;\n opacity: 0;\n\n /* Disbales core Button transition causing button to slide on toggle. */\n transition: none;\n\n &:focus {\n opacity: 1;\n }\n\n ${StyledIcon} {\n width: 1.5rem;\n height: 1.5rem;\n transform: rotate(${summaryExpanded ? 0 : css`180deg`});\n }\n `;\n});\n\nStyledExpandCollapseButton.defaultProps = defaultThemeProp;\n\nexport const StyledCaseSummary = styled.div(() => {\n const { summaryExpanded, aboveMD, aboveLG } = useCaseViewContext();\n\n return css`\n position: relative;\n height: 100%;\n\n ${aboveMD &&\n css`\n ${summaryExpanded\n ? css`\n width: ${aboveLG ? css`25rem` : css`22rem`};\n\n &:focus-within,\n &:hover {\n &::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n inset-inline-start: 100%;\n width: 0.75rem;\n }\n\n ${StyledExpandCollapseButton} {\n opacity: 1;\n }\n }\n `\n : css`\n width: 100%;\n ${StyledExpandCollapseButton} {\n opacity: 1;\n }\n `}\n `}\n `;\n});\n\nStyledCaseSummary.defaultProps = defaultThemeProp;\n\nexport const StyledWorkArea = styled.div(({ theme }) => {\n const { summaryExpanded, aboveMD } = useCaseViewContext();\n\n return css`\n grid-area: work-area;\n padding: calc(2 * ${theme.base.spacing});\n\n ${aboveMD &&\n css`\n padding: calc(2 * ${theme.base.spacing}) 0;\n\n ${!summaryExpanded &&\n css`\n margin-inline-start: calc(2 * ${theme.base.spacing});\n `}\n `}\n `;\n});\n\nStyledWorkArea.defaultProps = defaultThemeProp;\n\nexport const StyledUtilToggle = styled.button(({ theme }) => {\n return css`\n align-self: flex-end;\n color: ${theme.base.palette['foreground-color']};\n margin-inline-end: 0.375rem;\n `;\n});\n\nStyledUtilToggle.defaultProps = defaultThemeProp;\n\nexport const StyledUtilities = styled.div(() => {\n const { utilitiesExpanded, aboveLG } = useCaseViewContext();\n\n return css`\n height: max-content;\n\n ${aboveLG &&\n utilitiesExpanded &&\n css`\n width: 25rem;\n `}\n `;\n});\n\nStyledUtilities.defaultProps = defaultThemeProp;\n\nexport const StyledSummary = styled.div(({ theme }) => {\n const { summaryExpanded, aboveMD } = useCaseViewContext();\n\n return css`\n position: sticky;\n top: ${summaryExpanded ? 'var(--top-offset)' : 'var(--appshell-offset)'};\n width: 100%;\n background-color: ${theme.base.palette['primary-background']};\n z-index: ${theme.base['z-index'].popover};\n\n ${aboveMD &&\n summaryExpanded &&\n css`\n height: var(--case-view-height);\n `}\n `;\n});\n\nStyledSummary.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawer = styled.div(({ theme }) => {\n return css`\n min-width: 21.875rem;\n max-width: 31.25rem;\n width: calc((100vw - 31.25rem) / 10 + 21.875rem);\n background-color: ${theme.base.palette['primary-background']};\n height: var(--case-view-height);\n top: var(--top-offset);\n z-index: ${theme.base['z-index'].drawer - 1};\n `;\n});\n\nStyledCaseDrawer.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawerContent = styled.div(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['app-background']};\n padding: calc(2 * ${theme.base.spacing});\n height: 100%;\n overflow: auto;\n `;\n});\n\nStyledCaseDrawerContent.defaultProps = defaultThemeProp;\n\nexport const StyledPersistentUtility = styled.div(({ theme }) => {\n return css`\n min-width: ${theme.base['content-width'].sm};\n max-width: ${theme.base['content-width'].md};\n overflow: auto;\n position: sticky;\n z-index: 1;\n height: var(--case-view-height);\n top: var(--top-offset);\n `;\n});\n\nStyledPersistentUtility.defaultProps = defaultThemeProp;\n\nexport const ScrollStick = styled.div`\n position: sticky;\n top: 0;\n`;\n\nexport const StyledCaseView = styled.div(({ theme }) => {\n const { aboveMD } = useCaseViewContext();\n\n return css`\n --top-offset: calc(var(--appshell-offset, 0) + var(--summary-height));\n --case-view-height: calc(100vh - var(--top-offset));\n position: relative;\n min-height: var(--case-view-height);\n background-color: ${theme.base.palette['app-background']};\n\n ${aboveMD &&\n css`\n ${StyledUtilities}:last-child {\n margin-inline-end: calc(2 * ${theme.base.spacing});\n }\n `}\n `;\n});\n\nStyledCaseView.defaultProps = defaultThemeProp;\n"]}
|
|
1
|
+
{"version":3,"file":"CaseView.styles.js","sourceRoot":"","sources":["../../../src/components/CaseView/CaseView.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import styled, { css } from 'styled-components';\nimport { hideVisually, parseToHsl, readableColor, transparentize } from 'polished';\n\nimport {\n Button,\n calculateFontSize,\n defaultThemeProp,\n StyledBreadcrumbs,\n StyledButton,\n StyledFieldValue,\n StyledFieldValueList,\n StyledIcon,\n StyledPopover,\n StyledText,\n StyledTooltip,\n tryCatch,\n FontSize\n} from '@pega/cosmos-react-core';\nimport { StyledMenu } from '@pega/cosmos-react-core/lib/components/Menu/Menu.styles';\n\nimport { useCaseViewContext } from './CaseView.context';\n\nexport const StyledCaseSummaryFields = styled.div(({ theme }) => {\n const fontSizes = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n\n return css`\n padding: calc(2 * ${theme.base.spacing});\n\n > ${StyledFieldValueList}:first-child {\n grid-template-columns: 16ch auto;\n\n ${StyledFieldValue} {\n font-size: ${fontSizes[theme.components.text.h1['font-size'] as FontSize]};\n font-weight: ${theme.components.text.h1['font-weight']};\n }\n }\n `;\n});\n\nStyledCaseSummaryFields.defaultProps = defaultThemeProp;\n\nexport const StyledCaseHeader = styled.header(({ theme }) => {\n const color = tryCatch(() => readableColor(theme.base.palette['brand-primary']));\n\n return css`\n background-color: ${theme.base.palette['brand-primary']};\n color: ${color};\n padding: calc(2 * ${theme.base.spacing});\n position: relative;\n\n ${StyledMenu} {\n color: ${theme.base.palette['foreground-color']};\n z-index: ${theme.base['z-index'].popover + 1};\n }\n `;\n});\n\nStyledCaseHeader.defaultProps = defaultThemeProp;\n\nexport const StyledCaseIconWrap = styled.div(({ theme }) => {\n const spacing = theme.base.spacing;\n const borderRadius = theme.base['border-radius'];\n const backgroundColor = tryCatch(() => {\n const { lightness } = parseToHsl(theme.base.palette['brand-primary']);\n return lightness > 0.35 ? 'rgba(0, 0, 0, 0.2)' : 'rgba(255, 255, 255, 0.2)';\n });\n\n return css`\n background: ${backgroundColor};\n border-radius: calc(${borderRadius} / 2);\n width: calc(5 * ${spacing});\n height: calc(5 * ${spacing});\n ${StyledIcon} {\n font-size: calc(3 * ${spacing});\n margin: auto;\n }\n `;\n});\n\nStyledCaseIconWrap.defaultProps = defaultThemeProp;\n\nexport const StyledFollowIconWrap = styled.label`\n font-size: 1.25rem;\n input {\n ${hideVisually}\n }\n\n input:focus + svg {\n box-shadow: ${({ theme }) => theme.base.shadow['focus-inverted']};\n }\n`;\n\nStyledFollowIconWrap.defaultProps = defaultThemeProp;\n\nexport const StyledCaseHeaderText = styled.div(({ theme }) => {\n const color = readableColor(theme.base.palette['brand-primary']);\n const transparentColor = tryCatch(() => transparentize(0.2, color));\n const fontSize = calculateFontSize(theme.base['font-size'], theme.base['font-scale']);\n return css`\n word-break: break-word;\n\n ${StyledBreadcrumbs} {\n > a,\n > span,\n > button,\n > svg {\n color: ${transparentColor};\n font-size: ${fontSize.s};\n font-weight: normal;\n }\n\n > a,\n > button {\n &:focus {\n box-shadow: ${theme.base.shadow['focus-inverted']};\n }\n }\n\n ${StyledPopover}:not(${StyledTooltip}) {\n color: ${theme.base.palette['foreground-color']};\n }\n }\n\n > ${StyledText} > ${StyledButton} {\n color: ${color};\n }\n `;\n});\n\nStyledCaseHeaderText.defaultProps = defaultThemeProp;\n\nexport const StyledPromotedActions = styled.div(({ theme }) => {\n return css`\n border-bottom: 0.0625rem solid ${theme.base.palette['border-line']};\n `;\n});\n\nStyledPromotedActions.defaultProps = defaultThemeProp;\n\nexport const StyledCaseSummaryInfo = styled.div(() => {\n return css`\n overflow: auto;\n flex: 1;\n `;\n});\n\nStyledCaseSummaryInfo.defaultProps = defaultThemeProp;\n\nexport const StyledExpandCollapseButton = styled(Button)(({ theme }) => {\n const { summaryExpanded } = useCaseViewContext();\n\n return css`\n position: absolute;\n z-index: 1;\n bottom: 0;\n inset-inline-start: ${summaryExpanded ? 'calc(100% - 0.75rem)' : '0'};\n border-radius: ${summaryExpanded ? '1.5rem' : '0 1.5rem 1.5rem 0'};\n box-shadow: ${theme.base.shadow.low};\n border: none;\n opacity: 0;\n\n /* Disbales core Button transition causing button to slide on toggle. */\n transition: none;\n\n &:focus {\n opacity: 1;\n }\n\n ${StyledIcon} {\n width: 1.5rem;\n height: 1.5rem;\n transform: rotate(${summaryExpanded ? 0 : css`180deg`});\n }\n `;\n});\n\nStyledExpandCollapseButton.defaultProps = defaultThemeProp;\n\nexport const StyledCaseSummary = styled.div(() => {\n const { summaryExpanded, aboveMD, aboveLG } = useCaseViewContext();\n\n return css`\n position: relative;\n height: 100%;\n\n ${aboveMD &&\n css`\n ${summaryExpanded\n ? css`\n width: ${aboveLG ? css`25rem` : css`22rem`};\n\n &:focus-within,\n &:hover {\n &::after {\n content: '';\n position: absolute;\n top: 0;\n bottom: 0;\n inset-inline-start: 100%;\n width: 0.75rem;\n }\n\n ${StyledExpandCollapseButton} {\n opacity: 1;\n }\n }\n `\n : css`\n width: 100%;\n ${StyledExpandCollapseButton} {\n opacity: 1;\n }\n `}\n `}\n `;\n});\n\nStyledCaseSummary.defaultProps = defaultThemeProp;\n\nexport const StyledWorkArea = styled.div(({ theme }) => {\n const { summaryExpanded, aboveMD } = useCaseViewContext();\n\n return css`\n grid-area: work-area;\n padding: calc(2 * ${theme.base.spacing});\n\n ${aboveMD &&\n css`\n padding: calc(2 * ${theme.base.spacing}) 0;\n\n ${!summaryExpanded &&\n css`\n margin-inline-start: calc(2 * ${theme.base.spacing});\n `}\n `}\n `;\n});\n\nStyledWorkArea.defaultProps = defaultThemeProp;\n\nexport const StyledUtilToggle = styled.button(({ theme }) => {\n return css`\n align-self: flex-end;\n color: ${theme.base.palette['foreground-color']};\n margin-inline-end: 0.375rem;\n `;\n});\n\nStyledUtilToggle.defaultProps = defaultThemeProp;\n\nexport const StyledUtilities = styled.div(() => {\n const { utilitiesExpanded, aboveLG } = useCaseViewContext();\n\n return css`\n height: max-content;\n\n ${aboveLG &&\n utilitiesExpanded &&\n css`\n width: 25rem;\n `}\n `;\n});\n\nStyledUtilities.defaultProps = defaultThemeProp;\n\nexport const StyledSummary = styled.div(({ theme }) => {\n const { summaryExpanded, aboveMD } = useCaseViewContext();\n\n return css`\n position: sticky;\n top: ${summaryExpanded ? 'var(--top-offset)' : 'var(--appshell-offset)'};\n width: 100%;\n background-color: ${theme.base.palette['primary-background']};\n z-index: ${theme.base['z-index'].popover};\n\n ${aboveMD &&\n summaryExpanded &&\n css`\n height: var(--case-view-height);\n `}\n `;\n});\n\nStyledSummary.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawer = styled.div(({ theme }) => {\n return css`\n min-width: 21.875rem;\n max-width: 31.25rem;\n width: calc((100vw - 31.25rem) / 10 + 21.875rem);\n background-color: ${theme.base.palette['primary-background']};\n height: var(--case-view-height);\n top: var(--top-offset);\n z-index: ${theme.base['z-index'].drawer - 1};\n `;\n});\n\nStyledCaseDrawer.defaultProps = defaultThemeProp;\n\nexport const StyledCaseDrawerContent = styled.div(({ theme }) => {\n return css`\n background-color: ${theme.base.palette['app-background']};\n padding: calc(2 * ${theme.base.spacing});\n height: 100%;\n overflow: auto;\n `;\n});\n\nStyledCaseDrawerContent.defaultProps = defaultThemeProp;\n\nexport const StyledPersistentUtility = styled.div(({ theme }) => {\n return css`\n min-width: ${theme.base['content-width'].sm};\n max-width: ${theme.base['content-width'].md};\n overflow: auto;\n position: sticky;\n z-index: 1;\n height: var(--case-view-height);\n top: var(--top-offset);\n `;\n});\n\nStyledPersistentUtility.defaultProps = defaultThemeProp;\n\nexport const ScrollStick = styled.div`\n position: sticky;\n top: 0;\n`;\n\nexport const StyledCaseView = styled.div(({ theme }) => {\n const { aboveMD } = useCaseViewContext();\n\n return css`\n --top-offset: calc(var(--appshell-offset, 0) + var(--summary-height));\n --case-view-height: calc(100vh - var(--top-offset));\n position: relative;\n min-height: var(--case-view-height);\n background-color: ${theme.base.palette['app-background']};\n\n ${aboveMD &&\n css`\n ${StyledUtilities}:last-child {\n margin-inline-end: calc(2 * ${theme.base.spacing});\n }\n `}\n `;\n});\n\nStyledCaseView.defaultProps = defaultThemeProp;\n"]}
|
|
@@ -5,7 +5,7 @@ import { StyledDateTimeDisplay, StyledStep, StyledStepsContainer } from './Stage
|
|
|
5
5
|
registerIcon(checkIcon);
|
|
6
6
|
const StageGlimpse = ({ stage, actions }) => {
|
|
7
7
|
const t = useI18n();
|
|
8
|
-
return (_jsxs(_Fragment, { children: [_jsxs(Flex, { container: { justify: 'between', alignItems: 'start' }, children: [_jsxs("div", { children: [_jsx(Text, { variant: 'h2', children: stage.name }), stage.date ? (_jsx(StyledDateTimeDisplay, { value: stage.date, variant: 'relative', format: 'short' })) : (t('not_started'))] }), actions && actions.length > 0 && _jsx(Actions, { items: actions, iconOnly: true })] }), stage.steps && (_jsx(StyledStepsContainer, { children: stage.steps.map(({ id, name, completed }) => (_jsx(Flex, { as: StyledStep, container: { gap: 0.5 }, completed: completed, children: _jsx("div", { children: name }) }, id))) }))] }));
|
|
8
|
+
return (_jsxs(_Fragment, { children: [_jsxs(Flex, { container: { justify: 'between', alignItems: 'start' }, children: [_jsxs("div", { children: [_jsx(Text, { variant: 'h2', children: stage.name }), stage.date ? (_jsx(StyledDateTimeDisplay, { value: stage.date, variant: 'relative', format: 'short' })) : (_jsx(Text, { variant: 'secondary', children: t('not_started') }))] }), actions && actions.length > 0 && _jsx(Actions, { items: actions, iconOnly: true })] }), stage.steps && (_jsx(StyledStepsContainer, { children: stage.steps.map(({ id, name, completed }) => (_jsx(Flex, { as: StyledStep, container: { gap: 0.5 }, completed: completed, children: _jsx("div", { children: name }) }, id))) }))] }));
|
|
9
9
|
};
|
|
10
10
|
export default StageGlimpse;
|
|
11
11
|
//# sourceMappingURL=StageGlimpse.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"StageGlimpse.js","sourceRoot":"","sources":["../../../src/components/Stages/StageGlimpse.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAU,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAC7F,OAAO,KAAK,SAAS,MAAM,8DAA8D,CAAC;AAG1F,OAAO,EAAE,qBAAqB,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAE1F,YAAY,CAAC,SAAS,CAAC,CAAC;AAOxB,MAAM,YAAY,GAAyC,CAAC,EAC1D,KAAK,EACL,OAAO,EACW,EAAE,EAAE;IACtB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,8BACE,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,aAC1D,0BACE,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,KAAK,CAAC,IAAI,GAAQ,EACrC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CACZ,KAAC,qBAAqB,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAC,UAAU,EAAC,MAAM,EAAC,OAAO,GAAG,CAC/E,CAAC,CAAC,CAAC,CACF,CAAC,CAAC,aAAa,CAAC,
|
|
1
|
+
{"version":3,"file":"StageGlimpse.js","sourceRoot":"","sources":["../../../src/components/Stages/StageGlimpse.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAU,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,yBAAyB,CAAC;AAC7F,OAAO,KAAK,SAAS,MAAM,8DAA8D,CAAC;AAG1F,OAAO,EAAE,qBAAqB,EAAE,UAAU,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAE1F,YAAY,CAAC,SAAS,CAAC,CAAC;AAOxB,MAAM,YAAY,GAAyC,CAAC,EAC1D,KAAK,EACL,OAAO,EACW,EAAE,EAAE;IACtB,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,OAAO,CACL,8BACE,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,OAAO,EAAE,aAC1D,0BACE,KAAC,IAAI,IAAC,OAAO,EAAC,IAAI,YAAE,KAAK,CAAC,IAAI,GAAQ,EACrC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,CACZ,KAAC,qBAAqB,IAAC,KAAK,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,EAAC,UAAU,EAAC,MAAM,EAAC,OAAO,GAAG,CAC/E,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IAAC,OAAO,EAAC,WAAW,YAAE,CAAC,CAAC,aAAa,CAAC,GAAQ,CACpD,IACG,EACL,OAAO,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,KAAC,OAAO,IAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,SAAG,IACjE,EACN,KAAK,CAAC,KAAK,IAAI,CACd,KAAC,oBAAoB,cAClB,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,CAC5C,KAAC,IAAI,IAAC,EAAE,EAAE,UAAU,EAAE,SAAS,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,EAAW,SAAS,EAAE,SAAS,YAC1E,wBAAM,IAAI,GAAO,IADiC,EAAE,CAE/C,CACR,CAAC,GACmB,CACxB,IACA,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC","sourcesContent":["import { FunctionComponent } from 'react';\n\nimport { Action, Actions, Flex, registerIcon, Text, useI18n } from '@pega/cosmos-react-core';\nimport * as checkIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/check.icon';\n\nimport { StageProps } from './Stages.types';\nimport { StyledDateTimeDisplay, StyledStep, StyledStepsContainer } from './Stages.styles';\n\nregisterIcon(checkIcon);\n\nexport interface StageGlimpseProps {\n stage: StageProps;\n actions?: Action[];\n}\n\nconst StageGlimpse: FunctionComponent<StageGlimpseProps> = ({\n stage,\n actions\n}: StageGlimpseProps) => {\n const t = useI18n();\n return (\n <>\n <Flex container={{ justify: 'between', alignItems: 'start' }}>\n <div>\n <Text variant='h2'>{stage.name}</Text>\n {stage.date ? (\n <StyledDateTimeDisplay value={stage.date} variant='relative' format='short' />\n ) : (\n <Text variant='secondary'>{t('not_started')}</Text>\n )}\n </div>\n {actions && actions.length > 0 && <Actions items={actions} iconOnly />}\n </Flex>\n {stage.steps && (\n <StyledStepsContainer>\n {stage.steps.map(({ id, name, completed }) => (\n <Flex as={StyledStep} container={{ gap: 0.5 }} key={id} completed={completed}>\n <div>{name}</div>\n </Flex>\n ))}\n </StyledStepsContainer>\n )}\n </>\n );\n};\n\nexport default StageGlimpse;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-work",
|
|
3
|
-
"version": "3.0.0-dev.23.
|
|
3
|
+
"version": "3.0.0-dev.23.1",
|
|
4
4
|
"author": "Pegasystems",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"repository": {
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"build": "tsc -b"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
|
-
"@pega/cosmos-react-core": "3.0.0-dev.23.
|
|
23
|
+
"@pega/cosmos-react-core": "3.0.0-dev.23.1",
|
|
24
24
|
"@types/react": "^16.14.24 || ^17.0.38",
|
|
25
25
|
"@types/react-dom": "^16.9.14 || ^17.0.11",
|
|
26
26
|
"@types/styled-components": "^5.1.7",
|