@patternfly/react-data-view 6.1.0 → 6.3.0-prerelease.3

package/dist/cjs/DataViewTableBasic/DataViewTableBasic.test.js

@@ -1,10 +1,7 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const react_2 = require("@testing-library/react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
 const DataView_1 = require("../DataView");
 const DataViewTableBasic_1 = require("./DataViewTableBasic");
 const repositories = [
@@ -22,22 +19,19 @@ const columns = ['Repositories', 'Branches', 'Pull requests', 'Workspaces', 'Las
 const ouiaId = 'TableExample';
 describe('DataViewTable component', () => {
     test('should render correctly', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataViewTableBasic_1.DataViewTableBasic, { "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, rows: rows }));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataViewTableBasic_1.DataViewTableBasic, { "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, rows: rows }));
         expect(container).toMatchSnapshot();
     });
     test('should render with an empty state', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { activeState: "empty" },
-            react_1.default.createElement(DataViewTableBasic_1.DataViewTableBasic, { "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { empty: "No data found" }, rows: [] })));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { activeState: "empty", children: (0, jsx_runtime_1.jsx)(DataViewTableBasic_1.DataViewTableBasic, { "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { empty: "No data found" }, rows: [] }) }));
         expect(container).toMatchSnapshot();
     });
     test('should render with an error state', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { activeState: "error" },
-            react_1.default.createElement(DataViewTableBasic_1.DataViewTableBasic, { "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { error: "Some error" }, rows: [] })));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { activeState: "error", children: (0, jsx_runtime_1.jsx)(DataViewTableBasic_1.DataViewTableBasic, { "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { error: "Some error" }, rows: [] }) }));
         expect(container).toMatchSnapshot();
     });
     test('should render with a loading state', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { activeState: "loading" },
-            react_1.default.createElement(DataViewTableBasic_1.DataViewTableBasic, { "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { loading: "Data is loading" }, rows: [] })));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { activeState: "loading", children: (0, jsx_runtime_1.jsx)(DataViewTableBasic_1.DataViewTableBasic, { "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { loading: "Data is loading" }, rows: [] }) }));
         expect(container).toMatchSnapshot();
     });
 });

package/dist/cjs/DataViewTableHead/DataViewTableHead.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { FC } from 'react';
 import { TheadProps } from '@patternfly/react-table';
 import { DataViewTh } from '../DataViewTable';
 /** extends TheadProps */
@@ -10,5 +10,5 @@ export interface DataViewTableHeadProps extends TheadProps {
     /** Custom OUIA ID */
     ouiaId?: string;
 }
-export declare const DataViewTableHead: React.FC<DataViewTableHeadProps>;
+export declare const DataViewTableHead: FC<DataViewTableHeadProps>;
 export default DataViewTableHead;

package/dist/cjs/DataViewTableHead/DataViewTableHead.js

@@ -1,27 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -35,7 +12,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataViewTableHead = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const react_table_1 = require("@patternfly/react-table");
 const InternalContext_1 = require("../InternalContext");
 const DataViewTable_1 = require("../DataViewTable");
@@ -44,14 +22,13 @@ const DataViewTableHead = (_a) => {
     const { selection } = (0, InternalContext_1.useInternalContext)();
     const { onSelect, isSelected } = selection !== null && selection !== void 0 ? selection : {};
     const cells = (0, react_1.useMemo)(() => [
-        onSelect && isSelected && !isTreeTable ? (react_1.default.createElement(react_table_1.Th, { key: "row-select", screenReaderText: 'Data selection table head cell' })) : null,
+        onSelect && isSelected && !isTreeTable ? ((0, jsx_runtime_1.jsx)(react_table_1.Th, { screenReaderText: 'Data selection table head cell' }, "row-select")) : null,
         ...columns.map((column, index) => {
             var _a;
-            return (react_1.default.createElement(react_table_1.Th, Object.assign({ key: index }, ((0, DataViewTable_1.isDataViewThObject)(column) && ((_a = column === null || column === void 0 ? void 0 : column.props) !== null && _a !== void 0 ? _a : {})), { "data-ouia-component-id": `${ouiaId}-th-${index}` }), (0, DataViewTable_1.isDataViewThObject)(column) ? column.cell : column));
+            return ((0, jsx_runtime_1.jsx)(react_table_1.Th, Object.assign({}, ((0, DataViewTable_1.isDataViewThObject)(column) && ((_a = column === null || column === void 0 ? void 0 : column.props) !== null && _a !== void 0 ? _a : {})), { "data-ouia-component-id": `${ouiaId}-th-${index}`, children: (0, DataViewTable_1.isDataViewThObject)(column) ? column.cell : column }), index));
         })
     ], [columns, ouiaId, onSelect, isSelected, isTreeTable]);
-    return (react_1.default.createElement(react_table_1.Thead, Object.assign({ "data-ouia-component-id": `${ouiaId}-thead` }, props),
-        react_1.default.createElement(react_table_1.Tr, { ouiaId: `${ouiaId}-tr-head` }, cells)));
+    return ((0, jsx_runtime_1.jsx)(react_table_1.Thead, Object.assign({ "data-ouia-component-id": `${ouiaId}-thead` }, props, { children: (0, jsx_runtime_1.jsx)(react_table_1.Tr, { ouiaId: `${ouiaId}-tr-head`, children: cells }) })));
 };
 exports.DataViewTableHead = DataViewTableHead;
 exports.default = exports.DataViewTableHead;

package/dist/cjs/DataViewTableHead/DataViewTableHead.test.js

@@ -1,10 +1,7 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const react_2 = require("@testing-library/react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
 const react_table_1 = require("@patternfly/react-table");
 const DataViewTableHead_1 = require("./DataViewTableHead");
 const DataView_1 = require("../DataView");
@@ -17,20 +14,15 @@ describe('DataViewTableHead component', () => {
         isSelectDisabled: jest.fn(),
     };
     test('should render correctly', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(react_table_1.Table, null,
-            react_1.default.createElement(DataViewTableHead_1.DataViewTableHead, { columns: columns, ouiaId: ouiaId })));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(react_table_1.Table, { children: (0, jsx_runtime_1.jsx)(DataViewTableHead_1.DataViewTableHead, { columns: columns, ouiaId: ouiaId }) }));
         expect(container).toMatchSnapshot();
     });
     test('should render the tree table correctly when isTreeTable is true', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { selection: mockSelection },
-            react_1.default.createElement(react_table_1.Table, null,
-                react_1.default.createElement(DataViewTableHead_1.DataViewTableHead, { isTreeTable: true, columns: columns, ouiaId: ouiaId }))));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { selection: mockSelection, children: (0, jsx_runtime_1.jsx)(react_table_1.Table, { children: (0, jsx_runtime_1.jsx)(DataViewTableHead_1.DataViewTableHead, { isTreeTable: true, columns: columns, ouiaId: ouiaId }) }) }));
         expect(container).toMatchSnapshot();
     });
     test('should render selection column when selection is provided', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { selection: mockSelection },
-            react_1.default.createElement(react_table_1.Table, null,
-                react_1.default.createElement(DataViewTableHead_1.DataViewTableHead, { columns: columns, ouiaId: ouiaId }))));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { selection: mockSelection, children: (0, jsx_runtime_1.jsx)(react_table_1.Table, { children: (0, jsx_runtime_1.jsx)(DataViewTableHead_1.DataViewTableHead, { columns: columns, ouiaId: ouiaId }) }) }));
         expect(container).toMatchSnapshot();
     });
 });

package/dist/cjs/DataViewTableTree/DataViewTableTree.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { FC } from 'react';
 import { TableProps } from '@patternfly/react-table';
 import { DataViewTh, DataViewTrTree } from '../DataViewTable';
 import { DataViewState } from '../DataView/DataView';
@@ -21,5 +21,5 @@ export interface DataViewTableTreeProps extends Omit<TableProps, 'onSelect' | 'r
     /** Custom OUIA ID */
     ouiaId?: string;
 }
-export declare const DataViewTableTree: React.FC<DataViewTableTreeProps>;
+export declare const DataViewTableTree: FC<DataViewTableTreeProps>;
 export default DataViewTableTree;

package/dist/cjs/DataViewTableTree/DataViewTableTree.js

@@ -1,27 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -35,7 +12,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataViewTableTree = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const react_table_1 = require("@patternfly/react-table");
 const InternalContext_1 = require("../InternalContext");
 const DataViewTableHead_1 = require("../DataViewTableHead");
@@ -70,8 +48,8 @@ const DataViewTableTree = (_a) => {
     var { columns, rows, headStates, bodyStates, leafIcon = null, expandedIcon = null, collapsedIcon = null, ouiaId = 'DataViewTableTree' } = _a, props = __rest(_a, ["columns", "rows", "headStates", "bodyStates", "leafIcon", "expandedIcon", "collapsedIcon", "ouiaId"]);
     const { selection, activeState } = (0, InternalContext_1.useInternalContext)();
     const { onSelect, isSelected, isSelectDisabled } = selection !== null && selection !== void 0 ? selection : {};
-    const [expandedNodeIds, setExpandedNodeIds] = react_1.default.useState([]);
-    const [expandedDetailsNodeNames, setExpandedDetailsNodeIds] = react_1.default.useState([]);
+    const [expandedNodeIds, setExpandedNodeIds] = (0, react_1.useState)([]);
+    const [expandedDetailsNodeNames, setExpandedDetailsNodeIds] = (0, react_1.useState)([]);
     const activeHeadState = (0, react_1.useMemo)(() => activeState ? headStates === null || headStates === void 0 ? void 0 : headStates[activeState] : undefined, [activeState, headStates]);
     const activeBodyState = (0, react_1.useMemo)(() => activeState ? bodyStates === null || bodyStates === void 0 ? void 0 : bodyStates[activeState] : undefined, [activeState, bodyStates]);
     const nodes = (0, react_1.useMemo)(() => {
@@ -114,11 +92,11 @@ const DataViewTableTree = (_a) => {
                 ? renderRows(node.children, level + 1, 1, rowIndex + 1, !isExpanded || isHidden)
                 : [];
             return [
-                react_1.default.createElement(react_table_1.TreeRowWrapper, { key: node.id, row: { props: treeRow.props }, ouiaId: `${ouiaId}-tr-${rowIndex}` }, node.row.map((cell, colIndex) => {
-                    var _a;
-                    const cellIsObject = (0, DataViewTable_1.isDataViewTdObject)(cell);
-                    return (react_1.default.createElement(react_table_1.Td, Object.assign({ key: colIndex, treeRow: colIndex === 0 ? treeRow : undefined }, (cellIsObject && ((_a = cell === null || cell === void 0 ? void 0 : cell.props) !== null && _a !== void 0 ? _a : {})), { "data-ouia-component-id": `${ouiaId}-td-${rowIndex}-${colIndex}` }), cellIsObject ? cell.cell : cell));
-                })),
+                (0, jsx_runtime_1.jsx)(react_table_1.TreeRowWrapper, { row: { props: treeRow.props }, ouiaId: `${ouiaId}-tr-${rowIndex}`, children: node.row.map((cell, colIndex) => {
+                        var _a;
+                        const cellIsObject = (0, DataViewTable_1.isDataViewTdObject)(cell);
+                        return ((0, jsx_runtime_1.jsx)(react_table_1.Td, Object.assign({ treeRow: colIndex === 0 ? treeRow : undefined }, (cellIsObject && ((_a = cell === null || cell === void 0 ? void 0 : cell.props) !== null && _a !== void 0 ? _a : {})), { "data-ouia-component-id": `${ouiaId}-td-${rowIndex}-${colIndex}`, children: cellIsObject ? cell.cell : cell }), colIndex));
+                    }) }, node.id),
                 ...childRows,
                 ...renderRows(remainingNodes, level, posinset + 1, rowIndex + 1 + childRows.length, isHidden),
             ];
@@ -136,9 +114,7 @@ const DataViewTableTree = (_a) => {
         isSelectDisabled,
         ouiaId
     ]);
-    return (react_1.default.createElement(react_table_1.Table, Object.assign({ isTreeTable: true, "aria-label": "Data table", ouiaId: ouiaId }, props),
-        activeHeadState || react_1.default.createElement(DataViewTableHead_1.DataViewTableHead, { isTreeTable: true, columns: columns, ouiaId: ouiaId }),
-        activeBodyState || react_1.default.createElement(react_table_1.Tbody, null, nodes)));
+    return ((0, jsx_runtime_1.jsxs)(react_table_1.Table, Object.assign({ isTreeTable: true, "aria-label": "Data table", ouiaId: ouiaId }, props, { children: [activeHeadState || (0, jsx_runtime_1.jsx)(DataViewTableHead_1.DataViewTableHead, { isTreeTable: true, columns: columns, ouiaId: ouiaId }), activeBodyState || (0, jsx_runtime_1.jsx)(react_table_1.Tbody, { children: nodes })] })));
 };
 exports.DataViewTableTree = DataViewTableTree;
 exports.default = exports.DataViewTableTree;

package/dist/cjs/DataViewTableTree/DataViewTableTree.test.js

@@ -1,10 +1,7 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const react_2 = require("@testing-library/react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
 const react_icons_1 = require("@patternfly/react-icons");
 const DataView_1 = require("../DataView");
 const DataViewTable_1 = require("../DataViewTable");
@@ -68,23 +65,19 @@ describe('DataViewTableTree component', () => {
         isSelectDisabled: jest.fn(),
     };
     test('should render the tree table correctly', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { selection: mockSelection },
-            react_1.default.createElement(DataViewTable_1.DataViewTable, { isTreeTable: true, "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, rows: rows, leafIcon: react_1.default.createElement(react_icons_1.LeafIcon, null), expandedIcon: react_1.default.createElement(react_icons_1.FolderOpenIcon, { "aria-hidden": true }), collapsedIcon: react_1.default.createElement(react_icons_1.FolderIcon, { "aria-hidden": true }) })));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { selection: mockSelection, children: (0, jsx_runtime_1.jsx)(DataViewTable_1.DataViewTable, { isTreeTable: true, "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, rows: rows, leafIcon: (0, jsx_runtime_1.jsx)(react_icons_1.LeafIcon, {}), expandedIcon: (0, jsx_runtime_1.jsx)(react_icons_1.FolderOpenIcon, { "aria-hidden": true }), collapsedIcon: (0, jsx_runtime_1.jsx)(react_icons_1.FolderIcon, { "aria-hidden": true }) }) }));
         expect(container).toMatchSnapshot();
     });
     test('should render tree table with an empty state', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { activeState: "empty" },
-            react_1.default.createElement(DataViewTable_1.DataViewTable, { isTreeTable: true, "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { empty: "No data found" }, rows: [] })));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { activeState: "empty", children: (0, jsx_runtime_1.jsx)(DataViewTable_1.DataViewTable, { isTreeTable: true, "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { empty: "No data found" }, rows: [] }) }));
         expect(container).toMatchSnapshot();
     });
     test('should render tree table with an error state', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { activeState: "error" },
-            react_1.default.createElement(DataViewTable_1.DataViewTable, { isTreeTable: true, "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { error: "Some error" }, rows: [] })));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { activeState: "error", children: (0, jsx_runtime_1.jsx)(DataViewTable_1.DataViewTable, { isTreeTable: true, "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { error: "Some error" }, rows: [] }) }));
         expect(container).toMatchSnapshot();
     });
     test('should render tree table with a loading state', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { activeState: "loading" },
-            react_1.default.createElement(DataViewTable_1.DataViewTable, { isTreeTable: true, "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { loading: "Data is loading" }, rows: [] })));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { activeState: "loading", children: (0, jsx_runtime_1.jsx)(DataViewTable_1.DataViewTable, { isTreeTable: true, "aria-label": 'Repositories table', ouiaId: ouiaId, columns: columns, bodyStates: { loading: "Data is loading" }, rows: [] }) }));
         expect(container).toMatchSnapshot();
     });
 });

package/dist/cjs/DataViewTextFilter/DataViewTextFilter.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import { FC } from 'react';
 import { SearchInputProps, ToolbarFilterProps } from '@patternfly/react-core';
 /** extends SearchInputProps */
 export interface DataViewTextFilterProps extends SearchInputProps {
@@ -17,5 +17,5 @@ export interface DataViewTextFilterProps extends SearchInputProps {
     /** Custom OUIA ID */
     ouiaId?: string;
 }
-export declare const DataViewTextFilter: React.FC<DataViewTextFilterProps>;
+export declare const DataViewTextFilter: FC<DataViewTextFilterProps>;
 export default DataViewTextFilter;

package/dist/cjs/DataViewTextFilter/DataViewTextFilter.js

@@ -10,17 +10,13 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataViewTextFilter = void 0;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const react_core_1 = require("@patternfly/react-core");
 const DataViewTextFilter = (_a) => {
     var { filterId, title, value = '', onChange, onClear = () => onChange === null || onChange === void 0 ? void 0 : onChange(undefined, ''), showToolbarItem, trimValue = true, ouiaId = 'DataViewTextFilter' } = _a, props = __rest(_a, ["filterId", "title", "value", "onChange", "onClear", "showToolbarItem", "trimValue", "ouiaId"]);
-    return (react_1.default.createElement(react_core_1.ToolbarFilter, { key: ouiaId, "data-ouia-component-id": ouiaId, labels: value.length > 0 ? [{ key: title, node: value }] : [], deleteLabel: () => onChange === null || onChange === void 0 ? void 0 : onChange(undefined, ''), categoryName: title, showToolbarItem: showToolbarItem },
-        react_1.default.createElement(react_core_1.SearchInput, Object.assign({ searchInputId: filterId, value: value, onChange: (e, inputValue) => onChange === null || onChange === void 0 ? void 0 : onChange(e, trimValue ? inputValue.trim() : inputValue), onClear: onClear, placeholder: `Filter by ${title}`, "aria-label": `${title !== null && title !== void 0 ? title : filterId} filter`, "data-ouia-component-id": `${ouiaId}-input` }, props))));
+    return ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarFilter, { "data-ouia-component-id": ouiaId, labels: value.length > 0 ? [{ key: title, node: value }] : [], deleteLabel: () => onChange === null || onChange === void 0 ? void 0 : onChange(undefined, ''), categoryName: title, showToolbarItem: showToolbarItem, children: (0, jsx_runtime_1.jsx)(react_core_1.SearchInput, Object.assign({ searchInputId: filterId, value: value, onChange: (e, inputValue) => onChange === null || onChange === void 0 ? void 0 : onChange(e, trimValue ? inputValue.trim() : inputValue), onClear: onClear, placeholder: `Filter by ${title}`, "aria-label": `${title !== null && title !== void 0 ? title : filterId} filter`, "data-ouia-component-id": `${ouiaId}-input` }, props)) }, ouiaId));
 };
 exports.DataViewTextFilter = DataViewTextFilter;
 exports.default = exports.DataViewTextFilter;

package/dist/cjs/DataViewTextFilter/DataViewTextFilter.test.js

@@ -3,8 +3,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const react_2 = require("@testing-library/react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
 const DataViewTextFilter_1 = __importDefault(require("./DataViewTextFilter"));
 const DataViewToolbar_1 = __importDefault(require("../DataViewToolbar"));
 describe('DataViewTextFilter component', () => {
@@ -16,7 +16,7 @@ describe('DataViewTextFilter component', () => {
         onChange: mockOnChange,
     };
     it('should render correctly', () => {
-        const { container } = (0, react_2.render)(react_1.default.createElement(DataViewToolbar_1.default, { filters: react_1.default.createElement(DataViewTextFilter_1.default, Object.assign({}, defaultProps)) }));
+        const { container } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataViewToolbar_1.default, { filters: (0, jsx_runtime_1.jsx)(DataViewTextFilter_1.default, Object.assign({}, defaultProps)) }));
         expect(container).toMatchSnapshot();
     });
 });

package/dist/cjs/DataViewToolbar/DataViewToolbar.d.ts

@@ -1,4 +1,4 @@
-import React, { PropsWithChildren } from 'react';
+import { FC, PropsWithChildren } from 'react';
 import { ToolbarProps } from '@patternfly/react-core';
 /** extends ToolbarProps */
 export interface DataViewToolbarProps extends Omit<PropsWithChildren<ToolbarProps>, 'ref'> {
@@ -12,10 +12,12 @@ export interface DataViewToolbarProps extends Omit<PropsWithChildren<ToolbarProp
     pagination?: React.ReactNode;
     /** React node to display actions */
     actions?: React.ReactNode;
+    /** React node to display toggle group */
+    toggleGroup?: React.ReactNode;
     /** React node to display filters */
     filters?: React.ReactNode;
     /** React node to display custom filter labels */
     customLabelGroupContent?: React.ReactNode;
 }
-export declare const DataViewToolbar: React.FC<DataViewToolbarProps>;
+export declare const DataViewToolbar: FC<DataViewToolbarProps>;
 export default DataViewToolbar;

package/dist/cjs/DataViewToolbar/DataViewToolbar.js

@@ -1,27 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -35,19 +12,13 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DataViewToolbar = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const react_core_1 = require("@patternfly/react-core");
 const DataViewToolbar = (_a) => {
-    var { className, ouiaId = 'DataViewToolbar', bulkSelect, actions, pagination, filters, customLabelGroupContent, clearAllFilters, children } = _a, props = __rest(_a, ["className", "ouiaId", "bulkSelect", "actions", "pagination", "filters", "customLabelGroupContent", "clearAllFilters", "children"]);
-    const defaultClearFilters = (0, react_1.useRef)(react_1.default.createElement(react_core_1.ToolbarItem, null,
-        react_1.default.createElement(react_core_1.Button, { ouiaId: `${ouiaId}-clear-all-filters`, variant: "link", onClick: clearAllFilters, isInline: true }, "Clear filters")));
-    return (react_1.default.createElement(react_core_1.Toolbar, Object.assign({ ouiaId: ouiaId, className: className, customLabelGroupContent: customLabelGroupContent !== null && customLabelGroupContent !== void 0 ? customLabelGroupContent : defaultClearFilters.current }, props),
-        react_1.default.createElement(react_core_1.ToolbarContent, null,
-            bulkSelect && (react_1.default.createElement(react_core_1.ToolbarItem, { "data-ouia-component-id": `${ouiaId}-bulk-select` }, bulkSelect)),
-            filters && (react_1.default.createElement(react_core_1.ToolbarItem, null, filters)),
-            actions && (react_1.default.createElement(react_core_1.ToolbarItem, null, actions)),
-            pagination && (react_1.default.createElement(react_core_1.ToolbarItem, { variant: react_core_1.ToolbarItemVariant.pagination, "data-ouia-component-id": `${ouiaId}-pagination` }, pagination)),
-            children)));
+    var { className, ouiaId = 'DataViewToolbar', bulkSelect, actions, toggleGroup, pagination, filters, customLabelGroupContent, clearAllFilters, children } = _a, props = __rest(_a, ["className", "ouiaId", "bulkSelect", "actions", "toggleGroup", "pagination", "filters", "customLabelGroupContent", "clearAllFilters", "children"]);
+    const defaultClearFilters = (0, react_1.useRef)((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: (0, jsx_runtime_1.jsx)(react_core_1.Button, { ouiaId: `${ouiaId}-clear-all-filters`, variant: "link", onClick: clearAllFilters, isInline: true, children: "Clear filters" }) }));
+    return ((0, jsx_runtime_1.jsx)(react_core_1.Toolbar, Object.assign({ ouiaId: ouiaId, className: className, customLabelGroupContent: customLabelGroupContent !== null && customLabelGroupContent !== void 0 ? customLabelGroupContent : defaultClearFilters.current }, props, { children: (0, jsx_runtime_1.jsxs)(react_core_1.ToolbarContent, { children: [bulkSelect && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { "data-ouia-component-id": `${ouiaId}-bulk-select`, children: bulkSelect })), filters && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: filters })), actions && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: actions })), toggleGroup && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { children: toggleGroup })), pagination && ((0, jsx_runtime_1.jsx)(react_core_1.ToolbarItem, { variant: react_core_1.ToolbarItemVariant.pagination, "data-ouia-component-id": `${ouiaId}-pagination`, children: pagination })), children] }) })));
 };
 exports.DataViewToolbar = DataViewToolbar;
 exports.default = exports.DataViewToolbar;

package/dist/cjs/DataViewToolbar/DataViewToolbar.test.js

@@ -3,12 +3,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const react_2 = require("@testing-library/react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
 const DataViewToolbar_1 = __importDefault(require("./DataViewToolbar"));
 const react_core_1 = require("@patternfly/react-core");
 describe('DataViewToolbar component', () => {
     test('should render correctly', () => {
-        expect((0, react_2.render)(react_1.default.createElement(DataViewToolbar_1.default, { pagination: react_1.default.createElement(react_core_1.Pagination, { page: 1, perPage: 10 }) }))).toMatchSnapshot();
+        expect((0, react_1.render)((0, jsx_runtime_1.jsx)(DataViewToolbar_1.default, { pagination: (0, jsx_runtime_1.jsx)(react_core_1.Pagination, { page: 1, perPage: 10 }) }))).toMatchSnapshot();
     });
 });

package/dist/cjs/Hooks/filters.js

@@ -7,8 +7,8 @@ const useDataViewFilters = ({ initialFilters = {}, searchParams, setSearchParams
     const isUrlSyncEnabled = (0, react_1.useMemo)(() => searchParams && !!setSearchParams, [searchParams, setSearchParams]);
     const getInitialFilters = (0, react_1.useCallback)(() => isUrlSyncEnabled
         ? Object.keys(initialFilters).reduce((loadedFilters, key) => {
-            const urlValue = searchParams === null || searchParams === void 0 ? void 0 : searchParams.get(key);
             const isArrayFilter = Array.isArray(initialFilters[key]);
+            const urlValue = isArrayFilter ? searchParams === null || searchParams === void 0 ? void 0 : searchParams.getAll(key) : searchParams === null || searchParams === void 0 ? void 0 : searchParams.get(key);
             // eslint-disable-next-line no-nested-ternary
             loadedFilters[key] = urlValue
                 ? (isArrayFilter && !Array.isArray(urlValue) ? [urlValue] : urlValue)

package/dist/cjs/Hooks/filters.test.js

@@ -42,6 +42,31 @@ describe('useDataViewFilters', () => {
         (0, react_1.act)(() => result.current.onSetFilters({ search: 'new search' }));
         expect(setSearchParams).toHaveBeenCalled();
     });
+    it('should sync with URL search params with non array value', () => {
+        const searchParams = new URLSearchParams();
+        searchParams.set('test', 'foo');
+        const setSearchParams = jest.fn();
+        const props = {
+            initialFilters: { test: '' },
+            searchParams,
+            setSearchParams,
+        };
+        const { result } = (0, react_1.renderHook)(() => (0, filters_1.useDataViewFilters)(props));
+        expect(result.current.filters).toEqual({ test: 'foo' });
+    });
+    it('should sync with URL search params with array value', () => {
+        const searchParams = new URLSearchParams();
+        searchParams.append('test', 'foo');
+        searchParams.append('test', 'bar');
+        const setSearchParams = jest.fn();
+        const props = {
+            initialFilters: { test: [] },
+            searchParams,
+            setSearchParams,
+        };
+        const { result } = (0, react_1.renderHook)(() => (0, filters_1.useDataViewFilters)(props));
+        expect(result.current.filters).toEqual({ test: ['foo', 'bar'] });
+    });
     it('should reset filters to default values when clearAllFilters is called', () => {
         const { result } = (0, react_1.renderHook)(() => (0, filters_1.useDataViewFilters)({ initialFilters }));
         (0, react_1.act)(() => result.current.clearAllFilters());

package/dist/cjs/InternalContext/InternalContext.d.ts

@@ -1,4 +1,4 @@
-import React, { PropsWithChildren } from 'react';
+import { FC, PropsWithChildren } from 'react';
 import { DataViewState } from '../DataView';
 export interface DataViewSelection {
     /** Called when the selection of items changes */
@@ -19,8 +19,8 @@ export interface InternalContextValue extends InternalContextProps {
     /** Flag indicating if data view is selectable (auto-calculated) */
     isSelectable: boolean;
 }
-export declare const InternalContext: React.Context<InternalContextValue>;
+export declare const InternalContext: import("react").Context<InternalContextValue>;
 export type InternalProviderProps = PropsWithChildren<InternalContextProps>;
-export declare const InternalContextProvider: React.FC<InternalProviderProps>;
+export declare const InternalContextProvider: FC<InternalProviderProps>;
 export declare const useInternalContext: () => InternalContextValue;
 export default InternalContext;

package/dist/cjs/InternalContext/InternalContext.js

@@ -1,30 +1,8 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useInternalContext = exports.InternalContextProvider = exports.InternalContext = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 exports.InternalContext = (0, react_1.createContext)({
     selection: undefined,
     activeState: undefined,
@@ -32,7 +10,7 @@ exports.InternalContext = (0, react_1.createContext)({
 });
 const InternalContextProvider = ({ children, selection, activeState }) => {
     const isSelectable = (0, react_1.useMemo)(() => Boolean((selection === null || selection === void 0 ? void 0 : selection.onSelect) && (selection === null || selection === void 0 ? void 0 : selection.isSelected)), [selection === null || selection === void 0 ? void 0 : selection.onSelect, selection === null || selection === void 0 ? void 0 : selection.isSelected]);
-    return (react_1.default.createElement(exports.InternalContext.Provider, { value: { selection, activeState, isSelectable } }, children));
+    return ((0, jsx_runtime_1.jsx)(exports.InternalContext.Provider, { value: { selection, activeState, isSelectable }, children: children }));
 };
 exports.InternalContextProvider = InternalContextProvider;
 const useInternalContext = () => (0, react_1.useContext)(exports.InternalContext);

package/dist/cjs/InternalContext/InternalContext.test.js

@@ -1,10 +1,7 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
-const react_2 = require("@testing-library/react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
 require("@testing-library/jest-dom");
 const InternalContext_1 = require("./InternalContext");
 const DataView_1 = require("../DataView");
@@ -17,25 +14,19 @@ describe('InternalContext', () => {
     test('should provide context value and allow consuming it', () => {
         const TestComponent = () => {
             const { selection } = (0, InternalContext_1.useInternalContext)();
-            return (react_1.default.createElement("div", null,
-                react_1.default.createElement("button", { onClick: () => selection === null || selection === void 0 ? void 0 : selection.onSelect(true, ['item1']) }, "Select item"),
-                react_1.default.createElement("span", null, (selection === null || selection === void 0 ? void 0 : selection.isSelected('item1')) ? 'Selected' : 'Not selected')));
+            return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("button", { onClick: () => selection === null || selection === void 0 ? void 0 : selection.onSelect(true, ['item1']), children: "Select item" }), (0, jsx_runtime_1.jsx)("span", { children: (selection === null || selection === void 0 ? void 0 : selection.isSelected('item1')) ? 'Selected' : 'Not selected' })] }));
         };
-        const { getByText } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { selection: mockSelection },
-            react_1.default.createElement(TestComponent, null)));
-        react_2.fireEvent.click(getByText('Select item'));
+        const { getByText } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { selection: mockSelection, children: (0, jsx_runtime_1.jsx)(TestComponent, {}) }));
+        react_1.fireEvent.click(getByText('Select item'));
         expect(mockSelection.onSelect).toHaveBeenCalledWith(true, ['item1']);
     });
     test('should handle selection state correctly', () => {
         const mockSelectionState = Object.assign(Object.assign({}, mockSelection), { isSelected: jest.fn((item) => item === 'item1') });
         const TestComponent = () => {
             const { selection } = (0, InternalContext_1.useInternalContext)();
-            return (react_1.default.createElement("div", null,
-                react_1.default.createElement("span", null, (selection === null || selection === void 0 ? void 0 : selection.isSelected('item1')) ? 'Item 1 is selected' : 'Item 1 is not selected'),
-                react_1.default.createElement("span", null, (selection === null || selection === void 0 ? void 0 : selection.isSelected('item2')) ? 'Item 2 is selected' : 'Item 2 is not selected')));
+            return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: (selection === null || selection === void 0 ? void 0 : selection.isSelected('item1')) ? 'Item 1 is selected' : 'Item 1 is not selected' }), (0, jsx_runtime_1.jsx)("span", { children: (selection === null || selection === void 0 ? void 0 : selection.isSelected('item2')) ? 'Item 2 is selected' : 'Item 2 is not selected' })] }));
         };
-        const { getByText } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { selection: mockSelectionState },
-            react_1.default.createElement(TestComponent, null)));
+        const { getByText } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { selection: mockSelectionState, children: (0, jsx_runtime_1.jsx)(TestComponent, {}) }));
         expect(getByText('Item 1 is selected')).toBeInTheDocument();
         expect(getByText('Item 2 is not selected')).toBeInTheDocument();
     });
@@ -44,12 +35,9 @@ describe('InternalContext', () => {
         const TestComponent = () => {
             var _a, _b;
             const { selection } = (0, InternalContext_1.useInternalContext)();
-            return (react_1.default.createElement("div", null,
-                react_1.default.createElement("span", null, ((_a = selection === null || selection === void 0 ? void 0 : selection.isSelectDisabled) === null || _a === void 0 ? void 0 : _a.call(selection, 'item3')) ? 'Item 3 is disabled' : 'Item 3 is enabled'),
-                react_1.default.createElement("span", null, ((_b = selection === null || selection === void 0 ? void 0 : selection.isSelectDisabled) === null || _b === void 0 ? void 0 : _b.call(selection, 'item1')) ? 'Item 1 is disabled' : 'Item 1 is enabled')));
+            return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("span", { children: ((_a = selection === null || selection === void 0 ? void 0 : selection.isSelectDisabled) === null || _a === void 0 ? void 0 : _a.call(selection, 'item3')) ? 'Item 3 is disabled' : 'Item 3 is enabled' }), (0, jsx_runtime_1.jsx)("span", { children: ((_b = selection === null || selection === void 0 ? void 0 : selection.isSelectDisabled) === null || _b === void 0 ? void 0 : _b.call(selection, 'item1')) ? 'Item 1 is disabled' : 'Item 1 is enabled' })] }));
         };
-        const { getByText } = (0, react_2.render)(react_1.default.createElement(DataView_1.DataView, { selection: mockSelectionWithDisabled },
-            react_1.default.createElement(TestComponent, null)));
+        const { getByText } = (0, react_1.render)((0, jsx_runtime_1.jsx)(DataView_1.DataView, { selection: mockSelectionWithDisabled, children: (0, jsx_runtime_1.jsx)(TestComponent, {}) }));
         expect(getByText('Item 3 is disabled')).toBeInTheDocument();
         expect(getByText('Item 1 is enabled')).toBeInTheDocument();
     });