@pega/lists-react 9.0.0-build.9.8 → 9.0.0

package/lib/Core/Views/Table/CellWrapper.js

@@ -2,6 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import PropTypes from 'prop-types';
 import { memo, useCallback, useRef } from 'react';
 import styled, { css } from 'styled-components';
+import { FieldType } from 'pega-repeating-structures-core';
 import { Icon, VisuallyHiddenText } from '@pega/cosmos-react-core';
 import { createClassName as cx } from '../../Utils';
 import RenderingEngine from '../../Components/RenderingEngine/RenderCell';
@@ -49,7 +50,7 @@ export const CellIcon = styled(Icon)(({ cellAlign }) => {
 });
 function CellWrapper({ column, level = 0 }) {
     const ref = useRef();
-    const { field: { cellAlign }, isCustomColumn, isLastColumn, isFirstVisualColumn, getCellStyleFormat } = column;
+    const { field: { cellAlign, type: fieldType }, isCustomColumn, isLastColumn, isFirstVisualColumn, getCellStyleFormat } = column;
     const { classList, style: cellStyle, ...restProps } = column.getUIProps();
     const { config: styleFormatConfig = {}, label: styleFormatLabel, id: styleFormatId } = getCellStyleFormat() ?? {};
     const { foregroundColor, icon: cellIconProps } = styleFormatConfig;
@@ -63,7 +64,8 @@ function CellWrapper({ column, level = 0 }) {
             'cell-fixed': column.frozen,
             'cell-last': isLastColumn,
             'cell-first': isFirstVisualColumn,
-            'cell-last-frozen': column.lastFrozen
+            'cell-last-frozen': column.lastFrozen,
+            'column-type-action': fieldType === FieldType.ACTION_FIELD_TYPE
         }, !isCustomColumn && cellAlign && CELL_ALIGN_CLASSES[cellAlign]), style: cellStyles, ref: ref, tabIndex: -1, "data-style-format": styleFormatId, children: [_jsx(RenderingEngine, { style: renderingEngineStyles, highlighter: true, ...column.getRenderingEngineProps(), context: context }), cellIconProps && _jsx(CellIcon, { ...cellIconProps, cellAlign: cellAlign, set: 'budicon' }), styleFormatId && (_jsx(VisuallyHiddenText, { id: styleFormatId, children: `,${translate('state')}: ${styleFormatLabel},` }))] }));
 }
 CellWrapper.propTypes = {

package/lib/Core/Views/Table/CellWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"CellWrapper.js","sourceRoot":"","sources":["../../../../Core/Views/Table/CellWrapper.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { memo, useCallback, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { Icon, VisuallyHiddenText } from '@pega/cosmos-react-core';\n\nimport { createClassName as cx } from '../../Utils';\nimport RenderingEngine from '../../Components/RenderingEngine/RenderCell';\nimport { CELL_ALIGN_CLASSES } from '../../constants';\nimport { hierarchicalgroupheaderleftdisplacement } from '../../Components/HierarchicalGroupRenderer';\nimport useTranslate from '../../Hooks/useTranslate';\n\nconst getStyles = (column, level, styleFormatConfig) => {\n  const {\n    isFirstDataColumn,\n    parent,\n    field: { idHash, cellAlign }\n  } = column;\n  const { backgroundColor, icon: cellIconProps, foregroundColor } = styleFormatConfig;\n\n  const cellStyles = {\n    left: `var(--col-left-${idHash})`,\n    order: `var(--col-order-${idHash})`,\n    width: `var(--col-width-${idHash})`,\n    ...(backgroundColor && { backgroundColor }),\n    ...(isFirstDataColumn && parent?.hierarchicalGroupEnabled && { paddingLeft: 0 })\n  };\n\n  const renderingEngineStyles = {\n    ...(isFirstDataColumn &&\n      parent?.hierarchicalGroupEnabled && {\n        paddingLeft: hierarchicalgroupheaderleftdisplacement(level)\n      }),\n    ...(cellIconProps && { order: cellAlign === 'right' ? 2 : 1 }),\n    ...(foregroundColor && { color: foregroundColor })\n  };\n\n  return { cellStyles, renderingEngineStyles };\n};\n\nexport const CellIcon = styled(Icon)(({ cellAlign }) => {\n  // icon size 12px\n  return css`\n    /*\n     * Icon styles sometimes fail to override correctly. Increasing specificity ensures consistent override behavior.\n     * https://styled-components.com/docs/faqs#how-can-i-override-styles-with-higher-specificity\n     */\n    &&& {\n      height: 0.75rem;\n      width: 0.75rem;\n      min-width: 0.75rem;\n      min-height: 0.75rem;\n      margin-inline-end: ${cellAlign !== 'right' && '0.5rem'};\n      margin-inline-start: ${cellAlign === 'right' && '0.5rem'};\n      order: ${cellAlign === 'right' ? 1 : 2};\n      flex-shrink: 0;\n    }\n  `;\n});\n\nfunction CellWrapper({ column, level = 0 }) {\n  const ref = useRef();\n  const {\n    field: { cellAlign },\n    isCustomColumn,\n    isLastColumn,\n    isFirstVisualColumn,\n    getCellStyleFormat\n  } = column;\n  const { classList, style: cellStyle, ...restProps } = column.getUIProps();\n  const {\n    config: styleFormatConfig = {},\n    label: styleFormatLabel,\n    id: styleFormatId\n  } = getCellStyleFormat() ?? {};\n  const { foregroundColor, icon: cellIconProps } = styleFormatConfig;\n  const context = {\n    getElement: () => ref.current,\n    getStyles: useCallback(() => ({ foregroundColor }), [foregroundColor])\n  };\n  const { cellStyles, renderingEngineStyles } = getStyles(column, level, styleFormatConfig);\n  const [translate] = useTranslate();\n\n  return (\n    <div\n      {...restProps}\n      className={cx(\n        'cell',\n        ...classList,\n        {\n          'cell-fixed': column.frozen,\n          'cell-last': isLastColumn,\n          'cell-first': isFirstVisualColumn,\n          'cell-last-frozen': column.lastFrozen\n        },\n        !isCustomColumn && cellAlign && CELL_ALIGN_CLASSES[cellAlign]\n      )}\n      style={cellStyles}\n      ref={ref}\n      tabIndex={-1}\n      data-style-format={styleFormatId}\n    >\n      <RenderingEngine\n        style={renderingEngineStyles}\n        highlighter\n        {...column.getRenderingEngineProps()}\n        context={context}\n      />\n      {cellIconProps && <CellIcon {...cellIconProps} cellAlign={cellAlign} set='budicon' />}\n      {styleFormatId && (\n        <VisuallyHiddenText\n          id={styleFormatId}\n        >{`,${translate('state')}: ${styleFormatLabel},`}</VisuallyHiddenText>\n      )}\n    </div>\n  );\n}\n\nCellWrapper.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any),\n  level: PropTypes.number\n};\n\nexport default memo(CellWrapper);\n"]}
+{"version":3,"file":"CellWrapper.js","sourceRoot":"","sources":["../../../../Core/Views/Table/CellWrapper.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\nimport { memo, useCallback, useRef } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { FieldType } from 'pega-repeating-structures-core';\nimport { Icon, VisuallyHiddenText } from '@pega/cosmos-react-core';\n\nimport { createClassName as cx } from '../../Utils';\nimport RenderingEngine from '../../Components/RenderingEngine/RenderCell';\nimport { CELL_ALIGN_CLASSES } from '../../constants';\nimport { hierarchicalgroupheaderleftdisplacement } from '../../Components/HierarchicalGroupRenderer';\nimport useTranslate from '../../Hooks/useTranslate';\n\nconst getStyles = (column, level, styleFormatConfig) => {\n  const {\n    isFirstDataColumn,\n    parent,\n    field: { idHash, cellAlign }\n  } = column;\n  const { backgroundColor, icon: cellIconProps, foregroundColor } = styleFormatConfig;\n\n  const cellStyles = {\n    left: `var(--col-left-${idHash})`,\n    order: `var(--col-order-${idHash})`,\n    width: `var(--col-width-${idHash})`,\n    ...(backgroundColor && { backgroundColor }),\n    ...(isFirstDataColumn && parent?.hierarchicalGroupEnabled && { paddingLeft: 0 })\n  };\n\n  const renderingEngineStyles = {\n    ...(isFirstDataColumn &&\n      parent?.hierarchicalGroupEnabled && {\n        paddingLeft: hierarchicalgroupheaderleftdisplacement(level)\n      }),\n    ...(cellIconProps && { order: cellAlign === 'right' ? 2 : 1 }),\n    ...(foregroundColor && { color: foregroundColor })\n  };\n\n  return { cellStyles, renderingEngineStyles };\n};\n\nexport const CellIcon = styled(Icon)(({ cellAlign }) => {\n  // icon size 12px\n  return css`\n    /*\n     * Icon styles sometimes fail to override correctly. Increasing specificity ensures consistent override behavior.\n     * https://styled-components.com/docs/faqs#how-can-i-override-styles-with-higher-specificity\n     */\n    &&& {\n      height: 0.75rem;\n      width: 0.75rem;\n      min-width: 0.75rem;\n      min-height: 0.75rem;\n      margin-inline-end: ${cellAlign !== 'right' && '0.5rem'};\n      margin-inline-start: ${cellAlign === 'right' && '0.5rem'};\n      order: ${cellAlign === 'right' ? 1 : 2};\n      flex-shrink: 0;\n    }\n  `;\n});\n\nfunction CellWrapper({ column, level = 0 }) {\n  const ref = useRef();\n  const {\n    field: { cellAlign, type: fieldType },\n    isCustomColumn,\n    isLastColumn,\n    isFirstVisualColumn,\n    getCellStyleFormat\n  } = column;\n  const { classList, style: cellStyle, ...restProps } = column.getUIProps();\n  const {\n    config: styleFormatConfig = {},\n    label: styleFormatLabel,\n    id: styleFormatId\n  } = getCellStyleFormat() ?? {};\n  const { foregroundColor, icon: cellIconProps } = styleFormatConfig;\n  const context = {\n    getElement: () => ref.current,\n    getStyles: useCallback(() => ({ foregroundColor }), [foregroundColor])\n  };\n  const { cellStyles, renderingEngineStyles } = getStyles(column, level, styleFormatConfig);\n  const [translate] = useTranslate();\n\n  return (\n    <div\n      {...restProps}\n      className={cx(\n        'cell',\n        ...classList,\n        {\n          'cell-fixed': column.frozen,\n          'cell-last': isLastColumn,\n          'cell-first': isFirstVisualColumn,\n          'cell-last-frozen': column.lastFrozen,\n          'column-type-action': fieldType === FieldType.ACTION_FIELD_TYPE\n        },\n        !isCustomColumn && cellAlign && CELL_ALIGN_CLASSES[cellAlign]\n      )}\n      style={cellStyles}\n      ref={ref}\n      tabIndex={-1}\n      data-style-format={styleFormatId}\n    >\n      <RenderingEngine\n        style={renderingEngineStyles}\n        highlighter\n        {...column.getRenderingEngineProps()}\n        context={context}\n      />\n      {cellIconProps && <CellIcon {...cellIconProps} cellAlign={cellAlign} set='budicon' />}\n      {styleFormatId && (\n        <VisuallyHiddenText\n          id={styleFormatId}\n        >{`,${translate('state')}: ${styleFormatLabel},`}</VisuallyHiddenText>\n      )}\n    </div>\n  );\n}\n\nCellWrapper.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any),\n  level: PropTypes.number\n};\n\nexport default memo(CellWrapper);\n"]}

package/lib/Core/Views/Table/GroupingHeaderCell.d.ts

@@ -1,21 +1,12 @@
 export default GroupingHeaderCell;
-declare function GroupingHeaderCell(props: any): import("react/jsx-runtime").JSX.Element | null;
+declare function GroupingHeaderCell({ view }: {
+    view: any;
+}): import("react/jsx-runtime").JSX.Element | null;
 declare namespace GroupingHeaderCell {
     namespace propTypes {
-        let isExpanded: PropTypes.Requireable<boolean>;
-        let enable: PropTypes.Requireable<boolean>;
-        let handleChange: PropTypes.Requireable<(...args: any[]) => any>;
-        let classList: PropTypes.Requireable<(string | null | undefined)[]>;
-    }
-    namespace defaultProps {
-        let isExpanded_1: boolean;
-        export { isExpanded_1 as isExpanded };
-        let enable_1: boolean;
-        export { enable_1 as enable };
-        export function handleChange_1(): undefined;
-        export { handleChange_1 as handleChange };
-        let classList_1: never[];
-        export { classList_1 as classList };
+        let view: PropTypes.Validator<{
+            [x: string]: any;
+        }>;
     }
 }
 import PropTypes from 'prop-types';

package/lib/Core/Views/Table/GroupingHeaderCell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GroupingHeaderCell.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/GroupingHeaderCell.jsx"],"names":[],"mappings":";AAOA,gGAkBC;;;;;;;;;;;;;QAYe,4CAAe;;;;;;sBArCT,YAAY"}
+{"version":3,"file":"GroupingHeaderCell.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/GroupingHeaderCell.jsx"],"names":[],"mappings":";AAQA;;mDAqCC;;;;;;;;sBA7CqB,YAAY"}

package/lib/Core/Views/Table/GroupingHeaderCell.js

@@ -1,26 +1,28 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import PropTypes from 'prop-types';
 import { Icon, Button } from '@pega/cosmos-react-core';
-import { createClassName as cx } from '../../Utils';
+import { createClassName as cx, isRowReorderFieldEnabled } from '../../Utils';
 import useTranslate from '../../Hooks/useTranslate';
-function GroupingHeaderCell(props) {
-    const { enable, isExpanded, handleChange, classList } = props;
+import useSelectAllCheckbox from '../../Hooks/useSelectAllCheckbox';
+function GroupingHeaderCell({ view }) {
     const [translate] = useTranslate();
+    const { enable, isExpanded, handleChange } = view.groupingHeaderCellProps;
+    const { showSelectAllCheckbox } = useSelectAllCheckbox({
+        selectedRecordsCount: view.selectedRecordsCount,
+        resultsCount: view.resultsCount,
+        hasMoreResults: view.hasMoreResults,
+        selectionMode: view.meta?.selectionMode,
+        selectionCountThreshold: view.meta?.selectionCountThreshold
+    });
+    const hasOotbColumns = showSelectAllCheckbox ||
+        !!view.state?.errors?.dataErrors ||
+        isRowReorderFieldEnabled(view.meta ?? {});
     if (!enable)
         return null;
-    return (_jsx("div", { className: cx('expand-collapse-all', { expanded: isExpanded }, ...classList), children: _jsx(Button, { onClick: () => handleChange(!isExpanded), variant: 'simple', icon: true, compact: true, "aria-live": 'polite', label: isExpanded ? translate('Collapse all groups') : translate('Expand all groups'), children: isExpanded ? _jsx(Icon, { name: 'caret-down' }) : _jsx(Icon, { name: 'caret-right' }) }) }));
+    return (_jsx("div", { className: cx('expand-collapse-all', { expanded: isExpanded }, hasOotbColumns && 'no-border-right'), children: _jsx(Button, { onClick: () => handleChange(!isExpanded), variant: 'simple', icon: true, compact: true, "aria-live": 'polite', label: isExpanded ? translate('Collapse all groups') : translate('Expand all groups'), children: isExpanded ? _jsx(Icon, { name: 'caret-down' }) : _jsx(Icon, { name: 'caret-right' }) }) }));
 }
 GroupingHeaderCell.propTypes = {
-    isExpanded: PropTypes.bool,
-    enable: PropTypes.bool,
-    handleChange: PropTypes.func,
-    classList: PropTypes.arrayOf(PropTypes.string)
-};
-GroupingHeaderCell.defaultProps = {
-    isExpanded: false,
-    enable: false,
-    handleChange: () => undefined,
-    classList: []
+    view: PropTypes.objectOf(PropTypes.any).isRequired
 };
 export default GroupingHeaderCell;
 //# sourceMappingURL=GroupingHeaderCell.js.map

package/lib/Core/Views/Table/GroupingHeaderCell.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupingHeaderCell.js","sourceRoot":"","sources":["../../../../Core/Views/Table/GroupingHeaderCell.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEvD,OAAO,EAAE,eAAe,IAAI,EAAE,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,SAAS,kBAAkB,CAAC,KAAK;IAC/B,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAC9D,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IACzB,OAAO,CACL,cAAK,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,EAAE,GAAG,SAAS,CAAC,YAC/E,KAAC,MAAM,IACL,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,CAAC,UAAU,CAAC,EACxC,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,OAAO,qBACG,QAAQ,EAClB,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,mBAAmB,CAAC,YAEpF,UAAU,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,GAAG,GAC/D,GACL,CACP,CAAC;AACJ,CAAC;AAED,kBAAkB,CAAC,SAAS,GAAG;IAC7B,UAAU,EAAE,SAAS,CAAC,IAAI;IAC1B,MAAM,EAAE,SAAS,CAAC,IAAI;IACtB,YAAY,EAAE,SAAS,CAAC,IAAI;IAC5B,SAAS,EAAE,SAAS,CAAC,OAAO,CAAC,SAAS,CAAC,MAAM,CAAC;CAC/C,CAAC;AAEF,kBAAkB,CAAC,YAAY,GAAG;IAChC,UAAU,EAAE,KAAK;IACjB,MAAM,EAAE,KAAK;IACb,YAAY,EAAE,GAAG,EAAE,CAAC,SAAS;IAC7B,SAAS,EAAE,EAAE;CACd,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import PropTypes from 'prop-types';\n\nimport { Icon, Button } from '@pega/cosmos-react-core';\n\nimport { createClassName as cx } from '../../Utils';\nimport useTranslate from '../../Hooks/useTranslate';\n\nfunction GroupingHeaderCell(props) {\n  const { enable, isExpanded, handleChange, classList } = props;\n  const [translate] = useTranslate();\n  if (!enable) return null;\n  return (\n    <div className={cx('expand-collapse-all', { expanded: isExpanded }, ...classList)}>\n      <Button\n        onClick={() => handleChange(!isExpanded)}\n        variant='simple'\n        icon\n        compact\n        aria-live='polite'\n        label={isExpanded ? translate('Collapse all groups') : translate('Expand all groups')}\n      >\n        {isExpanded ? <Icon name='caret-down' /> : <Icon name='caret-right' />}\n      </Button>\n    </div>\n  );\n}\n\nGroupingHeaderCell.propTypes = {\n  isExpanded: PropTypes.bool,\n  enable: PropTypes.bool,\n  handleChange: PropTypes.func,\n  classList: PropTypes.arrayOf(PropTypes.string)\n};\n\nGroupingHeaderCell.defaultProps = {\n  isExpanded: false,\n  enable: false,\n  handleChange: () => undefined,\n  classList: []\n};\n\nexport default GroupingHeaderCell;\n"]}
+{"version":3,"file":"GroupingHeaderCell.js","sourceRoot":"","sources":["../../../../Core/Views/Table/GroupingHeaderCell.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,yBAAyB,CAAC;AAEvD,OAAO,EAAE,eAAe,IAAI,EAAE,EAAE,wBAAwB,EAAE,MAAM,aAAa,CAAC;AAC9E,OAAO,YAAY,MAAM,0BAA0B,CAAC;AACpD,OAAO,oBAAoB,MAAM,kCAAkC,CAAC;AAEpE,SAAS,kBAAkB,CAAC,EAAE,IAAI,EAAE;IAClC,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,MAAM,EAAE,MAAM,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,uBAAuB,CAAC;IAE1E,MAAM,EAAE,qBAAqB,EAAE,GAAG,oBAAoB,CAAC;QACrD,oBAAoB,EAAE,IAAI,CAAC,oBAAoB;QAC/C,YAAY,EAAE,IAAI,CAAC,YAAY;QAC/B,cAAc,EAAE,IAAI,CAAC,cAAc;QACnC,aAAa,EAAE,IAAI,CAAC,IAAI,EAAE,aAAa;QACvC,uBAAuB,EAAE,IAAI,CAAC,IAAI,EAAE,uBAAuB;KAC5D,CAAC,CAAC;IACH,MAAM,cAAc,GAClB,qBAAqB;QACrB,CAAC,CAAC,IAAI,CAAC,KAAK,EAAE,MAAM,EAAE,UAAU;QAChC,wBAAwB,CAAC,IAAI,CAAC,IAAI,IAAI,EAAE,CAAC,CAAC;IAE5C,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IACzB,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CACX,qBAAqB,EACrB,EAAE,QAAQ,EAAE,UAAU,EAAE,EACxB,cAAc,IAAI,iBAAiB,CACpC,YAED,KAAC,MAAM,IACL,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,CAAC,UAAU,CAAC,EACxC,OAAO,EAAC,QAAQ,EAChB,IAAI,QACJ,OAAO,qBACG,QAAQ,EAClB,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,SAAS,CAAC,qBAAqB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,mBAAmB,CAAC,YAEpF,UAAU,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,IAAI,EAAC,YAAY,GAAG,CAAC,CAAC,CAAC,KAAC,IAAI,IAAC,IAAI,EAAC,aAAa,GAAG,GAC/D,GACL,CACP,CAAC;AACJ,CAAC;AAED,kBAAkB,CAAC,SAAS,GAAG;IAC7B,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;CACnD,CAAC;AAEF,eAAe,kBAAkB,CAAC","sourcesContent":["import PropTypes from 'prop-types';\n\nimport { Icon, Button } from '@pega/cosmos-react-core';\n\nimport { createClassName as cx, isRowReorderFieldEnabled } from '../../Utils';\nimport useTranslate from '../../Hooks/useTranslate';\nimport useSelectAllCheckbox from '../../Hooks/useSelectAllCheckbox';\n\nfunction GroupingHeaderCell({ view }) {\n  const [translate] = useTranslate();\n  const { enable, isExpanded, handleChange } = view.groupingHeaderCellProps;\n\n  const { showSelectAllCheckbox } = useSelectAllCheckbox({\n    selectedRecordsCount: view.selectedRecordsCount,\n    resultsCount: view.resultsCount,\n    hasMoreResults: view.hasMoreResults,\n    selectionMode: view.meta?.selectionMode,\n    selectionCountThreshold: view.meta?.selectionCountThreshold\n  });\n  const hasOotbColumns =\n    showSelectAllCheckbox ||\n    !!view.state?.errors?.dataErrors ||\n    isRowReorderFieldEnabled(view.meta ?? {});\n\n  if (!enable) return null;\n  return (\n    <div\n      className={cx(\n        'expand-collapse-all',\n        { expanded: isExpanded },\n        hasOotbColumns && 'no-border-right'\n      )}\n    >\n      <Button\n        onClick={() => handleChange(!isExpanded)}\n        variant='simple'\n        icon\n        compact\n        aria-live='polite'\n        label={isExpanded ? translate('Collapse all groups') : translate('Expand all groups')}\n      >\n        {isExpanded ? <Icon name='caret-down' /> : <Icon name='caret-right' />}\n      </Button>\n    </div>\n  );\n}\n\nGroupingHeaderCell.propTypes = {\n  view: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nexport default GroupingHeaderCell;\n"]}

package/lib/Core/Views/Table/HeaderWrapper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderWrapper.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/HeaderWrapper.jsx"],"names":[],"mappings":";AASA;;4CA0CC;;;;;;;;sBAlDqB,YAAY"}
+{"version":3,"file":"HeaderWrapper.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/HeaderWrapper.jsx"],"names":[],"mappings":";AAUA;;4CA0CC;;;;;;;;sBAnDqB,YAAY"}

package/lib/Core/Views/Table/HeaderWrapper.js

@@ -1,13 +1,12 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { useRef } from 'react';
 import PropTypes from 'prop-types';
+import { FieldType } from 'pega-repeating-structures-core';
 import { createClassName as cx } from '../../Utils';
 import TableHeaderCell from '../../Components/HeaderCell';
-import useTranslate from '../../Hooks/useTranslate';
 import useSort from './UseSort';
 function HeaderWrapper({ column }) {
-    const [translate] = useTranslate();
-    const { field: { id, idHash, cellAlign }, isCustomColumn, isLastColumn, isFirstVisualColumn, label } = column;
+    const { field: { id, idHash, cellAlign, type: fieldType }, isCustomColumn, isLastColumn, isFirstVisualColumn, label } = column;
     const { classList } = column.getUIProps();
     const header = useRef();
     const popoverButtonRef = useRef();
@@ -24,8 +23,9 @@ function HeaderWrapper({ column }) {
             'cell-right-align': !isCustomColumn && cellAlign === 'right',
             'cell-last': isLastColumn,
             'cell-first': isFirstVisualColumn,
-            'cell-last-frozen': column.lastFrozen
-        }), role: 'columnheader', style: styles, ref: header, "aria-label": translate(label), "aria-colindex": column.order + 1, tabIndex: -1, "data-col-id": id, ...column.getHeaderUIProps(), children: _jsx(TableHeaderCell, { column: column, popoverButtonRef: popoverButtonRef }) }));
+            'cell-last-frozen': column.lastFrozen,
+            'column-type-action': fieldType === FieldType.ACTION_FIELD_TYPE
+        }), role: 'columnheader', style: styles, ref: header, "aria-label": label, "aria-colindex": column.order + 1, tabIndex: -1, "data-col-id": id, ...column.getHeaderUIProps(), children: _jsx(TableHeaderCell, { column: column, popoverButtonRef: popoverButtonRef }) }));
 }
 HeaderWrapper.propTypes = {
     column: PropTypes.objectOf(PropTypes.any).isRequired

package/lib/Core/Views/Table/HeaderWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderWrapper.js","sourceRoot":"","sources":["../../../../Core/Views/Table/HeaderWrapper.jsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,eAAe,IAAI,EAAE,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,eAAe,MAAM,6BAA6B,CAAC;AAC1D,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,OAAO,OAAO,MAAM,WAAW,CAAC;AAEhC,SAAS,aAAa,CAAC,EAAE,MAAM,EAAE;IAC/B,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,MAAM,EACJ,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,EAChC,cAAc,EACd,YAAY,EACZ,mBAAmB,EACnB,KAAK,EACN,GAAG,MAAM,CAAC;IACX,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,UAAU,EAAE,CAAC;IAC1C,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC;IACxB,MAAM,gBAAgB,GAAG,MAAM,EAAE,CAAC;IAClC,OAAO,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAExB,MAAM,MAAM,GAAG;QACb,IAAI,EAAE,kBAAkB,MAAM,GAAG;QACjC,KAAK,EAAE,mBAAmB,MAAM,GAAG;QACnC,KAAK,EAAE,mBAAmB,MAAM,GAAG;QACnC,MAAM,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,EAAE;KACpD,CAAC;IACF,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,GAAG,SAAS,EAAE;YAClC,YAAY,EAAE,MAAM,CAAC,MAAM;YAC3B,wGAAwG;YACxG,kBAAkB,EAAE,CAAC,cAAc,IAAI,SAAS,KAAK,OAAO;YAC5D,WAAW,EAAE,YAAY;YACzB,YAAY,EAAE,mBAAmB;YACjC,kBAAkB,EAAE,MAAM,CAAC,UAAU;SACtC,CAAC,EACF,IAAI,EAAC,cAAc,EACnB,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,gBACC,SAAS,CAAC,KAAK,CAAC,mBACb,MAAM,CAAC,KAAK,GAAG,CAAC,EAC/B,QAAQ,EAAE,CAAC,CAAC,iBACC,EAAE,KACX,MAAM,CAAC,gBAAgB,EAAE,YAE7B,KAAC,eAAe,IAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,gBAAgB,GAAI,GACnE,CACP,CAAC;AACJ,CAAC;AAED,aAAa,CAAC,SAAS,GAAG;IACxB,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;CACrD,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { createClassName as cx } from '../../Utils';\nimport TableHeaderCell from '../../Components/HeaderCell';\nimport useTranslate from '../../Hooks/useTranslate';\n\nimport useSort from './UseSort';\n\nfunction HeaderWrapper({ column }) {\n  const [translate] = useTranslate();\n  const {\n    field: { id, idHash, cellAlign },\n    isCustomColumn,\n    isLastColumn,\n    isFirstVisualColumn,\n    label\n  } = column;\n  const { classList } = column.getUIProps();\n  const header = useRef();\n  const popoverButtonRef = useRef();\n  useSort(header, column);\n\n  const styles = {\n    left: `var(--col-left-${idHash})`,\n    order: `var(--col-order-${idHash})`,\n    width: `var(--col-width-${idHash})`,\n    cursor: `${column.field.sort ? 'pointer' : 'auto'}`\n  };\n  return (\n    <div\n      className={cx('cell', ...classList, {\n        'cell-fixed': column.frozen,\n        // For now going with align right handling only as we don't have requirement of align center for header.\n        'cell-right-align': !isCustomColumn && cellAlign === 'right',\n        'cell-last': isLastColumn,\n        'cell-first': isFirstVisualColumn,\n        'cell-last-frozen': column.lastFrozen\n      })}\n      role='columnheader'\n      style={styles}\n      ref={header}\n      aria-label={translate(label)}\n      aria-colindex={column.order + 1}\n      tabIndex={-1}\n      data-col-id={id}\n      {...column.getHeaderUIProps()}\n    >\n      <TableHeaderCell column={column} popoverButtonRef={popoverButtonRef} />\n    </div>\n  );\n}\n\nHeaderWrapper.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nexport default HeaderWrapper;\n"]}
+{"version":3,"file":"HeaderWrapper.js","sourceRoot":"","sources":["../../../../Core/Views/Table/HeaderWrapper.jsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC/B,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAE3D,OAAO,EAAE,eAAe,IAAI,EAAE,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,eAAe,MAAM,6BAA6B,CAAC;AAE1D,OAAO,OAAO,MAAM,WAAW,CAAC;AAEhC,SAAS,aAAa,CAAC,EAAE,MAAM,EAAE;IAC/B,MAAM,EACJ,KAAK,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,EACjD,cAAc,EACd,YAAY,EACZ,mBAAmB,EACnB,KAAK,EACN,GAAG,MAAM,CAAC;IACX,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC,UAAU,EAAE,CAAC;IAC1C,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC;IACxB,MAAM,gBAAgB,GAAG,MAAM,EAAE,CAAC;IAClC,OAAO,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAExB,MAAM,MAAM,GAAG;QACb,IAAI,EAAE,kBAAkB,MAAM,GAAG;QACjC,KAAK,EAAE,mBAAmB,MAAM,GAAG;QACnC,KAAK,EAAE,mBAAmB,MAAM,GAAG;QACnC,MAAM,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,EAAE;KACpD,CAAC;IACF,OAAO,CACL,cACE,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,GAAG,SAAS,EAAE;YAClC,YAAY,EAAE,MAAM,CAAC,MAAM;YAC3B,wGAAwG;YACxG,kBAAkB,EAAE,CAAC,cAAc,IAAI,SAAS,KAAK,OAAO;YAC5D,WAAW,EAAE,YAAY;YACzB,YAAY,EAAE,mBAAmB;YACjC,kBAAkB,EAAE,MAAM,CAAC,UAAU;YACrC,oBAAoB,EAAE,SAAS,KAAK,SAAS,CAAC,iBAAiB;SAChE,CAAC,EACF,IAAI,EAAC,cAAc,EACnB,KAAK,EAAE,MAAM,EACb,GAAG,EAAE,MAAM,gBACC,KAAK,mBACF,MAAM,CAAC,KAAK,GAAG,CAAC,EAC/B,QAAQ,EAAE,CAAC,CAAC,iBACC,EAAE,KACX,MAAM,CAAC,gBAAgB,EAAE,YAE7B,KAAC,eAAe,IAAC,MAAM,EAAE,MAAM,EAAE,gBAAgB,EAAE,gBAAgB,GAAI,GACnE,CACP,CAAC;AACJ,CAAC;AAED,aAAa,CAAC,SAAS,GAAG;IACxB,MAAM,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;CACrD,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { useRef } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { FieldType } from 'pega-repeating-structures-core';\n\nimport { createClassName as cx } from '../../Utils';\nimport TableHeaderCell from '../../Components/HeaderCell';\n\nimport useSort from './UseSort';\n\nfunction HeaderWrapper({ column }) {\n  const {\n    field: { id, idHash, cellAlign, type: fieldType },\n    isCustomColumn,\n    isLastColumn,\n    isFirstVisualColumn,\n    label\n  } = column;\n  const { classList } = column.getUIProps();\n  const header = useRef();\n  const popoverButtonRef = useRef();\n  useSort(header, column);\n\n  const styles = {\n    left: `var(--col-left-${idHash})`,\n    order: `var(--col-order-${idHash})`,\n    width: `var(--col-width-${idHash})`,\n    cursor: `${column.field.sort ? 'pointer' : 'auto'}`\n  };\n  return (\n    <div\n      className={cx('cell', ...classList, {\n        'cell-fixed': column.frozen,\n        // For now going with align right handling only as we don't have requirement of align center for header.\n        'cell-right-align': !isCustomColumn && cellAlign === 'right',\n        'cell-last': isLastColumn,\n        'cell-first': isFirstVisualColumn,\n        'cell-last-frozen': column.lastFrozen,\n        'column-type-action': fieldType === FieldType.ACTION_FIELD_TYPE\n      })}\n      role='columnheader'\n      style={styles}\n      ref={header}\n      aria-label={label}\n      aria-colindex={column.order + 1}\n      tabIndex={-1}\n      data-col-id={id}\n      {...column.getHeaderUIProps()}\n    >\n      <TableHeaderCell column={column} popoverButtonRef={popoverButtonRef} />\n    </div>\n  );\n}\n\nHeaderWrapper.propTypes = {\n  column: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nexport default HeaderWrapper;\n"]}

package/lib/Core/Views/Table/SkeletonRows.d.ts

@@ -1,4 +1,4 @@
-export declare const StyledSkeletonRow: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
+export declare const StyledSkeletonRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 declare const SkeletonRows: () => import("react/jsx-runtime").JSX.Element;
 export default SkeletonRows;
 //# sourceMappingURL=SkeletonRows.d.ts.map

package/lib/Core/Views/Table/SkeletonRows.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SkeletonRows.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/SkeletonRows.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,iBAAiB,yGAsD5B,CAAC;AAIH,QAAA,MAAM,YAAY,+CAQjB,CAAC;AAEF,eAAe,YAAY,CAAC"}
+{"version":3,"file":"SkeletonRows.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/SkeletonRows.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,iBAAiB,6NAsD5B,CAAC;AAIH,QAAA,MAAM,YAAY,+CAQjB,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/lib/Core/Views/Table/StyledTableContainer.d.ts

@@ -1,3 +1,5 @@
 export default StyledTableContainer;
-declare const StyledTableContainer: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>, import("styled-components").DefaultTheme, {}, never>;
+declare const StyledTableContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("react").RefAttributes<any>, "ref"> & {
+    ref?: ((instance: any) => 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<any> | null | undefined;
+}, never>> & string & Omit<import("react").ForwardRefExoticComponent<import("react").RefAttributes<any>>, keyof import("react").Component<any, {}, any>>;
 //# sourceMappingURL=StyledTableContainer.d.ts.map

package/lib/Core/Views/Table/StyledTableContainer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StyledTableContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":";AAkBA,oNAu5BG"}
+{"version":3,"file":"StyledTableContainer.d.ts","sourceRoot":"","sources":["../../../../Core/Views/Table/StyledTableContainer.jsx"],"names":[],"mappings":";AAyBA;;yJAkhCG"}