npm - @pega/lists-react - Versions diffs - 10.0.0-build.4.2 → 10.0.0-build.4.20 - Mend

@pega/lists-react 10.0.0-build.4.2 → 10.0.0-build.4.20

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.

Files changed (118) hide show

package/lib/Core/{Views/Gallery/Components/GalleryHeader.js → Components/Card/CardHeader.js} RENAMED Viewed

@@ -1,15 +1,16 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
 import styled from 'styled-components';
-import RenderingEngine from '../../../Components/RenderingEngine/RenderCell';
+import RenderingEngine from '../RenderingEngine/RenderCell';
 const StyledHeaderContainer = styled.div `
   word-break: break-word;
 `;
-function GalleryHeader({ headerColumn, row }) {
+function CardHeader({ headerColumn, row }) {
     if (!headerColumn) {
         return null;
     }
     headerColumn?.setExecutionContext(row);
     return (_jsx(StyledHeaderContainer, { children: _jsx(RenderingEngine, { ...headerColumn.getRenderingEngineProps() }) }));
 }
-export default GalleryHeader;
-//# sourceMappingURL=GalleryHeader.js.map
+export default memo(CardHeader);
+//# sourceMappingURL=CardHeader.js.map

package/lib/Core/Components/Card/CardHeader.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"CardHeader.js","sourceRoot":"","sources":["../../../../Core/Components/Card/CardHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAC7B,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAIvC,OAAO,eAAe,MAAM,+BAA+B,CAAC;AAO5D,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEvC,CAAC;AAEF,SAAS,UAAU,CAAC,EAAE,YAAY,EAAE,GAAG,EAAmB;IACxD,IAAI,CAAC,YAAY,EAAE,CAAC;QAClB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,YAAY,EAAE,mBAAmB,CAAC,GAAG,CAAC,CAAC;IAEvC,OAAO,CACL,KAAC,qBAAqB,cACpB,KAAC,eAAe,OAAK,YAAY,CAAC,uBAAuB,EAAE,GAAI,GACzC,CACzB,CAAC;AACJ,CAAC;AAED,eAAe,IAAI,CAAC,UAAU,CAAC,CAAC","sourcesContent":["import { memo } from 'react';\nimport styled from 'styled-components';\n\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport RenderingEngine from '../RenderingEngine/RenderCell';\n\ntype CardHeaderProps = {\n headerColumn?: RsCoreTypes.Column;\n row: RsCoreTypes.Row;\n};\n\nconst StyledHeaderContainer = styled.div`\n word-break: break-word;\n`;\n\nfunction CardHeader({ headerColumn, row }: CardHeaderProps) {\n if (!headerColumn) {\n return null;\n }\n\n headerColumn?.setExecutionContext(row);\n\n return (\n <StyledHeaderContainer>\n <RenderingEngine {...headerColumn.getRenderingEngineProps()} />\n </StyledHeaderContainer>\n );\n}\n\nexport default memo(CardHeader);\n"]}

package/lib/Core/Components/Card/CardSubHeading.d.ts ADDED Viewed

@@ -0,0 +1,10 @@
+import type { ReactElement } from 'react';
+import type { RsCoreTypes } from 'pega-repeating-structures-core';
+interface CardSubHeadingProps {
+    subHeadingColumn: RsCoreTypes.Column;
+    row: RsCoreTypes.Row;
+}
+declare function CardSubHeading({ subHeadingColumn, row }: CardSubHeadingProps): ReactElement;
+declare const _default: import("react").MemoExoticComponent<typeof CardSubHeading>;
+export default _default;
+//# sourceMappingURL=CardSubHeading.d.ts.map

package/lib/Core/Components/Card/CardSubHeading.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"CardSubHeading.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Card/CardSubHeading.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAIlE,UAAU,mBAAmB;IAC3B,gBAAgB,EAAE,WAAW,CAAC,MAAM,CAAC;IACrC,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC;CACtB;AAED,iBAAS,cAAc,CAAC,EAAE,gBAAgB,EAAE,GAAG,EAAE,EAAE,mBAAmB,GAAG,YAAY,CAIpF;;AAED,wBAAoC"}

package/lib/Core/Components/Card/CardSubHeading.js ADDED Viewed

@@ -0,0 +1,9 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { memo } from 'react';
+import RenderingEngine from '../RenderingEngine/RenderCell';
+function CardSubHeading({ subHeadingColumn, row }) {
+    subHeadingColumn.setExecutionContext(row);
+    return _jsx(RenderingEngine, { ...subHeadingColumn.getRenderingEngineProps() });
+}
+export default memo(CardSubHeading);
+//# sourceMappingURL=CardSubHeading.js.map

package/lib/Core/Components/Card/CardSubHeading.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"CardSubHeading.js","sourceRoot":"","sources":["../../../../Core/Components/Card/CardSubHeading.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAK7B,OAAO,eAAe,MAAM,+BAA+B,CAAC;AAO5D,SAAS,cAAc,CAAC,EAAE,gBAAgB,EAAE,GAAG,EAAuB;IACpE,gBAAgB,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC;IAE1C,OAAO,KAAC,eAAe,OAAK,gBAAgB,CAAC,uBAAuB,EAAE,GAAI,CAAC;AAC7E,CAAC;AAED,eAAe,IAAI,CAAC,cAAc,CAAC,CAAC","sourcesContent":["import { memo } from 'react';\nimport type { ReactElement } from 'react';\n\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport RenderingEngine from '../RenderingEngine/RenderCell';\n\ninterface CardSubHeadingProps {\n subHeadingColumn: RsCoreTypes.Column;\n row: RsCoreTypes.Row;\n}\n\nfunction CardSubHeading({ subHeadingColumn, row }: CardSubHeadingProps): ReactElement {\n subHeadingColumn.setExecutionContext(row);\n\n return <RenderingEngine {...subHeadingColumn.getRenderingEngineProps()} />;\n}\n\nexport default memo(CardSubHeading);\n"]}

package/lib/Core/Components/Card/cardData.d.ts ADDED Viewed

@@ -0,0 +1,48 @@
+import { type RsCoreTypes } from 'pega-repeating-structures-core';
+import type { CardConfig } from 'pega-repeating-structures-core/types/Meta.types';
+import type { ImageSize, SelectionCardDisplayProps } from '@pega/cosmos-react-core';
+export declare const GALLERY_IMAGE_PLACEMENT_MAP: {
+    readonly left: "inline-start";
+    readonly right: "inline-end";
+    readonly top: "block-start";
+};
+export declare const DEFAULT_IMAGE_PLACEMENT: RsCoreTypes.HeroImagePlacement;
+export declare const DEFAULT_IMAGE_SIZE: ImageSize;
+export declare const isInlinePlacement: (placement: RsCoreTypes.HeroImagePlacement) => placement is Extract<RsCoreTypes.HeroImagePlacement, "left" | "right">;
+/**
+ * Extracts UI-related props from a row for card components.
+ *
+ * @param props - The properties containing the row.
+ * @param props.row - The data row.
+ * @returns An object containing card-safe row metadata.
+ */
+export declare function getCardUIProps({ row }: {
+    row: RsCoreTypes.Row;
+}): {
+    'data-key': string;
+};
+interface CardDataProps {
+    row: RsCoreTypes.Row;
+    visibleColumns: RsCoreTypes.Column[];
+    cardConfig?: Pick<CardConfig, 'heroImage' | 'tile' | 'showFieldLabels' | 'renderCardFooter'>;
+    headerColumn?: RsCoreTypes.Column;
+    subHeadingsColumns?: RsCoreTypes.Column[];
+}
+interface CardColumns {
+    visibleColumns: RsCoreTypes.Column[];
+    headerColumn?: RsCoreTypes.Column;
+    subHeadingsColumns?: RsCoreTypes.Column[];
+}
+/**
+ * Resolves the columns used to render a configured card.
+ */
+export declare function getCardColumns(columns: RsCoreTypes.Column[], { header, subHeadings }: Pick<CardConfig, 'header' | 'subHeadings'>): CardColumns;
+/**
+ * Generates SelectionCardDisplay data from card content configuration.
+ *
+ * @param props - Card data dependencies.
+ * @returns Data used to render a selection card.
+ */
+export declare function getCardData({ row, visibleColumns, cardConfig, headerColumn, subHeadingsColumns }: CardDataProps): Pick<SelectionCardDisplayProps, 'label' | 'subheading' | 'image' | 'fields' | 'aria-label' | 'footer'>;
+export {};
+//# sourceMappingURL=cardData.d.ts.map

package/lib/Core/Components/Card/cardData.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"cardData.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Card/cardData.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AACtF,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iDAAiD,CAAC;AAClF,OAAO,KAAK,EAAkB,SAAS,EAAE,yBAAyB,EAAE,MAAM,yBAAyB,CAAC;AAMpG,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;AA+BF;;;;;;GAMG;AACH,wBAAgB,cAAc,CAAC,EAAE,GAAG,EAAE,EAAE;IAAE,GAAG,EAAE,WAAW,CAAC,GAAG,CAAA;CAAE;;EAK/D;AAED,UAAU,aAAa;IACrB,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC;IACrB,cAAc,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC;IACrC,UAAU,CAAC,EAAE,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,MAAM,GAAG,iBAAiB,GAAG,kBAAkB,CAAC,CAAC;IAC7F,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC;IAClC,kBAAkB,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC;CAC3C;AAED,UAAU,WAAW;IACnB,cAAc,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC;IACrC,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC;IAClC,kBAAkB,CAAC,EAAE,WAAW,CAAC,MAAM,EAAE,CAAC;CAC3C;AAED;;GAEG;AACH,wBAAgB,cAAc,CAC5B,OAAO,EAAE,WAAW,CAAC,MAAM,EAAE,EAC7B,EAAE,MAAM,EAAE,WAAW,EAAE,EAAE,IAAI,CAAC,UAAU,EAAE,QAAQ,GAAG,aAAa,CAAC,GAClE,WAAW,CAab;AAED;;;;;GAKG;AACH,wBAAgB,WAAW,CAAC,EAC1B,GAAG,EACH,cAAc,EACd,UAAU,EACV,YAAY,EACZ,kBAAkB,EACnB,EAAE,aAAa,GAAG,IAAI,CACrB,yBAAyB,EACzB,OAAO,GAAG,YAAY,GAAG,OAAO,GAAG,QAAQ,GAAG,YAAY,GAAG,QAAQ,CACtE,CAmEA"}

package/lib/Core/{Views/Gallery/utils.js → Components/Card/cardData.js} RENAMED Viewed

@@ -1,7 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { isEmpty } from 'pega-repeating-structures-core';
-import GalleryFieldValue from './Components/GalleryFieldValue';
-import GalleryHeader from './Components/GalleryHeader';
+import { FieldType, isEmpty } from 'pega-repeating-structures-core';
+import CardFieldValue from './CardFieldValue';
+import CardHeader from './CardHeader';
+import CardSubHeading from './CardSubHeading';
 export const GALLERY_IMAGE_PLACEMENT_MAP = {
     left: 'inline-start',
     right: 'inline-end',
@@ -14,18 +15,10 @@ export const isInlinePlacement = (placement) => {
     return INLINE_PLACEMENTS.includes(placement);
 };
 /**
- * Extracts image data from the provided metadata and row context.
- *
- * @param meta - The metadata object containing gallery configuration.
- * @param row - The row object providing context and data values.
- * @returns An object containing:
- *   - `src`: The image source URL.
- *   - `alt`: The alternative text for the image.
- *   - `placement`: The placement of the image within the gallery.
- *   - `size`: The size of the image.
+ * Extracts image data from a HeroImage config and row context.
  */
-function getImageData(meta, row) {
-    const { galleryConfig: { heroImage: { source, altText, placement, size } = {} } = {} } = meta;
+function getHeroImageData(heroImage, row) {
+    const { source, altText, placement, size } = heroImage;
     const rowData = row.getContext().getValue();
     let altTextValue = '';
     if (altText && 'field' in altText) {
@@ -40,33 +33,55 @@ function getImageData(meta, row) {
     return { src: imageUrl, alt: altTextValue, placement: imagePlacement, size: imageSize };
 }
 /**
- * Generates the data required to display a card in the gallery view.
+ * Extracts UI-related props from a row for card components.
  *
- * @param props - The properties required to generate the card data.
- * @param props.row - The data for the current row.
- * @param props.visibleColumns - The columns that are visible in the gallery.
- * @param props.meta - Metadata including gallery configuration.
- * @param props.headerColumn - The column used for the card header.
- * @param props.actionColumn - The column used for card actions.
- * @returns An object containing the card's label, image, footer, and fields to be displayed.
+ * @param props - The properties containing the row.
+ * @param props.row - The data row.
+ * @returns An object containing card-safe row metadata.
+ */
+export function getCardUIProps({ row }) {
+    const uiProps = row.getUIProps();
+    return {
+        'data-key': uiProps['data-key']
+    };
+}
+/**
+ * Resolves the columns used to render a configured card.
  */
-export function getCardData({ row, visibleColumns, meta, headerColumn }) {
-    const { galleryConfig: { heroImage, tile: tileConfig, showFieldLabels = true } = {} } = meta;
-    // Must set execution context for each column to ensure correct value retrieval
+export function getCardColumns(columns, { header, subHeadings }) {
+    const visibleColumns = [...columns]
+        .filter(column => !column.hidden && column.field.type !== FieldType.ACTION_FIELD_TYPE)
+        .sort((first, second) => (first.order ?? 0) - (second.order ?? 0));
+    const headerColumn = header?.field
+        ? columns.find(column => column.field.id === header.field)
+        : undefined;
+    const subHeadingsColumns = subHeadings?.flatMap(({ field }) => {
+        const column = columns.find(candidate => candidate.field.id === field);
+        return column ? [column] : [];
+    });
+    return { visibleColumns, headerColumn, subHeadingsColumns };
+}
+/**
+ * Generates SelectionCardDisplay data from card content configuration.
+ *
+ * @param props - Card data dependencies.
+ * @returns Data used to render a selection card.
+ */
+export function getCardData({ row, visibleColumns, cardConfig, headerColumn, subHeadingsColumns }) {
+    const { heroImage, tile: tileConfig, showFieldLabels = true, renderCardFooter } = cardConfig ?? {};
     visibleColumns.forEach(col => col.setExecutionContext(row));
     const rowData = row.getContext().getValue();
     const fields = visibleColumns.map(col => ({
         id: col.field.id,
         ...(showFieldLabels && { name: col.getContext()?.getLabel() }),
         ...(col.field.layoutMode && { variant: col.field.layoutMode }),
-        // TODO: Add truncation for non-tile cards once `truncate` is typed at
-        // the field-level API.
         ...(!heroImage && tileConfig
             ? { value: String(rowData[col.field.id] ?? ''), truncate: true }
-            : { value: _jsx(GalleryFieldValue, { column: col, row: row }) })
+            : { value: _jsx(CardFieldValue, { column: col, row: row }) })
     }));
-    const heroImageData = heroImage ? getImageData(meta, row) : undefined;
-    let image = heroImageData;
+    let image = heroImage
+        ? getHeroImageData(heroImage, row)
+        : undefined;
     if (!heroImage && tileConfig) {
         const foregroundColor = tileConfig.foregroundColor.field in rowData
             ? String(rowData[tileConfig.foregroundColor.field])
@@ -81,10 +96,7 @@ export function getCardData({ row, visibleColumns, meta, headerColumn }) {
             const tileText = tileConfig.text && tileConfig.text.field in rowData
                 ? String(rowData[tileConfig.text.field]) || undefined
                 : undefined;
-            const tileBase = {
-                foregroundColor,
-                backgroundColor
-            };
+            const tileBase = { foregroundColor, backgroundColor };
             if (tileName) {
                 image = { ...tileBase, icon: tileName };
             }
@@ -93,23 +105,14 @@ export function getCardData({ row, visibleColumns, meta, headerColumn }) {
             }
         }
     }
-    const footer = meta.galleryConfig?.renderCardFooter?.(rowData) ?? null;
-    const label = _jsx(GalleryHeader, { headerColumn: headerColumn, row: row });
+    const footer = renderCardFooter?.(rowData) ?? null;
+    const label = _jsx(CardHeader, { headerColumn: headerColumn, row: row });
+    const subheading = subHeadingsColumns?.map(column => (_jsx(CardSubHeading, { subHeadingColumn: column, row: row }, column.field.id)));
     const headerValue = row.getContext()?.getRowHeader()?.getValue();
-    const ariaLabel = !isEmpty(headerValue) ? String(headerValue) : undefined;
-    return { fields, image, footer, label, 'aria-label': ariaLabel };
-}
-/**
- * Extracts UI-related props from a row for card components.
- *
- * @param props - The properties containing the row.
- * @param props.row - The data row.
- * @returns An object containing card-safe row metadata.
- */
-export function getCardUIProps({ row }) {
-    const uiProps = row.getUIProps();
-    return {
-        'data-key': uiProps['data-key']
-    };
+    let ariaLabel;
+    if (!headerColumn && !isEmpty(headerValue)) {
+        ariaLabel = String(headerValue);
+    }
+    return { fields, image, footer, label, subheading, 'aria-label': ariaLabel };
 }
-//# sourceMappingURL=utils.js.map
+//# sourceMappingURL=cardData.js.map

package/lib/Core/Components/Card/cardData.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"cardData.js","sourceRoot":"","sources":["../../../../Core/Components/Card/cardData.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FieldType, isEmpty, type RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { CardConfig } from 'pega-repeating-structures-core/types/Meta.types';\nimport type { ImagePlacement, ImageSize, SelectionCardDisplayProps } from '@pega/cosmos-react-core';\n\nimport CardFieldValue from './CardFieldValue';\nimport CardHeader from './CardHeader';\nimport CardSubHeading from './CardSubHeading';\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 a HeroImage config and row context.\n */\nfunction getHeroImageData(\n heroImage: RsCoreTypes.HeroImage,\n row: RsCoreTypes.Row\n): {\n src: string;\n alt: string;\n placement: ImagePlacement;\n size: ImageSize;\n} {\n const { source, altText, placement, size } = heroImage;\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 * 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 card-safe row metadata.\n */\nexport function getCardUIProps({ row }: { row: RsCoreTypes.Row }) {\n const uiProps = row.getUIProps();\n return {\n 'data-key': uiProps['data-key']\n };\n}\n\ninterface CardDataProps {\n row: RsCoreTypes.Row;\n visibleColumns: RsCoreTypes.Column[];\n cardConfig?: Pick<CardConfig, 'heroImage' | 'tile' | 'showFieldLabels' | 'renderCardFooter'>;\n headerColumn?: RsCoreTypes.Column;\n subHeadingsColumns?: RsCoreTypes.Column[];\n}\n\ninterface CardColumns {\n visibleColumns: RsCoreTypes.Column[];\n headerColumn?: RsCoreTypes.Column;\n subHeadingsColumns?: RsCoreTypes.Column[];\n}\n\n/**\n * Resolves the columns used to render a configured card.\n */\nexport function getCardColumns(\n columns: RsCoreTypes.Column[],\n { header, subHeadings }: Pick<CardConfig, 'header' | 'subHeadings'>\n): CardColumns {\n const visibleColumns = [...columns]\n .filter(column => !column.hidden && column.field.type !== FieldType.ACTION_FIELD_TYPE)\n .sort((first, second) => (first.order ?? 0) - (second.order ?? 0));\n const headerColumn = header?.field\n ? columns.find(column => column.field.id === header.field)\n : undefined;\n const subHeadingsColumns = subHeadings?.flatMap(({ field }) => {\n const column = columns.find(candidate => candidate.field.id === field);\n return column ? [column] : [];\n });\n\n return { visibleColumns, headerColumn, subHeadingsColumns };\n}\n\n/**\n * Generates SelectionCardDisplay data from card content configuration.\n *\n * @param props - Card data dependencies.\n * @returns Data used to render a selection card.\n */\nexport function getCardData({\n row,\n visibleColumns,\n cardConfig,\n headerColumn,\n subHeadingsColumns\n}: CardDataProps): Pick<\n SelectionCardDisplayProps,\n 'label' | 'subheading' | 'image' | 'fields' | 'aria-label' | 'footer'\n> {\n const {\n heroImage,\n tile: tileConfig,\n showFieldLabels = true,\n renderCardFooter\n } = cardConfig ?? {};\n\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 ...(!heroImage && tileConfig\n ? { value: String(rowData[col.field.id] ?? ''), truncate: true }\n : { value: <CardFieldValue column={col} row={row} /> })\n }));\n\n let image: SelectionCardDisplayProps['image'] = heroImage\n ? getHeroImageData(heroImage, row)\n : undefined;\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 = { foregroundColor, backgroundColor };\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 = renderCardFooter?.(rowData) ?? null;\n const label = <CardHeader headerColumn={headerColumn} row={row} />;\n const subheading = subHeadingsColumns?.map(column => (\n <CardSubHeading key={column.field.id} subHeadingColumn={column} row={row} />\n ));\n const headerValue = row.getContext()?.getRowHeader()?.getValue();\n let ariaLabel: string | undefined;\n if (!headerColumn && !isEmpty(headerValue)) {\n ariaLabel = String(headerValue);\n }\n\n return { fields, image, footer, label, subheading, 'aria-label': ariaLabel };\n}\n"]}

package/lib/Core/Components/Card/hooks/useRowActions.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useRowActions.d.ts","sourceRoot":"","sources":["../../../../../Core/Components/Card/hooks/useRowActions.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAClE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEtD,UAAU,kBAAkB;IAC1B,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC;IACrB,IAAI,EAAE,WAAW,CAAC,IAAI,CAAC;CACxB;AAED,QAAA,MAAM,aAAa,GAAI,eAGpB,kBAAkB,KAAG,CAAC,MAAM,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC,GAAG,SAuBnD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/Core/Components/Card/hooks/useRowActions.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"useRowActions.js","sourceRoot":"","sources":["../../../../../Core/Components/Card/hooks/useRowActions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAUpC,MAAM,aAAa,GAAG,CAAC,EACrB,GAAG,EACH,IAAI,EACe,EAAyC,EAAE;IAC9D,MAAM,YAAY,GAAG,WAAW,CAAC,KAAK,IAAuB,EAAE;QAC7D,MAAM,UAAU,GAAG,GAAG,CAAC,UAAU,EAAE,CAAC;QACpC,IAAI,UAAU,GAAG,IAAI,CAAC,UAAU,IAAI,EAAE,CAAC;QAEvC,IAAI,CAAC;YACH,MAAM,cAAc,GAAG,MAAM,UAAU,CAAC,mBAAmB,CAAC,UAAU,CAAC,QAAQ,EAAE,CAAC,CAAC;YACnF,IAAI,KAAK,CAAC,OAAO,CAAC,cAAc,CAAC,EAAE,CAAC;gBAClC,UAAU,GAAG,CAAC,GAAG,cAAc,EAAE,GAAG,UAAU,CAAC,CAAC;YAClD,CAAC;QACH,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,6CAA6C;QAC/C,CAAC;QAED,OAAO,UAAU,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;YAC/B,GAAG,MAAM;YACT,OAAO,EAAE,GAAG,EAAE;gBACZ,MAAM,CAAC,OAAO,CAAC,UAAU,CAAC,QAAQ,EAAE,EAAE,UAAU,CAAC,UAAU,CAAC,CAAC;YAC/D,CAAC;SACF,CAAC,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,GAAG,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;IAE3B,OAAO,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,CAAC;AAClE,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useCallback } from 'react';\n\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\nimport type { Action } from '@pega/cosmos-react-core';\n\ninterface UseRowActionsProps {\n row: RsCoreTypes.Row;\n meta: RsCoreTypes.Meta;\n}\n\nconst useRowActions = ({\n row,\n meta\n}: UseRowActionsProps): (() => Promise<Action[]>) | undefined => {\n const fetchActions = useCallback(async (): Promise<Action[]> => {\n const rowContext = row.getContext();\n let allActions = meta.rowActions ?? [];\n\n try {\n const dynamicActions = await rowContext.getRowActionDetails(rowContext.getValue());\n if (Array.isArray(dynamicActions)) {\n allActions = [...dynamicActions, ...allActions];\n }\n } catch (error) {\n // On error, fall back to static actions only\n }\n\n return allActions.map(action => ({\n ...action,\n onClick: () => {\n action.onClick(rowContext.getValue(), rowContext.refreshRow);\n }\n }));\n }, [row, meta.rowActions]);\n\n return meta.editing || meta.deleting ? fetchActions : undefined;\n};\n\nexport default useRowActions;\n"]}

package/lib/Core/Components/Card/index.d.ts ADDED Viewed

@@ -0,0 +1,5 @@
+export { default as CardHeader } from './CardHeader';
+export { default as CardFieldValue } from './CardFieldValue';
+export { default as useRowActions } from './hooks/useRowActions';
+export { getCardUIProps, getCardData, getCardColumns, GALLERY_IMAGE_PLACEMENT_MAP, DEFAULT_IMAGE_PLACEMENT, DEFAULT_IMAGE_SIZE, isInlinePlacement } from './cardData';
+//# sourceMappingURL=index.d.ts.map

package/lib/Core/Components/Card/index.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EACL,cAAc,EACd,WAAW,EACX,cAAc,EACd,2BAA2B,EAC3B,uBAAuB,EACvB,kBAAkB,EAClB,iBAAiB,EAClB,MAAM,YAAY,CAAC"}

package/lib/Core/Components/Card/index.js ADDED Viewed

@@ -0,0 +1,5 @@
+export { default as CardHeader } from './CardHeader';
+export { default as CardFieldValue } from './CardFieldValue';
+export { default as useRowActions } from './hooks/useRowActions';
+export { getCardUIProps, getCardData, getCardColumns, GALLERY_IMAGE_PLACEMENT_MAP, DEFAULT_IMAGE_PLACEMENT, DEFAULT_IMAGE_SIZE, isInlinePlacement } from './cardData';
+//# sourceMappingURL=index.js.map

package/lib/Core/Components/Card/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Components/Card/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EACL,cAAc,EACd,WAAW,EACX,cAAc,EACd,2BAA2B,EAC3B,uBAAuB,EACvB,kBAAkB,EAClB,iBAAiB,EAClB,MAAM,YAAY,CAAC","sourcesContent":["export { default as CardHeader } from './CardHeader';\nexport { default as CardFieldValue } from './CardFieldValue';\nexport { default as useRowActions } from './hooks/useRowActions';\nexport {\n getCardUIProps,\n getCardData,\n getCardColumns,\n GALLERY_IMAGE_PLACEMENT_MAP,\n DEFAULT_IMAGE_PLACEMENT,\n DEFAULT_IMAGE_SIZE,\n isInlinePlacement\n} from './cardData';\n"]}

package/lib/Core/Components/DefaultComponents/EmptyContainer.d.ts CHANGED Viewed

@@ -1,7 +1,8 @@
 export default EmptyContainer;
-declare function EmptyContainer({ message, shouldAnnounce, domContainer }: {
+declare function EmptyContainer({ message, shouldAnnounce, domContainer, transparent }: {
     message: any;
     shouldAnnounce: any;
     domContainer: any;
+    transparent?: boolean | undefined;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=EmptyContainer.d.ts.map

package/lib/Core/Components/DefaultComponents/EmptyContainer.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";~~AAuBA;;;;4CAqBC~~"}
1	+ {"version":3,"file":"EmptyContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAwBA;;;;;4CAsBC"}

package/lib/Core/Components/DefaultComponents/EmptyContainer.js CHANGED Viewed

@@ -13,11 +13,11 @@ const EmptyContainerStyle = styled.div `
   left: 0;
   right: 0;
   bottom: 0;
-  background: ${props => props.theme.base.palette['primary-background']};
+  background: ${({ theme, $transparent }) => $transparent ? 'transparent' : theme.base.palette['primary-background']};
   overflow: hidden;
 `;
 EmptyContainerStyle.defaultProps = defaultThemeProp;
-const EmptyContainer = ({ message, shouldAnnounce, domContainer }) => {
+const EmptyContainer = ({ message, shouldAnnounce, domContainer, transparent = false }) => {
     const { announcePolite } = useLiveLog();
     useEffect(() => {
         if (shouldAnnounce &&
@@ -26,7 +26,7 @@ const EmptyContainer = ({ message, shouldAnnounce, domContainer }) => {
             announcePolite({ message });
         }
     }, [shouldAnnounce, message, announcePolite, domContainer]);
-    return (_jsx(EmptyContainerStyle, { "data-test-id": TestIdConstants.noRecords, "data-testid": TestIdConstants.noRecords, children: _jsx(EmptyState, { message: message }) }));
+    return (_jsx(EmptyContainerStyle, { "$transparent": transparent, "data-test-id": TestIdConstants.noRecords, "data-testid": TestIdConstants.noRecords, children: _jsx(EmptyState, { message: message }) }));
 };
 export default EmptyContainer;
 //# sourceMappingURL=EmptyContainer.js.map

package/lib/Core/Components/DefaultComponents/EmptyContainer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EmptyContainer.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEnF,OAAO,eAAe,MAAM,oBAAoB,CAAC;AAEjD,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;gBAUtB,KAAK,~~CAAC~~,EAAE,CAAC,~~KAAK~~,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;;~~CAEtE~~,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,cAAc,GAAG,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,EAAE,EAAE;~~IACnE~~,MAAM,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,CAAC;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,IACE,cAAc;YACd,OAAO,QAAQ,KAAK,WAAW;YAC/B,YAAY,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAC9C,CAAC;YACD,cAAc,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE,CAAC,cAAc,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,CAAC,CAAC,CAAC;IAE5D,OAAO,CACL,KAAC,mBAAmB,oBACJ,eAAe,CAAC,SAAS,iBAC1B,eAAe,CAAC,SAAS,YAEtC,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,GAAI,GACZ,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import styled from 'styled-components';\nimport { useEffect } from 'react';\n\nimport { defaultThemeProp, EmptyState, useLiveLog } from '@pega/cosmos-react-core';\n\nimport TestIdConstants from '../TestIdConstants';\n\nconst EmptyContainerStyle = styled.div`\n position: absolute;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n top: var(--row-height, 0);\n left: 0;\n right: 0;\n bottom: 0;\n background: ${~~props~~ => ~~props.~~theme.base.palette['primary-background']};\n overflow: hidden;\n`;\n\nEmptyContainerStyle.defaultProps = defaultThemeProp;\n\nconst EmptyContainer = ({ message, shouldAnnounce, domContainer }) => {\n const { announcePolite } = useLiveLog();\n\n useEffect(() => {\n if (\n shouldAnnounce &&\n typeof document !== 'undefined' &&\n domContainer?.contains(document.activeElement)\n ) {\n announcePolite({ message });\n }\n }, [shouldAnnounce, message, announcePolite, domContainer]);\n\n return (\n <EmptyContainerStyle\n data-test-id={TestIdConstants.noRecords}\n data-testid={TestIdConstants.noRecords}\n >\n <EmptyState message={message} />\n </EmptyContainerStyle>\n );\n};\n\nexport default EmptyContainer;\n"]}
1	+ {"version":3,"file":"EmptyContainer.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/EmptyContainer.jsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,gBAAgB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAEnF,OAAO,eAAe,MAAM,oBAAoB,CAAC;AAEjD,MAAM,mBAAmB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;gBAUtB,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,EAAE,EAAE,CACxC,YAAY,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,oBAAoB,CAAC;;CAE1E,CAAC;AAEF,mBAAmB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEpD,MAAM,cAAc,GAAG,CAAC,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,WAAW,GAAG,KAAK,EAAE,EAAE,EAAE;IACxF,MAAM,EAAE,cAAc,EAAE,GAAG,UAAU,EAAE,CAAC;IAExC,SAAS,CAAC,GAAG,EAAE;QACb,IACE,cAAc;YACd,OAAO,QAAQ,KAAK,WAAW;YAC/B,YAAY,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAC9C,CAAC;YACD,cAAc,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC;QAC9B,CAAC;IACH,CAAC,EAAE,CAAC,cAAc,EAAE,OAAO,EAAE,cAAc,EAAE,YAAY,CAAC,CAAC,CAAC;IAE5D,OAAO,CACL,KAAC,mBAAmB,oBACJ,WAAW,kBACX,eAAe,CAAC,SAAS,iBAC1B,eAAe,CAAC,SAAS,YAEtC,KAAC,UAAU,IAAC,OAAO,EAAE,OAAO,GAAI,GACZ,CACvB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC","sourcesContent":["import styled from 'styled-components';\nimport { useEffect } from 'react';\n\nimport { defaultThemeProp, EmptyState, useLiveLog } from '@pega/cosmos-react-core';\n\nimport TestIdConstants from '../TestIdConstants';\n\nconst EmptyContainerStyle = styled.div`\n position: absolute;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n top: var(--row-height, 0);\n left: 0;\n right: 0;\n bottom: 0;\n background: ${({ theme, $transparent }) =>\n $transparent ? 'transparent' : theme.base.palette['primary-background']};\n overflow: hidden;\n`;\n\nEmptyContainerStyle.defaultProps = defaultThemeProp;\n\nconst EmptyContainer = ({ message, shouldAnnounce, domContainer, transparent = false }) => {\n const { announcePolite } = useLiveLog();\n\n useEffect(() => {\n if (\n shouldAnnounce &&\n typeof document !== 'undefined' &&\n domContainer?.contains(document.activeElement)\n ) {\n announcePolite({ message });\n }\n }, [shouldAnnounce, message, announcePolite, domContainer]);\n\n return (\n <EmptyContainerStyle\n $transparent={transparent}\n data-test-id={TestIdConstants.noRecords}\n data-testid={TestIdConstants.noRecords}\n >\n <EmptyState message={message} />\n </EmptyContainerStyle>\n );\n};\n\nexport default EmptyContainer;\n"]}

package/lib/Core/Components/DefaultComponents/PersonalizationCreateEdit.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PersonalizationCreateEdit.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationCreateEdit.jsx"],"names":[],"mappings":"AAOA;;;;;~~4CAqHC~~;;;;;;;;;;;QAUW,mCAAQ;;;;;;;~~sBArIE~~,YAAY"}
1	+ {"version":3,"file":"PersonalizationCreateEdit.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationCreateEdit.jsx"],"names":[],"mappings":"AAOA;;;;;4CAsHC;;;;;;;;;;;QAUW,mCAAQ;;;;;;;sBAtIE,YAAY"}

package/lib/Core/Components/DefaultComponents/PersonalizationCreateEdit.js CHANGED Viewed

@@ -54,6 +54,8 @@ export default function PersonalizationCreateEdit({ view, onFinish, editing = fa
         setViewName(e.target.value);
     };
     const onSubmit = () => {
+        if (error)
+            return;
         const trimmedName = viewName.trim();
         if (!trimmedName) {
             viewNameRef.current.focus();
@@ -72,7 +74,6 @@ export default function PersonalizationCreateEdit({ view, onFinish, editing = fa
             view.type.createPersonalization(trimmedName, markAsDefault || null);
         }
         onFinish();
-        return undefined;
     };
     return (_jsx(FormDialog, { heading: translate(editing ? 'Edit customized view' : 'Add customized view'), onCancel: onFinish, onSubmit: onSubmit, target: target, children: _jsxs(Flex, { container: { direction: 'column', gap: 2 }, children: [_jsx(Input, { ref: viewNameRef, name: 'viewName', required: true, label: translate('View name'), autoComplete: 'off', status: error ? 'error' : undefined, info: error, value: viewName, onChange: onChange }), !(editing && isAppDefaultView) && (_jsx(Checkbox, { checked: markAsDefault, label: translate('Always show this view first'), onChange: () => setMarkAsDefault(curState => !curState) }))] }) }));
 }

package/lib/Core/Components/DefaultComponents/PersonalizationCreateEdit.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PersonalizationCreateEdit.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationCreateEdit.jsx"],"names":[],"mappings":"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~~QACX~~,~~OAAO,SAAS,~~CAAC~~;IACnB~~,CAAC~~,CAAC~~;IAEF,OAAO,CACL,KAAC,UAAU,IACT,OAAO,EAAE,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,qBAAqB,CAAC,EAC5E,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,YAEd,MAAC,IAAI,IAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,aAC9C,KAAC,KAAK,IACJ,GAAG,EAAE,WAAW,EAChB,IAAI,EAAC,UAAU,EACf,QAAQ,QACR,KAAK,EAAE,SAAS,CAAC,WAAW,CAAC,EAC7B,YAAY,EAAC,KAAK,EAClB,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EACnC,IAAI,EAAE,KAAK,EACX,KAAK,EAAE,QAAQ,EACf,QAAQ,EAAE,QAAQ,GAClB,EAED,CAAC,CAAC,OAAO,IAAI,gBAAgB,CAAC,IAAI,CACjC,KAAC,QAAQ,IACP,OAAO,EAAE,aAAa,EACtB,KAAK,EAAE,SAAS,CAAC,6BAA6B,CAAC,EAC/C,QAAQ,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,GACvD,CACH,IACI,GACI,CACd,CAAC;AACJ,CAAC;AAED,yBAAyB,CAAC,SAAS,GAAG;IACpC,QAAQ,EAAE,SAAS,CAAC,IAAI;IACxB,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IAClD,OAAO,EAAE,SAAS,CAAC,IAAI;IACvB,MAAM,EAAE,SAAS,CAAC,UAAU,CAAC,OAAO,CAAC;CACtC,CAAC;AAEF,yBAAyB,CAAC,YAAY,GAAG;IACvC,QAAQ,EAAE,GAAG,EAAE,GAAE,CAAC;IAClB,OAAO,EAAE,KAAK;CACf,CAAC","sourcesContent":["import { useState, useEffect, useMemo, useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Flex, Input, Checkbox, FormDialog } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport default function PersonalizationCreateEdit({ view, onFinish, editing = false, target }) {\n const {\n state: { personalization },\n meta: { nonPersonalizationViewName }\n } = view;\n const personalizationNames = useMemo(() => {\n const personalizations = personalization?.allPersonalizations \|\| {};\n return Object.keys(personalizations).map(key => personalizations[key]?.name?.toLowerCase());\n }, [personalization]);\n const [translate] = useTranslate();\n const currentPersonalization = personalization?.allPersonalizations?.[personalization.active];\n const currentPersonalizationName = currentPersonalization?.name;\n const isAppDefaultView = personalization.active === 'APP_DEFAULT';\n const [viewName, setViewName] = useState(() => {\n if (editing) return currentPersonalizationName;\n return '';\n });\n const [error, setError] = useState();\n const viewNameRef = useRef(null);\n const defaultNameError = `${nonPersonalizationViewName} ${translate(\n 'name is reserved for non Personalized view and cannot be used.'\n )}`;\n const viewAlreadyPresentError = translate('This view is already present.');\n const viewNameEmptyError = translate('This view name cannot be empty.');\n const viewNameMaxLengthError = translate('View name must contain less than 65 characters.');\n const [markAsDefault, setMarkAsDefault] = useState(\n !!(editing && personalization.defaultPersonalization === personalization.active)\n );\n\n useEffect(() => {\n if (viewName && viewName.toLowerCase() === nonPersonalizationViewName.toLowerCase()) {\n setError(defaultNameError);\n return;\n }\n if (\n personalizationNames.includes(viewName?.trim().toLowerCase()) &&\n !(editing && viewName.trim() === currentPersonalizationName)\n ) {\n setError(viewAlreadyPresentError);\n return;\n }\n if (viewName?.length > 64) {\n setError(viewNameMaxLengthError);\n return;\n }\n setError(null);\n }, [\n defaultNameError,\n currentPersonalizationName,\n editing,\n nonPersonalizationViewName,\n personalizationNames,\n viewName,\n viewAlreadyPresentError,\n viewNameMaxLengthError\n ]);\n\n const onChange = e => {\n setViewName(e.target.value);\n };\n\n const onSubmit = () => {\n const trimmedName = viewName.trim();\n if (!trimmedName) {\n viewNameRef.current.focus();\n setError(viewNameEmptyError);\n return;\n }\n if (editing) {\n view.type.editPersonalization(\n personalization.active,\n trimmedName,\n // markAsDefault is meant to be null rather than false as APIS will remove the default if it sees false\n // but will be a no-op if undefined or null\n markAsDefault \|\| null,\n isAppDefaultView\n );\n } else {\n // markAsDefault is meant to be null rather than false as APIS will remove the default if it sees false\n // but will be a no-op if undefined or null\n view.type.createPersonalization(trimmedName, markAsDefault \|\| null);\n }\n\n onFinish();\n ~~return undefined;\n~~ };\n\n return (\n <FormDialog\n heading={translate(editing ? 'Edit customized view' : 'Add customized view')}\n onCancel={onFinish}\n onSubmit={onSubmit}\n target={target}\n >\n <Flex container={{ direction: 'column', gap: 2 }}>\n <Input\n ref={viewNameRef}\n name='viewName'\n required\n label={translate('View name')}\n autoComplete='off'\n status={error ? 'error' : undefined}\n info={error}\n value={viewName}\n onChange={onChange}\n />\n\n {!(editing && isAppDefaultView) && (\n <Checkbox\n checked={markAsDefault}\n label={translate('Always show this view first')}\n onChange={() => setMarkAsDefault(curState => !curState)}\n />\n )}\n </Flex>\n </FormDialog>\n );\n}\n\nPersonalizationCreateEdit.propTypes = {\n onFinish: PropTypes.func,\n view: PropTypes.objectOf(PropTypes.any).isRequired,\n editing: PropTypes.bool,\n target: PropTypes.instanceOf(Element)\n};\n\nPersonalizationCreateEdit.defaultProps = {\n onFinish: () => {},\n editing: false\n};\n"]}
1	+ {"version":3,"file":"PersonalizationCreateEdit.js","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/PersonalizationCreateEdit.jsx"],"names":[],"mappings":"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","sourcesContent":["import { useState, useEffect, useMemo, useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Flex, Input, Checkbox, FormDialog } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nexport default function PersonalizationCreateEdit({ view, onFinish, editing = false, target }) {\n const {\n state: { personalization },\n meta: { nonPersonalizationViewName }\n } = view;\n const personalizationNames = useMemo(() => {\n const personalizations = personalization?.allPersonalizations \|\| {};\n return Object.keys(personalizations).map(key => personalizations[key]?.name?.toLowerCase());\n }, [personalization]);\n const [translate] = useTranslate();\n const currentPersonalization = personalization?.allPersonalizations?.[personalization.active];\n const currentPersonalizationName = currentPersonalization?.name;\n const isAppDefaultView = personalization.active === 'APP_DEFAULT';\n const [viewName, setViewName] = useState(() => {\n if (editing) return currentPersonalizationName;\n return '';\n });\n const [error, setError] = useState();\n const viewNameRef = useRef(null);\n const defaultNameError = `${nonPersonalizationViewName} ${translate(\n 'name is reserved for non Personalized view and cannot be used.'\n )}`;\n const viewAlreadyPresentError = translate('This view is already present.');\n const viewNameEmptyError = translate('This view name cannot be empty.');\n const viewNameMaxLengthError = translate('View name must contain less than 65 characters.');\n const [markAsDefault, setMarkAsDefault] = useState(\n !!(editing && personalization.defaultPersonalization === personalization.active)\n );\n\n useEffect(() => {\n if (viewName && viewName.toLowerCase() === nonPersonalizationViewName.toLowerCase()) {\n setError(defaultNameError);\n return;\n }\n if (\n personalizationNames.includes(viewName?.trim().toLowerCase()) &&\n !(editing && viewName.trim() === currentPersonalizationName)\n ) {\n setError(viewAlreadyPresentError);\n return;\n }\n if (viewName?.length > 64) {\n setError(viewNameMaxLengthError);\n return;\n }\n setError(null);\n }, [\n defaultNameError,\n currentPersonalizationName,\n editing,\n nonPersonalizationViewName,\n personalizationNames,\n viewName,\n viewAlreadyPresentError,\n viewNameMaxLengthError\n ]);\n\n const onChange = e => {\n setViewName(e.target.value);\n };\n\n const onSubmit = () => {\n if (error) return;\n\n const trimmedName = viewName.trim();\n if (!trimmedName) {\n viewNameRef.current.focus();\n setError(viewNameEmptyError);\n return;\n }\n if (editing) {\n view.type.editPersonalization(\n personalization.active,\n trimmedName,\n // markAsDefault is meant to be null rather than false as APIS will remove the default if it sees false\n // but will be a no-op if undefined or null\n markAsDefault \|\| null,\n isAppDefaultView\n );\n } else {\n // markAsDefault is meant to be null rather than false as APIS will remove the default if it sees false\n // but will be a no-op if undefined or null\n view.type.createPersonalization(trimmedName, markAsDefault \|\| null);\n }\n\n onFinish();\n };\n\n return (\n <FormDialog\n heading={translate(editing ? 'Edit customized view' : 'Add customized view')}\n onCancel={onFinish}\n onSubmit={onSubmit}\n target={target}\n >\n <Flex container={{ direction: 'column', gap: 2 }}>\n <Input\n ref={viewNameRef}\n name='viewName'\n required\n label={translate('View name')}\n autoComplete='off'\n status={error ? 'error' : undefined}\n info={error}\n value={viewName}\n onChange={onChange}\n />\n\n {!(editing && isAppDefaultView) && (\n <Checkbox\n checked={markAsDefault}\n label={translate('Always show this view first')}\n onChange={() => setMarkAsDefault(curState => !curState)}\n />\n )}\n </Flex>\n </FormDialog>\n );\n}\n\nPersonalizationCreateEdit.propTypes = {\n onFinish: PropTypes.func,\n view: PropTypes.objectOf(PropTypes.any).isRequired,\n editing: PropTypes.bool,\n target: PropTypes.instanceOf(Element)\n};\n\nPersonalizationCreateEdit.defaultProps = {\n onFinish: () => {},\n editing: false\n};\n"]}

package/lib/Core/Components/DefaultComponents/index.d.ts CHANGED Viewed

@@ -63,10 +63,11 @@ declare const _default: {
     sortRenderer: typeof sort;
     filterRenderer: typeof Filter;
     headerCellRenderer: typeof HeaderCell;
-    emptyContainerRenderer: ({ message, shouldAnnounce, domContainer }: {
+    emptyContainerRenderer: ({ message, shouldAnnounce, domContainer, transparent }: {
         message: any;
         shouldAnnounce: any;
         domContainer: any;
+        transparent?: boolean | undefined;
     }) => import("react/jsx-runtime").JSX.Element;
     loadingIndicator: typeof LoadingIndicator;
     rowHeightRenderer: typeof RowHeightRenderer;

package/lib/Core/Components/DefaultComponents/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/index.jsx"],"names":[],"mappings":"AA4BA,uGAKC;;;;;;;;;;AAUD,mGASC~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~sBApDqB,YAAY;iBAEjB,QAAQ;mBACN,UAAU;uBAEN,cAAc;6BAER,oBAAoB;8BACnB,aAAa;4CAEC,2BAA2B;8CACzB,6BAA6B;8BAC7C,qBAAqB"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/DefaultComponents/index.jsx"],"names":[],"mappings":"AA4BA,uGAKC;;;;;;;;;;AAUD,mGASC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBApDqB,YAAY;iBAEjB,QAAQ;mBACN,UAAU;uBAEN,cAAc;6BAER,oBAAoB;8BACnB,aAAa;4CAEC,2BAA2B;8CACzB,6BAA6B;8BAC7C,qBAAqB"}

package/lib/Core/Components/GroupRenderer/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/GroupRenderer/index.jsx"],"names":[],"mappings":"~~AAyRA~~;;;;;;QAwCC;~~AA2GD~~;;;mDAoJC;;;;;;;;;;~~sBAhkBqB~~,YAAY"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Components/GroupRenderer/index.jsx"],"names":[],"mappings":"AA+RA;;;;;;QAwCC;AA8GD;;;mDAoJC;;;;;;;;;;sBAzkBqB,YAAY"}

package/lib/Core/Components/GroupRenderer/index.js CHANGED Viewed

@@ -224,6 +224,11 @@ const StyledMetaList = styled(MetaList) `
 const GroupAdditionalInfoSeparator = styled.span `
   margin-inline-start: 0.3rem;
 `;
+const StyledGroupName = styled.span `
+  min-width: 0;
+  overflow: hidden;
+  text-overflow: ellipsis;
+`;
 /**
  * Generates unique ARIA label IDs for accessibility.
  * - groupLabelId: for the group label (e.g., "Status:")
@@ -325,7 +330,7 @@ function GroupHeaderLabel({ column, groupHeader }) {
         ? formatter(groupHeader.count, { locale })
         : groupHeader.count;
     const { groupLabelId, groupNameId } = getAriaLabelIds(groupHeader.uniqueId);
-    return (_jsxs(_Fragment, { children: [_jsx("div", { className: 'group-label' }), !column.field.hideGroupColumnNameLabel && (_jsxs("span", { className: 'group-header-groupby', "data-test-id": groupHeader.groupBy, "data-testid": `${TestIdConstants.groupHeaderGroupBy}-${groupHeader.groupBy}`, id: groupLabelId, children: [groupHeader.label, ":"] })), _jsx("div", { className: 'group-label' }), _jsxs("span", { className: 'group-context-count', style: { display: 'inline-flex' }, "data-test-id": 'groupHeader', "data-testid": TestIdConstants.groupHeaderCount, id: groupNameId, children: [_jsx(GroupName, { view: view, column: column, groupHeader: groupHeader, dateFunction: dateFunction, customFunction: customFunction }), _jsx("span", { className: 'group-count', children: ` (${groupCountFormatted})` }), _jsx(VisuallyHiddenText, { children: " items" })] })] }));
+    return (_jsxs(_Fragment, { children: [_jsx("div", { className: 'group-label' }), !column.field.hideGroupColumnNameLabel && (_jsxs("span", { className: 'group-header-groupby', "data-test-id": groupHeader.groupBy, "data-testid": `${TestIdConstants.groupHeaderGroupBy}-${groupHeader.groupBy}`, id: groupLabelId, children: [groupHeader.label, ":"] })), _jsx("div", { className: 'group-label' }), _jsxs("span", { className: 'group-context-count', style: { display: 'inline-flex' }, "data-test-id": 'groupHeader', "data-testid": TestIdConstants.groupHeaderCount, id: groupNameId, children: [_jsx(StyledGroupName, { children: _jsx(GroupName, { view: view, column: column, groupHeader: groupHeader, dateFunction: dateFunction, customFunction: customFunction }) }), _jsx("span", { className: 'group-count', children: ` (${groupCountFormatted})` }), _jsx(VisuallyHiddenText, { children: " items" })] })] }));
 }
 // NOTE: While making any changes in GroupRenderer.jsx, also make similar changes in HierarchicalGroupRenderer.jsx file if applicable
 export default function GroupHeader({ groupHeader, columns }) {
@@ -367,7 +372,7 @@ export default function GroupHeader({ groupHeader, columns }) {
                 e.preventDefault();
                 buttonRef.current.focus();
             }
-        }, children: _jsxs(Flex, { container: true, children: [_jsx(ColorBadge, { colorIndicator: groupHeader.colorIndicator }), _jsxs("div", { children: [_jsxs("div", { className: 'stickyGroupHeader', children: [_jsxs(BareButton, { ref: buttonRef, "data-testid": `${TestIdConstants.groupHeaderButton}-${groupHeader.label}-${groupHeader.name}`, "aria-labelledby": [groupLabelId, groupNameId, ...additionalInfoIds].join(' '), "aria-expanded": !!groupHeader.isExpanded, style: {
+        }, children: _jsxs(Flex, { container: true, children: [_jsx(ColorBadge, { colorIndicator: groupHeader.colorIndicator }), _jsxs(Flex, { item: { grow: 1 }, container: { direction: 'column' }, children: [_jsxs("div", { className: 'stickyGroupHeader', children: [_jsxs(BareButton, { ref: buttonRef, "data-testid": `${TestIdConstants.groupHeaderButton}-${groupHeader.label}-${groupHeader.name}`, "aria-labelledby": [groupLabelId, groupNameId, ...additionalInfoIds].join(' '), "aria-expanded": !!groupHeader.isExpanded, style: {
                                         paddingRight: 'var(--group-left)'
                                     }, onClick: () => toggleGroup(), onKeyDown: event => {
                                         if (event.key === 'Enter') {