@pega/lists-react 8.0.0-build.27.14

package/lib/Core/Components/RenderingEngine/useHighlighter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHighlighter.d.ts","sourceRoot":"","sources":["../../../../Core/Components/RenderingEngine/useHighlighter.ts"],"names":[],"mappings":"AAOA,MAAM,CAAC,OAAO,UAAU,cAAc,CACpC,OAAO,EAAE,GAAG,EACZ,EAAE,aAAqB,EAAE,eAAuB,EAAE;;;CAAK,QA8CxD"}

package/lib/Core/Components/RenderingEngine/useHighlighter.js

@@ -0,0 +1,52 @@
+import { useEffect } from 'react';
+const SPECIAL_CHARS_REGEX = /(\[|\\|\^|\$|\.|\||\?|\*|\+|\(|\))/g;
+function sanitizeRegex(regex) {
+    return regex?.replace(SPECIAL_CHARS_REGEX, '\\$1');
+}
+export default function useHighlighter(context, { caseSensitive = false, shouldHighlight = false } = {}) {
+    // Context is executional context and wont be available in asynchronous method.
+    // We have to keep reference of used objects in closure.
+    const getElement = context?.getElement;
+    const getSearchKeyword = context?.getSearchKeyword;
+    useEffect(() => {
+        const flags = caseSensitive ? 'g' : 'gi';
+        const keyword = [sanitizeRegex(getSearchKeyword?.()?.trim())].filter((_) => _);
+        const keywordRegex = new RegExp(keyword[0], flags);
+        function highlight(element) {
+            if (!element?.textContent || !keywordRegex.test(element.textContent)) {
+                // in case there is no match
+                return;
+            }
+            // Sort longer matches first to avoid
+            // highlighting keywords within keywords.
+            Array.from(element?.childNodes || []).forEach(child => {
+                keywordRegex.lastIndex = 0;
+                if (child.nodeType !== 3) {
+                    // not a text node
+                    if (child.nodeName !== 'SCRIPT' && child.nodeName !== 'STYLE') {
+                        highlight(child);
+                    }
+                }
+                else if (child.textContent && keywordRegex.test(child.textContent)) {
+                    const frag = document.createDocumentFragment();
+                    let lastIdx = 0;
+                    child.textContent.replace(keywordRegex, (match, idx) => {
+                        const part = document.createTextNode(child.textContent.slice(lastIdx, idx));
+                        const highlighted = document.createElement('mark');
+                        highlighted.style.background = '#fffc65';
+                        highlighted.textContent = match;
+                        frag.appendChild(part);
+                        frag.appendChild(highlighted);
+                        lastIdx = idx + match.length;
+                    });
+                    const end = document.createTextNode(child.textContent.slice(lastIdx));
+                    frag.appendChild(end);
+                    child.parentNode?.replaceChild(frag, child);
+                }
+            });
+        }
+        if (shouldHighlight && keyword.length)
+            highlight(getElement?.());
+    });
+}
+//# sourceMappingURL=useHighlighter.js.map

package/lib/Core/Components/RenderingEngine/useHighlighter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHighlighter.js","sourceRoot":"","sources":["../../../../Core/Components/RenderingEngine/useHighlighter.ts"],"names":[],"mappings":"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","sourcesContent":["import { useEffect } from 'react';\n\nconst SPECIAL_CHARS_REGEX = /(\\[|\\\\|\\^|\\$|\\.|\\||\\?|\\*|\\+|\\(|\\))/g;\nfunction sanitizeRegex(regex: string) {\n  return regex?.replace(SPECIAL_CHARS_REGEX, '\\\\$1');\n}\n\nexport default function useHighlighter(\n  context: any,\n  { caseSensitive = false, shouldHighlight = false } = {}\n) {\n  // Context is executional context and wont be available in asynchronous method.\n  // We have to keep reference of used objects in closure.\n  const getElement = context?.getElement;\n  const getSearchKeyword = context?.getSearchKeyword;\n\n  useEffect(() => {\n    const flags = caseSensitive ? 'g' : 'gi';\n    const keyword = [sanitizeRegex(getSearchKeyword?.()?.trim())].filter((_: string) => _);\n\n    const keywordRegex = new RegExp(keyword[0], flags);\n    function highlight(element: Node) {\n      if (!element?.textContent || !keywordRegex.test(element.textContent)) {\n        // in case there is no match\n        return;\n      }\n      // Sort longer matches first to avoid\n      // highlighting keywords within keywords.\n      Array.from(element?.childNodes || []).forEach(child => {\n        keywordRegex.lastIndex = 0;\n        if (child.nodeType !== 3) {\n          // not a text node\n          if (child.nodeName !== 'SCRIPT' && child.nodeName !== 'STYLE') {\n            highlight(child);\n          }\n        } else if (child.textContent && keywordRegex.test(child.textContent)) {\n          const frag = document.createDocumentFragment();\n          let lastIdx = 0;\n          child.textContent.replace(keywordRegex, (match: string, idx: number): any => {\n            const part = document.createTextNode(child.textContent!.slice(lastIdx, idx));\n            const highlighted = document.createElement('mark');\n            highlighted.style.background = '#fffc65';\n            highlighted.textContent = match;\n            frag.appendChild(part);\n            frag.appendChild(highlighted);\n            lastIdx = idx + match.length;\n          });\n          const end = document.createTextNode(child.textContent.slice(lastIdx));\n          frag.appendChild(end);\n          child.parentNode?.replaceChild(frag, child);\n        }\n      });\n    }\n    if (shouldHighlight && keyword.length) highlight(getElement?.());\n  });\n}\n"]}

package/lib/Core/Components/TestIdConstants.d.ts

@@ -0,0 +1,15 @@
+declare namespace _default {
+    let filterButton: string;
+    let groupButton: string;
+    let sortButton: string;
+    let moreOptionsButton: string;
+    let noRecords: string;
+    let aggregateDisplayValue: string;
+    let columnFilterIcon: string;
+    let groupHeader: string;
+    let groupHeaderCount: string;
+    let groupHeaderGroupBy: string;
+    let hierarchicalCell: string;
+}
+export default _default;
+//# sourceMappingURL=TestIdConstants.d.ts.map

package/lib/Core/Components/TestIdConstants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TestIdConstants.d.ts","sourceRoot":"","sources":["../../../Core/Components/TestIdConstants.js"],"names":[],"mappings":""}

package/lib/Core/Components/TestIdConstants.js

@@ -0,0 +1,14 @@
+export default {
+    filterButton: 'repeat-filter-button',
+    groupButton: 'repeat-group-button',
+    sortButton: 'repeat-sort-button',
+    moreOptionsButton: 'repeat-more-options-button',
+    noRecords: 'repeat-no-records',
+    aggregateDisplayValue: 'aggregate-display-value',
+    columnFilterIcon: 'column-filter-icon',
+    groupHeader: 'group-header',
+    groupHeaderCount: 'group-header-count',
+    groupHeaderGroupBy: 'group-header-group-by',
+    hierarchicalCell: 'hierarchical-cell'
+};
+//# sourceMappingURL=TestIdConstants.js.map

package/lib/Core/Components/TestIdConstants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TestIdConstants.js","sourceRoot":"","sources":["../../../Core/Components/TestIdConstants.js"],"names":[],"mappings":"AAAA,eAAe;IACb,YAAY,EAAE,sBAAsB;IACpC,WAAW,EAAE,qBAAqB;IAClC,UAAU,EAAE,oBAAoB;IAChC,iBAAiB,EAAE,4BAA4B;IAC/C,SAAS,EAAE,mBAAmB;IAC9B,qBAAqB,EAAE,yBAAyB;IAChD,gBAAgB,EAAE,oBAAoB;IACtC,WAAW,EAAE,cAAc;IAC3B,gBAAgB,EAAE,oBAAoB;IACtC,kBAAkB,EAAE,uBAAuB;IAC3C,gBAAgB,EAAE,mBAAmB;CACtC,CAAC","sourcesContent":["export default {\n  filterButton: 'repeat-filter-button',\n  groupButton: 'repeat-group-button',\n  sortButton: 'repeat-sort-button',\n  moreOptionsButton: 'repeat-more-options-button',\n  noRecords: 'repeat-no-records',\n  aggregateDisplayValue: 'aggregate-display-value',\n  columnFilterIcon: 'column-filter-icon',\n  groupHeader: 'group-header',\n  groupHeaderCount: 'group-header-count',\n  groupHeaderGroupBy: 'group-header-group-by',\n  hierarchicalCell: 'hierarchical-cell'\n};\n"]}

package/lib/Core/Components/Toolbar/ActionsMenu.d.ts

@@ -0,0 +1,15 @@
+export default ActionsMenu;
+declare function ActionsMenu({ view, enableActionsMenu }: {
+    view: any;
+    enableActionsMenu: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace ActionsMenu {
+    namespace propTypes {
+        let view: PropTypes.Validator<{
+            [x: string]: any;
+        }>;
+        let enableActionsMenu: PropTypes.Validator<boolean>;
+    }
+}
+import PropTypes from 'prop-types';
+//# sourceMappingURL=ActionsMenu.d.ts.map

package/lib/Core/Components/Toolbar/ActionsMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionsMenu.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ActionsMenu.jsx"],"names":[],"mappings":";AAOA;;;4CAoEC;;;;;;;;;sBA3EqB,YAAY"}

package/lib/Core/Components/Toolbar/ActionsMenu.js

@@ -0,0 +1,58 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import PropTypes from 'prop-types';
+import { useState, useEffect } from 'react';
+import { MenuButton } from '@pega/cosmos-react-core';
+import useTranslate from '../../Hooks/useTranslate';
+function ActionsMenu({ view, enableActionsMenu }) {
+    const { state: { selectedRows } } = view;
+    const [actions, setActions] = useState([]);
+    const [actionsFetched, setActionsFetched] = useState(false);
+    const [translate] = useTranslate();
+    useEffect(() => {
+        setActions([]);
+        setActionsFetched(false);
+    }, [selectedRows]);
+    const fetchActions = () => {
+        if (!actionsFetched) {
+            view.type.fetchActions(selectedRows).then(response => {
+                const actionsArray = response.map(action => ({
+                    ...action,
+                    primary: action.text,
+                    onClick: () => {
+                        // cb to refresh only selected rows
+                        action.onClick(selectedRows, view.type.clearSelectionAndRefreshRows.bind(null, selectedRows));
+                    }
+                }));
+                setActions(actionsArray);
+                setActionsFetched(true);
+            });
+        }
+    };
+    // enableActionsMenu is false
+    let wrapperDivProps = {
+        'aria-label': translate('Select two or more items to enable bulk actions'),
+        role: 'button',
+        'aria-disabled': true,
+        tabIndex: 0
+    };
+    // enableActionsMenu is true
+    if (enableActionsMenu) {
+        wrapperDivProps = {
+            tabIndex: -1,
+            'aria-disabled': false
+        };
+    }
+    return (_jsx("div", { ...wrapperDivProps, children: _jsx(MenuButton, { menu: {
+                items: actions.flat(),
+                emptyText: translate('No actions available'),
+                loading: !actionsFetched
+            }, popover: {
+                portal: true
+            }, onClick: fetchActions, variant: 'secondary', text: translate('Bulk actions'), iconOnly: false, disabled: !enableActionsMenu }) }));
+}
+ActionsMenu.propTypes = {
+    view: PropTypes.objectOf(PropTypes.any).isRequired,
+    enableActionsMenu: PropTypes.bool.isRequired
+};
+export default ActionsMenu;
+//# sourceMappingURL=ActionsMenu.js.map

package/lib/Core/Components/Toolbar/ActionsMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionsMenu.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ActionsMenu.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,EAAE,UAAU,EAAE,MAAM,yBAAyB,CAAC;AAErD,OAAO,YAAY,MAAM,0BAA0B,CAAC;AAEpD,SAAS,WAAW,CAAC,EAAE,IAAI,EAAE,iBAAiB,EAAE;IAC9C,MAAM,EACJ,KAAK,EAAE,EAAE,YAAY,EAAE,EACxB,GAAG,IAAI,CAAC;IAET,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAC3C,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5D,MAAM,CAAC,SAAS,CAAC,GAAG,YAAY,EAAE,CAAC;IACnC,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,EAAE,CAAC,CAAC;QACf,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAC3B,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAC;IAEnB,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,IAAI,CAAC,cAAc,EAAE,CAAC;YACpB,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE;gBACnD,MAAM,YAAY,GAAG,QAAQ,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;oBAC3C,GAAG,MAAM;oBACT,OAAO,EAAE,MAAM,CAAC,IAAI;oBACpB,OAAO,EAAE,GAAG,EAAE;wBACZ,mCAAmC;wBACnC,MAAM,CAAC,OAAO,CACZ,YAAY,EACZ,IAAI,CAAC,IAAI,CAAC,4BAA4B,CAAC,IAAI,CAAC,IAAI,EAAE,YAAY,CAAC,CAChE,CAAC;oBACJ,CAAC;iBACF,CAAC,CAAC,CAAC;gBACJ,UAAU,CAAC,YAAY,CAAC,CAAC;gBACzB,iBAAiB,CAAC,IAAI,CAAC,CAAC;YAC1B,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC,CAAC;IAEF,6BAA6B;IAC7B,IAAI,eAAe,GAAG;QACpB,YAAY,EAAE,SAAS,CAAC,iDAAiD,CAAC;QAC1E,IAAI,EAAE,QAAQ;QACd,eAAe,EAAE,IAAI;QACrB,QAAQ,EAAE,CAAC;KACZ,CAAC;IAEF,4BAA4B;IAC5B,IAAI,iBAAiB,EAAE,CAAC;QACtB,eAAe,GAAG;YAChB,QAAQ,EAAE,CAAC,CAAC;YACZ,eAAe,EAAE,KAAK;SACvB,CAAC;IACJ,CAAC;IAED,OAAO,CACL,iBAAS,eAAe,YACtB,KAAC,UAAU,IACT,IAAI,EAAE;gBACJ,KAAK,EAAE,OAAO,CAAC,IAAI,EAAE;gBACrB,SAAS,EAAE,SAAS,CAAC,sBAAsB,CAAC;gBAC5C,OAAO,EAAE,CAAC,cAAc;aACzB,EACD,OAAO,EAAE;gBACP,MAAM,EAAE,IAAI;aACb,EACD,OAAO,EAAE,YAAY,EACrB,OAAO,EAAC,WAAW,EACnB,IAAI,EAAE,SAAS,CAAC,cAAc,CAAC,EAC/B,QAAQ,EAAE,KAAK,EACf,QAAQ,EAAE,CAAC,iBAAiB,GAC5B,GACE,CACP,CAAC;AACJ,CAAC;AAED,WAAW,CAAC,SAAS,GAAG;IACtB,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IAClD,iBAAiB,EAAE,SAAS,CAAC,IAAI,CAAC,UAAU;CAC7C,CAAC;AAEF,eAAe,WAAW,CAAC","sourcesContent":["import PropTypes from 'prop-types';\nimport { useState, useEffect } from 'react';\n\nimport { MenuButton } from '@pega/cosmos-react-core';\n\nimport useTranslate from '../../Hooks/useTranslate';\n\nfunction ActionsMenu({ view, enableActionsMenu }) {\n  const {\n    state: { selectedRows }\n  } = view;\n\n  const [actions, setActions] = useState([]);\n  const [actionsFetched, setActionsFetched] = useState(false);\n  const [translate] = useTranslate();\n  useEffect(() => {\n    setActions([]);\n    setActionsFetched(false);\n  }, [selectedRows]);\n\n  const fetchActions = () => {\n    if (!actionsFetched) {\n      view.type.fetchActions(selectedRows).then(response => {\n        const actionsArray = response.map(action => ({\n          ...action,\n          primary: action.text,\n          onClick: () => {\n            // cb to refresh only selected rows\n            action.onClick(\n              selectedRows,\n              view.type.clearSelectionAndRefreshRows.bind(null, selectedRows)\n            );\n          }\n        }));\n        setActions(actionsArray);\n        setActionsFetched(true);\n      });\n    }\n  };\n\n  // enableActionsMenu is false\n  let wrapperDivProps = {\n    'aria-label': translate('Select two or more items to enable bulk actions'),\n    role: 'button',\n    'aria-disabled': true,\n    tabIndex: 0\n  };\n\n  // enableActionsMenu is true\n  if (enableActionsMenu) {\n    wrapperDivProps = {\n      tabIndex: -1,\n      'aria-disabled': false\n    };\n  }\n\n  return (\n    <div {...wrapperDivProps}>\n      <MenuButton\n        menu={{\n          items: actions.flat(),\n          emptyText: translate('No actions available'),\n          loading: !actionsFetched\n        }}\n        popover={{\n          portal: true\n        }}\n        onClick={fetchActions}\n        variant='secondary'\n        text={translate('Bulk actions')}\n        iconOnly={false}\n        disabled={!enableActionsMenu}\n      />\n    </div>\n  );\n}\n\nActionsMenu.propTypes = {\n  view: PropTypes.objectOf(PropTypes.any).isRequired,\n  enableActionsMenu: PropTypes.bool.isRequired\n};\n\nexport default ActionsMenu;\n"]}

package/lib/Core/Components/Toolbar/AdvanceToolbar.d.ts

@@ -0,0 +1,14 @@
+declare function AdvanceToolbar({ view }: {
+    view: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace AdvanceToolbar {
+    namespace propTypes {
+        let view: PropTypes.Validator<{
+            [x: string]: any;
+        }>;
+    }
+    let defaultProps: {};
+}
+export default AdvanceToolbar;
+import PropTypes from 'prop-types';
+//# sourceMappingURL=AdvanceToolbar.d.ts.map

package/lib/Core/Components/Toolbar/AdvanceToolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdvanceToolbar.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":"AAsBA;;4CAwHC;;;;;;;;;;sBA9IqB,YAAY"}

package/lib/Core/Components/Toolbar/AdvanceToolbar.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import PropTypes from 'prop-types';
+import { ListToolbar } from '@pega/cosmos-react-core';
+import { SELECTION_MODES } from '../../constants';
+import ActionsMenu from './ActionsMenu';
+import MapToolbar from './Map/MapToolbar';
+import ToolbarActions from './ToolbarActions';
+import TimelineToolbar from './Timeline/TimelineToolbar';
+import useSearch from './hooks/useSearch';
+import useFilter from './hooks/useFilter';
+import usePersonalization from './hooks/usePersonalization';
+import useMore from './hooks/useMore';
+import useGroup from './hooks/useGroup/useGroup';
+import useSort from './hooks/useSort/useSort';
+import getCount from './utils/getCount';
+import RefreshBanner from './RefreshBanner';
+import AnnounceRowsCount from './AnnounceRowsCount';
+import ValidateMessage from './ValidateMessage';
+import useFormControlProps from './hooks/useFormControlProps';
+export default function AdvanceToolbar({ view }) {
+    const { selectedRecordsCount, meta: { basicMode, selectionMode, title, toolbarActions, template, refreshAction, allowBulkActions, mapFieldIds } = {}, rows, state, getContext, isLoading, showCount } = view;
+    const { pendingRefresh } = state;
+    const { getRequiredDef } = getContext();
+    const { validatemessage } = getRequiredDef() || {};
+    const { viewSelector } = usePersonalization({ view });
+    const search = useSearch({ view });
+    const count = showCount ? getCount({ view }) : {};
+    const filter = useFilter({ view });
+    const group = useGroup({ view });
+    const sort = useSort({ view });
+    const { actions, actionsButtonRef, popover } = useMore({ view });
+    const enableActionsMenu = selectionMode === SELECTION_MODES.multi && selectedRecordsCount !== 0;
+    const formControlProps = useFormControlProps(view);
+    const additionalActions = (_jsxs(_Fragment, { children: [basicMode && (_jsx(ToolbarActions, { toolbarActions: toolbarActions?.filter(action => !action.id.startsWith('Add')) })), allowBulkActions && _jsx(ActionsMenu, { enableActionsMenu: enableActionsMenu, view: view })] }));
+    const createNewAction = toolbarActions?.find(action => action.id.startsWith('Add'));
+    const createNew = createNewAction && basicMode
+        ? {
+            label: createNewAction?.text,
+            onClick: createNewAction.onClick
+        }
+        : undefined;
+    let Toolbar;
+    switch (template) {
+        case 'Timeline':
+            Toolbar = (_jsxs(_Fragment, { children: [_jsx(TimelineToolbar, { name: title, formControlProps: formControlProps, viewSelector: viewSelector, search: search, count: count, additionalActions: additionalActions, filter: filter, createNew: createNew, view: view, actions: actions, actionsButtonRef: actionsButtonRef }), popover] }));
+            break;
+        case 'Map':
+            Toolbar = (_jsx(MapToolbar, { locationFieldId: mapFieldIds?.location, name: title, formControlProps: formControlProps, rows: rows, count: count, createNew: createNew, additionalActions: additionalActions }));
+            break;
+        default:
+            Toolbar = (_jsxs(_Fragment, { children: [_jsx(ListToolbar, { name: title, formControlProps: formControlProps, viewSelector: viewSelector, search: search, count: count, additionalActions: additionalActions, filter: filter, group: group, sort: sort, actions: actions, actionsButtonRef: actionsButtonRef, createNew: createNew }), popover] }));
+    }
+    return (_jsxs(AnnounceRowsCount, { state: state, count: count, isLoading: isLoading, children: [_jsx(ValidateMessage, { message: validatemessage, children: Toolbar }), refreshAction && pendingRefresh && (_jsx(RefreshBanner, { pendingRefresh: pendingRefresh, view: view }))] }));
+}
+AdvanceToolbar.propTypes = {
+    view: PropTypes.objectOf(PropTypes.any).isRequired
+};
+AdvanceToolbar.defaultProps = {};
+//# sourceMappingURL=AdvanceToolbar.js.map

package/lib/Core/Components/Toolbar/AdvanceToolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AdvanceToolbar.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AdvanceToolbar.jsx"],"names":[],"mappings":"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","sourcesContent":["import PropTypes from 'prop-types';\n\nimport { ListToolbar } from '@pega/cosmos-react-core';\n\nimport { SELECTION_MODES } from '../../constants';\n\nimport ActionsMenu from './ActionsMenu';\nimport MapToolbar from './Map/MapToolbar';\nimport ToolbarActions from './ToolbarActions';\nimport TimelineToolbar from './Timeline/TimelineToolbar';\nimport useSearch from './hooks/useSearch';\nimport useFilter from './hooks/useFilter';\nimport usePersonalization from './hooks/usePersonalization';\nimport useMore from './hooks/useMore';\nimport useGroup from './hooks/useGroup/useGroup';\nimport useSort from './hooks/useSort/useSort';\nimport getCount from './utils/getCount';\nimport RefreshBanner from './RefreshBanner';\nimport AnnounceRowsCount from './AnnounceRowsCount';\nimport ValidateMessage from './ValidateMessage';\nimport useFormControlProps from './hooks/useFormControlProps';\n\nexport default function AdvanceToolbar({ view }) {\n  const {\n    selectedRecordsCount,\n    meta: {\n      basicMode,\n      selectionMode,\n      title,\n      toolbarActions,\n      template,\n      refreshAction,\n      allowBulkActions,\n      mapFieldIds\n    } = {},\n    rows,\n    state,\n    getContext,\n    isLoading,\n    showCount\n  } = view;\n  const { pendingRefresh } = state;\n  const { getRequiredDef } = getContext();\n  const { validatemessage } = getRequiredDef() || {};\n  const { viewSelector } = usePersonalization({ view });\n  const search = useSearch({ view });\n  const count = showCount ? getCount({ view }) : {};\n  const filter = useFilter({ view });\n  const group = useGroup({ view });\n  const sort = useSort({ view });\n  const { actions, actionsButtonRef, popover } = useMore({ view });\n  const enableActionsMenu = selectionMode === SELECTION_MODES.multi && selectedRecordsCount !== 0;\n  const formControlProps = useFormControlProps(view);\n\n  const additionalActions = (\n    <>\n      {basicMode && (\n        <ToolbarActions\n          toolbarActions={toolbarActions?.filter(action => !action.id.startsWith('Add'))}\n        />\n      )}\n      {allowBulkActions && <ActionsMenu enableActionsMenu={enableActionsMenu} view={view} />}\n    </>\n  );\n\n  const createNewAction = toolbarActions?.find(action => action.id.startsWith('Add'));\n  const createNew =\n    createNewAction && basicMode\n      ? {\n          label: createNewAction?.text,\n          onClick: createNewAction.onClick\n        }\n      : undefined;\n\n  let Toolbar;\n  switch (template) {\n    case 'Timeline':\n      Toolbar = (\n        <>\n          <TimelineToolbar\n            name={title}\n            formControlProps={formControlProps}\n            viewSelector={viewSelector}\n            search={search}\n            count={count}\n            additionalActions={additionalActions}\n            filter={filter}\n            createNew={createNew}\n            view={view}\n            actions={actions}\n            actionsButtonRef={actionsButtonRef}\n          />\n          {popover}\n        </>\n      );\n      break;\n    case 'Map':\n      Toolbar = (\n        <MapToolbar\n          locationFieldId={mapFieldIds?.location}\n          name={title}\n          formControlProps={formControlProps}\n          rows={rows}\n          count={count}\n          createNew={createNew}\n          additionalActions={additionalActions}\n        />\n      );\n      break;\n    default:\n      Toolbar = (\n        <>\n          <ListToolbar\n            name={title}\n            formControlProps={formControlProps}\n            viewSelector={viewSelector}\n            search={search}\n            count={count}\n            additionalActions={additionalActions}\n            filter={filter}\n            group={group}\n            sort={sort}\n            actions={actions}\n            actionsButtonRef={actionsButtonRef}\n            createNew={createNew}\n          />\n          {popover}\n        </>\n      );\n  }\n\n  return (\n    <AnnounceRowsCount state={state} count={count} isLoading={isLoading}>\n      <ValidateMessage message={validatemessage}>\n        {Toolbar}\n        {/* FIXME: This implementation of error status should be considered temporary until an official, and properly accessible, spec is determined. */}\n      </ValidateMessage>\n      {refreshAction && pendingRefresh && (\n        <RefreshBanner pendingRefresh={pendingRefresh} view={view} />\n      )}\n    </AnnounceRowsCount>\n  );\n}\n\nAdvanceToolbar.propTypes = {\n  view: PropTypes.objectOf(PropTypes.any).isRequired\n};\n\nAdvanceToolbar.defaultProps = {};\n"]}

package/lib/Core/Components/Toolbar/AnnounceRowsCount.d.ts

@@ -0,0 +1,20 @@
+export default AnnounceRowsCount;
+declare function AnnounceRowsCount({ state, count, isLoading, children }: {
+    state: any;
+    count: any;
+    isLoading: any;
+    children: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace AnnounceRowsCount {
+    namespace propTypes {
+        let state: PropTypes.Validator<{
+            [x: string]: any;
+        }>;
+        let count: PropTypes.Validator<{
+            [x: string]: any;
+        }>;
+        let children: PropTypes.Validator<object>;
+    }
+}
+import PropTypes from 'prop-types';
+//# sourceMappingURL=AnnounceRowsCount.d.ts.map

package/lib/Core/Components/Toolbar/AnnounceRowsCount.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnnounceRowsCount.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AnnounceRowsCount.jsx"],"names":[],"mappings":";AAIA;;;;;4CAGC;;;;;;;;;;;;sBAPqB,YAAY"}

package/lib/Core/Components/Toolbar/AnnounceRowsCount.js

@@ -0,0 +1,14 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import PropTypes from 'prop-types';
+import useAnnounceRowsCount from './hooks/useAnnounceRowsCount';
+const AnnounceRowsCount = ({ state, count, isLoading, children }) => {
+    useAnnounceRowsCount(state, count, isLoading);
+    return _jsx(_Fragment, { children: children });
+};
+AnnounceRowsCount.propTypes = {
+    state: PropTypes.objectOf(PropTypes.any).isRequired,
+    count: PropTypes.objectOf(PropTypes.any).isRequired,
+    children: PropTypes.oneOfType([PropTypes.object, PropTypes.array]).isRequired
+};
+export default AnnounceRowsCount;
+//# sourceMappingURL=AnnounceRowsCount.js.map

package/lib/Core/Components/Toolbar/AnnounceRowsCount.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AnnounceRowsCount.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/AnnounceRowsCount.jsx"],"names":[],"mappings":";AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAO,oBAAoB,MAAM,8BAA8B,CAAC;AAEhE,MAAM,iBAAiB,GAAG,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,EAAE;IAClE,oBAAoB,CAAC,KAAK,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC;IAC9C,OAAO,4BAAG,QAAQ,GAAI,CAAC;AACzB,CAAC,CAAC;AAEF,iBAAiB,CAAC,SAAS,GAAG;IAC5B,KAAK,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IACnD,KAAK,EAAE,SAAS,CAAC,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,CAAC,UAAU;IACnD,QAAQ,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,MAAM,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,UAAU;CAC9E,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import PropTypes from 'prop-types';\n\nimport useAnnounceRowsCount from './hooks/useAnnounceRowsCount';\n\nconst AnnounceRowsCount = ({ state, count, isLoading, children }) => {\n  useAnnounceRowsCount(state, count, isLoading);\n  return <>{children}</>;\n};\n\nAnnounceRowsCount.propTypes = {\n  state: PropTypes.objectOf(PropTypes.any).isRequired,\n  count: PropTypes.objectOf(PropTypes.any).isRequired,\n  children: PropTypes.oneOfType([PropTypes.object, PropTypes.array]).isRequired\n};\n\nexport default AnnounceRowsCount;\n"]}

package/lib/Core/Components/Toolbar/ColumnSelector.d.ts

@@ -0,0 +1,35 @@
+export function getIconByFieldType(type: any): import("react/jsx-runtime").JSX.Element;
+/**
+ * Transforms the columns array into array of columns grouped by category
+ * @param {Array} columns : ;
+ * @returns Arrays of columns nested by category
+ */
+export function transformData(columns: any[], action: any): any[];
+export function ColumnSelectorControl(props: any): import("react/jsx-runtime").JSX.Element;
+export namespace ColumnSelectorControl {
+    namespace propTypes {
+        let data: PropTypes.Validator<(object | null | undefined)[]>;
+        let onSelect: PropTypes.Validator<(...args: any[]) => any>;
+        let forceShowPopup: PropTypes.Validator<boolean>;
+    }
+}
+export const colsVisibility: "Show/hide columns";
+export const pinning: "Freeze columns";
+declare const _default: import("react").MemoExoticComponent<typeof ColumnSelector>;
+export default _default;
+import PropTypes from 'prop-types';
+declare function ColumnSelector({ dispatch, columns, action }: {
+    dispatch: any;
+    columns: any;
+    action: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace ColumnSelector {
+    export namespace propTypes_1 {
+        let dispatch: PropTypes.Validator<(...args: any[]) => any>;
+        let columns: PropTypes.Validator<(object | null | undefined)[]>;
+        let action: PropTypes.Validator<string>;
+    }
+    export { propTypes_1 as propTypes };
+    export let defaultProps: {};
+}
+//# sourceMappingURL=ColumnSelector.d.ts.map

package/lib/Core/Components/Toolbar/ColumnSelector.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnSelector.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"AAWA,uFAGC;AACD;;;;GAIG;AACH,kEA4DC;AAED,2FA8DC;;;;;;;;AAxID,iDAAkD;AAClD,uCAAwC;;;sBARlB,YAAY;AAuJlC;;;;4CAwBC"}

package/lib/Core/Components/Toolbar/ColumnSelector.js

@@ -0,0 +1,141 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
+import { memo, useCallback, useEffect, useRef, useState, useMemo } from 'react';
+import PropTypes from 'prop-types';
+import { Icon, SearchInput, Menu, menuHelpers, useElement } from '@pega/cosmos-react-core';
+import useSelect from '../../Hooks/UseSelect';
+import { allowToggle, getFieldIcon } from '../../Utils';
+export const colsVisibility = 'Show/hide columns';
+export const pinning = 'Freeze columns';
+export function getIconByFieldType(type) {
+    const iconName = getFieldIcon(type);
+    return _jsx(Icon, { "data-test-id": iconName, "data-testid": iconName, name: iconName });
+}
+/**
+ * Transforms the columns array into array of columns grouped by category
+ * @param {Array} columns : ;
+ * @returns Arrays of columns nested by category
+ */
+export function transformData(columns, action) {
+    const result = [];
+    if (!columns?.length)
+        return result;
+    const categoryObj = {};
+    const allowColumnToggle = allowToggle(columns[0].parent.getVisibleColumns());
+    columns
+        ?.filter(c => c.field.toggle)
+        .forEach(column => {
+        const { field: { id, category = [], type }, label, hidden, frozen } = column;
+        const lastCategoryLabel = category.length ? category[category.length - 1].label : undefined;
+        let selectAction;
+        let disabled;
+        if (action === colsVisibility) {
+            selectAction = !hidden;
+            disabled = !allowColumnToggle && !hidden;
+        }
+        else if (action === pinning)
+            selectAction = frozen;
+        if (categoryObj[lastCategoryLabel])
+            categoryObj[lastCategoryLabel].items.push({
+                id,
+                primary: label,
+                label,
+                selected: selectAction,
+                type,
+                disabled
+            });
+        else {
+            categoryObj[lastCategoryLabel] = {
+                id: lastCategoryLabel,
+                label: lastCategoryLabel,
+                items: [
+                    {
+                        id,
+                        primary: label,
+                        selected: selectAction,
+                        label,
+                        type,
+                        disabled
+                    }
+                ]
+            };
+        }
+    });
+    // Items with no category attribute are set in the root of returned array
+    if (categoryObj[undefined] && categoryObj[undefined].items) {
+        result.push(...categoryObj[undefined].items);
+        delete categoryObj[undefined];
+    }
+    const keys = Object.keys(categoryObj);
+    // Items with category attribute are grouped inside the nested category object
+    keys.forEach(key => {
+        result.push(categoryObj[key]);
+    });
+    return result;
+}
+export function ColumnSelectorControl(props) {
+    const { data, onSelect, forceShowPopup } = props;
+    const flatData = menuHelpers.flatten(data);
+    data.forEach(d => {
+        if (d.items)
+            d.items.forEach(item => {
+                item.visual = getIconByFieldType(item.type);
+            });
+        else {
+            d.visual = getIconByFieldType(d.type);
+        }
+    });
+    const selectedData = flatData.filter(o => o.selected).map(obj => obj.id);
+    const [visibleColumns, onChecked] = useSelect(selectedData);
+    const onChange = useCallback(id => onChecked(id), [onChecked]);
+    const [searchQuery, onSearch] = useState('');
+    const [searchEl, setSearchEl] = useElement(null);
+    const hasMountedRef = useRef(false);
+    const onSearchTriggered = useCallback(searchString => {
+        onSearch(searchString);
+    }, [onSearch]);
+    useEffect(() => {
+        if (forceShowPopup && searchEl)
+            searchEl.focus();
+    }, [forceShowPopup, searchEl]);
+    useEffect(() => {
+        if (hasMountedRef.current) {
+            const previousVisibleColumns = flatData.filter(o => o.selected).map(o => o.id);
+            const currentVisibleColumns = [...visibleColumns];
+            const toggledColumns = [
+                ...currentVisibleColumns.filter(id => !previousVisibleColumns.includes(id)),
+                ...previousVisibleColumns.filter(id => !visibleColumns.has(id))
+            ];
+            onSelect(toggledColumns);
+        }
+        hasMountedRef.current = true;
+    }, [visibleColumns]);
+    const itemsToRender = searchQuery
+        ? flatData.filter(item => item.label.toLowerCase().includes(searchQuery.toLowerCase()))
+        : data;
+    return (_jsx(Menu, { items: itemsToRender, mode: 'multi-select', onItemClick: onChange, role: 'listbox', focusControlEl: searchEl || undefined, header: _jsx(SearchInput, { value: searchQuery, onSearchChange: onSearchTriggered, ref: setSearchEl }) }));
+}
+ColumnSelectorControl.propTypes = {
+    data: PropTypes.arrayOf(PropTypes.object).isRequired,
+    onSelect: PropTypes.func.isRequired,
+    forceShowPopup: PropTypes.bool.isRequired
+};
+function ColumnSelector({ dispatch, columns, action }) {
+    const data = useMemo(() => transformData(columns, action), [columns, action]);
+    const [forceShowPopup, setForceShowPopup] = useState(true);
+    const onSelectHandler = useCallback(cols => {
+        if (columns.length > 100) {
+            setForceShowPopup(false);
+        }
+        if (cols.length > 0)
+            dispatch(cols);
+    }, [dispatch, columns.length]);
+    return (_jsx(_Fragment, { children: forceShowPopup && (_jsx(ColumnSelectorControl, { data: data, onSelect: onSelectHandler, forceShowPopup: forceShowPopup })) }));
+}
+ColumnSelector.propTypes = {
+    dispatch: PropTypes.func.isRequired,
+    columns: PropTypes.arrayOf(PropTypes.object).isRequired,
+    action: PropTypes.string.isRequired
+};
+ColumnSelector.defaultProps = {};
+export default memo(ColumnSelector);
+//# sourceMappingURL=ColumnSelector.js.map

package/lib/Core/Components/Toolbar/ColumnSelector.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnSelector.js","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/ColumnSelector.jsx"],"names":[],"mappings":"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","sourcesContent":["import { memo, useCallback, useEffect, useRef, useState, useMemo } from 'react';\nimport PropTypes from 'prop-types';\n\nimport { Icon, SearchInput, Menu, menuHelpers, useElement } from '@pega/cosmos-react-core';\n\nimport useSelect from '../../Hooks/UseSelect';\nimport { allowToggle, getFieldIcon } from '../../Utils';\n\nexport const colsVisibility = 'Show/hide columns';\nexport const pinning = 'Freeze columns';\n\nexport function getIconByFieldType(type) {\n  const iconName = getFieldIcon(type);\n  return <Icon data-test-id={iconName} data-testid={iconName} name={iconName} />;\n}\n/**\n * Transforms the columns array into array of columns grouped by category\n * @param {Array} columns : ;\n * @returns Arrays of columns nested by category\n */\nexport function transformData(columns, action) {\n  const result = [];\n  if (!columns?.length) return result;\n\n  const categoryObj = {};\n  const allowColumnToggle = allowToggle(columns[0].parent.getVisibleColumns());\n\n  columns\n    ?.filter(c => c.field.toggle)\n    .forEach(column => {\n      const {\n        field: { id, category = [], type },\n        label,\n        hidden,\n        frozen\n      } = column;\n      const lastCategoryLabel = category.length ? category[category.length - 1].label : undefined;\n      let selectAction;\n      let disabled;\n      if (action === colsVisibility) {\n        selectAction = !hidden;\n        disabled = !allowColumnToggle && !hidden;\n      } else if (action === pinning) selectAction = frozen;\n      if (categoryObj[lastCategoryLabel])\n        categoryObj[lastCategoryLabel].items.push({\n          id,\n          primary: label,\n          label,\n          selected: selectAction,\n          type,\n          disabled\n        });\n      else {\n        categoryObj[lastCategoryLabel] = {\n          id: lastCategoryLabel,\n          label: lastCategoryLabel,\n          items: [\n            {\n              id,\n              primary: label,\n              selected: selectAction,\n              label,\n              type,\n              disabled\n            }\n          ]\n        };\n      }\n    });\n  // Items with no category attribute are set in the root of returned array\n  if (categoryObj[undefined] && categoryObj[undefined].items) {\n    result.push(...categoryObj[undefined].items);\n    delete categoryObj[undefined];\n  }\n  const keys = Object.keys(categoryObj);\n  // Items with category attribute are grouped inside the nested category object\n  keys.forEach(key => {\n    result.push(categoryObj[key]);\n  });\n  return result;\n}\n\nexport function ColumnSelectorControl(props) {\n  const { data, onSelect, forceShowPopup } = props;\n  const flatData = menuHelpers.flatten(data);\n\n  data.forEach(d => {\n    if (d.items)\n      d.items.forEach(item => {\n        item.visual = getIconByFieldType(item.type);\n      });\n    else {\n      d.visual = getIconByFieldType(d.type);\n    }\n  });\n\n  const selectedData = flatData.filter(o => o.selected).map(obj => obj.id);\n  const [visibleColumns, onChecked] = useSelect(selectedData);\n  const onChange = useCallback(id => onChecked(id), [onChecked]);\n  const [searchQuery, onSearch] = useState('');\n  const [searchEl, setSearchEl] = useElement(null);\n\n  const hasMountedRef = useRef(false);\n\n  const onSearchTriggered = useCallback(\n    searchString => {\n      onSearch(searchString);\n    },\n    [onSearch]\n  );\n\n  useEffect(() => {\n    if (forceShowPopup && searchEl) searchEl.focus();\n  }, [forceShowPopup, searchEl]);\n\n  useEffect(() => {\n    if (hasMountedRef.current) {\n      const previousVisibleColumns = flatData.filter(o => o.selected).map(o => o.id);\n      const currentVisibleColumns = [...visibleColumns];\n      const toggledColumns = [\n        ...currentVisibleColumns.filter(id => !previousVisibleColumns.includes(id)),\n        ...previousVisibleColumns.filter(id => !visibleColumns.has(id))\n      ];\n      onSelect(toggledColumns);\n    }\n    hasMountedRef.current = true;\n  }, [visibleColumns]);\n\n  const itemsToRender = searchQuery\n    ? flatData.filter(item => item.label.toLowerCase().includes(searchQuery.toLowerCase()))\n    : data;\n\n  return (\n    <Menu\n      items={itemsToRender}\n      mode='multi-select'\n      onItemClick={onChange}\n      role='listbox'\n      focusControlEl={searchEl || undefined}\n      header={\n        <SearchInput value={searchQuery} onSearchChange={onSearchTriggered} ref={setSearchEl} />\n      }\n    />\n  );\n}\n\nColumnSelectorControl.propTypes = {\n  data: PropTypes.arrayOf(PropTypes.object).isRequired,\n  onSelect: PropTypes.func.isRequired,\n  forceShowPopup: PropTypes.bool.isRequired\n};\n\nfunction ColumnSelector({ dispatch, columns, action }) {\n  const data = useMemo(() => transformData(columns, action), [columns, action]);\n  const [forceShowPopup, setForceShowPopup] = useState(true);\n  const onSelectHandler = useCallback(\n    cols => {\n      if (columns.length > 100) {\n        setForceShowPopup(false);\n      }\n      if (cols.length > 0) dispatch(cols);\n    },\n    [dispatch, columns.length]\n  );\n\n  return (\n    <>\n      {forceShowPopup && (\n        <ColumnSelectorControl\n          data={data}\n          onSelect={onSelectHandler}\n          forceShowPopup={forceShowPopup}\n        />\n      )}\n    </>\n  );\n}\n\nColumnSelector.propTypes = {\n  dispatch: PropTypes.func.isRequired,\n  columns: PropTypes.arrayOf(PropTypes.object).isRequired,\n  action: PropTypes.string.isRequired\n};\n\nColumnSelector.defaultProps = {};\n\nexport default memo(ColumnSelector);\n"]}

package/lib/Core/Components/Toolbar/DebugInfo.d.ts

@@ -0,0 +1,14 @@
+declare const _default: import("react").MemoExoticComponent<typeof DebugInfo>;
+export default _default;
+declare function DebugInfo({ view }: {
+    view: any;
+}): import("react/jsx-runtime").JSX.Element;
+declare namespace DebugInfo {
+    namespace propTypes {
+        let view: PropTypes.Validator<{
+            [x: string]: any;
+        }>;
+    }
+}
+import PropTypes from 'prop-types';
+//# sourceMappingURL=DebugInfo.d.ts.map

package/lib/Core/Components/Toolbar/DebugInfo.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DebugInfo.d.ts","sourceRoot":"","sources":["../../../../Core/Components/Toolbar/DebugInfo.jsx"],"names":[],"mappings":";;AA0BA;;4CAiDC;;;;;;;;sBA1EqB,YAAY"}

package/lib/Core/Components/Toolbar/DebugInfo.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useRef, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import styled, { css } from 'styled-components';
+import { Card, CardContent, CardHeader, FieldValueList, Text } from '@pega/cosmos-react-core';
+import useTranslate from '../../Hooks/useTranslate';
+import { debugInfoFields } from '../../constants';
+const fieldsConfiguration = [
+    { field: debugInfoFields.className, defaultLabel: 'Class' },
+    { field: debugInfoFields.dataPage, defaultLabel: 'Data page' },
+    { field: debugInfoFields.dataSource, defaultLabel: 'Data source' },
+    { field: debugInfoFields.timeTaken, defaultLabel: 'Time taken' },
+    { field: debugInfoFields.insightId, defaultLabel: 'Insight ID', hideIfNotAvailable: true }
+];
+const StyledDebugInfo = styled.div(() => {
+    return css `
+    .debug-record {
+      /* stylelint-disable unit-allowed-list */
+      padding: 5px;
+    }
+  `;
+});
+function DebugInfo({ view }) {
+    const [translate] = useTranslate();
+    const debugInfoList = view.debugInfo.length === 0 ? [{}] : view.debugInfo;
+    const headingRef = useRef(null);
+    useEffect(() => {
+        if (headingRef.current)
+            headingRef.current.focus();
+    }, []);
+    const formattedData = debugInfoList.map(debugInfoEntry => fieldsConfiguration.reduce((result, { field, defaultLabel, hideIfNotAvailable }) => {
+        if (hideIfNotAvailable && !debugInfoEntry[field]) {
+            return result;
+        }
+        result.push({
+            id: field,
+            name: translate(defaultLabel),
+            value: debugInfoEntry[field] ? (_jsx(Text, { variant: 'h5', "data-testid": `field-${field}`, children: debugInfoEntry[field] })) : undefined
+        });
+        return result;
+    }, []));
+    return (_jsx(StyledDebugInfo, { children: _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(Text, { tabIndex: 0, ref: headingRef, variant: 'h2', children: translate('Query info') }) }), _jsx(CardContent, { children: formattedData.map((debugInfoEntry, index) => (_jsx(FieldValueList, { className: 'debug-record', variant: 'inline', fields: debugInfoEntry }, index))) })] }) }));
+}
+DebugInfo.propTypes = {
+    view: PropTypes.objectOf(PropTypes.any).isRequired
+};
+export default memo(DebugInfo);
+//# sourceMappingURL=DebugInfo.js.map