@pega/lists-react 9.0.0-build.23.3 → 9.0.0-build.23.4
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/Core/Views/Gallery/Components/GalleryCard.d.ts.map +1 -1
- package/lib/Core/Views/Gallery/Components/GalleryCard.js +13 -2
- package/lib/Core/Views/Gallery/Components/GalleryCard.js.map +1 -1
- package/lib/Core/Views/Gallery/GalleryContainer.d.ts +4 -0
- package/lib/Core/Views/Gallery/GalleryContainer.d.ts.map +1 -1
- package/lib/Core/Views/Gallery/GalleryContainer.js +4 -3
- package/lib/Core/Views/Gallery/GalleryContainer.js.map +1 -1
- package/lib/Core/Views/Gallery/index.d.ts.map +1 -1
- package/lib/Core/Views/Gallery/index.js +2 -2
- package/lib/Core/Views/Gallery/index.js.map +1 -1
- package/lib/Core/Views/Gallery/utils.d.ts +2 -2
- package/lib/Core/Views/Gallery/utils.d.ts.map +1 -1
- package/lib/Core/Views/Gallery/utils.js +39 -6
- package/lib/Core/Views/Gallery/utils.js.map +1 -1
- package/package.json +7 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GalleryCard.d.ts","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryCard.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"GalleryCard.d.ts","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryCard.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAIzD,QAAA,MAAM,WAAW,oFAAsD,gBAAgB,6CAyCrF,CAAC;AAEH,eAAe,WAAW,CAAC"}
|
|
@@ -4,7 +4,7 @@ import { SelectionCardDisplay } from '@pega/cosmos-react-core';
|
|
|
4
4
|
import { getCardData, getCardUIProps } from '../utils';
|
|
5
5
|
import useRowActions from '../hooks/useRowActions';
|
|
6
6
|
const GalleryCard = memo(({ headerColumn, row, meta, visibleColumns }) => {
|
|
7
|
-
const { label, image, fields, 'aria-label': ariaLabel } = getCardData({
|
|
7
|
+
const { label, image, footer, fields, 'aria-label': ariaLabel } = getCardData({
|
|
8
8
|
row,
|
|
9
9
|
visibleColumns,
|
|
10
10
|
meta,
|
|
@@ -12,7 +12,18 @@ const GalleryCard = memo(({ headerColumn, row, meta, visibleColumns }) => {
|
|
|
12
12
|
});
|
|
13
13
|
const uiProps = getCardUIProps({ row });
|
|
14
14
|
const fetchActionsCb = useRowActions({ row, meta });
|
|
15
|
-
|
|
15
|
+
const { onCardClick } = meta.galleryConfig ?? {};
|
|
16
|
+
const rowData = onCardClick ? row.getContext().getValue() : undefined;
|
|
17
|
+
return (_jsx(SelectionCardDisplay, { "aria-label": ariaLabel, label: label, image: image, fields: fields, actions: fetchActionsCb, ...uiProps, footer: footer, ...(onCardClick &&
|
|
18
|
+
rowData && {
|
|
19
|
+
onClick: () => onCardClick(rowData),
|
|
20
|
+
onKeyDown: (e) => {
|
|
21
|
+
if (e.key === 'Enter' || e.key === ' ') {
|
|
22
|
+
e.preventDefault();
|
|
23
|
+
onCardClick(rowData);
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
}) }));
|
|
16
27
|
});
|
|
17
28
|
export default GalleryCard;
|
|
18
29
|
//# sourceMappingURL=GalleryCard.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GalleryCard.js","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"GalleryCard.js","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryCard.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAG7B,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAG/D,OAAO,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,aAAa,MAAM,wBAAwB,CAAC;AAEnD,MAAM,WAAW,GAAG,IAAI,CAAC,CAAC,EAAE,YAAY,EAAE,GAAG,EAAE,IAAI,EAAE,cAAc,EAAoB,EAAE,EAAE;IACzF,MAAM,EACJ,KAAK,EACL,KAAK,EACL,MAAM,EACN,MAAM,EACN,YAAY,EAAE,SAAS,EACxB,GAAG,WAAW,CAAC;QACd,GAAG;QACH,cAAc;QACd,IAAI;QACJ,YAAY;KACb,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,cAAc,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IACxC,MAAM,cAAc,GAAG,aAAa,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,CAAC,CAAC;IACpD,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,aAAa,IAAI,EAAE,CAAC;IAEjD,MAAM,OAAO,GAAG,WAAW,CAAC,CAAC,CAAC,GAAG,CAAC,UAAU,EAAE,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC;IAEtE,OAAO,CACL,KAAC,oBAAoB,kBACP,SAAS,EACrB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,cAAc,KACnB,OAAO,EACX,MAAM,EAAE,MAAM,KACV,CAAC,WAAW;YACd,OAAO,IAAI;YACT,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,OAAO,CAAC;YACnC,SAAS,EAAE,CAAC,CAAgB,EAAE,EAAE;gBAC9B,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;oBACvC,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,WAAW,CAAC,OAAO,CAAC,CAAC;gBACvB,CAAC;YACH,CAAC;SACF,CAAC,GACJ,CACH,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,WAAW,CAAC","sourcesContent":["import { memo } from 'react';\nimport type { KeyboardEvent } from 'react';\n\nimport { SelectionCardDisplay } from '@pega/cosmos-react-core';\n\nimport type { GalleryCardProps } from '../Gallery.types';\nimport { getCardData, getCardUIProps } from '../utils';\nimport useRowActions from '../hooks/useRowActions';\n\nconst GalleryCard = memo(({ headerColumn, row, meta, visibleColumns }: GalleryCardProps) => {\n const {\n label,\n image,\n footer,\n fields,\n 'aria-label': ariaLabel\n } = getCardData({\n row,\n visibleColumns,\n meta,\n headerColumn\n });\n\n const uiProps = getCardUIProps({ row });\n const fetchActionsCb = useRowActions({ row, meta });\n const { onCardClick } = meta.galleryConfig ?? {};\n\n const rowData = onCardClick ? row.getContext().getValue() : undefined;\n\n return (\n <SelectionCardDisplay\n aria-label={ariaLabel}\n label={label}\n image={image}\n fields={fields}\n actions={fetchActionsCb}\n {...uiProps}\n footer={footer}\n {...(onCardClick &&\n rowData && {\n onClick: () => onCardClick(rowData),\n onKeyDown: (e: KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n onCardClick(rowData);\n }\n }\n })}\n />\n );\n});\n\nexport default GalleryCard;\n"]}
|
|
@@ -10,6 +10,10 @@ interface GalleryContainerProps {
|
|
|
10
10
|
placement?: RsCoreTypes.HeroImagePlacement;
|
|
11
11
|
size?: ImageSize;
|
|
12
12
|
};
|
|
13
|
+
tile?: {
|
|
14
|
+
placement?: RsCoreTypes.HeroImagePlacement;
|
|
15
|
+
size?: ImageSize;
|
|
16
|
+
};
|
|
13
17
|
}
|
|
14
18
|
declare const GalleryContainer: import("react").ForwardRefExoticComponent<Omit<WithAttributes<"div", GalleryContainerProps>, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
|
|
15
19
|
export default GalleryContainer;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GalleryContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASnD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAYzE,UAAU,qBAAqB;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;IACvB,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE;QACN,SAAS,CAAC,EAAE,WAAW,CAAC,kBAAkB,CAAC;QAC3C,IAAI,CAAC,EAAE,SAAS,CAAC;KAClB,CAAC;CACH;AAwDD,QAAA,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"GalleryContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AASnD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAYzE,UAAU,qBAAqB;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;IACvB,YAAY,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE;QACN,SAAS,CAAC,EAAE,WAAW,CAAC,kBAAkB,CAAC;QAC3C,IAAI,CAAC,EAAE,SAAS,CAAC;KAClB,CAAC;IACF,IAAI,CAAC,EAAE;QACL,SAAS,CAAC,EAAE,WAAW,CAAC,kBAAkB,CAAC;QAC3C,IAAI,CAAC,EAAE,SAAS,CAAC;KAClB,CAAC;CACH;AAwDD,QAAA,MAAM,gBAAgB,sJAmBrB,CAAC;AAIF,eAAe,gBAAgB,CAAC;AAEhC,QAAA,MAAM,yBAAyB,6NAG9B,CAAC;AAGF,OAAO,EAAE,yBAAyB,EAAE,CAAC"}
|
|
@@ -41,9 +41,10 @@ const StyledInlineImageGalleryContainer = styled(StyledGalleryContainer)(({ them
|
|
|
41
41
|
`;
|
|
42
42
|
});
|
|
43
43
|
StyledInlineImageGalleryContainer.defaultProps = defaultThemeProp;
|
|
44
|
-
const GalleryContainer = forwardRef(({ image, ...props }, ref) => {
|
|
45
|
-
|
|
46
|
-
|
|
44
|
+
const GalleryContainer = forwardRef(({ image, tile, ...props }, ref) => {
|
|
45
|
+
const layoutSource = image ?? tile;
|
|
46
|
+
if (layoutSource) {
|
|
47
|
+
const { placement = DEFAULT_IMAGE_PLACEMENT, size = DEFAULT_IMAGE_SIZE } = layoutSource;
|
|
47
48
|
if (isInlinePlacement(placement)) {
|
|
48
49
|
return (_jsx(StyledInlineImageGalleryContainer, { ref: ref, imageSize: size, imagePlacement: placement, ...props }));
|
|
49
50
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GalleryContainer.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AACnD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,0BAA0B,EAC1B,iCAAiC,EACjC,YAAY,EACZ,mBAAmB,EACpB,MAAM,2EAA2E,CAAC;AAGnF,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,OAAO,EAAE,mCAAmC,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAEjG,OAAO,EACL,uBAAuB,EACvB,kBAAkB,EAClB,2BAA2B,EAC3B,iBAAiB,EAClB,MAAM,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"GalleryContainer.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/GalleryContainer.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AACnD,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EACL,0BAA0B,EAC1B,iCAAiC,EACjC,YAAY,EACZ,mBAAmB,EACpB,MAAM,2EAA2E,CAAC;AAGnF,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,OAAO,EAAE,mCAAmC,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAEjG,OAAO,EACL,uBAAuB,EACvB,kBAAkB,EAClB,2BAA2B,EAC3B,iBAAiB,EAClB,MAAM,SAAS,CAAC;AA2BjB,MAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,CACvC,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,EAAE,EAAE;IAChC,OAAO,GAAG,CAAA;QACN,sBAAsB,CAAC,EAAE,IAAI,EAAE,YAAY,EAAE,CAAC;;;;;;UAM5C,0BAA0B,CAAC,KAAK,CAAC;;UAEjC,mBAAmB,IAAI,YAAY;;;;KAIxC,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,iCAAiC,GAAG,MAAM,CAAC,sBAAsB,CAAC,CAEtE,CAAC,EAAE,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,EAAE,EAAE;IACzC,OAAO,GAAG,CAAA;;;;;;QAMJ,iCAAiC,CAAC,KAAK,EAAE;QACzC,SAAS,EAAE,2BAA2B,CAAC,cAAc,CAAC;QACtD,IAAI,EAAE,SAAS;KAChB,CAAC;;QAEA,mBAAmB,IAAI,YAAY;;;;GAIxC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,iCAAiC,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAElE,MAAM,gBAAgB,GAAG,UAAU,CACjC,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACjC,MAAM,YAAY,GAAG,KAAK,IAAI,IAAI,CAAC;IACnC,IAAI,YAAY,EAAE,CAAC;QACjB,MAAM,EAAE,SAAS,GAAG,uBAAuB,EAAE,IAAI,GAAG,kBAAkB,EAAE,GAAG,YAAY,CAAC;QACxF,IAAI,iBAAiB,CAAC,SAAS,CAAC,EAAE,CAAC;YACjC,OAAO,CACL,KAAC,iCAAiC,IAChC,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,EACf,cAAc,EAAE,SAAS,KACrB,KAAK,GACT,CACH,CAAC;QACJ,CAAC;IACH,CAAC;IAED,OAAO,KAAC,sBAAsB,IAAC,GAAG,EAAE,GAAG,KAAM,KAAK,GAAI,CAAC;AACzD,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAC;AAElD,eAAe,gBAAgB,CAAC;AAEhC,MAAM,yBAAyB,GAAG,MAAM,CAAC,GAAG,CAAA;IACxC,mCAAmC;;CAEtC,CAAC;AAEF,yBAAyB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,CAAC","sourcesContent":["import { forwardRef, type ReactNode } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport {\n getBaseCardContainerStyles,\n getInlineImageCardContainerStyles,\n StyledHeader,\n StyledSelectionCard\n} from '@pega/cosmos-react-core/lib/components/SelectionCard/SelectionCard.styles';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { ImageSize, WithAttributes } from '@pega/cosmos-react-core';\nimport { defaultThemeProp } from '@pega/cosmos-react-core';\n\nimport { generateRSDataContainerHeightStyles, generateRSHeightStyles } from '../../Utils/styles';\n\nimport {\n DEFAULT_IMAGE_PLACEMENT,\n DEFAULT_IMAGE_SIZE,\n GALLERY_IMAGE_PLACEMENT_MAP,\n isInlinePlacement\n} from './utils';\n\ninterface GalleryContainerProps {\n children?: ReactNode;\n view: RsCoreTypes.View;\n isFullscreen: boolean;\n className?: string;\n image?: {\n placement?: RsCoreTypes.HeroImagePlacement;\n size?: ImageSize;\n };\n tile?: {\n placement?: RsCoreTypes.HeroImagePlacement;\n size?: ImageSize;\n };\n}\n\ninterface StyledGalleryContainerProps {\n view: RsCoreTypes.View;\n isFullscreen: boolean;\n}\n\ninterface StyledInlineImageGalleryContainerProps extends StyledGalleryContainerProps {\n imagePlacement: Extract<RsCoreTypes.HeroImagePlacement, 'left' | 'right'>;\n imageSize: ImageSize;\n}\n\nconst StyledGalleryContainer = styled.div<StyledGalleryContainerProps>(\n ({ view, isFullscreen, theme }) => {\n return css`\n ${generateRSHeightStyles({ view, isFullscreen })}\n\n .grid-container {\n position: absolute;\n width: 100%;\n padding: 0.2rem;\n ${getBaseCardContainerStyles(theme)}\n\n ${StyledSelectionCard} ${StyledHeader} {\n min-height: auto;\n }\n }\n `;\n }\n);\n\nStyledGalleryContainer.defaultProps = defaultThemeProp;\n\nconst StyledInlineImageGalleryContainer = styled(StyledGalleryContainer)<\n Pick<StyledInlineImageGalleryContainerProps, 'imageSize' | 'imagePlacement'>\n>(({ theme, imageSize, imagePlacement }) => {\n return css`\n *:has(> .grid-container) {\n container-type: inline-size;\n }\n\n .grid-container {\n ${getInlineImageCardContainerStyles(theme, {\n placement: GALLERY_IMAGE_PLACEMENT_MAP[imagePlacement],\n size: imageSize\n })}\n\n ${StyledSelectionCard} ${StyledHeader} {\n min-height: auto;\n }\n }\n `;\n});\n\nStyledInlineImageGalleryContainer.defaultProps = defaultThemeProp;\n\nconst GalleryContainer = forwardRef<HTMLDivElement, WithAttributes<'div', GalleryContainerProps>>(\n ({ image, tile, ...props }, ref) => {\n const layoutSource = image ?? tile;\n if (layoutSource) {\n const { placement = DEFAULT_IMAGE_PLACEMENT, size = DEFAULT_IMAGE_SIZE } = layoutSource;\n if (isInlinePlacement(placement)) {\n return (\n <StyledInlineImageGalleryContainer\n ref={ref}\n imageSize={size}\n imagePlacement={placement}\n {...props}\n />\n );\n }\n }\n\n return <StyledGalleryContainer ref={ref} {...props} />;\n }\n);\n\nGalleryContainer.displayName = 'GalleryContainer';\n\nexport default GalleryContainer;\n\nconst StyledVirtualizeContainer = styled.div`\n ${generateRSDataContainerHeightStyles};\n position: relative;\n`;\n\nStyledVirtualizeContainer.defaultProps = defaultThemeProp;\nexport { StyledVirtualizeContainer };\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAgB7E,iBAAS,OAAO,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,WAAW,CAAC,IAAI,CAAA;CAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/index.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAa,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAgB7E,iBAAS,OAAO,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,WAAW,CAAC,IAAI,CAAA;CAAE,2CAwEpD;kBAxEQ,OAAO;;;AA4EhB,eAAe,OAAO,CAAC"}
|
|
@@ -16,7 +16,7 @@ import GalleryContainer, { StyledVirtualizeContainer } from './GalleryContainer'
|
|
|
16
16
|
function Gallery({ view }) {
|
|
17
17
|
const isFullscreen = !!useFullscreenContext()?.[0];
|
|
18
18
|
const { columns = [], meta, rows } = view;
|
|
19
|
-
const { galleryConfig: { heroImage, header } = {}, selectionMode } = meta;
|
|
19
|
+
const { galleryConfig: { heroImage, tile: tileConfig, header } = {}, selectionMode } = meta;
|
|
20
20
|
const headerColumn = useMemo(() => (header?.field ? columns.find(col => col.field.id === header.field) : undefined), [header, columns]);
|
|
21
21
|
const selectionColumn = useMemo(() => columns.find(col => col.field.id === rowSelectColumnMeta.field.id), [columns]);
|
|
22
22
|
const visibleColumns = useMemo(() => {
|
|
@@ -24,7 +24,7 @@ function Gallery({ view }) {
|
|
|
24
24
|
cols.sort((colA, colB) => (colA.order ?? 0) - (colB.order ?? 0));
|
|
25
25
|
return cols;
|
|
26
26
|
}, [columns]);
|
|
27
|
-
return (_jsx(RsCardWrapper, { children: _jsxs(GalleryContainer, { "data-test-id": 'gallery', "data-testid": 'gallery', view: view, isFullscreen: isFullscreen, image: heroImage, children: [_jsx(WarningBanner, { warningMessages: view.warningMessages }), _jsx(Toolbar, { view: view }), _jsx(RenderView, { view: view, type: EXTERNAL_FILTERS }), _jsxs(StyledVirtualizeContainer, { className: 'container', children: [_jsx(Virtualiser, { id: 'rootVirtualiser', rowContainerClass: 'grid-container', view: view, bufferMultiplier: 0.8, children: rows?.length
|
|
27
|
+
return (_jsx(RsCardWrapper, { children: _jsxs(GalleryContainer, { "data-test-id": 'gallery', "data-testid": 'gallery', view: view, isFullscreen: isFullscreen, image: heroImage, tile: tileConfig, children: [_jsx(WarningBanner, { warningMessages: view.warningMessages }), _jsx(Toolbar, { view: view }), _jsx(RenderView, { view: view, type: EXTERNAL_FILTERS }), _jsxs(StyledVirtualizeContainer, { className: 'container', children: [_jsx(Virtualiser, { id: 'rootVirtualiser', rowContainerClass: 'grid-container', view: view, bufferMultiplier: 0.8, children: rows?.length
|
|
28
28
|
? rows.map(row => selectionMode === SELECTION_MODES.multi && selectionColumn ? (_jsx(GalleryCheckboxCard, { meta: meta, row: row, visibleColumns: visibleColumns, headerColumn: headerColumn, selectionColumn: selectionColumn }, row.reactKey)) : (_jsx(GalleryCard, { meta: meta, row: row, visibleColumns: visibleColumns, headerColumn: headerColumn }, row.reactKey)))
|
|
29
29
|
: [] }), _jsx(LoadingIndicator, { view: view, show: !rows || !!view.isLoading })] })] }) }));
|
|
30
30
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,SAAS,EAAoB,MAAM,gCAAgC,CAAC;AAC7E,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAE,mBAAmB,EAAE,MAAM,uDAAuD,CAAC;AAE5F,OAAO,WAAW,MAAM,4BAA4B,CAAC;AACrD,OAAO,OAAO,MAAM,0BAA0B,CAAC;AAC/C,OAAO,UAAU,MAAM,6CAA6C,CAAC;AACrE,OAAO,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AACpE,OAAO,aAAa,MAAM,kBAAkB,CAAC;AAC7C,OAAO,gBAAgB,MAAM,mCAAmC,CAAC;AACjE,OAAO,aAAa,MAAM,gCAAgC,CAAC;AAE3D,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,OAAO,mBAAmB,MAAM,kCAAkC,CAAC;AACnE,OAAO,gBAAgB,EAAE,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAEjF,SAAS,OAAO,CAAC,EAAE,IAAI,EAA8B;IACnD,MAAM,YAAY,GAAG,CAAC,CAAC,oBAAoB,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;IAEnD,MAAM,EAAE,OAAO,GAAG,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IAC1C,MAAM,EAAE,aAAa,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo } from 'react';\n\nimport { FieldType, type RsCoreTypes } from 'pega-repeating-structures-core';\nimport { useFullscreenContext } from '@pega/cosmos-react-core';\nimport { rowSelectColumnMeta } from 'pega-repeating-structures-core/lib/src/core/constants';\n\nimport Virtualiser from '../Table/VirtualizeWrapper';\nimport Toolbar from '../../Components/Toolbar';\nimport RenderView from '../../Components/RenderingEngine/RenderView';\nimport { EXTERNAL_FILTERS, SELECTION_MODES } from '../../constants';\nimport RsCardWrapper from '../RsCardWrapper';\nimport LoadingIndicator from '../../Components/LoadingIndicator';\nimport WarningBanner from '../../Components/WarningBanner';\n\nimport GalleryCard from './Components/GalleryCard';\nimport GalleryCheckboxCard from './Components/GalleryCheckboxCard';\nimport GalleryContainer, { StyledVirtualizeContainer } from './GalleryContainer';\n\nfunction Gallery({ view }: { view: RsCoreTypes.View }) {\n const isFullscreen = !!useFullscreenContext()?.[0];\n\n const { columns = [], meta, rows } = view;\n const { galleryConfig: { heroImage, tile: tileConfig, header } = {}, selectionMode } = meta;\n\n const headerColumn = useMemo(\n () => (header?.field ? columns.find(col => col.field.id === header.field) : undefined),\n [header, columns]\n );\n\n const selectionColumn = useMemo(\n () => columns.find(col => col.field.id === rowSelectColumnMeta.field.id),\n [columns]\n );\n\n const visibleColumns = useMemo(() => {\n const cols = [...columns].filter(\n col => !col.hidden && col.field.type !== FieldType.ACTION_FIELD_TYPE\n );\n cols.sort((colA, colB) => (colA.order ?? 0) - (colB.order ?? 0));\n return cols;\n }, [columns]);\n\n return (\n <RsCardWrapper>\n <GalleryContainer\n data-test-id='gallery'\n data-testid='gallery'\n view={view}\n isFullscreen={isFullscreen}\n image={heroImage}\n tile={tileConfig}\n >\n <WarningBanner warningMessages={view.warningMessages} />\n <Toolbar view={view} />\n <RenderView view={view} type={EXTERNAL_FILTERS} />\n <StyledVirtualizeContainer className='container'>\n <Virtualiser\n id='rootVirtualiser'\n rowContainerClass='grid-container'\n view={view}\n bufferMultiplier={0.8}\n >\n {rows?.length\n ? rows.map(row =>\n selectionMode === SELECTION_MODES.multi && selectionColumn ? (\n <GalleryCheckboxCard\n key={row.reactKey}\n meta={meta}\n row={row}\n visibleColumns={visibleColumns}\n headerColumn={headerColumn}\n selectionColumn={selectionColumn}\n />\n ) : (\n <GalleryCard\n key={row.reactKey}\n meta={meta}\n row={row}\n visibleColumns={visibleColumns}\n headerColumn={headerColumn}\n />\n )\n )\n : []}\n </Virtualiser>\n <LoadingIndicator view={view} show={!rows || !!view.isLoading} />\n </StyledVirtualizeContainer>\n </GalleryContainer>\n </RsCardWrapper>\n );\n}\n\nGallery.displayName = 'Gallery';\n\nexport default Gallery;\n"]}
|
|
@@ -18,9 +18,9 @@ export declare const isInlinePlacement: (placement: RsCoreTypes.HeroImagePlaceme
|
|
|
18
18
|
* @param props.meta - Metadata including gallery configuration.
|
|
19
19
|
* @param props.headerColumn - The column used for the card header.
|
|
20
20
|
* @param props.actionColumn - The column used for card actions.
|
|
21
|
-
* @returns An object containing the card's label, image, and fields to be displayed.
|
|
21
|
+
* @returns An object containing the card's label, image, footer, and fields to be displayed.
|
|
22
22
|
*/
|
|
23
|
-
export declare function getCardData({ row, visibleColumns, meta, headerColumn }: GalleryCardProps): Pick<SelectionCardDisplayProps, 'label' | 'image' | 'fields' | 'aria-label'>;
|
|
23
|
+
export declare function getCardData({ row, visibleColumns, meta, headerColumn }: GalleryCardProps): Pick<SelectionCardDisplayProps, 'label' | 'image' | 'fields' | 'aria-label' | 'footer'>;
|
|
24
24
|
/**
|
|
25
25
|
* Extracts UI-related props from a row for card components.
|
|
26
26
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/utils.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,KAAK,EAAkB,SAAS,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAEpG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAIxD,eAAO,MAAM,2BAA2B;;;;CAImC,CAAC;AAG5E,eAAO,MAAM,uBAAuB,EAAE,WAAW,CAAC,kBAA2B,CAAC;AAC9E,eAAO,MAAM,kBAAkB,EAAE,SAAsB,CAAC;AAExD,eAAO,MAAM,iBAAiB,GAC5B,WAAW,WAAW,CAAC,kBAAkB,KACxC,SAAS,IAAI,OAAO,CAAC,WAAW,CAAC,kBAAkB,EAAE,MAAM,GAAG,OAAO,CAEvE,CAAC;AAuCF;;;;;;;;;;GAUG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,cAAc,EACd,IAAI,EACJ,YAAY,EACb,EAAE,gBAAgB,GAAG,IAAI,
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Gallery/utils.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAW,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC3E,OAAO,KAAK,EAAkB,SAAS,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAEpG,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AAIxD,eAAO,MAAM,2BAA2B;;;;CAImC,CAAC;AAG5E,eAAO,MAAM,uBAAuB,EAAE,WAAW,CAAC,kBAA2B,CAAC;AAC9E,eAAO,MAAM,kBAAkB,EAAE,SAAsB,CAAC;AAExD,eAAO,MAAM,iBAAiB,GAC5B,WAAW,WAAW,CAAC,kBAAkB,KACxC,SAAS,IAAI,OAAO,CAAC,WAAW,CAAC,kBAAkB,EAAE,MAAM,GAAG,OAAO,CAEvE,CAAC;AAuCF;;;;;;;;;;GAUG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,cAAc,EACd,IAAI,EACJ,YAAY,EACb,EAAE,gBAAgB,GAAG,IAAI,CACxB,yBAAyB,EACzB,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,YAAY,GAAG,QAAQ,CACvD,CAgEA;AAED;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAAE,GAAG,EAAE,EAAE;IAAE,GAAG,EAAE,WAAW,CAAC,GAAG,CAAA;CAAE;;;EAM/D"}
|
|
@@ -48,23 +48,56 @@ function getImageData(meta, row) {
|
|
|
48
48
|
* @param props.meta - Metadata including gallery configuration.
|
|
49
49
|
* @param props.headerColumn - The column used for the card header.
|
|
50
50
|
* @param props.actionColumn - The column used for card actions.
|
|
51
|
-
* @returns An object containing the card's label, image, and fields to be displayed.
|
|
51
|
+
* @returns An object containing the card's label, image, footer, and fields to be displayed.
|
|
52
52
|
*/
|
|
53
53
|
export function getCardData({ row, visibleColumns, meta, headerColumn }) {
|
|
54
|
-
const { galleryConfig: { heroImage, showFieldLabels = true } = {} } = meta;
|
|
54
|
+
const { galleryConfig: { heroImage, tile: tileConfig, showFieldLabels = true } = {} } = meta;
|
|
55
55
|
// Must set execution context for each column to ensure correct value retrieval
|
|
56
56
|
visibleColumns.forEach(col => col.setExecutionContext(row));
|
|
57
|
+
const rowData = row.getContext().getValue();
|
|
57
58
|
const fields = visibleColumns.map(col => ({
|
|
58
59
|
id: col.field.id,
|
|
59
|
-
value: _jsx(GalleryFieldValue, { column: col, row: row }),
|
|
60
60
|
...(showFieldLabels && { name: col.getContext()?.getLabel() }),
|
|
61
|
-
...(col.field.layoutMode && { variant: col.field.layoutMode })
|
|
61
|
+
...(col.field.layoutMode && { variant: col.field.layoutMode }),
|
|
62
|
+
// TODO: Add truncation for non-tile cards once `truncate` is typed at
|
|
63
|
+
// the field-level API.
|
|
64
|
+
...(!heroImage && tileConfig
|
|
65
|
+
? { value: String(rowData[col.field.id] ?? ''), truncate: true }
|
|
66
|
+
: { value: _jsx(GalleryFieldValue, { column: col, row: row }) })
|
|
62
67
|
}));
|
|
63
|
-
const
|
|
68
|
+
const heroImageData = heroImage ? getImageData(meta, row) : undefined;
|
|
69
|
+
let image = heroImageData;
|
|
70
|
+
if (!heroImage && tileConfig) {
|
|
71
|
+
const foregroundColor = tileConfig.foregroundColor.field in rowData
|
|
72
|
+
? String(rowData[tileConfig.foregroundColor.field])
|
|
73
|
+
: undefined;
|
|
74
|
+
const backgroundColor = tileConfig.backgroundColor.field in rowData
|
|
75
|
+
? String(rowData[tileConfig.backgroundColor.field])
|
|
76
|
+
: undefined;
|
|
77
|
+
if (foregroundColor && backgroundColor) {
|
|
78
|
+
const tileName = tileConfig.iconName && tileConfig.iconName.field in rowData
|
|
79
|
+
? String(rowData[tileConfig.iconName.field]) || undefined
|
|
80
|
+
: undefined;
|
|
81
|
+
const tileText = tileConfig.text && tileConfig.text.field in rowData
|
|
82
|
+
? String(rowData[tileConfig.text.field]) || undefined
|
|
83
|
+
: undefined;
|
|
84
|
+
const tileBase = {
|
|
85
|
+
foregroundColor,
|
|
86
|
+
backgroundColor
|
|
87
|
+
};
|
|
88
|
+
if (tileName) {
|
|
89
|
+
image = { ...tileBase, icon: tileName };
|
|
90
|
+
}
|
|
91
|
+
else if (tileText) {
|
|
92
|
+
image = { ...tileBase, text: tileText };
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
const footer = meta.galleryConfig?.renderCardFooter?.(rowData) ?? null;
|
|
64
97
|
const label = _jsx(GalleryHeader, { headerColumn: headerColumn, row: row });
|
|
65
98
|
const headerValue = row.getContext()?.getRowHeader()?.getValue();
|
|
66
99
|
const ariaLabel = !isEmpty(headerValue) ? String(headerValue) : undefined;
|
|
67
|
-
return { fields, image, label, 'aria-label': ariaLabel };
|
|
100
|
+
return { fields, image, footer, label, 'aria-label': ariaLabel };
|
|
68
101
|
}
|
|
69
102
|
/**
|
|
70
103
|
* Extracts UI-related props from a row for card components.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/utils.tsx"],"names":[],"mappings":"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","sourcesContent":["import { isEmpty, type RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { ImagePlacement, ImageSize, SelectionCardDisplayProps } from '@pega/cosmos-react-core';\n\nimport type { GalleryCardProps } from './Gallery.types';\nimport GalleryFieldValue from './Components/GalleryFieldValue';\nimport GalleryHeader from './Components/GalleryHeader';\n\nexport const GALLERY_IMAGE_PLACEMENT_MAP = {\n left: 'inline-start',\n right: 'inline-end',\n top: 'block-start'\n} as const satisfies Record<RsCoreTypes.HeroImagePlacement, ImagePlacement>;\n\nconst INLINE_PLACEMENTS: RsCoreTypes.HeroImagePlacement[] = ['left', 'right'] as const;\nexport const DEFAULT_IMAGE_PLACEMENT: RsCoreTypes.HeroImagePlacement = 'left';\nexport const DEFAULT_IMAGE_SIZE: ImageSize = 'flexible';\n\nexport const isInlinePlacement = (\n placement: RsCoreTypes.HeroImagePlacement\n): placement is Extract<RsCoreTypes.HeroImagePlacement, 'left' | 'right'> => {\n return INLINE_PLACEMENTS.includes(placement);\n};\n\n/**\n * Extracts image data from the provided metadata and row context.\n *\n * @param meta - The metadata object containing gallery configuration.\n * @param row - The row object providing context and data values.\n * @returns An object containing:\n * - `src`: The image source URL.\n * - `alt`: The alternative text for the image.\n * - `placement`: The placement of the image within the gallery.\n * - `size`: The size of the image.\n */\nfunction getImageData(\n meta: RsCoreTypes.Meta,\n row: RsCoreTypes.Row\n): {\n src: string;\n alt: string;\n placement: ImagePlacement;\n size: ImageSize;\n} {\n const { galleryConfig: { heroImage: { source, altText, placement, size } = {} } = {} } = meta;\n const rowData = row.getContext().getValue();\n\n let altTextValue = '';\n if (altText && 'field' in altText) {\n altTextValue = altText.field in rowData ? String(rowData[altText.field]) : '';\n } else if (altText && 'value' in altText) {\n altTextValue = altText.value;\n }\n\n const imageUrl = source?.field && source?.field in rowData ? String(rowData[source.field]) : '';\n const imagePlacement = GALLERY_IMAGE_PLACEMENT_MAP[placement ?? DEFAULT_IMAGE_PLACEMENT];\n const imageSize = size || DEFAULT_IMAGE_SIZE;\n\n return { src: imageUrl, alt: altTextValue, placement: imagePlacement, size: imageSize };\n}\n\n/**\n * Generates the data required to display a card in the gallery view.\n *\n * @param props - The properties required to generate the card data.\n * @param props.row - The data for the current row.\n * @param props.visibleColumns - The columns that are visible in the gallery.\n * @param props.meta - Metadata including gallery configuration.\n * @param props.headerColumn - The column used for the card header.\n * @param props.actionColumn - The column used for card actions.\n * @returns An object containing the card's label, image, and fields to be displayed.\n */\nexport function getCardData({\n row,\n visibleColumns,\n meta,\n headerColumn\n}: GalleryCardProps): Pick<SelectionCardDisplayProps, 'label' | 'image' | 'fields' | 'aria-label'> {\n const { galleryConfig: { heroImage, showFieldLabels = true } = {} } = meta;\n\n // Must set execution context for each column to ensure correct value retrieval\n visibleColumns.forEach(col => col.setExecutionContext(row));\n\n const fields = visibleColumns.map(col => ({\n id: col.field.id,\n value: <GalleryFieldValue column={col} row={row} />,\n ...(showFieldLabels && { name: col.getContext()?.getLabel() }),\n ...(col.field.layoutMode && { variant: col.field.layoutMode })\n }));\n\n const image = heroImage ? getImageData(meta, row) : undefined;\n\n const label = <GalleryHeader headerColumn={headerColumn} row={row} />;\n\n const headerValue = row.getContext()?.getRowHeader()?.getValue();\n const ariaLabel = !isEmpty(headerValue) ? String(headerValue) : undefined;\n\n return { fields, image, label, 'aria-label': ariaLabel };\n}\n\n/**\n * Extracts UI-related props from a row for card components.\n *\n * @param props - The properties containing the row.\n * @param props.row - The data row.\n * @returns An object containing aria-rowindex and data-key for the card.\n */\nexport function getCardUIProps({ row }: { row: RsCoreTypes.Row }) {\n const uiProps = row.getUIProps();\n return {\n 'aria-rowindex': uiProps['aria-rowindex'],\n 'data-key': uiProps['data-key']\n };\n}\n"]}
|
|
1
|
+
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../Core/Views/Gallery/utils.tsx"],"names":[],"mappings":"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","sourcesContent":["import { isEmpty, type RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { ImagePlacement, ImageSize, SelectionCardDisplayProps } from '@pega/cosmos-react-core';\n\nimport type { GalleryCardProps } from './Gallery.types';\nimport GalleryFieldValue from './Components/GalleryFieldValue';\nimport GalleryHeader from './Components/GalleryHeader';\n\nexport const GALLERY_IMAGE_PLACEMENT_MAP = {\n left: 'inline-start',\n right: 'inline-end',\n top: 'block-start'\n} as const satisfies Record<RsCoreTypes.HeroImagePlacement, ImagePlacement>;\n\nconst INLINE_PLACEMENTS: RsCoreTypes.HeroImagePlacement[] = ['left', 'right'] as const;\nexport const DEFAULT_IMAGE_PLACEMENT: RsCoreTypes.HeroImagePlacement = 'left';\nexport const DEFAULT_IMAGE_SIZE: ImageSize = 'flexible';\n\nexport const isInlinePlacement = (\n placement: RsCoreTypes.HeroImagePlacement\n): placement is Extract<RsCoreTypes.HeroImagePlacement, 'left' | 'right'> => {\n return INLINE_PLACEMENTS.includes(placement);\n};\n\n/**\n * Extracts image data from the provided metadata and row context.\n *\n * @param meta - The metadata object containing gallery configuration.\n * @param row - The row object providing context and data values.\n * @returns An object containing:\n * - `src`: The image source URL.\n * - `alt`: The alternative text for the image.\n * - `placement`: The placement of the image within the gallery.\n * - `size`: The size of the image.\n */\nfunction getImageData(\n meta: RsCoreTypes.Meta,\n row: RsCoreTypes.Row\n): {\n src: string;\n alt: string;\n placement: ImagePlacement;\n size: ImageSize;\n} {\n const { galleryConfig: { heroImage: { source, altText, placement, size } = {} } = {} } = meta;\n const rowData = row.getContext().getValue();\n\n let altTextValue = '';\n if (altText && 'field' in altText) {\n altTextValue = altText.field in rowData ? String(rowData[altText.field]) : '';\n } else if (altText && 'value' in altText) {\n altTextValue = altText.value;\n }\n\n const imageUrl = source?.field && source?.field in rowData ? String(rowData[source.field]) : '';\n const imagePlacement = GALLERY_IMAGE_PLACEMENT_MAP[placement ?? DEFAULT_IMAGE_PLACEMENT];\n const imageSize = size || DEFAULT_IMAGE_SIZE;\n\n return { src: imageUrl, alt: altTextValue, placement: imagePlacement, size: imageSize };\n}\n\n/**\n * Generates the data required to display a card in the gallery view.\n *\n * @param props - The properties required to generate the card data.\n * @param props.row - The data for the current row.\n * @param props.visibleColumns - The columns that are visible in the gallery.\n * @param props.meta - Metadata including gallery configuration.\n * @param props.headerColumn - The column used for the card header.\n * @param props.actionColumn - The column used for card actions.\n * @returns An object containing the card's label, image, footer, and fields to be displayed.\n */\nexport function getCardData({\n row,\n visibleColumns,\n meta,\n headerColumn\n}: GalleryCardProps): Pick<\n SelectionCardDisplayProps,\n 'label' | 'image' | 'fields' | 'aria-label' | 'footer'\n> {\n const { galleryConfig: { heroImage, tile: tileConfig, showFieldLabels = true } = {} } = meta;\n\n // Must set execution context for each column to ensure correct value retrieval\n visibleColumns.forEach(col => col.setExecutionContext(row));\n\n const rowData = row.getContext().getValue();\n\n const fields = visibleColumns.map(col => ({\n id: col.field.id,\n ...(showFieldLabels && { name: col.getContext()?.getLabel() }),\n ...(col.field.layoutMode && { variant: col.field.layoutMode }),\n // TODO: Add truncation for non-tile cards once `truncate` is typed at\n // the field-level API.\n ...(!heroImage && tileConfig\n ? { value: String(rowData[col.field.id] ?? ''), truncate: true }\n : { value: <GalleryFieldValue column={col} row={row} /> })\n }));\n\n const heroImageData = heroImage ? getImageData(meta, row) : undefined;\n\n let image: SelectionCardDisplayProps['image'] = heroImageData;\n\n if (!heroImage && tileConfig) {\n const foregroundColor =\n tileConfig.foregroundColor.field in rowData\n ? String(rowData[tileConfig.foregroundColor.field])\n : undefined;\n const backgroundColor =\n tileConfig.backgroundColor.field in rowData\n ? String(rowData[tileConfig.backgroundColor.field])\n : undefined;\n\n if (foregroundColor && backgroundColor) {\n const tileName =\n tileConfig.iconName && tileConfig.iconName.field in rowData\n ? String(rowData[tileConfig.iconName.field]) || undefined\n : undefined;\n const tileText =\n tileConfig.text && tileConfig.text.field in rowData\n ? String(rowData[tileConfig.text.field]) || undefined\n : undefined;\n\n const tileBase = {\n foregroundColor,\n backgroundColor\n };\n\n if (tileName) {\n image = { ...tileBase, icon: tileName };\n } else if (tileText) {\n image = { ...tileBase, text: tileText };\n }\n }\n }\n\n const footer = meta.galleryConfig?.renderCardFooter?.(rowData) ?? null;\n\n const label = <GalleryHeader headerColumn={headerColumn} row={row} />;\n\n const headerValue = row.getContext()?.getRowHeader()?.getValue();\n const ariaLabel = !isEmpty(headerValue) ? String(headerValue) : undefined;\n\n return { fields, image, footer, label, 'aria-label': ariaLabel };\n}\n\n/**\n * Extracts UI-related props from a row for card components.\n *\n * @param props - The properties containing the row.\n * @param props.row - The data row.\n * @returns An object containing aria-rowindex and data-key for the card.\n */\nexport function getCardUIProps({ row }: { row: RsCoreTypes.Row }) {\n const uiProps = row.getUIProps();\n return {\n 'aria-rowindex': uiProps['aria-rowindex'],\n 'data-key': uiProps['data-key']\n };\n}\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pega/lists-react",
|
|
3
|
-
"version": "9.0.0-build.23.
|
|
3
|
+
"version": "9.0.0-build.23.4",
|
|
4
4
|
"description": "Repeating view structures such as Table, Gallery(Repeating layouts), Kanban etc.",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE",
|
|
6
6
|
"author": "Pegasystems",
|
|
@@ -14,9 +14,9 @@
|
|
|
14
14
|
"build": "tsc -b tsconfig.build.json"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@pega/cosmos-react-condition-builder": "9.0.0-build.23.
|
|
18
|
-
"@pega/cosmos-react-core": "9.0.0-build.23.
|
|
19
|
-
"@pega/cosmos-react-rte": "9.0.0-build.23.
|
|
17
|
+
"@pega/cosmos-react-condition-builder": "9.0.0-build.23.4",
|
|
18
|
+
"@pega/cosmos-react-core": "9.0.0-build.23.4",
|
|
19
|
+
"@pega/cosmos-react-rte": "9.0.0-build.23.4",
|
|
20
20
|
"@types/lodash-es": "^4.17.12",
|
|
21
21
|
"@types/react": "^17.0.62 || ^18.3.3",
|
|
22
22
|
"@types/react-dom": "^17.0.20 || ^18.3.0",
|
|
@@ -24,8 +24,8 @@
|
|
|
24
24
|
"dayjs": "^1.11.13",
|
|
25
25
|
"fast-deep-equal": "^3.1.3",
|
|
26
26
|
"lodash-es": "^4.17.23",
|
|
27
|
-
"pega-repeating-structures-core": "npm:@pega/lists-core@9.0.0-build.23.
|
|
28
|
-
"pega-ui-list-data-apis": "npm:@pega/lists-core-utils@9.0.0-build.23.
|
|
27
|
+
"pega-repeating-structures-core": "npm:@pega/lists-core@9.0.0-build.23.4",
|
|
28
|
+
"pega-ui-list-data-apis": "npm:@pega/lists-core-utils@9.0.0-build.23.4",
|
|
29
29
|
"polished": "^4.1.0",
|
|
30
30
|
"prop-types": "^15.8.1",
|
|
31
31
|
"react": "^17.0.0 || ^18.0.0",
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
"@testing-library/react": "^16.0.0",
|
|
45
45
|
"@testing-library/user-event": "^14.6.1",
|
|
46
46
|
"jest-axe": "^8.0.0",
|
|
47
|
-
"srs-utils": "9.0.0-build.23.
|
|
47
|
+
"srs-utils": "9.0.0-build.23.4",
|
|
48
48
|
"typescript": "~5.9.3"
|
|
49
49
|
}
|
|
50
50
|
}
|