@pega/cosmos-react-work 9.15.0 → 9.15.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/CasePreview/CasePreview.d.ts.map +1 -1
- package/lib/components/CasePreview/CasePreview.js +4 -9
- package/lib/components/CasePreview/CasePreview.js.map +1 -1
- package/lib/components/Shortcuts/Shortcuts.d.ts.map +1 -1
- package/lib/components/Shortcuts/Shortcuts.js +2 -2
- package/lib/components/Shortcuts/Shortcuts.js.map +1 -1
- package/lib/components/Shortcuts/Shortcuts.styles.d.ts +3 -1
- package/lib/components/Shortcuts/Shortcuts.styles.d.ts.map +1 -1
- package/lib/components/Shortcuts/Shortcuts.styles.js +20 -18
- package/lib/components/Shortcuts/Shortcuts.styles.js.map +1 -1
- package/package.json +3 -3
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CasePreview.d.ts","sourceRoot":"","sources":["../../../src/components/CasePreview/CasePreview.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAelD,OAAO,KAAK,EACV,+BAA+B,EAC/B,SAAS,EACT,UAAU,EACV,cAAc,EACd,eAAe,EAEhB,MAAM,yBAAyB,CAAC;AAIjC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAQvE,MAAM,WAAW,gBACf,SAAQ,IAAI,CACR,aAAa,EACX,QAAQ,GACR,UAAU,GACV,SAAS,GACT,YAAY,GACZ,aAAa,GACb,MAAM,GACN,OAAO,GACP,UAAU,GACV,kBAAkB,GAClB,SAAS,GACT,iBAAiB,GACjB,QAAQ,GACR,eAAe,GACf,MAAM,GACN,YAAY,GACZ,QAAQ,GACR,OAAO,GACP,SAAS,GACT,WAAW,GACX,uBAAuB,CAC1B,EACD,cAAc,EACd,UAAU,EACV,SAAS;IACX,4GAA4G;IAC5G,QAAQ,CAAC,EAAE,oBAAoB,CAAC,UAAU,CAAC,CAAC;IAC5C,iDAAiD;IACjD,IAAI,EAAE,OAAO,CAAC;IACd,iEAAiE;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,2EAA2E;IAC3E,YAAY,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IAC1C,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,iDAAiD;IACjD,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;;;;
|
|
1
|
+
{"version":3,"file":"CasePreview.d.ts","sourceRoot":"","sources":["../../../src/components/CasePreview/CasePreview.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAmB,GAAG,EAAE,MAAM,OAAO,CAAC;AAelD,OAAO,KAAK,EACV,+BAA+B,EAC/B,SAAS,EACT,UAAU,EACV,cAAc,EACd,eAAe,EAEhB,MAAM,yBAAyB,CAAC;AAIjC,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AACjD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAQvE,MAAM,WAAW,gBACf,SAAQ,IAAI,CACR,aAAa,EACX,QAAQ,GACR,UAAU,GACV,SAAS,GACT,YAAY,GACZ,aAAa,GACb,MAAM,GACN,OAAO,GACP,UAAU,GACV,kBAAkB,GAClB,SAAS,GACT,iBAAiB,GACjB,QAAQ,GACR,eAAe,GACf,MAAM,GACN,YAAY,GACZ,QAAQ,GACR,OAAO,GACP,SAAS,GACT,WAAW,GACX,uBAAuB,CAC1B,EACD,cAAc,EACd,UAAU,EACV,SAAS;IACX,4GAA4G;IAC5G,QAAQ,CAAC,EAAE,oBAAoB,CAAC,UAAU,CAAC,CAAC;IAC5C,iDAAiD;IACjD,IAAI,EAAE,OAAO,CAAC;IACd,iEAAiE;IACjE,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+DAA+D;IAC/D,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,2EAA2E;IAC3E,YAAY,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;IAC1C,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,iDAAiD;IACjD,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,gDAAgD;IAChD,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,6EAA6E;IAC7E,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,yCAAyC;IACzC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;;;;AAwOD,wBAA+D"}
|
|
@@ -20,25 +20,20 @@ const StyledCasePreviewDrawer = styled(StyledPreviewDrawer)(({ theme }) => {
|
|
|
20
20
|
}
|
|
21
21
|
|
|
22
22
|
${StyledCaseView} {
|
|
23
|
-
height: calc(100vh - ${theme.base.spacing} - ${theme.base['hit-area']['mouse-min']});
|
|
24
23
|
z-index: 1;
|
|
25
24
|
|
|
26
|
-
@media (pointer: coarse) {
|
|
27
|
-
height: calc(100vh - ${theme.base.spacing} - ${theme.base['hit-area']['finger-min']});
|
|
28
|
-
}
|
|
29
|
-
|
|
30
25
|
${StyledSummaryRegion} {
|
|
31
26
|
position: relative;
|
|
32
27
|
top: 0;
|
|
28
|
+
|
|
29
|
+
@media (min-height: ${theme.base.breakpoints.sm}) {
|
|
30
|
+
position: sticky;
|
|
31
|
+
}
|
|
33
32
|
}
|
|
34
33
|
}
|
|
35
34
|
|
|
36
35
|
${StyledCaseViewContent} {
|
|
37
36
|
overflow-y: auto;
|
|
38
|
-
|
|
39
|
-
& > :last-child {
|
|
40
|
-
padding-bottom: calc(2 * ${theme.base.spacing});
|
|
41
|
-
}
|
|
42
37
|
}
|
|
43
38
|
|
|
44
39
|
${StyledGenAICoachContainer} {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CasePreview.js","sourceRoot":"","sources":["../../../src/components/CasePreview/CasePreview.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAEhE,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,YAAY,EACZ,gBAAgB,EAChB,aAAa,EACb,OAAO,EACP,UAAU,EACV,WAAW,EACX,UAAU,EACV,kBAAkB,EAClB,mBAAmB,EACnB,iBAAiB,EAClB,MAAM,yBAAyB,CAAC;AASjC,OAAO,KAAK,SAAS,MAAM,8DAA8D,CAAC;AAE1F,OAAO,QAAQ,EAAE,EAAE,cAAc,EAAE,qBAAqB,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAGnG,OAAO,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;AAC5E,OAAO,EAAE,wBAAwB,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAC;AAEnG,OAAO,EAAE,qBAAqB,EAAE,MAAM,wBAAwB,CAAC;AAE/D,YAAY,CAAC,SAAS,CAAC,CAAC;AAqDxB,MAAM,uBAAuB,GAAG,MAAM,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACxE,OAAO,GAAG,CAAA;MACN,wBAAwB;;;;MAIxB,0BAA0B;;;;;MAK1B,cAAc;6BACS,KAAK,CAAC,IAAI,CAAC,OAAO,MAAM,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,WAAW,CAAC;;;;+BAIzD,KAAK,CAAC,IAAI,CAAC,OAAO,MAAM,KAAK,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,YAAY,CAAC;;;QAGnF,mBAAmB;;;;;;MAMrB,qBAAqB;;;;mCAIQ,KAAK,CAAC,IAAI,CAAC,OAAO;;;;MAI/C,yBAAyB;;;;GAI5B,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AA4BxD,MAAM,kBAAkB,GAAG,CAAC,EAC1B,KAAK,EACL,YAAY,EACZ,MAAM,EACN,QAAQ,EACR,OAAO,EACP,UAAU,EACV,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,aAAa,EACb,IAAI,EACJ,MAAM,EACN,KAAK,EACL,UAAU,EACV,SAAS,EACT,qBAAqB,EACrB,OAAO,EACP,OAAO,EACP,MAAM,EACkB,EAAE,EAAE;IAC5B,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,IAAI,KAAK,EAAE,CAAC;QACV,OAAO,KAAC,UAAU,IAAC,OAAO,EAAE,CAAC,CAAC,eAAe,CAAC,EAAE,OAAO,EAAE,YAAY,GAAI,CAAC;IAC5E,CAAC;IAED,OAAO,CACL,KAAC,QAAQ,IACP,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,gBAAgB,EAAE,gBAAgB,EAClC,aAAa,EAAE,aAAa,EAC5B,IAAI,EAAE,IAAI,EACV,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,SAAS,EAAE,SAAS,EACpB,qBAAqB,EAAE,qBAAqB,EAC5C,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,SAAS,SACT,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,WAAW,GAAsD,UAAU,CAC/E,SAAS,WAAW,CAAC,KAAwC,EAAE,GAA4B;IACzF,MAAM,EACJ,MAAM,EACN,IAAI,EAAE,QAAQ,EACd,QAAQ,EACR,KAAK,EACL,YAAY,EACZ,MAAM,EACN,QAAQ,EACR,OAAO,EACP,UAAU,EACV,QAAQ,EACR,WAAW,EACX,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,aAAa,EACb,IAAI,EACJ,MAAM,EACN,KAAK,EACL,UAAU,EACV,SAAS,EACT,qBAAqB,EACrB,OAAO,EACP,OAAO,EACP,MAAM,EACN,YAAY,EACZ,WAAW,EACX,aAAa,EACb,YAAY,EACZ,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,OAAO,GAAG,UAAU,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAC;IAE1D,MAAM,EAAE,aAAa,EAAE,GAAG,iBAAiB,EAAE,CAAC;IAC9C,MAAM,iBAAiB,GAAG,MAAM,CAA6B,SAAS,CAAC,CAAC;IACxE,MAAM,UAAU,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IAC3C,MAAM,cAAc,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IAE3C,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC;IAE3C,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,CAAC,QAAQ,CAAC,CAAC;IACpB,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,IAAI,IAAI,cAAc,EAAE,CAAC;YAC3B,MAAM,YAAY,GAAG;gBACnB,KAAK;gBACL,YAAY;gBACZ,MAAM;gBACN,QAAQ;gBACR,OAAO;gBACP,UAAU;gBACV,QAAQ;gBACR,WAAW;gBACX,IAAI;gBACJ,KAAK;gBACL,QAAQ;gBACR,gBAAgB;gBAChB,aAAa;gBACb,IAAI;gBACJ,MAAM;gBACN,KAAK;gBACL,UAAU;gBACV,SAAS;gBACT,qBAAqB;gBACrB,OAAO;gBACP,OAAO;gBACP,MAAM;aACP,CAAC;YAEF,MAAM,QAAQ,GAAG;gBACf,YAAY,EAAE;oBACZ,MAAM,EAAE,OAAO,CAAC,IAAI;oBACpB,YAAY,EAAE,OAAO,OAAO,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,EAAE,IAAI;oBACnE,YAAY;oBACZ,WAAW;oBACX,aAAa;oBACb,YAAY,EAAE,GAAG,EAAE;wBACjB,YAAY,EAAE,EAAE,CAAC;wBACjB,OAAO,CAAC,KAAK,CAAC,CAAC;wBACf,IAAI,iBAAiB,CAAC,OAAO,EAAE,CAAC;4BAC9B,iBAAiB,CAAC,OAAO,CAAC,cAAc,EAAE,CAAC;4BAC3C,iBAAiB,CAAC,OAAO,GAAG,SAAS,CAAC;wBACxC,CAAC;oBACH,CAAC;oBACD,EAAE,EAAE,uBAAuB;oBAC3B,GAAG,EAAE,UAAU;oBACf,QAAQ;oBACR,GAAG,SAAS;iBACb;aACF,CAAC;YACF,IAAI,iBAAiB,CAAC,OAAO,EAAE,CAAC;gBAC9B,iBAAiB,CAAC,OAAO,CAAC,aAAa,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAC;YAClE,CAAC;iBAAM,CAAC;gBACN,iBAAiB,CAAC,OAAO,GAAG,aAAa,CAAC,kBAAkB,EAAE,YAAY,EAAE,QAAQ,CAAC,CAAC;YACxF,CAAC;QACH,CAAC;aAAM,IAAI,CAAC,IAAI,EAAE,CAAC;YACjB,+DAA+D;YAC/D,iBAAiB,CAAC,OAAO,GAAG,SAAS,CAAC;QACxC,CAAC;IACH,CAAC,EAAE,CAAC,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,qBAAqB,EAAE,cAAc,CAAC,CAAC,CAAC;IAE7F,OAAO,IAAI,CAAC;AACd,CAAC,CACF,CAAC;AAEF,eAAe,WAAW,CAAC,WAAW,EAAE,qBAAqB,CAAC,CAAC","sourcesContent":["import { forwardRef, useEffect, useState, useRef } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n registerIcon,\n defaultThemeProp,\n useBreakpoint,\n useI18n,\n useTestIds,\n withTestIds,\n ErrorState,\n useConsolidatedRef,\n StyledPreviewDrawer,\n usePreviewManager\n} from '@pega/cosmos-react-core';\nimport type {\n ForwardRefForwardPropsComponent,\n BaseProps,\n TestIdProp,\n NoChildrenProp,\n ErrorStateProps,\n PreviewMethods\n} from '@pega/cosmos-react-core';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\n\nimport CaseView, { StyledCaseView, StyledCaseViewContent, StyledSummaryRegion } from '../CaseView';\nimport type { CaseViewProps } from '../CaseView';\nimport type { CaseViewContextValue } from '../CaseView/CaseView.types';\nimport { StyledGenAICoachContainer } from '../GenAICoach/GenAICoach.styles';\nimport { StyledSummaryPrimaryList, StyledSummarySecondaryList } from '../CaseView/CaseView.styles';\n\nimport { getCasePreviewTestIds } from './CasePreview.test-ids';\n\nregisterIcon(timesIcon);\n\nexport interface CasePreviewProps\n extends Pick<\n CaseViewProps,\n | 'caseId'\n | 'caseType'\n | 'heading'\n | 'subheading'\n | 'parentCases'\n | 'icon'\n | 'color'\n | 'followed'\n | 'onFollowedChange'\n | 'actions'\n | 'promotedActions'\n | 'onEdit'\n | 'summaryFields'\n | 'tabs'\n | 'tabContent'\n | 'stages'\n | 'tasks'\n | 'banners'\n | 'utilities'\n | 'utilitiesSummaryItems'\n >,\n NoChildrenProp,\n TestIdProp,\n BaseProps {\n /** A set of props including an href that will be forwarded to the case preview's heading and subheading. */\n caseLink?: CaseViewContextValue['caseLink'];\n /** If true, the Case Preview will be visible. */\n open: boolean;\n /** If true, the Case Preview will render in a progress state. */\n progress?: boolean;\n /** If true, the Case Preview will render in an error state. */\n error?: boolean;\n /** Callback fired when \"Try again\" button is clicked in an error state. */\n onErrorRetry?: ErrorStateProps['onRetry'];\n /** Callback fired before Case Preview opens. */\n onBeforeOpen?: () => void;\n /** Callback fired after Case Preview opens. */\n onAfterOpen?: () => void;\n /** Callback fired before Case Preview closes. */\n onBeforeClose?: () => void;\n /** Callback fired after Case Preview closes. */\n onAfterClose?: () => void;\n /** Callback fired when a click action occurs outside of the Case Preview. */\n onOuterClick?: () => void;\n /** Reference to the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledCasePreviewDrawer = styled(StyledPreviewDrawer)(({ theme }) => {\n return css`\n ${StyledSummaryPrimaryList} {\n padding: unset;\n }\n\n ${StyledSummarySecondaryList} {\n padding-block-start: unset;\n padding-inline: unset;\n }\n\n ${StyledCaseView} {\n height: calc(100vh - ${theme.base.spacing} - ${theme.base['hit-area']['mouse-min']});\n z-index: 1;\n\n @media (pointer: coarse) {\n height: calc(100vh - ${theme.base.spacing} - ${theme.base['hit-area']['finger-min']});\n }\n\n ${StyledSummaryRegion} {\n position: relative;\n top: 0;\n }\n }\n\n ${StyledCaseViewContent} {\n overflow-y: auto;\n\n & > :last-child {\n padding-bottom: calc(2 * ${theme.base.spacing});\n }\n }\n\n ${StyledGenAICoachContainer} {\n width: unset;\n min-width: unset;\n }\n `;\n});\n\nStyledCasePreviewDrawer.defaultProps = defaultThemeProp;\n\ntype CasePreviewContentProps = Pick<\n CasePreviewProps,\n | 'error'\n | 'onErrorRetry'\n | 'caseId'\n | 'caseType'\n | 'heading'\n | 'subheading'\n | 'caseLink'\n | 'parentCases'\n | 'icon'\n | 'color'\n | 'followed'\n | 'onFollowedChange'\n | 'summaryFields'\n | 'tabs'\n | 'tabContent'\n | 'stages'\n | 'tasks'\n | 'banners'\n | 'utilities'\n | 'utilitiesSummaryItems'\n | 'actions'\n | 'onEdit'\n>;\n\nconst CasePreviewContent = ({\n error,\n onErrorRetry,\n caseId,\n caseType,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n color,\n followed,\n onFollowedChange,\n summaryFields,\n tabs,\n stages,\n tasks,\n tabContent,\n utilities,\n utilitiesSummaryItems,\n actions,\n banners,\n onEdit\n}: CasePreviewContentProps) => {\n const t = useI18n();\n\n if (error) {\n return <ErrorState message={t('preview_error')} onRetry={onErrorRetry} />;\n }\n\n return (\n <CaseView\n caseId={caseId}\n caseType={caseType}\n parentCases={parentCases}\n heading={heading}\n subheading={subheading}\n caseLink={caseLink}\n icon={icon}\n color={color}\n followed={followed}\n onFollowedChange={onFollowedChange}\n summaryFields={summaryFields}\n tabs={tabs}\n stages={stages}\n tasks={tasks}\n tabContent={tabContent}\n utilities={utilities}\n utilitiesSummaryItems={utilitiesSummaryItems}\n actions={actions}\n banners={banners}\n onEdit={onEdit}\n isPreview\n />\n );\n};\n\nconst CasePreview: ForwardRefForwardPropsComponent<CasePreviewProps> = forwardRef(\n function CasePreview(props: PropsWithoutRef<CasePreviewProps>, ref: CasePreviewProps['ref']) {\n const {\n testId,\n open: openProp,\n progress,\n error,\n onErrorRetry,\n caseId,\n caseType,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n color,\n followed,\n onFollowedChange,\n summaryFields,\n tabs,\n stages,\n tasks,\n tabContent,\n utilities,\n utilitiesSummaryItems,\n actions,\n banners,\n onEdit,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose,\n ...restProps\n } = props;\n const testIds = useTestIds(testId, getCasePreviewTestIds);\n\n const { createPreview } = usePreviewManager();\n const previewMethodsRef = useRef<PreviewMethods | undefined>(undefined);\n const previewRef = useConsolidatedRef(ref);\n const isSmallOrAbove = useBreakpoint('sm');\n\n const [open, setOpen] = useState(openProp);\n\n useEffect(() => {\n setOpen(openProp);\n }, [openProp]);\n\n useEffect(() => {\n if (open && isSmallOrAbove) {\n const contentProps = {\n error,\n onErrorRetry,\n caseId,\n caseType,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n color,\n followed,\n onFollowedChange,\n summaryFields,\n tabs,\n stages,\n tasks,\n tabContent,\n utilities,\n utilitiesSummaryItems,\n actions,\n banners,\n onEdit\n };\n\n const metadata = {\n previewProps: {\n testId: testIds.root,\n previewLabel: typeof heading === 'string' ? heading : heading?.text,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose: () => {\n onAfterClose?.();\n setOpen(false);\n if (previewMethodsRef.current) {\n previewMethodsRef.current.unmountPreview();\n previewMethodsRef.current = undefined;\n }\n },\n as: StyledCasePreviewDrawer,\n ref: previewRef,\n progress,\n ...restProps\n }\n };\n if (previewMethodsRef.current) {\n previewMethodsRef.current.updatePreview(contentProps, metadata);\n } else {\n previewMethodsRef.current = createPreview(CasePreviewContent, contentProps, metadata);\n }\n } else if (!open) {\n // This branch is needed for controlled component via open prop\n previewMethodsRef.current = undefined;\n }\n }, [open, progress, error, tabs, banners, utilities, utilitiesSummaryItems, isSmallOrAbove]);\n\n return null;\n }\n);\n\nexport default withTestIds(CasePreview, getCasePreviewTestIds);\n"]}
|
|
1
|
+
{"version":3,"file":"CasePreview.js","sourceRoot":"","sources":["../../../src/components/CasePreview/CasePreview.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, useEffect, useState, useRef } from 'react';\nimport type { PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n registerIcon,\n defaultThemeProp,\n useBreakpoint,\n useI18n,\n useTestIds,\n withTestIds,\n ErrorState,\n useConsolidatedRef,\n StyledPreviewDrawer,\n usePreviewManager\n} from '@pega/cosmos-react-core';\nimport type {\n ForwardRefForwardPropsComponent,\n BaseProps,\n TestIdProp,\n NoChildrenProp,\n ErrorStateProps,\n PreviewMethods\n} from '@pega/cosmos-react-core';\nimport * as timesIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/times.icon';\n\nimport CaseView, { StyledCaseView, StyledCaseViewContent, StyledSummaryRegion } from '../CaseView';\nimport type { CaseViewProps } from '../CaseView';\nimport type { CaseViewContextValue } from '../CaseView/CaseView.types';\nimport { StyledGenAICoachContainer } from '../GenAICoach/GenAICoach.styles';\nimport { StyledSummaryPrimaryList, StyledSummarySecondaryList } from '../CaseView/CaseView.styles';\n\nimport { getCasePreviewTestIds } from './CasePreview.test-ids';\n\nregisterIcon(timesIcon);\n\nexport interface CasePreviewProps\n extends Pick<\n CaseViewProps,\n | 'caseId'\n | 'caseType'\n | 'heading'\n | 'subheading'\n | 'parentCases'\n | 'icon'\n | 'color'\n | 'followed'\n | 'onFollowedChange'\n | 'actions'\n | 'promotedActions'\n | 'onEdit'\n | 'summaryFields'\n | 'tabs'\n | 'tabContent'\n | 'stages'\n | 'tasks'\n | 'banners'\n | 'utilities'\n | 'utilitiesSummaryItems'\n >,\n NoChildrenProp,\n TestIdProp,\n BaseProps {\n /** A set of props including an href that will be forwarded to the case preview's heading and subheading. */\n caseLink?: CaseViewContextValue['caseLink'];\n /** If true, the Case Preview will be visible. */\n open: boolean;\n /** If true, the Case Preview will render in a progress state. */\n progress?: boolean;\n /** If true, the Case Preview will render in an error state. */\n error?: boolean;\n /** Callback fired when \"Try again\" button is clicked in an error state. */\n onErrorRetry?: ErrorStateProps['onRetry'];\n /** Callback fired before Case Preview opens. */\n onBeforeOpen?: () => void;\n /** Callback fired after Case Preview opens. */\n onAfterOpen?: () => void;\n /** Callback fired before Case Preview closes. */\n onBeforeClose?: () => void;\n /** Callback fired after Case Preview closes. */\n onAfterClose?: () => void;\n /** Callback fired when a click action occurs outside of the Case Preview. */\n onOuterClick?: () => void;\n /** Reference to the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\nconst StyledCasePreviewDrawer = styled(StyledPreviewDrawer)(({ theme }) => {\n return css`\n ${StyledSummaryPrimaryList} {\n padding: unset;\n }\n\n ${StyledSummarySecondaryList} {\n padding-block-start: unset;\n padding-inline: unset;\n }\n\n ${StyledCaseView} {\n z-index: 1;\n\n ${StyledSummaryRegion} {\n position: relative;\n top: 0;\n\n @media (min-height: ${theme.base.breakpoints.sm}) {\n position: sticky;\n }\n }\n }\n\n ${StyledCaseViewContent} {\n overflow-y: auto;\n }\n\n ${StyledGenAICoachContainer} {\n width: unset;\n min-width: unset;\n }\n `;\n});\n\nStyledCasePreviewDrawer.defaultProps = defaultThemeProp;\n\ntype CasePreviewContentProps = Pick<\n CasePreviewProps,\n | 'error'\n | 'onErrorRetry'\n | 'caseId'\n | 'caseType'\n | 'heading'\n | 'subheading'\n | 'caseLink'\n | 'parentCases'\n | 'icon'\n | 'color'\n | 'followed'\n | 'onFollowedChange'\n | 'summaryFields'\n | 'tabs'\n | 'tabContent'\n | 'stages'\n | 'tasks'\n | 'banners'\n | 'utilities'\n | 'utilitiesSummaryItems'\n | 'actions'\n | 'onEdit'\n>;\n\nconst CasePreviewContent = ({\n error,\n onErrorRetry,\n caseId,\n caseType,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n color,\n followed,\n onFollowedChange,\n summaryFields,\n tabs,\n stages,\n tasks,\n tabContent,\n utilities,\n utilitiesSummaryItems,\n actions,\n banners,\n onEdit\n}: CasePreviewContentProps) => {\n const t = useI18n();\n\n if (error) {\n return <ErrorState message={t('preview_error')} onRetry={onErrorRetry} />;\n }\n\n return (\n <CaseView\n caseId={caseId}\n caseType={caseType}\n parentCases={parentCases}\n heading={heading}\n subheading={subheading}\n caseLink={caseLink}\n icon={icon}\n color={color}\n followed={followed}\n onFollowedChange={onFollowedChange}\n summaryFields={summaryFields}\n tabs={tabs}\n stages={stages}\n tasks={tasks}\n tabContent={tabContent}\n utilities={utilities}\n utilitiesSummaryItems={utilitiesSummaryItems}\n actions={actions}\n banners={banners}\n onEdit={onEdit}\n isPreview\n />\n );\n};\n\nconst CasePreview: ForwardRefForwardPropsComponent<CasePreviewProps> = forwardRef(\n function CasePreview(props: PropsWithoutRef<CasePreviewProps>, ref: CasePreviewProps['ref']) {\n const {\n testId,\n open: openProp,\n progress,\n error,\n onErrorRetry,\n caseId,\n caseType,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n color,\n followed,\n onFollowedChange,\n summaryFields,\n tabs,\n stages,\n tasks,\n tabContent,\n utilities,\n utilitiesSummaryItems,\n actions,\n banners,\n onEdit,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose,\n ...restProps\n } = props;\n const testIds = useTestIds(testId, getCasePreviewTestIds);\n\n const { createPreview } = usePreviewManager();\n const previewMethodsRef = useRef<PreviewMethods | undefined>(undefined);\n const previewRef = useConsolidatedRef(ref);\n const isSmallOrAbove = useBreakpoint('sm');\n\n const [open, setOpen] = useState(openProp);\n\n useEffect(() => {\n setOpen(openProp);\n }, [openProp]);\n\n useEffect(() => {\n if (open && isSmallOrAbove) {\n const contentProps = {\n error,\n onErrorRetry,\n caseId,\n caseType,\n heading,\n subheading,\n caseLink,\n parentCases,\n icon,\n color,\n followed,\n onFollowedChange,\n summaryFields,\n tabs,\n stages,\n tasks,\n tabContent,\n utilities,\n utilitiesSummaryItems,\n actions,\n banners,\n onEdit\n };\n\n const metadata = {\n previewProps: {\n testId: testIds.root,\n previewLabel: typeof heading === 'string' ? heading : heading?.text,\n onBeforeOpen,\n onAfterOpen,\n onBeforeClose,\n onAfterClose: () => {\n onAfterClose?.();\n setOpen(false);\n if (previewMethodsRef.current) {\n previewMethodsRef.current.unmountPreview();\n previewMethodsRef.current = undefined;\n }\n },\n as: StyledCasePreviewDrawer,\n ref: previewRef,\n progress,\n ...restProps\n }\n };\n if (previewMethodsRef.current) {\n previewMethodsRef.current.updatePreview(contentProps, metadata);\n } else {\n previewMethodsRef.current = createPreview(CasePreviewContent, contentProps, metadata);\n }\n } else if (!open) {\n // This branch is needed for controlled component via open prop\n previewMethodsRef.current = undefined;\n }\n }, [open, progress, error, tabs, banners, utilities, utilitiesSummaryItems, isSmallOrAbove]);\n\n return null;\n }\n);\n\nexport default withTestIds(CasePreview, getCasePreviewTestIds);\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shortcuts.d.ts","sourceRoot":"","sources":["../../../src/components/Shortcuts/Shortcuts.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAa,eAAe,EAAE,MAAM,OAAO,CAAC;AAuBxD,OAAO,KAAK,EAAE,cAAc,EAAgB,MAAM,mBAAmB,CAAC;;;;
|
|
1
|
+
{"version":3,"file":"Shortcuts.d.ts","sourceRoot":"","sources":["../../../src/components/Shortcuts/Shortcuts.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAa,eAAe,EAAE,MAAM,OAAO,CAAC;AAuBxD,OAAO,KAAK,EAAE,cAAc,EAAgB,MAAM,mBAAmB,CAAC;;;;AA8NtE,wBAA2D"}
|
|
@@ -46,10 +46,10 @@ const Shortcuts = forwardRef(function Shortcuts({ heading, items = [], categorie
|
|
|
46
46
|
const withCardShell = (content) => (_jsxs(Card, { ...restProps, "data-testid": testIds.root, ref: ref, children: [_jsx(CardHeader, { children: _jsx(Text, { variant: 'h2', children: heading ?? t('shortcuts') }) }), _jsx(CardContent, { children: content })] }));
|
|
47
47
|
if (categories) {
|
|
48
48
|
const visibleCategories = categories.filter(cat => cat.items.length > 0);
|
|
49
|
-
const categorySections = (_jsx(StyledShortcutsCategoriesContainer, { ref: categoriesContainerRef, children: visibleCategories.map(cat => (_jsxs(Flex, { container: { direction: 'column' }, "aria-labelledby": `cat-${cat.id}`, "data-testid": testIds.categorySection, as: 'section', children: [_jsx(StyledShortcutsCategoryHeading, { id: `cat-${cat.id}`, "data-testid": testIds.categoryHeading, variant: 'h3', children: cat.label }), _jsx(StyledShortcutsCardsContainer, { role: 'list', "aria-label": cat.label, children: cat.items.map(item => (_jsx(CardItem, { item: item, variant: variant }, item.id))) })] }, cat.id))) }));
|
|
49
|
+
const categorySections = (_jsx(StyledShortcutsCategoriesContainer, { ref: categoriesContainerRef, children: visibleCategories.map(cat => (_jsxs(Flex, { container: { direction: 'column' }, "aria-labelledby": `cat-${cat.id}`, "data-testid": testIds.categorySection, as: 'section', children: [_jsx(StyledShortcutsCategoryHeading, { id: `cat-${cat.id}`, "data-testid": testIds.categoryHeading, variant: 'h3', children: cat.label }), _jsx(StyledShortcutsCardsContainer, { role: 'list', "aria-label": cat.label, itemCount: cat.items.length, children: cat.items.map(item => (_jsx(CardItem, { item: item, variant: variant }, item.id))) })] }, cat.id))) }));
|
|
50
50
|
return withCardShell(visibleCategories.length === 0 ? emptyState : categorySections);
|
|
51
51
|
}
|
|
52
|
-
const cardGrid = (_jsx(StyledShortcutsCardsWrapper, { children: _jsx(StyledShortcutsCardsContainer, { ref: flatListRef, role: 'list', "data-testid": testIds.list, "aria-label": heading ?? t('shortcuts'), children: items.map(item => (_jsx(CardItem, { item: item, variant: variant }, item.id))) }) }));
|
|
52
|
+
const cardGrid = (_jsx(StyledShortcutsCardsWrapper, { children: _jsx(StyledShortcutsCardsContainer, { ref: flatListRef, role: 'list', "data-testid": testIds.list, "aria-label": heading ?? t('shortcuts'), itemCount: items.length, children: items.map(item => (_jsx(CardItem, { item: item, variant: variant }, item.id))) }) }));
|
|
53
53
|
if (!showHeader) {
|
|
54
54
|
if (items.length === 0)
|
|
55
55
|
return null;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shortcuts.js","sourceRoot":"","sources":["../../../src/components/Shortcuts/Shortcuts.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, forwardRef, useState } from 'react';\nimport type { ReactNode, PropsWithoutRef } from 'react';\n\nimport {\n calculateForegroundColor,\n Card,\n CardContent,\n CardHeader,\n EmptyState,\n Flex,\n Text,\n VisuallyHiddenText,\n readableColor,\n registerIcon,\n isSolidColor,\n useArrows,\n useI18n,\n usePrevious,\n useTestIds,\n useTheme,\n withTestIds\n} from '@pega/cosmos-react-core';\nimport * as openNewTabIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/open.icon';\n\nimport type { ShortcutsProps, ShortcutItem } from './Shortcuts.types';\nimport {\n StyledExternalIcon,\n StyledLabelRow,\n StyledShortcutsCard,\n StyledShortcutsCardButton,\n StyledShortcutsCardsContainer,\n StyledShortcutsCardsWrapper,\n StyledShortcutsCategoriesContainer,\n StyledShortcutsCategoryHeading,\n StyledShortcutsCardIcon,\n StyledShortcutImageContainer,\n StyledShortcutImg,\n StyledSubtitleText,\n StyledText,\n StyledTextContent,\n StyledCardContentWrapper\n} from './Shortcuts.styles';\nimport { getShortcutsTestIds } from './Shortcuts.test-ids';\n\nregisterIcon(openNewTabIcon);\n\nconst itemLinkProps = (\n item: ShortcutItem\n): {\n href?: string;\n target?: string;\n rel?: string;\n onClick?: () => void;\n} => {\n if (item.type === 'external') {\n return { href: item.href, target: '_blank', rel: 'noopener noreferrer' };\n }\n\n return { onClick: item.onClick };\n};\n\nconst CardItem = ({ item, variant }: { item: ShortcutItem; variant: 'stacked' | 'inline' }) => {\n const {\n components: {\n card,\n shortcuts: {\n icon: { background: configuredIconBackground, foreground: configuredIconForeground }\n }\n }\n } = useTheme();\n\n const isLink = item.type === 'external';\n const image = isLink ? item.image : undefined;\n const description = isLink ? item.description : undefined;\n\n const [isBrokenImage, setIsBrokenImage] = useState(false);\n const prevImage = usePrevious(image);\n\n const iconBackground = configuredIconBackground;\n const withIconBackground = Boolean(isSolidColor(iconBackground));\n\n const cardForeground = calculateForegroundColor(card.background, card['foreground-color']);\n let iconForeground = configuredIconForeground;\n\n if (configuredIconForeground === 'auto') {\n iconForeground = withIconBackground\n ? readableColor(iconBackground, { mode: 'light', level: 'AANonText' })\n : cardForeground;\n }\n\n const showImage = Boolean(image) && !(isBrokenImage && image === prevImage);\n\n const commonIconProps = {\n name: item.icon\n };\n\n const iconVisual = withIconBackground ? (\n <StyledShortcutsCardIcon\n {...commonIconProps}\n background={iconBackground}\n foreground={iconForeground}\n />\n ) : (\n <StyledShortcutsCardIcon {...commonIconProps} iconColor={iconForeground} size='m' />\n );\n\n const visual = showImage ? (\n <Flex container={{ alignItems: 'center', justify: 'center' }} as={StyledShortcutImageContainer}>\n <StyledShortcutImg\n src={image}\n alt={item.label}\n onError={() => setIsBrokenImage(true)}\n onLoad={() => setIsBrokenImage(false)}\n />\n </Flex>\n ) : (\n iconVisual\n );\n\n return (\n <StyledShortcutsCard>\n <StyledShortcutsCardButton variant='link' layoutVariant={variant} {...itemLinkProps(item)}>\n <StyledCardContentWrapper layoutVariant={variant} hasDescription={!!description}>\n {visual}\n <Flex\n container={{ direction: 'column', gap: 0.5 }}\n as={StyledTextContent}\n layoutVariant={variant}\n >\n <StyledLabelRow>\n <StyledText>{item.label}</StyledText>\n {item.type === 'external' && <StyledExternalIcon name='open' />}\n </StyledLabelRow>\n\n {description && (\n <StyledSubtitleText variant='secondary' forwardedAs='p'>\n {description}\n </StyledSubtitleText>\n )}\n </Flex>\n </StyledCardContentWrapper>\n </StyledShortcutsCardButton>\n </StyledShortcutsCard>\n );\n};\n\nconst Shortcuts = forwardRef(function Shortcuts(\n {\n heading,\n items = [],\n categories,\n showHeader = true,\n variant = 'inline',\n testId,\n ...restProps\n }: PropsWithoutRef<ShortcutsProps>,\n ref: ShortcutsProps['ref']\n) {\n const t = useI18n();\n const testIds = useTestIds(testId, getShortcutsTestIds);\n\n const flatListRef = useRef<HTMLUListElement>(null);\n const categoriesContainerRef = useRef<HTMLDivElement>(null);\n\n useArrows(flatListRef, { dir: 'both', cycle: true });\n useArrows(categoriesContainerRef, { dir: 'both', cycle: true });\n\n const emptyState = <EmptyState message={t('no_items')} data-testid={testIds.emptyState} />;\n\n const withCardShell = (content: ReactNode) => (\n <Card {...restProps} data-testid={testIds.root} ref={ref}>\n <CardHeader>\n <Text variant='h2'>{heading ?? t('shortcuts')}</Text>\n </CardHeader>\n <CardContent>{content}</CardContent>\n </Card>\n );\n\n if (categories) {\n const visibleCategories = categories.filter(cat => cat.items.length > 0);\n\n const categorySections = (\n <StyledShortcutsCategoriesContainer ref={categoriesContainerRef}>\n {visibleCategories.map(cat => (\n <Flex\n container={{ direction: 'column' }}\n key={cat.id}\n aria-labelledby={`cat-${cat.id}`}\n data-testid={testIds.categorySection}\n as='section'\n >\n <StyledShortcutsCategoryHeading\n id={`cat-${cat.id}`}\n data-testid={testIds.categoryHeading}\n variant='h3'\n >\n {cat.label}\n </StyledShortcutsCategoryHeading>\n\n <StyledShortcutsCardsContainer role='list' aria-label={cat.label}>\n {cat.items.map(item => (\n <CardItem key={item.id} item={item} variant={variant} />\n ))}\n </StyledShortcutsCardsContainer>\n </Flex>\n ))}\n </StyledShortcutsCategoriesContainer>\n );\n\n return withCardShell(visibleCategories.length === 0 ? emptyState : categorySections);\n }\n\n const cardGrid = (\n <StyledShortcutsCardsWrapper>\n <StyledShortcutsCardsContainer\n ref={flatListRef}\n role='list'\n data-testid={testIds.list}\n aria-label={heading ?? t('shortcuts')}\n >\n {items.map(item => (\n <CardItem key={item.id} item={item} variant={variant} />\n ))}\n </StyledShortcutsCardsContainer>\n </StyledShortcutsCardsWrapper>\n );\n\n if (!showHeader) {\n if (items.length === 0) return null;\n\n return (\n <div data-testid={testIds.root} {...restProps} ref={ref}>\n <VisuallyHiddenText>{heading ?? t('shortcuts')}</VisuallyHiddenText>\n {cardGrid}\n </div>\n );\n }\n\n return withCardShell(items.length === 0 ? emptyState : cardGrid);\n});\n\nexport default withTestIds(Shortcuts, getShortcutsTestIds);\n"]}
|
|
1
|
+
{"version":3,"file":"Shortcuts.js","sourceRoot":"","sources":["../../../src/components/Shortcuts/Shortcuts.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useRef, forwardRef, useState } from 'react';\nimport type { ReactNode, PropsWithoutRef } from 'react';\n\nimport {\n calculateForegroundColor,\n Card,\n CardContent,\n CardHeader,\n EmptyState,\n Flex,\n Text,\n VisuallyHiddenText,\n readableColor,\n registerIcon,\n isSolidColor,\n useArrows,\n useI18n,\n usePrevious,\n useTestIds,\n useTheme,\n withTestIds\n} from '@pega/cosmos-react-core';\nimport * as openNewTabIcon from '@pega/cosmos-react-core/lib/components/Icon/icons/open.icon';\n\nimport type { ShortcutsProps, ShortcutItem } from './Shortcuts.types';\nimport {\n StyledExternalIcon,\n StyledLabelRow,\n StyledShortcutsCard,\n StyledShortcutsCardButton,\n StyledShortcutsCardsContainer,\n StyledShortcutsCardsWrapper,\n StyledShortcutsCategoriesContainer,\n StyledShortcutsCategoryHeading,\n StyledShortcutsCardIcon,\n StyledShortcutImageContainer,\n StyledShortcutImg,\n StyledSubtitleText,\n StyledText,\n StyledTextContent,\n StyledCardContentWrapper\n} from './Shortcuts.styles';\nimport { getShortcutsTestIds } from './Shortcuts.test-ids';\n\nregisterIcon(openNewTabIcon);\n\nconst itemLinkProps = (\n item: ShortcutItem\n): {\n href?: string;\n target?: string;\n rel?: string;\n onClick?: () => void;\n} => {\n if (item.type === 'external') {\n return { href: item.href, target: '_blank', rel: 'noopener noreferrer' };\n }\n\n return { onClick: item.onClick };\n};\n\nconst CardItem = ({ item, variant }: { item: ShortcutItem; variant: 'stacked' | 'inline' }) => {\n const {\n components: {\n card,\n shortcuts: {\n icon: { background: configuredIconBackground, foreground: configuredIconForeground }\n }\n }\n } = useTheme();\n\n const isLink = item.type === 'external';\n const image = isLink ? item.image : undefined;\n const description = isLink ? item.description : undefined;\n\n const [isBrokenImage, setIsBrokenImage] = useState(false);\n const prevImage = usePrevious(image);\n\n const iconBackground = configuredIconBackground;\n const withIconBackground = Boolean(isSolidColor(iconBackground));\n\n const cardForeground = calculateForegroundColor(card.background, card['foreground-color']);\n let iconForeground = configuredIconForeground;\n\n if (configuredIconForeground === 'auto') {\n iconForeground = withIconBackground\n ? readableColor(iconBackground, { mode: 'light', level: 'AANonText' })\n : cardForeground;\n }\n\n const showImage = Boolean(image) && !(isBrokenImage && image === prevImage);\n\n const commonIconProps = {\n name: item.icon\n };\n\n const iconVisual = withIconBackground ? (\n <StyledShortcutsCardIcon\n {...commonIconProps}\n background={iconBackground}\n foreground={iconForeground}\n />\n ) : (\n <StyledShortcutsCardIcon {...commonIconProps} iconColor={iconForeground} size='m' />\n );\n\n const visual = showImage ? (\n <Flex container={{ alignItems: 'center', justify: 'center' }} as={StyledShortcutImageContainer}>\n <StyledShortcutImg\n src={image}\n alt={item.label}\n onError={() => setIsBrokenImage(true)}\n onLoad={() => setIsBrokenImage(false)}\n />\n </Flex>\n ) : (\n iconVisual\n );\n\n return (\n <StyledShortcutsCard>\n <StyledShortcutsCardButton variant='link' layoutVariant={variant} {...itemLinkProps(item)}>\n <StyledCardContentWrapper layoutVariant={variant} hasDescription={!!description}>\n {visual}\n <Flex\n container={{ direction: 'column', gap: 0.5 }}\n as={StyledTextContent}\n layoutVariant={variant}\n >\n <StyledLabelRow>\n <StyledText>{item.label}</StyledText>\n {item.type === 'external' && <StyledExternalIcon name='open' />}\n </StyledLabelRow>\n\n {description && (\n <StyledSubtitleText variant='secondary' forwardedAs='p'>\n {description}\n </StyledSubtitleText>\n )}\n </Flex>\n </StyledCardContentWrapper>\n </StyledShortcutsCardButton>\n </StyledShortcutsCard>\n );\n};\n\nconst Shortcuts = forwardRef(function Shortcuts(\n {\n heading,\n items = [],\n categories,\n showHeader = true,\n variant = 'inline',\n testId,\n ...restProps\n }: PropsWithoutRef<ShortcutsProps>,\n ref: ShortcutsProps['ref']\n) {\n const t = useI18n();\n const testIds = useTestIds(testId, getShortcutsTestIds);\n\n const flatListRef = useRef<HTMLUListElement>(null);\n const categoriesContainerRef = useRef<HTMLDivElement>(null);\n\n useArrows(flatListRef, { dir: 'both', cycle: true });\n useArrows(categoriesContainerRef, { dir: 'both', cycle: true });\n\n const emptyState = <EmptyState message={t('no_items')} data-testid={testIds.emptyState} />;\n\n const withCardShell = (content: ReactNode) => (\n <Card {...restProps} data-testid={testIds.root} ref={ref}>\n <CardHeader>\n <Text variant='h2'>{heading ?? t('shortcuts')}</Text>\n </CardHeader>\n <CardContent>{content}</CardContent>\n </Card>\n );\n\n if (categories) {\n const visibleCategories = categories.filter(cat => cat.items.length > 0);\n\n const categorySections = (\n <StyledShortcutsCategoriesContainer ref={categoriesContainerRef}>\n {visibleCategories.map(cat => (\n <Flex\n container={{ direction: 'column' }}\n key={cat.id}\n aria-labelledby={`cat-${cat.id}`}\n data-testid={testIds.categorySection}\n as='section'\n >\n <StyledShortcutsCategoryHeading\n id={`cat-${cat.id}`}\n data-testid={testIds.categoryHeading}\n variant='h3'\n >\n {cat.label}\n </StyledShortcutsCategoryHeading>\n\n <StyledShortcutsCardsContainer\n role='list'\n aria-label={cat.label}\n itemCount={cat.items.length}\n >\n {cat.items.map(item => (\n <CardItem key={item.id} item={item} variant={variant} />\n ))}\n </StyledShortcutsCardsContainer>\n </Flex>\n ))}\n </StyledShortcutsCategoriesContainer>\n );\n\n return withCardShell(visibleCategories.length === 0 ? emptyState : categorySections);\n }\n\n const cardGrid = (\n <StyledShortcutsCardsWrapper>\n <StyledShortcutsCardsContainer\n ref={flatListRef}\n role='list'\n data-testid={testIds.list}\n aria-label={heading ?? t('shortcuts')}\n itemCount={items.length}\n >\n {items.map(item => (\n <CardItem key={item.id} item={item} variant={variant} />\n ))}\n </StyledShortcutsCardsContainer>\n </StyledShortcutsCardsWrapper>\n );\n\n if (!showHeader) {\n if (items.length === 0) return null;\n\n return (\n <div data-testid={testIds.root} {...restProps} ref={ref}>\n <VisuallyHiddenText>{heading ?? t('shortcuts')}</VisuallyHiddenText>\n {cardGrid}\n </div>\n );\n }\n\n return withCardShell(items.length === 0 ? emptyState : cardGrid);\n});\n\nexport default withTestIds(Shortcuts, getShortcutsTestIds);\n"]}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
export declare const StyledShortcutsCardsWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
2
|
-
export declare const StyledShortcutsCardsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").
|
|
2
|
+
export declare const StyledShortcutsCardsContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, {
|
|
3
|
+
itemCount: number;
|
|
4
|
+
}>> & string;
|
|
3
5
|
export declare const StyledShortcutsCategoriesContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
4
6
|
export declare const StyledShortcutsCategoryHeading: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("@pega/cosmos-react-core").TextProps, "ref"> & import("react").RefAttributes<HTMLHeadingElement | HTMLSpanElement> & import("@pega/cosmos-react-core").ForwardProps, "ref"> & {
|
|
5
7
|
ref?: ((instance: HTMLHeadingElement | HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLHeadingElement | HTMLSpanElement> | null | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shortcuts.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Shortcuts/Shortcuts.styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,2BAA2B,6NAEvC,CAAC;AAEF,eAAO,MAAM,6BAA6B,
|
|
1
|
+
{"version":3,"file":"Shortcuts.styles.d.ts","sourceRoot":"","sources":["../../../src/components/Shortcuts/Shortcuts.styles.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,2BAA2B,6NAEvC,CAAC;AAEF,eAAO,MAAM,6BAA6B;eAA0B,MAAM;YAyBzE,CAAC;AAIF,eAAO,MAAM,kCAAkC,6NAS9C,CAAC;AAIF,eAAO,MAAM,8BAA8B;;yLAIzC,CAAC;AAIH,eAAO,MAAM,mBAAmB,6NAG/B,CAAC;AAEF,eAAO,MAAM,iBAAiB;mBAA+B,SAAS,GAAG,QAAQ;YAehF,CAAC;AAIF,eAAO,MAAM,UAAU,+NAOtB,CAAC;AAIF,eAAO,MAAM,kBAAkB;;yLAK9B,CAAC;AAIF,eAAO,MAAM,yBAAyB;;;mBACrB,SAAS,GAAG,QAAQ;oLA4BnC,CAAC;AAIH,eAAO,MAAM,uBAAuB;gBACtB,MAAM;0JAUnB,CAAC;AAIF,eAAO,MAAM,cAAc,+NAM1B,CAAC;AAIF,eAAO,MAAM,kBAAkB,kaAE9B,CAAC;AAIF,eAAO,MAAM,4BAA4B,+NAaxC,CAAC;AAIF,eAAO,MAAM,iBAAiB,oOAK7B,CAAC;AAIF,eAAO,MAAM,wBAAwB;mBACpB,SAAS,GAAG,QAAQ;oBACnB,OAAO;YAsBxB,CAAC"}
|
|
@@ -5,27 +5,29 @@ import { lineClamp } from '@pega/cosmos-react-core/lib/styles/mixins';
|
|
|
5
5
|
export const StyledShortcutsCardsWrapper = styled.div `
|
|
6
6
|
container-type: inline-size;
|
|
7
7
|
`;
|
|
8
|
-
export const StyledShortcutsCardsContainer = styled.ul(({ theme: { base } }) => {
|
|
8
|
+
export const StyledShortcutsCardsContainer = styled.ul(({ theme: { base }, itemCount }) => {
|
|
9
9
|
return css `
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
10
|
+
display: grid;
|
|
11
|
+
grid-template-columns: repeat(auto-fill, minmax(min(calc(${base.spacing} * 30), 100%), 1fr));
|
|
12
|
+
gap: ${base.spacing};
|
|
13
|
+
list-style: none;
|
|
14
|
+
padding: ${base.spacing} 0;
|
|
15
|
+
margin: 0;
|
|
16
16
|
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
17
|
+
@container (min-width: ${parseFloat(base.breakpoints.sm)}rem) {
|
|
18
|
+
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
19
|
+
grid-auto-rows: 1fr;
|
|
20
|
+
justify-content: start;
|
|
21
|
+
align-items: stretch;
|
|
22
|
+
width: 100%;
|
|
23
|
+
}
|
|
24
24
|
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
25
|
+
@container (min-width: ${parseFloat(base.breakpoints.md)}rem) {
|
|
26
|
+
grid-template-columns: ${itemCount === 1
|
|
27
|
+
? 'repeat(2, minmax(0, 1fr))'
|
|
28
|
+
: `repeat(${Math.min(Math.max(itemCount, 1), 4)}, minmax(0, 1fr))`};
|
|
29
|
+
}
|
|
30
|
+
`;
|
|
29
31
|
});
|
|
30
32
|
StyledShortcutsCardsContainer.defaultProps = defaultThemeProp;
|
|
31
33
|
export const StyledShortcutsCategoriesContainer = styled.div(({ theme: { base } }) => css `
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Shortcuts.styles.js","sourceRoot":"","sources":["../../../src/components/Shortcuts/Shortcuts.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACzF,OAAO,EAAE,SAAS,EAAE,MAAM,2CAA2C,CAAC;AAEtE,MAAM,CAAC,MAAM,2BAA2B,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEpD,CAAC;AAEF,MAAM,CAAC,MAAM,6BAA6B,GAAG,MAAM,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"Shortcuts.styles.js","sourceRoot":"","sources":["../../../src/components/Shortcuts/Shortcuts.styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACzF,OAAO,EAAE,SAAS,EAAE,MAAM,2CAA2C,CAAC;AAEtE,MAAM,CAAC,MAAM,2BAA2B,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEpD,CAAC;AAEF,MAAM,CAAC,MAAM,6BAA6B,GAAG,MAAM,CAAC,EAAE,CACpD,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE;IACjC,OAAO,GAAG,CAAA;;iEAEmD,IAAI,CAAC,OAAO;aAChE,IAAI,CAAC,OAAO;;iBAER,IAAI,CAAC,OAAO;;;+BAGE,UAAU,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC;;;;;;;;+BAQ/B,UAAU,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC;iCAC7B,SAAS,KAAK,CAAC;QACtC,CAAC,CAAC,2BAA2B;QAC7B,CAAC,CAAC,UAAU,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,mBAAmB;;KAEvE,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,6BAA6B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE9D,MAAM,CAAC,MAAM,kCAAkC,GAAG,MAAM,CAAC,GAAG,CAC1D,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;gBAGd,IAAI,CAAC,OAAO;;2BAED,IAAI,CAAC,OAAO;;GAEpC,CACF,CAAC;AAEF,kCAAkC,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnE,MAAM,CAAC,MAAM,8BAA8B,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE;IACjF,OAAO,GAAG,CAAA;wBACY,IAAI,CAAC,OAAO;GACjC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,8BAA8B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/D,MAAM,CAAC,MAAM,mBAAmB,GAAG,MAAM,CAAC,EAAE,CAAA;;;CAG3C,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CACzC,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;MACtB,aAAa,KAAK,QAAQ;IAC5B,GAAG,CAAA;;;;KAIF;;MAEC,aAAa,KAAK,SAAS;IAC7B,GAAG,CAAA;;;KAGF;GACF,CACF,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CACnC,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;mBACX,IAAI,CAAC,aAAa,CAAC,CAAC,WAAW,CAAC;;;MAG7C,SAAS,CAAC,CAAC,CAAC;GACf,CACF,CAAC;AAEF,UAAU,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE3C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,CAC5C,GAAG,EAAE,CAAC,GAAG,CAAA;MACL,SAAS,CAAC,CAAC,CAAC;;GAEf,CACF,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,yBAAyB,GAAG,MAAM,CAAC,MAAM,CAAC,CAEpD,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,aAAa,EAAE,EAAE,EAAE;IACpD,MAAM,oBAAoB,GAAG,QAAQ,CAAC,GAAG,EAAE,CACzC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC,EAAE,UAAU,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAC,CACnF,CAAC;IAEF,OAAO,GAAG,CAAA;;;;kBAIM,aAAa,KAAK,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO;;;8BAGpC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC;qBACpC,IAAI,CAAC,eAAe,CAAC;kBACxB,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;2BACzB,IAAI,CAAC,OAAO;0BACb,IAAI,CAAC,OAAO;;;oBAGlB,oBAAoB;;;QAGhC,UAAU;;;;GAIf,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,yBAAyB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE1D,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,IAAI,CAAC,CAGjD,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;MAGlB,SAAS;IACX,GAAG,CAAA;eACQ,SAAS;KACnB;GACF,CACF,CAAC;AAEF,uBAAuB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAExD,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CACvC,CAAC,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;gBAGd,IAAI,CAAC,OAAO;GACzB,CACF,CAAC;AAEF,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,CAAC,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAA;;CAE7C,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEnD,MAAM,CAAC,MAAM,4BAA4B,GAAG,MAAM,CAAC,IAAI,CACrD,CAAC,EACC,KAAK,EAAE,EACL,IAAI,EACJ,UAAU,EAAE,EAAE,IAAI,EAAE,EACrB,EACF,EAAE,EAAE,CAAC,GAAG,CAAA;;;0BAGe,IAAI,CAAC,eAAe,CAAC;aAClC,IAAI,CAAC,IAAI,CAAC,CAAC;cACV,IAAI,CAAC,IAAI,CAAC,CAAC;GACtB,CACF,CAAC;AAEF,4BAA4B,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7D,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAK1C,CAAC;AAEF,iBAAiB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElD,MAAM,CAAC,MAAM,wBAAwB,GAAG,MAAM,CAAC,GAAG,CAIhD,CAAC,EAAE,aAAa,EAAE,cAAc,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;;;MAKvD,aAAa,KAAK,QAAQ;IAC5B,GAAG,CAAA;;kBAEW,IAAI,CAAC,OAAO;qBACT,cAAc,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,QAAQ;KACxD;;MAEC,aAAa,KAAK,SAAS;IAC7B,GAAG,CAAA;;kBAEW,IAAI,CAAC,OAAO;;;KAGzB;GACF,CACF,CAAC;AAEF,wBAAwB,CAAC,YAAY,GAAG,gBAAgB,CAAC","sourcesContent":["import styled, { css } from 'styled-components';\nimport { mix } from 'polished';\n\nimport { Button, defaultThemeProp, Icon, Text, tryCatch } from '@pega/cosmos-react-core';\nimport { lineClamp } from '@pega/cosmos-react-core/lib/styles/mixins';\n\nexport const StyledShortcutsCardsWrapper = styled.div`\n container-type: inline-size;\n`;\n\nexport const StyledShortcutsCardsContainer = styled.ul<{ itemCount: number }>(\n ({ theme: { base }, itemCount }) => {\n return css`\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(min(calc(${base.spacing} * 30), 100%), 1fr));\n gap: ${base.spacing};\n list-style: none;\n padding: ${base.spacing} 0;\n margin: 0;\n\n @container (min-width: ${parseFloat(base.breakpoints.sm)}rem) {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n grid-auto-rows: 1fr;\n justify-content: start;\n align-items: stretch;\n width: 100%;\n }\n\n @container (min-width: ${parseFloat(base.breakpoints.md)}rem) {\n grid-template-columns: ${itemCount === 1\n ? 'repeat(2, minmax(0, 1fr))'\n : `repeat(${Math.min(Math.max(itemCount, 1), 4)}, minmax(0, 1fr))`};\n }\n `;\n }\n);\n\nStyledShortcutsCardsContainer.defaultProps = defaultThemeProp;\n\nexport const StyledShortcutsCategoriesContainer = styled.div(\n ({ theme: { base } }) => css`\n display: grid;\n grid-template-columns: minmax(0, 1fr);\n gap: calc(${base.spacing} * 2);\n width: 100%;\n padding-block-start: ${base.spacing};\n container-type: inline-size;\n `\n);\n\nStyledShortcutsCategoriesContainer.defaultProps = defaultThemeProp;\n\nexport const StyledShortcutsCategoryHeading = styled(Text)(({ theme: { base } }) => {\n return css`\n margin-block-end: ${base.spacing};\n `;\n});\n\nStyledShortcutsCategoryHeading.defaultProps = defaultThemeProp;\n\nexport const StyledShortcutsCard = styled.li`\n display: flex;\n flex-direction: column;\n`;\n\nexport const StyledTextContent = styled.div<{ layoutVariant: 'stacked' | 'inline' }>(\n ({ layoutVariant }) => css`\n ${layoutVariant === 'inline' &&\n css`\n flex: 1;\n min-width: 0;\n align-items: flex-start;\n `}\n\n ${layoutVariant === 'stacked' &&\n css`\n align-items: center;\n width: 100%;\n `}\n `\n);\n\nStyledTextContent.defaultProps = defaultThemeProp;\n\nexport const StyledText = styled.span(\n ({ theme: { base } }) => css`\n font-weight: ${base['font-weight']['semi-bold']};\n font-size: 1em;\n color: CanvasText;\n ${lineClamp(3)}\n `\n);\n\nStyledText.defaultProps = defaultThemeProp;\n\nexport const StyledSubtitleText = styled(Text)(\n () => css`\n ${lineClamp(3)}\n text-align: inherit;\n `\n);\n\nStyledSubtitleText.defaultProps = defaultThemeProp;\n\nexport const StyledShortcutsCardButton = styled(Button)<{\n layoutVariant: 'stacked' | 'inline';\n}>(({ theme: { base, components }, layoutVariant }) => {\n const hoverBackgroundColor = tryCatch(() =>\n mix(0.9, base.palette['primary-background'], components.button['secondary-color'])\n );\n\n return css`\n display: flex;\n align-items: center;\n justify-content: flex-start;\n text-align: ${layoutVariant === 'stacked' ? 'center' : 'start'};\n flex: 1;\n width: 100%;\n border: 0.0625rem solid ${base.palette['border-line']};\n border-radius: ${base['border-radius']};\n background: ${base.palette['primary-background']};\n padding-inline: calc(${base.spacing} * 2);\n padding-block: calc(${base.spacing} * 1.5);\n\n &:hover {\n background: ${hoverBackgroundColor};\n text-decoration: none;\n\n ${StyledText} {\n text-decoration: underline;\n }\n }\n `;\n});\n\nStyledShortcutsCardButton.defaultProps = defaultThemeProp;\n\nexport const StyledShortcutsCardIcon = styled(Icon)<{\n iconColor?: string;\n}>(\n ({ iconColor }) => css`\n flex-shrink: 0;\n\n ${iconColor &&\n css`\n color: ${iconColor};\n `}\n `\n);\n\nStyledShortcutsCardIcon.defaultProps = defaultThemeProp;\n\nexport const StyledLabelRow = styled.span(\n ({ theme: { base } }) => css`\n display: flex;\n align-items: center;\n gap: calc(${base.spacing} * 0.5);\n `\n);\n\nStyledLabelRow.defaultProps = defaultThemeProp;\n\nexport const StyledExternalIcon = styled(Icon)`\n flex-shrink: 0;\n`;\n\nStyledExternalIcon.defaultProps = defaultThemeProp;\n\nexport const StyledShortcutImageContainer = styled.span(\n ({\n theme: {\n base,\n components: { icon }\n }\n }) => css`\n flex-shrink: 0;\n overflow: hidden;\n border-radius: calc(${base['border-radius']} / 2);\n width: ${icon.size.m};\n height: ${icon.size.m};\n `\n);\n\nStyledShortcutImageContainer.defaultProps = defaultThemeProp;\n\nexport const StyledShortcutImg = styled.img`\n width: 100%;\n height: 100%;\n object-fit: contain;\n display: block;\n`;\n\nStyledShortcutImg.defaultProps = defaultThemeProp;\n\nexport const StyledCardContentWrapper = styled.div<{\n layoutVariant: 'stacked' | 'inline';\n hasDescription: boolean;\n}>(\n ({ layoutVariant, hasDescription, theme: { base } }) => css`\n display: flex;\n flex: 1;\n min-width: 0;\n\n ${layoutVariant === 'inline' &&\n css`\n flex-direction: row;\n gap: calc(${base.spacing} * 1.5);\n align-items: ${hasDescription ? 'flex-start' : 'center'};\n `}\n\n ${layoutVariant === 'stacked' &&\n css`\n flex-direction: column;\n gap: calc(${base.spacing} * 2);\n align-items: center;\n justify-content: center;\n `}\n `\n);\n\nStyledCardContentWrapper.defaultProps = defaultThemeProp;\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/cosmos-react-work",
|
|
3
|
-
"version": "9.15.
|
|
3
|
+
"version": "9.15.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.15.
|
|
18
|
-
"@pega/cosmos-react-rte": "9.15.
|
|
17
|
+
"@pega/cosmos-react-core": "9.15.1",
|
|
18
|
+
"@pega/cosmos-react-rte": "9.15.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",
|