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

package/lib/Core/Views/Kanban/hooks/useKanbanLanesVirtualization.js

@@ -0,0 +1,32 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { useItemIntersection } from '@pega/cosmos-react-core';
+// Lanes mounted when a board or lane grouping is first displayed.
+const INITIAL_LANE_COUNT = 3;
+// Additional right-side lanes mounted when the current final lane enters the scrollport.
+const APPEND_LANE_COUNT = 2;
+// Minimum lanes to display so the intersection observer can always fire to trigger further loading.
+const MINIMUM_OBSERVED_LANE_COUNT = 2;
+/**
+ * Progressively mounts right-side Kanban lanes while retaining already mounted lanes and their
+ * vertical scroll positions. Resets the lane window for a new grouping or refreshed lane catalog.
+ *
+ * @param groupKey - Active lane grouping identifier.
+ * @param lanes - Lanes available for the active grouping.
+ */
+export default function useKanbanLanesVirtualization({ groupKey, lanes }) {
+    const boardRef = useRef(null);
+    const totalLaneCount = lanes.length;
+    const [mountedLaneCount, setMountedLaneCount] = useState(INITIAL_LANE_COUNT);
+    const clampLaneCount = useCallback((count) => Math.max(Math.min(count, totalLaneCount), Math.min(MINIMUM_OBSERVED_LANE_COUNT, totalLaneCount)), [totalLaneCount]);
+    // A new grouping or lane catalog starts with the initial lane window.
+    useEffect(() => {
+        setMountedLaneCount(INITIAL_LANE_COUNT);
+    }, [groupKey, totalLaneCount]);
+    const appendLanes = useCallback(() => {
+        // Keep prior lanes mounted so their independent vertical scroll positions are retained.
+        setMountedLaneCount(prev => clampLaneCount(prev + APPEND_LANE_COUNT));
+    }, [clampLaneCount]);
+    useItemIntersection(boardRef, mountedLaneCount - 1, appendLanes, ':scope > [data-kanban-lane]');
+    return { boardRef, visibleLanes: lanes.slice(0, mountedLaneCount) };
+}
+//# sourceMappingURL=useKanbanLanesVirtualization.js.map

package/lib/Core/Views/Kanban/hooks/useKanbanLanesVirtualization.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useKanbanLanesVirtualization.js","sourceRoot":"","sources":["../../../../../Core/Views/Kanban/hooks/useKanbanLanesVirtualization.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjE,OAAO,EAAE,mBAAmB,EAAE,MAAM,yBAAyB,CAAC;AAG9D,kEAAkE;AAClE,MAAM,kBAAkB,GAAG,CAAC,CAAC;AAC7B,yFAAyF;AACzF,MAAM,iBAAiB,GAAG,CAAC,CAAC;AAC5B,oGAAoG;AACpG,MAAM,2BAA2B,GAAG,CAAC,CAAC;AAYtC;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,UAAU,4BAA4B,CAAC,EACnD,QAAQ,EACR,KAAK,EAC+B;IACpC,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE9C,MAAM,cAAc,GAAG,KAAK,CAAC,MAAM,CAAC;IACpC,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAC,kBAAkB,CAAC,CAAC;IAE7E,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,KAAa,EAAU,EAAE,CACxB,IAAI,CAAC,GAAG,CACN,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,cAAc,CAAC,EAC/B,IAAI,CAAC,GAAG,CAAC,2BAA2B,EAAE,cAAc,CAAC,CACtD,EACH,CAAC,cAAc,CAAC,CACjB,CAAC;IAEF,sEAAsE;IACtE,SAAS,CAAC,GAAG,EAAE;QACb,mBAAmB,CAAC,kBAAkB,CAAC,CAAC;IAC1C,CAAC,EAAE,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAC;IAE/B,MAAM,WAAW,GAAG,WAAW,CAAC,GAAG,EAAE;QACnC,wFAAwF;QACxF,mBAAmB,CAAC,IAAI,CAAC,EAAE,CAAC,cAAc,CAAC,IAAI,GAAG,iBAAiB,CAAC,CAAC,CAAC;IACxE,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC,CAAC;IAErB,mBAAmB,CAAC,QAAQ,EAAE,gBAAgB,GAAG,CAAC,EAAE,WAAW,EAAE,6BAA6B,CAAC,CAAC;IAEhG,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,gBAAgB,CAAC,EAAE,CAAC;AACtE,CAAC","sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { useItemIntersection } from '@pega/cosmos-react-core';\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\n// Lanes mounted when a board or lane grouping is first displayed.\nconst INITIAL_LANE_COUNT = 3;\n// Additional right-side lanes mounted when the current final lane enters the scrollport.\nconst APPEND_LANE_COUNT = 2;\n// Minimum lanes to display so the intersection observer can always fire to trigger further loading.\nconst MINIMUM_OBSERVED_LANE_COUNT = 2;\n\ninterface UseKanbanLanesVirtualizationOptions {\n  groupKey?: string;\n  lanes: RsCoreTypes.GroupGenerator[];\n}\n\ninterface KanbanLanesVirtualization {\n  boardRef: React.RefObject<HTMLDivElement>;\n  visibleLanes: RsCoreTypes.GroupGenerator[];\n}\n\n/**\n * Progressively mounts right-side Kanban lanes while retaining already mounted lanes and their\n * vertical scroll positions. Resets the lane window for a new grouping or refreshed lane catalog.\n *\n * @param groupKey - Active lane grouping identifier.\n * @param lanes - Lanes available for the active grouping.\n */\nexport default function useKanbanLanesVirtualization({\n  groupKey,\n  lanes\n}: UseKanbanLanesVirtualizationOptions): KanbanLanesVirtualization {\n  const boardRef = useRef<HTMLDivElement>(null);\n\n  const totalLaneCount = lanes.length;\n  const [mountedLaneCount, setMountedLaneCount] = useState(INITIAL_LANE_COUNT);\n\n  const clampLaneCount = useCallback(\n    (count: number): number =>\n      Math.max(\n        Math.min(count, totalLaneCount),\n        Math.min(MINIMUM_OBSERVED_LANE_COUNT, totalLaneCount)\n      ),\n    [totalLaneCount]\n  );\n\n  // A new grouping or lane catalog starts with the initial lane window.\n  useEffect(() => {\n    setMountedLaneCount(INITIAL_LANE_COUNT);\n  }, [groupKey, totalLaneCount]);\n\n  const appendLanes = useCallback(() => {\n    // Keep prior lanes mounted so their independent vertical scroll positions are retained.\n    setMountedLaneCount(prev => clampLaneCount(prev + APPEND_LANE_COUNT));\n  }, [clampLaneCount]);\n\n  useItemIntersection(boardRef, mountedLaneCount - 1, appendLanes, ':scope > [data-kanban-lane]');\n\n  return { boardRef, visibleLanes: lanes.slice(0, mountedLaneCount) };\n}\n"]}

package/lib/Core/Views/Kanban/index.d.ts

@@ -0,0 +1,9 @@
+import { type RsCoreTypes } from 'pega-repeating-structures-core';
+declare function Kanban({ view }: {
+    view: RsCoreTypes.View;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace Kanban {
+    var displayName: string;
+}
+export default Kanban;
+//# sourceMappingURL=index.d.ts.map

package/lib/Core/Views/Kanban/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Kanban/index.tsx"],"names":[],"mappings":"AASA,OAAO,EAAe,KAAK,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAwB/E,iBAAS,MAAM,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,WAAW,CAAC,IAAI,CAAA;CAAE,2CA8FnD;kBA9FQ,MAAM;;;AAkGf,eAAe,MAAM,CAAC"}

package/lib/Core/Views/Kanban/index.js

@@ -0,0 +1,63 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { usePrevious, useFullscreenContext, useTheme, Grid, isInstance } from '@pega/cosmos-react-core';
+import { getGroupKey } from 'pega-repeating-structures-core';
+import Toolbar from '../../Components/Toolbar';
+import RenderView from '../../Components/RenderingEngine/RenderView';
+import { EXTERNAL_FILTERS } from '../../constants';
+import EmptyContainer from '../../Components/DefaultComponents/EmptyContainer';
+import RsCardWrapper from '../RsCardWrapper';
+import LoadingIndicator from '../../Components/LoadingIndicator';
+import WarningBanner from '../../Components/WarningBanner';
+import useTranslate from '../../Hooks/useTranslate';
+import { isFilterApplied } from '../../Utils';
+import { getCardColumns } from '../../Components/Card';
+import KanbanLane, { EmptyKanbanLane } from './KanbanLane';
+import { StyledKanbanBoard, StyledKanbanContainer } from './Kanban.styles';
+import useKanbanLanesVirtualization from './hooks/useKanbanLanesVirtualization';
+function getLaneId(laneColumn, value) {
+    return `${laneColumn?.field.id ?? ''}:${isInstance(value, Date) ? value.toISOString() : String(value)}`;
+}
+function Kanban({ view }) {
+    const { columns = [], groupHeaders = [], meta, rows } = view;
+    const { filterExpression, searchText, externalState, groups } = view.state ?? {};
+    const isFullscreen = !!useFullscreenContext()?.[0];
+    const theme = useTheme();
+    const [translate] = useTranslate();
+    // Lane configuration
+    const firstGroupHeader = groupHeaders[0];
+    const laneGroup = groups?.[0];
+    const laneColumn = useMemo(() => columns.find(column => String(column.field.id) === String(laneGroup?.columnId)), [columns, laneGroup]);
+    const hasLaneConfiguration = !!(laneColumn && laneGroup);
+    // RsCore returns empty groupHeader with groupBy = '' and count = 0 when there are no records to display.
+    const isEmptyLane = groupHeaders.length === 1 && firstGroupHeader?.groupBy === '' && firstGroupHeader.count === 0;
+    const shouldRenderEmptyLane = !!laneGroup && isEmptyLane;
+    // With instantRender from RSCore, state can contain the new groupBy while groupHeaders still reflect the previous grouping.
+    const laneGroupKey = laneGroup ? getGroupKey(laneGroup) : undefined;
+    const hasStaleLanes = !!firstGroupHeader?.groupBy && firstGroupHeader.groupBy !== laneGroupKey;
+    const lanes = hasLaneConfiguration && !hasStaleLanes ? groupHeaders : [];
+    const laneSourceKey = laneGroup ? `${laneGroupKey}:${laneGroup.order}` : undefined;
+    // Lanes virtualization
+    const { boardRef, visibleLanes } = useKanbanLanesVirtualization({
+        groupKey: laneSourceKey,
+        lanes
+    });
+    // Empty state configuration
+    const previousTotalItemCount = usePrevious(view.totalItemCount);
+    const emptyMessage = isFilterApplied({ filterExpression, searchText, externalState }, meta.externalFilters)
+        ? translate('No records found')
+        : translate('No records');
+    const shouldAnnounceEmpty = (previousTotalItemCount ?? 0) > 0 && view.totalItemCount === 0;
+    const emptyState = (_jsx(EmptyContainer, { message: emptyMessage, shouldAnnounce: shouldAnnounceEmpty, domContainer: view.getDomContainer(), transparent: true }));
+    const { visibleColumns, headerColumn, subHeadingsColumns } = useMemo(() => getCardColumns(columns, meta.cardConfig ?? {}), [columns, meta.cardConfig]);
+    return (_jsx(RsCardWrapper, { children: _jsxs(StyledKanbanContainer, { "data-testid": 'kanban', view: view, isFullscreen: isFullscreen, children: [_jsx(WarningBanner, { warningMessages: view.warningMessages }), _jsx(Toolbar, { view: view }), _jsx(RenderView, { view: view, type: EXTERNAL_FILTERS }), _jsxs(Grid, { as: StyledKanbanBoard, ref: boardRef, role: 'list', "aria-label": meta.title ?? meta.name, container: {
+                        autoFlow: 'column',
+                        autoCols: `minmax(min(${theme.base['content-width'].sm}, 100%), 1fr)`,
+                        gap: 1.5,
+                        pad: 0.5
+                    }, children: [!shouldRenderEmptyLane &&
+                            visibleLanes.map(lane => (_jsx(KanbanLane, { laneId: getLaneId(laneColumn, lane.name), lane: lane, laneColumn: laneColumn, meta: meta, visibleColumns: visibleColumns, headerColumn: headerColumn, subHeadingsColumns: subHeadingsColumns, emptyState: emptyState }, getLaneId(laneColumn, lane.name)))), shouldRenderEmptyLane && _jsx(EmptyKanbanLane, { emptyState: emptyState }), _jsx(LoadingIndicator, { view: view, show: !rows || !!view.isLoading })] })] }) }));
+}
+Kanban.displayName = 'Kanban';
+export default Kanban;
+//# sourceMappingURL=index.js.map

package/lib/Core/Views/Kanban/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../Core/Views/Kanban/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo } from 'react';\n\nimport {\n  usePrevious,\n  useFullscreenContext,\n  useTheme,\n  Grid,\n  isInstance\n} from '@pega/cosmos-react-core';\nimport { getGroupKey, type RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport Toolbar from '../../Components/Toolbar';\nimport RenderView from '../../Components/RenderingEngine/RenderView';\nimport { EXTERNAL_FILTERS } from '../../constants';\nimport EmptyContainer from '../../Components/DefaultComponents/EmptyContainer';\nimport RsCardWrapper from '../RsCardWrapper';\nimport LoadingIndicator from '../../Components/LoadingIndicator';\nimport WarningBanner from '../../Components/WarningBanner';\nimport useTranslate from '../../Hooks/useTranslate';\nimport { isFilterApplied } from '../../Utils';\nimport { getCardColumns } from '../../Components/Card';\n\nimport KanbanLane, { EmptyKanbanLane } from './KanbanLane';\nimport { StyledKanbanBoard, StyledKanbanContainer } from './Kanban.styles';\nimport useKanbanLanesVirtualization from './hooks/useKanbanLanesVirtualization';\n\nfunction getLaneId(\n  laneColumn: RsCoreTypes.Column | undefined,\n  value: RsCoreTypes.GroupGenerator['name']\n): string {\n  return `${laneColumn?.field.id ?? ''}:${isInstance(value, Date) ? value.toISOString() : String(value)}`;\n}\n\nfunction Kanban({ view }: { view: RsCoreTypes.View }) {\n  const { columns = [], groupHeaders = [], meta, rows } = view;\n  const { filterExpression, searchText, externalState, groups } = view.state ?? {};\n  const isFullscreen = !!useFullscreenContext()?.[0];\n  const theme = useTheme();\n  const [translate] = useTranslate();\n\n  // Lane configuration\n  const firstGroupHeader = groupHeaders[0];\n  const laneGroup = groups?.[0];\n  const laneColumn = useMemo(\n    () => columns.find(column => String(column.field.id) === String(laneGroup?.columnId)),\n    [columns, laneGroup]\n  );\n  const hasLaneConfiguration = !!(laneColumn && laneGroup);\n\n  // RsCore returns empty groupHeader with groupBy = '' and count = 0 when there are no records to display.\n  const isEmptyLane =\n    groupHeaders.length === 1 && firstGroupHeader?.groupBy === '' && firstGroupHeader.count === 0;\n  const shouldRenderEmptyLane = !!laneGroup && isEmptyLane;\n\n  // With instantRender from RSCore, state can contain the new groupBy while groupHeaders still reflect the previous grouping.\n  const laneGroupKey = laneGroup ? getGroupKey(laneGroup) : undefined;\n  const hasStaleLanes = !!firstGroupHeader?.groupBy && firstGroupHeader.groupBy !== laneGroupKey;\n  const lanes = hasLaneConfiguration && !hasStaleLanes ? groupHeaders : [];\n  const laneSourceKey = laneGroup ? `${laneGroupKey}:${laneGroup.order}` : undefined;\n\n  // Lanes virtualization\n  const { boardRef, visibleLanes } = useKanbanLanesVirtualization({\n    groupKey: laneSourceKey,\n    lanes\n  });\n\n  // Empty state configuration\n  const previousTotalItemCount = usePrevious(view.totalItemCount);\n  const emptyMessage = isFilterApplied(\n    { filterExpression, searchText, externalState },\n    meta.externalFilters\n  )\n    ? translate('No records found')\n    : translate('No records');\n  const shouldAnnounceEmpty = (previousTotalItemCount ?? 0) > 0 && view.totalItemCount === 0;\n  const emptyState = (\n    <EmptyContainer\n      message={emptyMessage}\n      shouldAnnounce={shouldAnnounceEmpty}\n      domContainer={view.getDomContainer()}\n      transparent\n    />\n  );\n\n  const { visibleColumns, headerColumn, subHeadingsColumns } = useMemo(\n    () => getCardColumns(columns, meta.cardConfig ?? {}),\n    [columns, meta.cardConfig]\n  );\n\n  return (\n    <RsCardWrapper>\n      <StyledKanbanContainer data-testid='kanban' view={view} isFullscreen={isFullscreen}>\n        <WarningBanner warningMessages={view.warningMessages} />\n        <Toolbar view={view} />\n        <RenderView view={view} type={EXTERNAL_FILTERS} />\n        <Grid\n          as={StyledKanbanBoard}\n          ref={boardRef}\n          role='list'\n          aria-label={meta.title ?? meta.name}\n          container={{\n            autoFlow: 'column',\n            autoCols: `minmax(min(${theme.base['content-width'].sm}, 100%), 1fr)`,\n            gap: 1.5,\n            pad: 0.5\n          }}\n        >\n          {!shouldRenderEmptyLane &&\n            visibleLanes.map(lane => (\n              <KanbanLane\n                key={getLaneId(laneColumn, lane.name)}\n                laneId={getLaneId(laneColumn, lane.name)}\n                lane={lane}\n                laneColumn={laneColumn}\n                meta={meta}\n                visibleColumns={visibleColumns}\n                headerColumn={headerColumn}\n                subHeadingsColumns={subHeadingsColumns}\n                emptyState={emptyState}\n              />\n            ))}\n          {shouldRenderEmptyLane && <EmptyKanbanLane emptyState={emptyState} />}\n          <LoadingIndicator view={view} show={!rows || !!view.isLoading} />\n        </Grid>\n      </StyledKanbanContainer>\n    </RsCardWrapper>\n  );\n}\n\nKanban.displayName = 'Kanban';\n\nexport default Kanban;\n"]}

package/lib/Core/Views/Timeline/Timeline.styles.d.ts

@@ -380,8 +380,8 @@ export declare const StyledGroupContentList: import("styled-components/dist/type
 export declare const StyledTimelineListItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;
 export declare const StyledTimelineEndMarker: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, never>> & string;
 export declare const StyledTimeline: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").OlHTMLAttributes<HTMLOListElement>, HTMLOListElement>, never>> & string;
-export declare const StyledTime: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("@pega/cosmos-react-core").DateTimeDisplayProps, "ref"> & import("react").RefAttributes<HTMLSpanElement> & import("@pega/cosmos-react-core").ForwardProps, "ref"> & {
-    ref?: ((instance: HTMLSpanElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+export declare const StyledTime: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<Omit<import("@pega/cosmos-react-core").DateTimeDisplayProps, "ref"> & import("react").RefAttributes<HTMLTimeElement> & import("@pega/cosmos-react-core").ForwardProps, "ref"> & {
+    ref?: ((instance: HTMLTimeElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLTimeElement> | null | undefined;
 }, never>> & string & Omit<import("@pega/cosmos-react-core").ForwardRefForwardPropsComponent<import("@pega/cosmos-react-core").DateTimeDisplayProps>, keyof import("react").Component<any, {}, any>>;
 export declare const StyledLoadingCell: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const timelineItemsGridProps: {

package/lib/Core/templateFeatureSupport.js

@@ -2,9 +2,9 @@ import { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';
 // TODO: All such feature map support should be available at View object based via a feature in rs-core based on the template from meta.
 // The consumer can pass along the resolved feature map to their component for decisioning.
 const featureSupport = {
-    personalization: ['Table', 'Gallery', 'Timeline'],
+    personalization: ['Table', 'Gallery', 'Timeline', 'Kanban'],
     group: ['Table', 'Timeline'],
-    showHideColumns: ['Table', 'Gallery'],
+    showHideColumns: ['Table', 'Gallery', 'Kanban'],
     galleryLayout: ['Gallery'],
     freezeColumns: ['Table'],
     rowDensity: ['Table'],

package/lib/Core/templateFeatureSupport.js.map

@@ -1 +1 @@
-{"version":3,"file":"templateFeatureSupport.js","sourceRoot":"","sources":["../../Core/templateFeatureSupport.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAK/E,wIAAwI;AACxI,2FAA2F;AAC3F,MAAM,cAAc,GAA2C;IAC7D,eAAe,EAAE,CAAC,OAAO,EAAE,SAAS,EAAE,UAAU,CAAC;IACjD,KAAK,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC;IAC5B,eAAe,EAAE,CAAC,OAAO,EAAE,SAAS,CAAC;IACrC,aAAa,EAAE,CAAC,SAAS,CAAC;IAC1B,aAAa,EAAE,CAAC,OAAO,CAAC;IACxB,UAAU,EAAE,CAAC,OAAO,CAAC;IACrB,eAAe,EAAE,CAAC,OAAO,CAAC;IAC1B,eAAe,EAAE,CAAC,OAAO,CAAC;IAC1B,iBAAiB,EAAE,CAAC,OAAO,CAAC;IAC5B,IAAI,EAAE,CAAC,OAAO,CAAC;CAChB,CAAC;AAIF;;;;;;;GAOG;AACH,MAAM,sBAAsB,GAAG,CAAC,QAAuB,EAAE,OAAmB,EAAW,EAAE;IACvF,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,CAAC;QAC7B,OAAO,IAAI,CAAC;IACd,CAAC;IACD,OAAO,cAAc,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;AACpD,CAAC,CAAC;AAEF,eAAe,sBAAsB,CAAC","sourcesContent":["import { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';\n\ntype TemplateValue =\n  (typeof REPEATING_STRUCTURE_TEMPLATES)[keyof typeof REPEATING_STRUCTURE_TEMPLATES];\n\n// TODO: All such feature map support should be available at View object based via a feature in rs-core based on the template from meta.\n// The consumer can pass along the resolved feature map to their component for decisioning.\nconst featureSupport: { [feature: string]: TemplateValue[] } = {\n  personalization: ['Table', 'Gallery', 'Timeline'],\n  group: ['Table', 'Timeline'],\n  showHideColumns: ['Table', 'Gallery'],\n  galleryLayout: ['Gallery'],\n  freezeColumns: ['Table'],\n  rowDensity: ['Table'],\n  showHeaderIcons: ['Table'],\n  autoSizeColumns: ['Table'],\n  resetColumnWidths: ['Table'],\n  wrap: ['Table']\n};\n\ntype FeatureKey = keyof typeof featureSupport | string;\n\n/**\n * Check if a feature should show in toolbar for a given template.\n * Features not in the map are considered supported for all templates.\n *\n * @param template - The template type\n * @param feature - The feature identifier\n * @returns true if the feature should show in toolbar for the template\n */\nconst showFeatureForTemplate = (template: TemplateValue, feature: FeatureKey): boolean => {\n  if (!featureSupport[feature]) {\n    return true;\n  }\n  return featureSupport[feature].includes(template);\n};\n\nexport default showFeatureForTemplate;\n"]}
+{"version":3,"file":"templateFeatureSupport.js","sourceRoot":"","sources":["../../Core/templateFeatureSupport.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,6BAA6B,EAAE,MAAM,gCAAgC,CAAC;AAK/E,wIAAwI;AACxI,2FAA2F;AAC3F,MAAM,cAAc,GAA2C;IAC7D,eAAe,EAAE,CAAC,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,QAAQ,CAAC;IAC3D,KAAK,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC;IAC5B,eAAe,EAAE,CAAC,OAAO,EAAE,SAAS,EAAE,QAAQ,CAAC;IAC/C,aAAa,EAAE,CAAC,SAAS,CAAC;IAC1B,aAAa,EAAE,CAAC,OAAO,CAAC;IACxB,UAAU,EAAE,CAAC,OAAO,CAAC;IACrB,eAAe,EAAE,CAAC,OAAO,CAAC;IAC1B,eAAe,EAAE,CAAC,OAAO,CAAC;IAC1B,iBAAiB,EAAE,CAAC,OAAO,CAAC;IAC5B,IAAI,EAAE,CAAC,OAAO,CAAC;CAChB,CAAC;AAIF;;;;;;;GAOG;AACH,MAAM,sBAAsB,GAAG,CAAC,QAAuB,EAAE,OAAmB,EAAW,EAAE;IACvF,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,EAAE,CAAC;QAC7B,OAAO,IAAI,CAAC;IACd,CAAC;IACD,OAAO,cAAc,CAAC,OAAO,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;AACpD,CAAC,CAAC;AAEF,eAAe,sBAAsB,CAAC","sourcesContent":["import { REPEATING_STRUCTURE_TEMPLATES } from 'pega-repeating-structures-core';\n\ntype TemplateValue =\n  (typeof REPEATING_STRUCTURE_TEMPLATES)[keyof typeof REPEATING_STRUCTURE_TEMPLATES];\n\n// TODO: All such feature map support should be available at View object based via a feature in rs-core based on the template from meta.\n// The consumer can pass along the resolved feature map to their component for decisioning.\nconst featureSupport: { [feature: string]: TemplateValue[] } = {\n  personalization: ['Table', 'Gallery', 'Timeline', 'Kanban'],\n  group: ['Table', 'Timeline'],\n  showHideColumns: ['Table', 'Gallery', 'Kanban'],\n  galleryLayout: ['Gallery'],\n  freezeColumns: ['Table'],\n  rowDensity: ['Table'],\n  showHeaderIcons: ['Table'],\n  autoSizeColumns: ['Table'],\n  resetColumnWidths: ['Table'],\n  wrap: ['Table']\n};\n\ntype FeatureKey = keyof typeof featureSupport | string;\n\n/**\n * Check if a feature should show in toolbar for a given template.\n * Features not in the map are considered supported for all templates.\n *\n * @param template - The template type\n * @param feature - The feature identifier\n * @returns true if the feature should show in toolbar for the template\n */\nconst showFeatureForTemplate = (template: TemplateValue, feature: FeatureKey): boolean => {\n  if (!featureSupport[feature]) {\n    return true;\n  }\n  return featureSupport[feature].includes(template);\n};\n\nexport default showFeatureForTemplate;\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pega/lists-react",
-  "version": "10.0.0-build.4.2",
+  "version": "10.0.0-build.4.20",
   "description": "Repeating view structures such as Table, Gallery(Repeating layouts), Kanban etc.",
   "license": "SEE LICENSE IN LICENSE",
   "author": "Pegasystems",
@@ -14,17 +14,17 @@
     "build": "tsc -b tsconfig.build.json"
   },
   "dependencies": {
-    "@pega/cosmos-react-condition-builder": "10.0.0-build.4.2",
-    "@pega/cosmos-react-core": "10.0.0-build.4.2",
-    "@pega/cosmos-react-rte": "10.0.0-build.4.2",
+    "@pega/cosmos-react-condition-builder": "10.0.0-build.4.20",
+    "@pega/cosmos-react-core": "10.0.0-build.4.20",
+    "@pega/cosmos-react-rte": "10.0.0-build.4.20",
     "@types/lodash-es": "^4.17.12",
     "@types/react": "^17.0.62 || ^18.3.3",
     "@types/react-dom": "^17.0.20 || ^18.3.0",
     "dayjs": "^1.11.13",
     "fast-deep-equal": "^3.1.3",
     "lodash-es": "^4.18.1",
-    "pega-repeating-structures-core": "npm:@pega/lists-core@10.0.0-build.4.2",
-    "pega-ui-list-data-apis": "npm:@pega/lists-core-utils@10.0.0-build.4.2",
+    "pega-repeating-structures-core": "npm:@pega/lists-core@10.0.0-build.4.20",
+    "pega-ui-list-data-apis": "npm:@pega/lists-core-utils@10.0.0-build.4.20",
     "polished": "^4.1.0",
     "prop-types": "^15.8.1",
     "react": "^17.0.0 || ^18.0.0",
@@ -42,7 +42,7 @@
     "@testing-library/react": "^16.0.0",
     "@testing-library/user-event": "^14.6.1",
     "jest-axe": "^8.0.0",
-    "srs-utils": "10.0.0-build.4.2",
+    "srs-utils": "10.0.0-build.4.20",
     "typescript": "~6.0.3"
   }
 }

package/lib/Core/Views/Gallery/Components/GalleryFieldValue.d.ts

@@ -1,8 +0,0 @@
-import type { RsCoreTypes } from 'pega-repeating-structures-core';
-interface GalleryFieldValueProps {
-    column: RsCoreTypes.Column;
-    row: RsCoreTypes.Row;
-}
-declare function GalleryFieldValue({ column, row }: GalleryFieldValueProps): import("react/jsx-runtime").JSX.Element;
-export default GalleryFieldValue;
-//# sourceMappingURL=GalleryFieldValue.d.ts.map

package/lib/Core/Views/Gallery/Components/GalleryFieldValue.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"GalleryFieldValue.d.ts","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryFieldValue.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAIlE,UAAU,sBAAsB;IAC9B,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC;IAC3B,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC;CACtB;AAED,iBAAS,iBAAiB,CAAC,EAAE,MAAM,EAAE,GAAG,EAAE,EAAE,sBAAsB,2CAIjE;AAED,eAAe,iBAAiB,CAAC"}

package/lib/Core/Views/Gallery/Components/GalleryFieldValue.js

@@ -1,8 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import RenderingEngine from '../../../Components/RenderingEngine/RenderCell';
-function GalleryFieldValue({ column, row }) {
-    column.setExecutionContext(row);
-    return _jsx(RenderingEngine, { ...column.getRenderingEngineProps(), highlighter: true });
-}
-export default GalleryFieldValue;
-//# sourceMappingURL=GalleryFieldValue.js.map

package/lib/Core/Views/Gallery/Components/GalleryFieldValue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"GalleryFieldValue.js","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryFieldValue.tsx"],"names":[],"mappings":";AAEA,OAAO,eAAe,MAAM,gDAAgD,CAAC;AAO7E,SAAS,iBAAiB,CAAC,EAAE,MAAM,EAAE,GAAG,EAA0B;IAChE,MAAM,CAAC,mBAAmB,CAAC,GAAG,CAAC,CAAC;IAEhC,OAAO,KAAC,eAAe,OAAK,MAAM,CAAC,uBAAuB,EAAE,EAAE,WAAW,SAAG,CAAC;AAC/E,CAAC;AAED,eAAe,iBAAiB,CAAC","sourcesContent":["import type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport RenderingEngine from '../../../Components/RenderingEngine/RenderCell';\n\ninterface GalleryFieldValueProps {\n  column: RsCoreTypes.Column;\n  row: RsCoreTypes.Row;\n}\n\nfunction GalleryFieldValue({ column, row }: GalleryFieldValueProps) {\n  column.setExecutionContext(row);\n\n  return <RenderingEngine {...column.getRenderingEngineProps()} highlighter />;\n}\n\nexport default GalleryFieldValue;\n"]}

package/lib/Core/Views/Gallery/Components/GalleryHeader.d.ts

@@ -1,8 +0,0 @@
-import type { RsCoreTypes } from 'pega-repeating-structures-core';
-type GalleryHeaderProps = {
-    headerColumn?: RsCoreTypes.Column;
-    row: RsCoreTypes.Row;
-};
-declare function GalleryHeader({ headerColumn, row }: GalleryHeaderProps): import("react/jsx-runtime").JSX.Element | null;
-export default GalleryHeader;
-//# sourceMappingURL=GalleryHeader.d.ts.map

package/lib/Core/Views/Gallery/Components/GalleryHeader.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"GalleryHeader.d.ts","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryHeader.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAIlE,KAAK,kBAAkB,GAAG;IACxB,YAAY,CAAC,EAAE,WAAW,CAAC,MAAM,CAAC;IAClC,GAAG,EAAE,WAAW,CAAC,GAAG,CAAC;CACtB,CAAC;AAMF,iBAAS,aAAa,CAAC,EAAE,YAAY,EAAE,GAAG,EAAE,EAAE,kBAAkB,kDAY/D;AAED,eAAe,aAAa,CAAC"}

package/lib/Core/Views/Gallery/Components/GalleryHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"GalleryHeader.js","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/Components/GalleryHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAIvC,OAAO,eAAe,MAAM,gDAAgD,CAAC;AAO7E,MAAM,qBAAqB,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEvC,CAAC;AAEF,SAAS,aAAa,CAAC,EAAE,YAAY,EAAE,GAAG,EAAsB;IAC9D,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,aAAa,CAAC","sourcesContent":["import styled from 'styled-components';\n\nimport type { RsCoreTypes } from 'pega-repeating-structures-core';\n\nimport RenderingEngine from '../../../Components/RenderingEngine/RenderCell';\n\ntype GalleryHeaderProps = {\n  headerColumn?: RsCoreTypes.Column;\n  row: RsCoreTypes.Row;\n};\n\nconst StyledHeaderContainer = styled.div`\n  word-break: break-word;\n`;\n\nfunction GalleryHeader({ headerColumn, row }: GalleryHeaderProps) {\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 GalleryHeader;\n"]}

package/lib/Core/Views/Gallery/hooks/useRowActions.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useRowActions.d.ts","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/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/Views/Gallery/hooks/useRowActions.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useRowActions.js","sourceRoot":"","sources":["../../../../../Core/Views/Gallery/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/Views/Gallery/utils.d.ts

@@ -1,36 +0,0 @@
-import { type RsCoreTypes } from 'pega-repeating-structures-core';
-import type { ImageSize, SelectionCardDisplayProps } from '@pega/cosmos-react-core';
-import type { GalleryCardProps } from './Gallery.types';
-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">;
-/**
- * Generates the data required to display a card in the gallery view.
- *
- * @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.
- */
-export declare function getCardData({ row, visibleColumns, meta, headerColumn }: GalleryCardProps): Pick<SelectionCardDisplayProps, 'label' | 'image' | 'fields' | 'aria-label' | 'footer'>;
-/**
- * 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;
-};
-//# sourceMappingURL=utils.d.ts.map

package/lib/Core/Views/Gallery/utils.d.ts.map

@@ -1 +0,0 @@
-{"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;;EAK/D"}

package/lib/Core/Views/Gallery/utils.js.map

@@ -1 +0,0 @@
-{"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 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"]}