@bsol-oss/react-datatable5 11.0.0-beta.6 → 11.0.0-beta.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -85,7 +85,7 @@ interface DataDisplayProps {
85
85
  variant?: "horizontal" | "stats" | "";
86
86
  translate?: UseTranslationResponse<any, any>;
87
87
  }
88
- declare const DataDisplay: ({ variant, translate }: DataDisplayProps) => react_jsx_runtime.JSX.Element;
88
+ declare const DataDisplay: ({ variant }: DataDisplayProps) => react_jsx_runtime.JSX.Element;
89
89
 
90
90
  type DensityState = "sm" | "md" | "lg";
91
91
  interface DensityTableState {
@@ -427,6 +427,7 @@ declare const useDataTableContext: <TData>() => DataTableContext<TData>;
427
427
 
428
428
  interface GetColumnsConfigs<K extends RowData> {
429
429
  schema: JSONSchema7;
430
+ include?: K[];
430
431
  ignore?: K[];
431
432
  width?: number[];
432
433
  meta?: {
@@ -436,7 +437,7 @@ interface GetColumnsConfigs<K extends RowData> {
436
437
  translate?: UseTranslationResponse<any, any>;
437
438
  }
438
439
  declare const widthSanityCheck: <K extends unknown>(widthList: number[], ignoreList: K[], properties: { [key in K as string]?: object | undefined; }) => void;
439
- declare const getColumns: <TData extends unknown>({ schema, ignore, width, meta, defaultWidth, translate, }: GetColumnsConfigs<TData>) => ColumnDef<TData>[];
440
+ declare const getColumns: <TData extends unknown>({ schema, include, ignore, width, meta, defaultWidth, translate, }: GetColumnsConfigs<TData>) => ColumnDef<TData>[];
440
441
 
441
442
  interface EmptyStateProps {
442
443
  title?: string;
package/dist/index.js CHANGED
@@ -2625,8 +2625,8 @@ const RecordDisplay = ({ object, boxProps, translate, prefix = "", }) => {
2625
2625
  }) }));
2626
2626
  };
2627
2627
 
2628
- const DataDisplay = ({ variant = "", translate }) => {
2629
- const { table } = useDataTableContext();
2628
+ const CellRenderer = ({ cell }) => {
2629
+ const { translate } = useDataTableContext();
2630
2630
  const getLabel = ({ columnId }) => {
2631
2631
  if (translate !== undefined) {
2632
2632
  return translate.t(`${columnId}`);
@@ -2651,66 +2651,51 @@ const DataDisplay = ({ variant = "", translate }) => {
2651
2651
  }
2652
2652
  throw new Error(`value is unknown, ${typeof value}`);
2653
2653
  };
2654
- if (variant == "horizontal") {
2655
- return (jsxRuntime.jsx(react.Flex, { flexFlow: "column", gap: "1", children: table.getRowModel().rows.map((row) => {
2656
- return (jsxRuntime.jsx(react.Card.Root, { children: jsxRuntime.jsx(react.Card.Body, { children: jsxRuntime.jsx(react.DataList.Root, { gap: 4, padding: 4, display: "grid", variant: "subtle", orientation: "horizontal", overflow: "auto", children: row.getVisibleCells().map((cell) => {
2657
- const showCustomDataDisplay = cell.column.columnDef.meta?.showCustomDisplay ?? false;
2658
- if (showCustomDataDisplay) {
2659
- return (jsxRuntime.jsx(react.Flex, { children: reactTable.flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
2660
- }
2661
- const value = cell.getValue();
2662
- if (typeof value === "object") {
2663
- return (jsxRuntime.jsxs(react.DataList.Item, { children: [jsxRuntime.jsx(react.DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsxRuntime.jsx(RecordDisplay, { boxProps: {
2664
- borderWidth: 1,
2665
- borderRadius: 4,
2666
- borderColor: "gray.400",
2667
- paddingX: 4,
2668
- paddingY: 2,
2669
- }, object: value })] }, cell.id));
2670
- }
2671
- return (jsxRuntime.jsxs(react.DataList.Item, { children: [jsxRuntime.jsx(react.DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsxRuntime.jsx(react.DataList.ItemValue, { wordBreak: "break-word", textOverflow: "ellipsis", overflow: "hidden", children: `${formatValue(cell.getValue())}` })] }, cell.id));
2672
- }) }) }) }, `chakra-table-card-${row.id}`));
2673
- }) }));
2654
+ const showCustomDataDisplay = cell.column.columnDef.meta?.showCustomDisplay ?? false;
2655
+ const gridColumn = cell.column.columnDef.meta?.gridColumn ?? [
2656
+ "span 12",
2657
+ "span 6",
2658
+ "span 3",
2659
+ ];
2660
+ const gridRow = cell.column.columnDef.meta?.gridRow ?? {};
2661
+ if (showCustomDataDisplay) {
2662
+ return (jsxRuntime.jsx(react.Flex, { gridColumn, gridRow, children: reactTable.flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
2674
2663
  }
2675
- if (variant == "stats") {
2676
- return (jsxRuntime.jsx(react.Flex, { flexFlow: "column", gap: "1", children: table.getRowModel().rows.map((row) => {
2677
- return (jsxRuntime.jsx(react.Card.Root, { children: jsxRuntime.jsx(react.Card.Body, { children: jsxRuntime.jsx(react.DataList.Root, { gap: 4, padding: 4, display: "flex", flexFlow: "row", variant: "subtle", overflow: "auto", children: row.getVisibleCells().map((cell) => {
2678
- const showCustomDataDisplay = cell.column.columnDef.meta?.showCustomDisplay ?? false;
2679
- if (showCustomDataDisplay) {
2680
- return (jsxRuntime.jsx(react.Flex, { children: reactTable.flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
2681
- }
2682
- const value = cell.getValue();
2683
- if (typeof value === "object") {
2684
- return (jsxRuntime.jsxs(react.DataList.Item, { display: "inline-flex", flexFlow: "column", justifyContent: "center", alignItems: "center", flex: "1 0 0%", children: [jsxRuntime.jsx(react.DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsxRuntime.jsx(RecordDisplay, { boxProps: {
2685
- borderWidth: 1,
2686
- borderRadius: 4,
2687
- borderColor: "gray.400",
2688
- paddingX: 4,
2689
- paddingY: 2,
2690
- }, object: value })] }));
2691
- }
2692
- return (jsxRuntime.jsxs(react.DataList.Item, { display: "flex", justifyContent: "center", alignItems: "center", flex: "1 0 0%", children: [jsxRuntime.jsx(react.DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsxRuntime.jsx(react.DataList.ItemValue, { wordBreak: "break-word", textOverflow: "ellipsis", overflow: "hidden", children: `${formatValue(cell.getValue())}` })] }, cell.id));
2693
- }) }) }) }, `chakra-table-card-${row.id}`));
2694
- }) }));
2664
+ const value = cell.getValue();
2665
+ if (typeof value === "object") {
2666
+ return (jsxRuntime.jsxs(react.Box, { gridColumn, gridRow, children: [jsxRuntime.jsx(react.Box, { children: getLabel({ columnId: cell.column.id }) }), jsxRuntime.jsx(RecordDisplay, { boxProps: {
2667
+ borderWidth: 1,
2668
+ borderRadius: 4,
2669
+ borderColor: "gray.400",
2670
+ paddingX: 4,
2671
+ paddingY: 2,
2672
+ }, object: value })] }, cell.id));
2695
2673
  }
2674
+ return (jsxRuntime.jsxs(react.Box, { gridColumn, gridRow, children: [jsxRuntime.jsx(react.Box, { color: 'gray.400', children: getLabel({ columnId: cell.column.id }) }), jsxRuntime.jsx(react.Box, { wordBreak: "break-word", textOverflow: "ellipsis", overflow: "hidden", children: `${formatValue(cell.getValue())}` })] }, cell.id));
2675
+ };
2676
+ const DataDisplay = ({ variant = "" }) => {
2677
+ const { table, translate } = useDataTableContext();
2696
2678
  return (jsxRuntime.jsx(react.Flex, { flexFlow: "column", gap: "1", children: table.getRowModel().rows.map((row) => {
2697
- return (jsxRuntime.jsx(react.Card.Root, { children: jsxRuntime.jsx(react.Card.Body, { children: jsxRuntime.jsx(react.DataList.Root, { gap: 4, padding: 4, display: "grid", variant: "subtle", gridTemplateColumns: "repeat(auto-fit, minmax(20rem, 1fr))", children: row.getVisibleCells().map((cell) => {
2698
- const showCustomDataDisplay = cell.column.columnDef.meta?.showCustomDisplay ?? false;
2699
- if (showCustomDataDisplay) {
2700
- return (jsxRuntime.jsx(react.Flex, { children: reactTable.flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
2701
- }
2702
- const value = cell.getValue();
2703
- if (typeof value === "object") {
2704
- return (jsxRuntime.jsxs(react.DataList.Item, { children: [jsxRuntime.jsx(react.DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsxRuntime.jsx(RecordDisplay, { boxProps: {
2705
- borderWidth: 1,
2706
- borderRadius: 4,
2707
- borderColor: "gray.400",
2708
- paddingX: 4,
2709
- paddingY: 2,
2710
- }, object: value })] }, cell.id));
2711
- }
2712
- return (jsxRuntime.jsxs(react.DataList.Item, { children: [jsxRuntime.jsx(react.DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsxRuntime.jsx(react.DataList.ItemValue, { wordBreak: "break-word", textOverflow: "ellipsis", overflow: "hidden", children: `${formatValue(cell.getValue())}` })] }, cell.id));
2713
- }) }) }) }, `chakra-table-card-${row.id}`));
2679
+ const rowId = row.id;
2680
+ return (jsxRuntime.jsx(react.Card.Root, { children: jsxRuntime.jsx(react.Card.Body, { display: "grid", gap: 4, padding: 4, gridTemplateColumns: "repeat(12, 1fr)", children: table.getAllColumns().map((column) => {
2681
+ const childCell = row.getAllCells().find((cell) => {
2682
+ return cell.id === `${rowId}_${column.id}`;
2683
+ });
2684
+ if (column.columns.length > 0) {
2685
+ return (jsxRuntime.jsxs(react.Card.Root, { margin: "1", gridColumn: "span 12", children: [jsxRuntime.jsx(react.Card.Header, { color: "gray.400", children: translate.t(column.id) }), jsxRuntime.jsx(react.Card.Body, { display: "grid", gap: "4", gridTemplateColumns: "repeat(12, 1fr)", children: column.columns.map((column) => {
2686
+ if (!column.getIsVisible()) {
2687
+ return jsxRuntime.jsx(jsxRuntime.Fragment, {});
2688
+ }
2689
+ const foundCell = row
2690
+ .getVisibleCells()
2691
+ .find((cell) => {
2692
+ return cell.id === `${rowId}_${column.id}`;
2693
+ });
2694
+ return jsxRuntime.jsx(CellRenderer, { cell: foundCell });
2695
+ }) })] }, `chakra-table-card-${childCell?.id}`));
2696
+ }
2697
+ return jsxRuntime.jsx(CellRenderer, { cell: childCell });
2698
+ }) }) }, `chakra-table-card-${rowId}`));
2714
2699
  }) }));
2715
2700
  };
2716
2701
 
@@ -3498,7 +3483,7 @@ const widthSanityCheck = (widthList, ignoreList, properties) => {
3498
3483
  throw new Error(`The width list is too long given from the number of remaining properties after ignore some.`);
3499
3484
  }
3500
3485
  };
3501
- const getColumns = ({ schema, ignore = [], width = [], meta = {}, defaultWidth = 400, translate, }) => {
3486
+ const getColumns = ({ schema, include = [], ignore = [], width = [], meta = {}, defaultWidth = 400, translate, }) => {
3502
3487
  const { properties } = schema;
3503
3488
  idListSanityCheck("ignore", ignore, properties);
3504
3489
  widthSanityCheck(width, ignore, properties);
@@ -3510,7 +3495,8 @@ const getColumns = ({ schema, ignore = [], width = [], meta = {}, defaultWidth =
3510
3495
  return snakeToLabel(column);
3511
3496
  };
3512
3497
  const keys = Object.keys(properties);
3513
- const ignored = keys.filter((key) => {
3498
+ const included = include.length > 0 ? include : keys;
3499
+ const ignored = included.filter((key) => {
3514
3500
  return !ignore.some((shouldIgnoreKey) => key === shouldIgnoreKey);
3515
3501
  });
3516
3502
  const columnHelper = reactTable.createColumnHelper();
package/dist/index.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
2
- import { Button as Button$1, AbsoluteCenter, Spinner, Span, IconButton, Portal, Dialog, RadioGroup as RadioGroup$1, Grid, Box, Slider as Slider$1, HStack, For, Flex, Text, Tag as Tag$1, Input, useDisclosure, DialogBackdrop, CheckboxCard as CheckboxCard$1, Menu, createRecipeContext, createContext as createContext$1, Pagination as Pagination$1, usePaginationContext, Image, Card, DataList, Checkbox as Checkbox$1, Table as Table$1, Tooltip as Tooltip$1, Group, InputElement, Icon, MenuRoot as MenuRoot$1, MenuTrigger as MenuTrigger$1, EmptyState as EmptyState$2, VStack, List, Alert, Accordion, Field as Field$1, Popover, NumberInput, Show, RadioCard, CheckboxGroup, Heading, Center } from '@chakra-ui/react';
2
+ import { Button as Button$1, AbsoluteCenter, Spinner, Span, IconButton, Portal, Dialog, RadioGroup as RadioGroup$1, Grid, Box, Slider as Slider$1, HStack, For, Flex, Text, Tag as Tag$1, Input, useDisclosure, DialogBackdrop, CheckboxCard as CheckboxCard$1, Menu, createRecipeContext, createContext as createContext$1, Pagination as Pagination$1, usePaginationContext, Image, Card, Checkbox as Checkbox$1, Table as Table$1, Tooltip as Tooltip$1, Group, InputElement, Icon, MenuRoot as MenuRoot$1, MenuTrigger as MenuTrigger$1, EmptyState as EmptyState$2, VStack, List, Alert, Accordion, Field as Field$1, Popover, NumberInput, Show, RadioCard, CheckboxGroup, Heading, Center } from '@chakra-ui/react';
3
3
  import { AiOutlineColumnWidth } from 'react-icons/ai';
4
4
  import * as React from 'react';
5
5
  import React__default, { createContext, useContext, useState, useEffect, useRef } from 'react';
@@ -2605,8 +2605,8 @@ const RecordDisplay = ({ object, boxProps, translate, prefix = "", }) => {
2605
2605
  }) }));
2606
2606
  };
2607
2607
 
2608
- const DataDisplay = ({ variant = "", translate }) => {
2609
- const { table } = useDataTableContext();
2608
+ const CellRenderer = ({ cell }) => {
2609
+ const { translate } = useDataTableContext();
2610
2610
  const getLabel = ({ columnId }) => {
2611
2611
  if (translate !== undefined) {
2612
2612
  return translate.t(`${columnId}`);
@@ -2631,66 +2631,51 @@ const DataDisplay = ({ variant = "", translate }) => {
2631
2631
  }
2632
2632
  throw new Error(`value is unknown, ${typeof value}`);
2633
2633
  };
2634
- if (variant == "horizontal") {
2635
- return (jsx(Flex, { flexFlow: "column", gap: "1", children: table.getRowModel().rows.map((row) => {
2636
- return (jsx(Card.Root, { children: jsx(Card.Body, { children: jsx(DataList.Root, { gap: 4, padding: 4, display: "grid", variant: "subtle", orientation: "horizontal", overflow: "auto", children: row.getVisibleCells().map((cell) => {
2637
- const showCustomDataDisplay = cell.column.columnDef.meta?.showCustomDisplay ?? false;
2638
- if (showCustomDataDisplay) {
2639
- return (jsx(Flex, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
2640
- }
2641
- const value = cell.getValue();
2642
- if (typeof value === "object") {
2643
- return (jsxs(DataList.Item, { children: [jsx(DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsx(RecordDisplay, { boxProps: {
2644
- borderWidth: 1,
2645
- borderRadius: 4,
2646
- borderColor: "gray.400",
2647
- paddingX: 4,
2648
- paddingY: 2,
2649
- }, object: value })] }, cell.id));
2650
- }
2651
- return (jsxs(DataList.Item, { children: [jsx(DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsx(DataList.ItemValue, { wordBreak: "break-word", textOverflow: "ellipsis", overflow: "hidden", children: `${formatValue(cell.getValue())}` })] }, cell.id));
2652
- }) }) }) }, `chakra-table-card-${row.id}`));
2653
- }) }));
2634
+ const showCustomDataDisplay = cell.column.columnDef.meta?.showCustomDisplay ?? false;
2635
+ const gridColumn = cell.column.columnDef.meta?.gridColumn ?? [
2636
+ "span 12",
2637
+ "span 6",
2638
+ "span 3",
2639
+ ];
2640
+ const gridRow = cell.column.columnDef.meta?.gridRow ?? {};
2641
+ if (showCustomDataDisplay) {
2642
+ return (jsx(Flex, { gridColumn, gridRow, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
2654
2643
  }
2655
- if (variant == "stats") {
2656
- return (jsx(Flex, { flexFlow: "column", gap: "1", children: table.getRowModel().rows.map((row) => {
2657
- return (jsx(Card.Root, { children: jsx(Card.Body, { children: jsx(DataList.Root, { gap: 4, padding: 4, display: "flex", flexFlow: "row", variant: "subtle", overflow: "auto", children: row.getVisibleCells().map((cell) => {
2658
- const showCustomDataDisplay = cell.column.columnDef.meta?.showCustomDisplay ?? false;
2659
- if (showCustomDataDisplay) {
2660
- return (jsx(Flex, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
2661
- }
2662
- const value = cell.getValue();
2663
- if (typeof value === "object") {
2664
- return (jsxs(DataList.Item, { display: "inline-flex", flexFlow: "column", justifyContent: "center", alignItems: "center", flex: "1 0 0%", children: [jsx(DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsx(RecordDisplay, { boxProps: {
2665
- borderWidth: 1,
2666
- borderRadius: 4,
2667
- borderColor: "gray.400",
2668
- paddingX: 4,
2669
- paddingY: 2,
2670
- }, object: value })] }));
2671
- }
2672
- return (jsxs(DataList.Item, { display: "flex", justifyContent: "center", alignItems: "center", flex: "1 0 0%", children: [jsx(DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsx(DataList.ItemValue, { wordBreak: "break-word", textOverflow: "ellipsis", overflow: "hidden", children: `${formatValue(cell.getValue())}` })] }, cell.id));
2673
- }) }) }) }, `chakra-table-card-${row.id}`));
2674
- }) }));
2644
+ const value = cell.getValue();
2645
+ if (typeof value === "object") {
2646
+ return (jsxs(Box, { gridColumn, gridRow, children: [jsx(Box, { children: getLabel({ columnId: cell.column.id }) }), jsx(RecordDisplay, { boxProps: {
2647
+ borderWidth: 1,
2648
+ borderRadius: 4,
2649
+ borderColor: "gray.400",
2650
+ paddingX: 4,
2651
+ paddingY: 2,
2652
+ }, object: value })] }, cell.id));
2675
2653
  }
2654
+ return (jsxs(Box, { gridColumn, gridRow, children: [jsx(Box, { color: 'gray.400', children: getLabel({ columnId: cell.column.id }) }), jsx(Box, { wordBreak: "break-word", textOverflow: "ellipsis", overflow: "hidden", children: `${formatValue(cell.getValue())}` })] }, cell.id));
2655
+ };
2656
+ const DataDisplay = ({ variant = "" }) => {
2657
+ const { table, translate } = useDataTableContext();
2676
2658
  return (jsx(Flex, { flexFlow: "column", gap: "1", children: table.getRowModel().rows.map((row) => {
2677
- return (jsx(Card.Root, { children: jsx(Card.Body, { children: jsx(DataList.Root, { gap: 4, padding: 4, display: "grid", variant: "subtle", gridTemplateColumns: "repeat(auto-fit, minmax(20rem, 1fr))", children: row.getVisibleCells().map((cell) => {
2678
- const showCustomDataDisplay = cell.column.columnDef.meta?.showCustomDisplay ?? false;
2679
- if (showCustomDataDisplay) {
2680
- return (jsx(Flex, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id));
2681
- }
2682
- const value = cell.getValue();
2683
- if (typeof value === "object") {
2684
- return (jsxs(DataList.Item, { children: [jsx(DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsx(RecordDisplay, { boxProps: {
2685
- borderWidth: 1,
2686
- borderRadius: 4,
2687
- borderColor: "gray.400",
2688
- paddingX: 4,
2689
- paddingY: 2,
2690
- }, object: value })] }, cell.id));
2691
- }
2692
- return (jsxs(DataList.Item, { children: [jsx(DataList.ItemLabel, { children: getLabel({ columnId: cell.column.id }) }), jsx(DataList.ItemValue, { wordBreak: "break-word", textOverflow: "ellipsis", overflow: "hidden", children: `${formatValue(cell.getValue())}` })] }, cell.id));
2693
- }) }) }) }, `chakra-table-card-${row.id}`));
2659
+ const rowId = row.id;
2660
+ return (jsx(Card.Root, { children: jsx(Card.Body, { display: "grid", gap: 4, padding: 4, gridTemplateColumns: "repeat(12, 1fr)", children: table.getAllColumns().map((column) => {
2661
+ const childCell = row.getAllCells().find((cell) => {
2662
+ return cell.id === `${rowId}_${column.id}`;
2663
+ });
2664
+ if (column.columns.length > 0) {
2665
+ return (jsxs(Card.Root, { margin: "1", gridColumn: "span 12", children: [jsx(Card.Header, { color: "gray.400", children: translate.t(column.id) }), jsx(Card.Body, { display: "grid", gap: "4", gridTemplateColumns: "repeat(12, 1fr)", children: column.columns.map((column) => {
2666
+ if (!column.getIsVisible()) {
2667
+ return jsx(Fragment, {});
2668
+ }
2669
+ const foundCell = row
2670
+ .getVisibleCells()
2671
+ .find((cell) => {
2672
+ return cell.id === `${rowId}_${column.id}`;
2673
+ });
2674
+ return jsx(CellRenderer, { cell: foundCell });
2675
+ }) })] }, `chakra-table-card-${childCell?.id}`));
2676
+ }
2677
+ return jsx(CellRenderer, { cell: childCell });
2678
+ }) }) }, `chakra-table-card-${rowId}`));
2694
2679
  }) }));
2695
2680
  };
2696
2681
 
@@ -3478,7 +3463,7 @@ const widthSanityCheck = (widthList, ignoreList, properties) => {
3478
3463
  throw new Error(`The width list is too long given from the number of remaining properties after ignore some.`);
3479
3464
  }
3480
3465
  };
3481
- const getColumns = ({ schema, ignore = [], width = [], meta = {}, defaultWidth = 400, translate, }) => {
3466
+ const getColumns = ({ schema, include = [], ignore = [], width = [], meta = {}, defaultWidth = 400, translate, }) => {
3482
3467
  const { properties } = schema;
3483
3468
  idListSanityCheck("ignore", ignore, properties);
3484
3469
  widthSanityCheck(width, ignore, properties);
@@ -3490,7 +3475,8 @@ const getColumns = ({ schema, ignore = [], width = [], meta = {}, defaultWidth =
3490
3475
  return snakeToLabel(column);
3491
3476
  };
3492
3477
  const keys = Object.keys(properties);
3493
- const ignored = keys.filter((key) => {
3478
+ const included = include.length > 0 ? include : keys;
3479
+ const ignored = included.filter((key) => {
3494
3480
  return !ignore.some((shouldIgnoreKey) => key === shouldIgnoreKey);
3495
3481
  });
3496
3482
  const columnHelper = createColumnHelper();
@@ -3,4 +3,4 @@ export interface DataDisplayProps {
3
3
  variant?: "horizontal" | "stats" | "";
4
4
  translate?: UseTranslationResponse<any, any>;
5
5
  }
6
- export declare const DataDisplay: ({ variant, translate }: DataDisplayProps) => import("react/jsx-runtime").JSX.Element;
6
+ export declare const DataDisplay: ({ variant }: DataDisplayProps) => import("react/jsx-runtime").JSX.Element;
@@ -3,6 +3,7 @@ import { JSONSchema7 } from "json-schema";
3
3
  import { UseTranslationResponse } from "react-i18next";
4
4
  export interface GetColumnsConfigs<K extends RowData> {
5
5
  schema: JSONSchema7;
6
+ include?: K[];
6
7
  ignore?: K[];
7
8
  width?: number[];
8
9
  meta?: {
@@ -12,4 +13,4 @@ export interface GetColumnsConfigs<K extends RowData> {
12
13
  translate?: UseTranslationResponse<any, any>;
13
14
  }
14
15
  export declare const widthSanityCheck: <K extends unknown>(widthList: number[], ignoreList: K[], properties: { [key in K as string]?: object | undefined; }) => void;
15
- export declare const getColumns: <TData extends unknown>({ schema, ignore, width, meta, defaultWidth, translate, }: GetColumnsConfigs<TData>) => ColumnDef<TData>[];
16
+ export declare const getColumns: <TData extends unknown>({ schema, include, ignore, width, meta, defaultWidth, translate, }: GetColumnsConfigs<TData>) => ColumnDef<TData>[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bsol-oss/react-datatable5",
3
- "version": "11.0.0-beta.6",
3
+ "version": "11.0.0-beta.7",
4
4
  "type": "module",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",