@rws-aoa/react-library 6.0.0 → 7.0.0

package/dist/components/atoms/table/Table.js

@@ -1,223 +1,194 @@
-import { jsx as R } from "react/jsx-runtime";
-import { checkboxClasses as b, paginationItemClasses as G } from "@mui/material";
-import { GridLogicOperator as f, DataGrid as I, gridClasses as t } from "@mui/x-data-grid";
+import { jsx as F } from "react/jsx-runtime";
+import { checkboxClasses as b, paginationItemClasses as L } from "@mui/material";
+import { GridLogicOperator as f, DataGrid as D, gridClasses as t } from "@mui/x-data-grid";
 import { l as p } from "../../../chunks/lodash.CA_K01A9.js";
-import { useState as r, useCallback as k, useEffect as v, useMemo as O } from "react";
-import { FontNormalSxProps as T } from "../../../_constants.js";
-import { QuickSearchToolbar as j } from "./_QuickSearchToolbar.js";
-function Z({ ...e }) {
-  const [h, d] = r(!1), [l, x] = r({
+import { useState as r, useEffect as v, useMemo as G } from "react";
+import { FontNormalSxProps as R } from "../../../_constants.js";
+import { QuickSearchToolbar as I } from "./_QuickSearchToolbar.js";
+function z({
+  ...e
+}) {
+  const [k, d] = r(!1), [l, x] = r({
     page: 0,
     pageSize: 10
-  }), [i, C] = r([]), [n, S] = r({
+  }), [i, h] = r([]), [n, C] = r({
     items: []
-  }), [w, M] = r(null), a = e.mode ?? "server", u = a === "server", y = k((o) => {
-    C(o);
-  }, []), $ = k((o) => {
-    S(o);
-  }, []), [P, g] = r(e.data?.rowCount ?? 0);
+  }), [S, w] = r(null), [M, u] = r(e.data?.rowCount ?? 0), a = e.mode ?? "server", g = a === "server";
   async function m(o, s, c) {
-    if (u && e.getData) {
-      const D = async () => {
-        await e.getData({ ...o, sortModel: s, filterModel: c });
+    if (g && e.getData) {
+      const P = async () => {
+        await e.getData({
+          ...o,
+          sortModel: s,
+          filterModel: c
+        });
       };
-      d(!0), await D(), d(!1);
+      d(!0), await P(), d(!1);
     }
   }
   v(() => {
-    g((o) => e.data?.rowCount ?? o);
-  }, [e.data?.rowCount, g]), v(() => {
+    u((o) => e.data?.rowCount ?? o);
+  }, [e.data?.rowCount, u]), v(() => {
     m(l, i, n);
   }, [l, i, n]);
-  const F = O(
-    () => ({
-      pagination: {
-        paginationModel: {
-          page: 0,
-          pageSize: 10
-        },
-        rowCount: 0
-      },
-      sorting: {
-        sortModel: e.initialSort ? [e.initialSort] : []
+  const y = G(() => ({
+    pagination: {
+      paginationModel: {
+        page: 0,
+        pageSize: 10
       },
-      filter: {
-        filterModel: {
-          items: [],
-          logicOperator: f.And,
-          quickFilterLogicOperator: f.And,
-          quickFilterValues: []
-        }
+      rowCount: 0
+    },
+    sorting: {
+      sortModel: e.initialSort ? [e.initialSort] : []
+    },
+    filter: {
+      filterModel: {
+        items: [],
+        logicOperator: f.And,
+        quickFilterLogicOperator: f.And,
+        quickFilterValues: []
       }
-    }),
-    [e.initialSort]
-  ), L = p.merge(
-    {
-      columnHeaderSortIconLabel: "Sorteren",
-      filterPanelColumns: "Kolom",
-      filterPanelInputLabel: "Zoekterm",
-      filterPanelInputPlaceholder: "Zoeken...",
-      toolbarQuickFilterPlaceholder: "Zoeken...",
-      toolbarQuickFilterLabel: "Zoeken",
-      toolbarQuickFilterDeleteIconLabel: "Wissen",
-      noRowsLabel: "Geen regels beschikbaar",
-      noResultsOverlayLabel: "Geen regels gevonden.",
-      paginationItemAriaLabel: (o) => {
-        switch (o) {
-          /* v8 ignore next */
-          case "first":
-            return "Ga naar eerste pagina";
-          /* v8 ignore next */
-          case "last":
-            return "Ga naar laatste pagina";
-          case "next":
-            return "Ga naar volgende pagina";
-          case "previous":
-            return "Ga naar vorige pagina";
-        }
-      },
-      paginationDisplayedRows: ({ from: o, to: s, count: c }) => `${o} - ${s} van ${c}`,
-      paginationRowsPerPage: "Regels per pagina",
-      footerRowSelected: (o) => `${o} regels geselecteerd`
-    },
-    e.localeText
-  );
-  return /* @__PURE__ */ R(
-    I,
-    {
-      columns: e.columns,
-      disableColumnFilter: !0,
-      disableColumnMenu: !0,
-      disableColumnSelector: !0,
-      disableDensitySelector: !0,
-      disableRowSelectionOnClick: !0,
-      disableVirtualization: !0,
-      filterMode: a,
-      getRowHeight: () => "auto",
-      ignoreDiacritics: !0,
-      initialState: F,
-      loading: h,
-      localeText: L,
-      onFilterModelChange: $,
-      onPaginationModelChange: x,
-      onSortModelChange: y,
-      pageSizeOptions: [5, 10, 20, 40, 80],
-      paginationMode: a,
-      paginationModel: l,
-      rowCount: u ? P : void 0,
-      rows: e.data?.rows,
-      showToolbar: !0,
-      slotProps: {
-        filterPanel: {
-          filterFormProps: {
-            operatorInputProps: {
-              disabled: !0,
-              sx: { display: "none" }
-            },
-            valueInputProps: {
-              sx: {
-                marginLeft: "15px"
-              }
-            }
+    }
+  }), [e.initialSort]), $ = p.merge({
+    columnHeaderSortIconLabel: "Sorteren",
+    filterPanelColumns: "Kolom",
+    filterPanelInputLabel: "Zoekterm",
+    filterPanelInputPlaceholder: "Zoeken...",
+    toolbarQuickFilterPlaceholder: "Zoeken...",
+    toolbarQuickFilterLabel: "Zoeken",
+    toolbarQuickFilterDeleteIconLabel: "Wissen",
+    noRowsLabel: "Geen regels beschikbaar",
+    noResultsOverlayLabel: "Geen regels gevonden.",
+    paginationItemAriaLabel: (o) => {
+      switch (o) {
+        /* v8 ignore next */
+        case "first":
+          return "Ga naar eerste pagina";
+        /* v8 ignore next */
+        case "last":
+          return "Ga naar laatste pagina";
+        case "next":
+          return "Ga naar volgende pagina";
+        case "previous":
+          return "Ga naar vorige pagina";
+      }
+    },
+    paginationDisplayedRows: ({
+      from: o,
+      to: s,
+      count: c
+    }) => `${o} - ${s} van ${c}`,
+    paginationRowsPerPage: "Regels per pagina",
+    footerRowSelected: (o) => `${o} regels geselecteerd`
+  }, e.localeText);
+  return /* @__PURE__ */ F(D, { columns: e.columns, disableColumnFilter: !0, disableColumnMenu: !0, disableColumnSelector: !0, disableDensitySelector: !0, disableRowSelectionOnClick: !0, disableVirtualization: !0, filterMode: a, getRowHeight: () => "auto", ignoreDiacritics: !0, initialState: y, loading: k, localeText: $, onFilterModelChange: (o) => C(o), onPaginationModelChange: x, onSortModelChange: (o) => h(o), pageSizeOptions: [5, 10, 20, 40, 80], paginationMode: a, paginationModel: l, rowCount: g ? M : void 0, rows: e.data?.rows, showToolbar: !0, slotProps: {
+    filterPanel: {
+      filterFormProps: {
+        operatorInputProps: {
+          disabled: !0,
+          sx: {
+            display: "none"
           }
         },
-        panel: {
-          target: w
-        },
-        toolbar: {
-          setFilterButtonEl: M,
-          showQuickFilter: !0,
-          quickFilterProps: { debounceMs: 500 },
-          mode: a,
-          getData: async () => m(l, i, n),
-          actionButtons: e.actionButtons,
-          localeText: e.localeText
-        },
-        root: {
-          "data-qa": e["data-qa"]
+        valueInputProps: {
+          sx: {
+            marginLeft: "15px"
+          }
         }
+      }
+    },
+    panel: {
+      target: S
+    },
+    toolbar: {
+      setFilterButtonEl: w,
+      showQuickFilter: e.dataGridOverridableProps?.disableColumnFilter === !1,
+      quickFilterProps: {
+        debounceMs: 500
       },
-      slots: { toolbar: j },
-      sortingMode: a,
-      sx: p.merge(
-        {
-          border: 0,
-          color: "var(--color-text)",
-          letterSpacing: "normal",
-          minHeight: "300px",
-          [`&.${t["root--densityCompact"]}`]: {
-            [`.${t.cell}`]: {
-              py: "8px"
-            }
-          },
-          [`&.${t["root--densityStandard"]}`]: {
-            [`.${t.cell}`]: {
-              py: "15px"
-            }
-          },
-          [`&.${t["root--densityComfortable"]}`]: {
-            [`.${t.cell}`]: {
-              py: "22px"
-            }
-          },
-          /**
-           * The 'no results' message does not show if the DataGrid does not have a fixed height.
-           * Because a fixed height is not desirable, we set a min-height on the DataGrid and set
-           * the min-height of the virtualScroller to half of that height.
-           */
-          [`.${t.virtualScroller}`]: {
-            minHeight: "150px",
-            overflow: "hidden",
-            position: "relative"
-          },
-          [`.${t.columnHeader}`]: {
-            "--DataGrid-containerBackground": "var(--color-rijks-skyblue)",
-            backgroundColor: "var(--color-rijks-skyblue)",
-            color: "var(--color-text-light)"
-          },
-          [`.${t.row}`]: {
-            ":hover": {
-              backgroundColor: "var(--color-rijks-skyblue-light)"
-            },
-            ":nth-of-type(even)": {
-              backgroundColor: "var(--color-rijks-grey-1)",
-              ":hover": {
-                backgroundColor: "var(--color-rijks-skyblue-light)"
-              }
-            }
-          },
-          [`.${t.columnHeader}, .${t.cell}, .MuiDataGrid-columnsContainer`]: {
-            borderRight: "1px solid var(--color-rijks-grey-2)"
-          },
-          [`.${t.cell}`]: {
-            color: "var(--color-text)"
-          },
-          [`.${G.root}`]: {
-            borderRadius: 0
-          },
-          [`.${b.root}`]: {
-            color: "var(--color-primary)",
-            ":focus": {
-              outline: "2px dashed var(--color-text)",
-              outlineOffset: "-9px",
-              borderRadius: 0
-            },
-            ":disabled": {
-              color: "var(--color-disabled)"
-            }
-          },
-          [`.${t.columnHeader} .${b.root}`]: {
-            color: "white"
-          }
-        },
-        e.sx,
-        T
-      ),
-      ...e.dataGridOverridableProps
+      mode: a,
+      getData: async () => m(l, i, n),
+      actionButtons: e.actionButtons,
+      localeText: e.localeText
+    },
+    root: {
+      "data-qa": e["data-qa"]
+    }
+  }, slots: {
+    toolbar: I
+  }, sortingMode: a, sx: p.merge({
+    border: 0,
+    color: "var(--color-text)",
+    letterSpacing: "normal",
+    minHeight: "300px",
+    [`&.${t["root--densityCompact"]}`]: {
+      [`.${t.cell}`]: {
+        py: "8px"
+      }
+    },
+    [`&.${t["root--densityStandard"]}`]: {
+      [`.${t.cell}`]: {
+        py: "15px"
+      }
+    },
+    [`&.${t["root--densityComfortable"]}`]: {
+      [`.${t.cell}`]: {
+        py: "22px"
+      }
+    },
+    /**
+     * The 'no results' message does not show if the DataGrid does not have a fixed height.
+     * Because a fixed height is not desirable, we set a min-height on the DataGrid and set
+     * the min-height of the virtualScroller to half of that height.
+     */
+    [`.${t.virtualScroller}`]: {
+      minHeight: "150px",
+      overflow: "hidden",
+      position: "relative"
+    },
+    [`.${t.columnHeader}`]: {
+      "--DataGrid-containerBackground": "var(--color-rijks-skyblue)",
+      backgroundColor: "var(--color-rijks-skyblue)",
+      color: "var(--color-text-light)"
+    },
+    [`.${t.row}`]: {
+      ":hover": {
+        backgroundColor: "var(--color-rijks-skyblue-light)"
+      },
+      ":nth-of-type(even)": {
+        backgroundColor: "var(--color-rijks-grey-1)",
+        ":hover": {
+          backgroundColor: "var(--color-rijks-skyblue-light)"
+        }
+      }
+    },
+    [`.${t.columnHeader}, .${t.cell}, .MuiDataGrid-columnsContainer`]: {
+      borderRight: "1px solid var(--color-rijks-grey-2)"
+    },
+    [`.${t.cell}`]: {
+      color: "var(--color-text)"
+    },
+    [`.${L.root}`]: {
+      borderRadius: 0
+    },
+    [`.${b.root}`]: {
+      color: "var(--color-primary)",
+      ":focus": {
+        outline: "2px dashed var(--color-text)",
+        outlineOffset: "-9px",
+        borderRadius: 0
+      },
+      ":disabled": {
+        color: "var(--color-disabled)"
+      }
+    },
+    [`.${t.columnHeader} .${b.root}`]: {
+      color: "white"
     }
-  );
+  }, e.sx, R), ...e.dataGridOverridableProps });
 }
 export {
-  Z as AoaTable
+  z as AoaTable
 };
 //# sourceMappingURL=Table.js.map

package/dist/components/atoms/table/Table.js.map

@@ -1 +1 @@
-{"version":3,"file":"Table.js","sources":["../../../../src/components/atoms/table/Table.tsx"],"sourcesContent":["import { checkboxClasses, paginationItemClasses, type SxProps } from '@mui/material';\nimport {\n  GridLogicOperator,\n  DataGrid,\n  gridClasses,\n  type DataGridProps,\n  type GridColDef,\n  type GridGetRowsParams,\n  type GridInitialState,\n  type GridLocaleText,\n  type GridPaginationModel,\n  type GridRowModel,\n  type GridValidRowModel,\n  type GridSortModel,\n  type GridFilterModel\n} from '@mui/x-data-grid';\nimport { merge } from 'lodash';\nimport { useCallback, useEffect, useMemo, useState } from 'react';\nimport { FontNormalSxProps } from '../../../_constants';\nimport { QuickSearchToolbar } from './_QuickSearchToolbar';\n\nexport interface AoaTableData<T extends GridValidRowModel = GridValidRowModel> {\n  /**\n   * Additional `pageInfo` for advanced use-cases.\n   * `hasNextPage`: When row count is unknown/estimated, `hasNextPage` will be used to check if more records are available on server.\n   */\n  pageInfo?: {\n    hasNextPage?: boolean;\n    nextCursor?: string;\n  };\n  /**\n   * To reflect updates in total `rowCount` (optional).\n   * Useful when the `rowCount` is inaccurate (for example when filtering) or not available upfront.\n   */\n  rowCount?: number;\n  /**\n   * The paged, filtered and sorted items from the database\n   */\n  rows: GridRowModel<T>[];\n}\n\nexport type AoaTableColumns<T extends object = any> = GridColDef<T>[];\n\nexport type AoaTableQueryOptions = GridPaginationModel & Omit<GridGetRowsParams, 'end' | 'paginationModel' | 'start'>;\n\ntype ModeProps =\n  /**\n   * Overwrites the default mode (server) when you need pagination, filtering and sorting on the client side\n   */\n  | { getData?: never; mode: 'client' }\n  /**\n   * The Redux action that takes PaginationModel as parameter to retrieve data from the server\n   */\n  | { getData(queryOptions: AoaTableQueryOptions): Promise<void> | void; mode?: 'server' };\n\nexport type AoaTableProps<T extends object = any> = ModeProps & {\n  /**\n   * Action buttons shown in the toolbar of the table\n   */\n  readonly actionButtons?: JSX.Element[];\n  /**\n   * The column structure to display the data\n   */\n  readonly columns: GridColDef<T>[];\n  /**\n   * The TableData object to be displayed in the table\n   */\n  readonly data: AoaTableData<T>;\n  /**\n   * Data-qa tag for E2E test purposes\n   */\n  readonly 'data-qa'?: string;\n  /**\n   * Overwrite a safe selection of the {@link DataGrid} properties\n   */\n  readonly dataGridOverridableProps?: Pick<\n    DataGridProps<T>,\n    | 'checkboxSelection'\n    | 'disableColumnFilter'\n    | 'disableRowSelectionOnClick'\n    | 'getRowId'\n    | 'ignoreDiacritics'\n    | 'isRowSelectable'\n    | 'loading'\n    | 'onRowSelectionModelChange'\n    | 'rowSelectionModel'\n  >;\n  /**\n   * Sets the initial sortModel in case the required sorting differs from the back-end's default sorting\n   */\n  readonly initialSort?: { field: string; sort: 'asc' | 'desc' };\n  /**\n   * Overwrites the default labels when you need a different language than Dutch\n   */\n  readonly localeText?: GridLocaleText & { refreshTable: string };\n  /**\n   * Material UI's property to apply styling\n   */\n  readonly sx?: SxProps;\n};\n\n/**\n * Constructs a table using pre-defined Rijks styling\n *\n * @param props - Props to pass to the button\n * @example\n * ```jsx\n * <AoaTable\n *  getData={(queryOptions) => getMockData(queryOptions)}\n *  data={mockData}\n *  columns={[{ field: \"id\" }, { field: \"title\" }, { field: \"completed\" }]}\n * />\n * ```\n */\n\nexport function AoaTable<T extends object = any>({ ...props }: AoaTableProps<T>) {\n  const [isLoading, setIsLoading] = useState(false);\n  const [paginationModel, setPaginationModel] = useState<GridPaginationModel>({\n    page: 0,\n    pageSize: 10\n  });\n  const [sortModel, setSortModel] = useState<GridSortModel>([]);\n  const [filterModel, setFilterModel] = useState<GridFilterModel>({\n    items: []\n  });\n  const [filterButtonEl, setFilterButtonEl] = useState<HTMLButtonElement | null>(null);\n\n  const mode = props.mode ?? 'server';\n  const isServerMode = mode === 'server';\n\n  const handleSortModelChange = useCallback((sortModel: GridSortModel) => {\n    setSortModel(sortModel);\n  }, []);\n\n  const onFilterChange = useCallback((filterModel: GridFilterModel) => {\n    setFilterModel(filterModel);\n  }, []);\n\n  const [rowCountState, setRowCountState] = useState(props.data?.rowCount ?? 0);\n\n  async function getData(paginationModel: GridPaginationModel, sortModel: GridSortModel, filterModel: GridFilterModel) {\n    if (isServerMode && props.getData) {\n      const fetchData = async () => {\n        await props.getData({ ...paginationModel, sortModel, filterModel });\n      };\n\n      setIsLoading(true);\n      await fetchData();\n      setIsLoading(false);\n    }\n  }\n\n  useEffect(() => {\n    setRowCountState((prevRowCountState) => props.data?.rowCount ?? prevRowCountState);\n  }, [props.data?.rowCount, setRowCountState]);\n\n  useEffect(() => {\n    void getData(paginationModel, sortModel, filterModel);\n    // ESLint tells us here that we should add the `getData` function, however,\n    // doing so will cause the fetching to loop infinity until the JavaScript heap overflows.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [paginationModel, sortModel, filterModel]);\n\n  const initialState: GridInitialState = useMemo(\n    () => ({\n      pagination: {\n        paginationModel: {\n          page: 0,\n          pageSize: 10\n        },\n        rowCount: 0\n      },\n      sorting: {\n        sortModel: props.initialSort ? [props.initialSort] : []\n      },\n      filter: {\n        filterModel: {\n          items: [],\n          logicOperator: GridLogicOperator.And,\n          quickFilterLogicOperator: GridLogicOperator.And,\n          quickFilterValues: []\n        }\n      }\n    }),\n    [props.initialSort]\n  );\n\n  const mergedLocaleText = merge<\n    Partial<GridLocaleText & { refreshTable: string }>,\n    (GridLocaleText & { refreshTable: string }) | undefined\n  >(\n    {\n      columnHeaderSortIconLabel: 'Sorteren',\n      filterPanelColumns: 'Kolom',\n      filterPanelInputLabel: 'Zoekterm',\n      filterPanelInputPlaceholder: 'Zoeken...',\n      toolbarQuickFilterPlaceholder: 'Zoeken...',\n      toolbarQuickFilterLabel: 'Zoeken',\n      toolbarQuickFilterDeleteIconLabel: 'Wissen',\n      noRowsLabel: 'Geen regels beschikbaar',\n      noResultsOverlayLabel: 'Geen regels gevonden.',\n      paginationItemAriaLabel: (type) => {\n        switch (type) {\n          /* v8 ignore next */\n          case 'first':\n            /* v8 ignore next */\n            return 'Ga naar eerste pagina';\n          /* v8 ignore next */\n          case 'last':\n            /* v8 ignore next */\n            return 'Ga naar laatste pagina';\n          case 'next':\n            return 'Ga naar volgende pagina';\n          case 'previous':\n            return 'Ga naar vorige pagina';\n        }\n      },\n      paginationDisplayedRows: ({ from, to, count }) => `${from} - ${to} van ${count}`,\n      paginationRowsPerPage: 'Regels per pagina',\n      footerRowSelected: (count) => `${count} regels geselecteerd`\n    },\n    props.localeText\n  );\n\n  return (\n    <DataGrid\n      columns={props.columns}\n      disableColumnFilter\n      disableColumnMenu\n      disableColumnSelector\n      disableDensitySelector\n      disableRowSelectionOnClick\n      disableVirtualization\n      filterMode={mode}\n      getRowHeight={() => 'auto'}\n      ignoreDiacritics\n      initialState={initialState}\n      loading={isLoading}\n      localeText={mergedLocaleText}\n      onFilterModelChange={onFilterChange}\n      onPaginationModelChange={setPaginationModel}\n      onSortModelChange={handleSortModelChange}\n      pageSizeOptions={[5, 10, 20, 40, 80]}\n      paginationMode={mode}\n      paginationModel={paginationModel}\n      rowCount={isServerMode ? rowCountState : undefined}\n      rows={props.data?.rows}\n      showToolbar\n      slotProps={{\n        filterPanel: {\n          filterFormProps: {\n            operatorInputProps: {\n              disabled: true,\n              sx: { display: 'none' }\n            },\n            valueInputProps: {\n              sx: {\n                marginLeft: '15px'\n              }\n            }\n          }\n        },\n        panel: {\n          target: filterButtonEl\n        },\n        toolbar: {\n          setFilterButtonEl,\n          showQuickFilter: true,\n          quickFilterProps: { debounceMs: 500 },\n          mode,\n          getData: async () => getData(paginationModel, sortModel, filterModel),\n          actionButtons: props.actionButtons,\n          localeText: props.localeText\n        },\n        root: {\n          'data-qa': props['data-qa']\n        }\n      }}\n      slots={{ toolbar: QuickSearchToolbar }}\n      sortingMode={mode}\n      sx={merge(\n        {\n          border: 0,\n          color: 'var(--color-text)',\n          letterSpacing: 'normal',\n          minHeight: '300px',\n\n          [`&.${gridClasses['root--densityCompact']}`]: {\n            [`.${gridClasses.cell}`]: {\n              py: '8px'\n            }\n          },\n          [`&.${gridClasses['root--densityStandard']}`]: {\n            [`.${gridClasses.cell}`]: {\n              py: '15px'\n            }\n          },\n          [`&.${gridClasses['root--densityComfortable']}`]: {\n            [`.${gridClasses.cell}`]: {\n              py: '22px'\n            }\n          },\n\n          /**\n           * The 'no results' message does not show if the DataGrid does not have a fixed height.\n           * Because a fixed height is not desirable, we set a min-height on the DataGrid and set\n           * the min-height of the virtualScroller to half of that height.\n           */\n          [`.${gridClasses.virtualScroller}`]: {\n            minHeight: '150px',\n            overflow: 'hidden',\n            position: 'relative'\n          },\n\n          [`.${gridClasses.columnHeader}`]: {\n            '--DataGrid-containerBackground': 'var(--color-rijks-skyblue)',\n            backgroundColor: 'var(--color-rijks-skyblue)',\n            color: 'var(--color-text-light)'\n          },\n\n          [`.${gridClasses.row}`]: {\n            ':hover': {\n              backgroundColor: 'var(--color-rijks-skyblue-light)'\n            },\n\n            ':nth-of-type(even)': {\n              backgroundColor: 'var(--color-rijks-grey-1)',\n\n              ':hover': {\n                backgroundColor: 'var(--color-rijks-skyblue-light)'\n              }\n            }\n          },\n\n          [`.${gridClasses.columnHeader}, .${gridClasses.cell}, .MuiDataGrid-columnsContainer`]: {\n            borderRight: '1px solid var(--color-rijks-grey-2)'\n          },\n\n          [`.${gridClasses.cell}`]: {\n            color: 'var(--color-text)'\n          },\n\n          [`.${paginationItemClasses.root}`]: {\n            borderRadius: 0\n          },\n\n          [`.${checkboxClasses.root}`]: {\n            color: 'var(--color-primary)',\n\n            ':focus': {\n              outline: '2px dashed var(--color-text)',\n              outlineOffset: '-9px',\n              borderRadius: 0\n            },\n\n            ':disabled': {\n              color: 'var(--color-disabled)'\n            }\n          },\n\n          [`.${gridClasses.columnHeader} .${checkboxClasses.root}`]: {\n            color: 'white'\n          }\n        },\n        props.sx,\n        FontNormalSxProps\n      )}\n      {...props.dataGridOverridableProps}\n    />\n  );\n}\n"],"names":["AoaTable","props","isLoading","setIsLoading","useState","paginationModel","setPaginationModel","sortModel","setSortModel","filterModel","setFilterModel","filterButtonEl","setFilterButtonEl","mode","isServerMode","handleSortModelChange","useCallback","onFilterChange","rowCountState","setRowCountState","getData","fetchData","useEffect","prevRowCountState","initialState","useMemo","GridLogicOperator","mergedLocaleText","merge","type","from","to","count","jsx","DataGrid","QuickSearchToolbar","gridClasses","paginationItemClasses","checkboxClasses","FontNormalSxProps"],"mappings":";;;;;;;AAmHO,SAASA,EAAiC,EAAE,GAAGC,KAA2B;AAC/E,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAiBC,CAAkB,IAAIF,EAA8B;AAAA,IAC1E,MAAM;AAAA,IACN,UAAU;AAAA,EAAA,CACX,GACK,CAACG,GAAWC,CAAY,IAAIJ,EAAwB,CAAA,CAAE,GACtD,CAACK,GAAaC,CAAc,IAAIN,EAA0B;AAAA,IAC9D,OAAO,CAAA;AAAA,EAAC,CACT,GACK,CAACO,GAAgBC,CAAiB,IAAIR,EAAmC,IAAI,GAE7ES,IAAOZ,EAAM,QAAQ,UACrBa,IAAeD,MAAS,UAExBE,IAAwBC,EAAY,CAACT,MAA6B;AACtE,IAAAC,EAAaD,CAAS;AAAA,EAAA,GACrB,EAAE,GAECU,IAAiBD,EAAY,CAACP,MAAiC;AACnE,IAAAC,EAAeD,CAAW;AAAA,EAAA,GACzB,EAAE,GAEC,CAACS,GAAeC,CAAgB,IAAIf,EAASH,EAAM,MAAM,YAAY,CAAC;AAE5E,iBAAemB,EAAQf,GAAsCE,GAA0BE,GAA8B;AACnH,QAAIK,KAAgBb,EAAM,SAAS;AACjC,YAAMoB,IAAY,YAAY;AAC5B,cAAMpB,EAAM,QAAQ,EAAE,GAAGI,GAAiB,WAAAE,GAAW,aAAAE,GAAa;AAAA,MAAA;AAGpE,MAAAN,EAAa,EAAI,GACjB,MAAMkB,EAAA,GACNlB,EAAa,EAAK;AAAA,IAAA;AAAA,EACpB;AAGF,EAAAmB,EAAU,MAAM;AACd,IAAAH,EAAiB,CAACI,MAAsBtB,EAAM,MAAM,YAAYsB,CAAiB;AAAA,EAAA,GAChF,CAACtB,EAAM,MAAM,UAAUkB,CAAgB,CAAC,GAE3CG,EAAU,MAAM;AACd,IAAKF,EAAQf,GAAiBE,GAAWE,CAAW;AAAA,EAAA,GAInD,CAACJ,GAAiBE,GAAWE,CAAW,CAAC;AAE5C,QAAMe,IAAiCC;AAAA,IACrC,OAAO;AAAA,MACL,YAAY;AAAA,QACV,iBAAiB;AAAA,UACf,MAAM;AAAA,UACN,UAAU;AAAA,QAAA;AAAA,QAEZ,UAAU;AAAA,MAAA;AAAA,MAEZ,SAAS;AAAA,QACP,WAAWxB,EAAM,cAAc,CAACA,EAAM,WAAW,IAAI,CAAA;AAAA,MAAC;AAAA,MAExD,QAAQ;AAAA,QACN,aAAa;AAAA,UACX,OAAO,CAAA;AAAA,UACP,eAAeyB,EAAkB;AAAA,UACjC,0BAA0BA,EAAkB;AAAA,UAC5C,mBAAmB,CAAA;AAAA,QAAC;AAAA,MACtB;AAAA,IACF;AAAA,IAEF,CAACzB,EAAM,WAAW;AAAA,EAAA,GAGd0B,IAAmBC,EAAAA;AAAAA,IAIvB;AAAA,MACE,2BAA2B;AAAA,MAC3B,oBAAoB;AAAA,MACpB,uBAAuB;AAAA,MACvB,6BAA6B;AAAA,MAC7B,+BAA+B;AAAA,MAC/B,yBAAyB;AAAA,MACzB,mCAAmC;AAAA,MACnC,aAAa;AAAA,MACb,uBAAuB;AAAA,MACvB,yBAAyB,CAACC,MAAS;AACjC,gBAAQA,GAAA;AAAA;AAAA,UAEN,KAAK;AAEH,mBAAO;AAAA;AAAA,UAET,KAAK;AAEH,mBAAO;AAAA,UACT,KAAK;AACH,mBAAO;AAAA,UACT,KAAK;AACH,mBAAO;AAAA,QAAA;AAAA,MACX;AAAA,MAEF,yBAAyB,CAAC,EAAE,MAAAC,GAAM,IAAAC,GAAI,OAAAC,EAAA,MAAY,GAAGF,CAAI,MAAMC,CAAE,QAAQC,CAAK;AAAA,MAC9E,uBAAuB;AAAA,MACvB,mBAAmB,CAACA,MAAU,GAAGA,CAAK;AAAA,IAAA;AAAA,IAExC/B,EAAM;AAAA,EAAA;AAGR,SACE,gBAAAgC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAASjC,EAAM;AAAA,MACf,qBAAmB;AAAA,MACnB,mBAAiB;AAAA,MACjB,uBAAqB;AAAA,MACrB,wBAAsB;AAAA,MACtB,4BAA0B;AAAA,MAC1B,uBAAqB;AAAA,MACrB,YAAYY;AAAA,MACZ,cAAc,MAAM;AAAA,MACpB,kBAAgB;AAAA,MAChB,cAAAW;AAAA,MACA,SAAStB;AAAA,MACT,YAAYyB;AAAA,MACZ,qBAAqBV;AAAA,MACrB,yBAAyBX;AAAA,MACzB,mBAAmBS;AAAA,MACnB,iBAAiB,CAAC,GAAG,IAAI,IAAI,IAAI,EAAE;AAAA,MACnC,gBAAgBF;AAAA,MAChB,iBAAAR;AAAA,MACA,UAAUS,IAAeI,IAAgB;AAAA,MACzC,MAAMjB,EAAM,MAAM;AAAA,MAClB,aAAW;AAAA,MACX,WAAW;AAAA,QACT,aAAa;AAAA,UACX,iBAAiB;AAAA,YACf,oBAAoB;AAAA,cAClB,UAAU;AAAA,cACV,IAAI,EAAE,SAAS,OAAA;AAAA,YAAO;AAAA,YAExB,iBAAiB;AAAA,cACf,IAAI;AAAA,gBACF,YAAY;AAAA,cAAA;AAAA,YACd;AAAA,UACF;AAAA,QACF;AAAA,QAEF,OAAO;AAAA,UACL,QAAQU;AAAA,QAAA;AAAA,QAEV,SAAS;AAAA,UACP,mBAAAC;AAAA,UACA,iBAAiB;AAAA,UACjB,kBAAkB,EAAE,YAAY,IAAA;AAAA,UAChC,MAAAC;AAAA,UACA,SAAS,YAAYO,EAAQf,GAAiBE,GAAWE,CAAW;AAAA,UACpE,eAAeR,EAAM;AAAA,UACrB,YAAYA,EAAM;AAAA,QAAA;AAAA,QAEpB,MAAM;AAAA,UACJ,WAAWA,EAAM,SAAS;AAAA,QAAA;AAAA,MAC5B;AAAA,MAEF,OAAO,EAAE,SAASkC,EAAA;AAAA,MAClB,aAAatB;AAAA,MACb,IAAIe,EAAAA;AAAAA,QACF;AAAA,UACE,QAAQ;AAAA,UACR,OAAO;AAAA,UACP,eAAe;AAAA,UACf,WAAW;AAAA,UAEX,CAAC,KAAKQ,EAAY,sBAAsB,CAAC,EAAE,GAAG;AAAA,YAC5C,CAAC,IAAIA,EAAY,IAAI,EAAE,GAAG;AAAA,cACxB,IAAI;AAAA,YAAA;AAAA,UACN;AAAA,UAEF,CAAC,KAAKA,EAAY,uBAAuB,CAAC,EAAE,GAAG;AAAA,YAC7C,CAAC,IAAIA,EAAY,IAAI,EAAE,GAAG;AAAA,cACxB,IAAI;AAAA,YAAA;AAAA,UACN;AAAA,UAEF,CAAC,KAAKA,EAAY,0BAA0B,CAAC,EAAE,GAAG;AAAA,YAChD,CAAC,IAAIA,EAAY,IAAI,EAAE,GAAG;AAAA,cACxB,IAAI;AAAA,YAAA;AAAA,UACN;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,UAQF,CAAC,IAAIA,EAAY,eAAe,EAAE,GAAG;AAAA,YACnC,WAAW;AAAA,YACX,UAAU;AAAA,YACV,UAAU;AAAA,UAAA;AAAA,UAGZ,CAAC,IAAIA,EAAY,YAAY,EAAE,GAAG;AAAA,YAChC,kCAAkC;AAAA,YAClC,iBAAiB;AAAA,YACjB,OAAO;AAAA,UAAA;AAAA,UAGT,CAAC,IAAIA,EAAY,GAAG,EAAE,GAAG;AAAA,YACvB,UAAU;AAAA,cACR,iBAAiB;AAAA,YAAA;AAAA,YAGnB,sBAAsB;AAAA,cACpB,iBAAiB;AAAA,cAEjB,UAAU;AAAA,gBACR,iBAAiB;AAAA,cAAA;AAAA,YACnB;AAAA,UACF;AAAA,UAGF,CAAC,IAAIA,EAAY,YAAY,MAAMA,EAAY,IAAI,iCAAiC,GAAG;AAAA,YACrF,aAAa;AAAA,UAAA;AAAA,UAGf,CAAC,IAAIA,EAAY,IAAI,EAAE,GAAG;AAAA,YACxB,OAAO;AAAA,UAAA;AAAA,UAGT,CAAC,IAAIC,EAAsB,IAAI,EAAE,GAAG;AAAA,YAClC,cAAc;AAAA,UAAA;AAAA,UAGhB,CAAC,IAAIC,EAAgB,IAAI,EAAE,GAAG;AAAA,YAC5B,OAAO;AAAA,YAEP,UAAU;AAAA,cACR,SAAS;AAAA,cACT,eAAe;AAAA,cACf,cAAc;AAAA,YAAA;AAAA,YAGhB,aAAa;AAAA,cACX,OAAO;AAAA,YAAA;AAAA,UACT;AAAA,UAGF,CAAC,IAAIF,EAAY,YAAY,KAAKE,EAAgB,IAAI,EAAE,GAAG;AAAA,YACzD,OAAO;AAAA,UAAA;AAAA,QACT;AAAA,QAEFrC,EAAM;AAAA,QACNsC;AAAA,MAAA;AAAA,MAED,GAAGtC,EAAM;AAAA,IAAA;AAAA,EAAA;AAGhB;"}
+{"version":3,"file":"Table.js","sources":["../../../../src/components/atoms/table/Table.tsx"],"sourcesContent":["import { checkboxClasses, paginationItemClasses, type SxProps } from '@mui/material';\nimport {\n  GridLogicOperator,\n  DataGrid,\n  gridClasses,\n  type DataGridProps,\n  type GridColDef,\n  type GridGetRowsParams,\n  type GridInitialState,\n  type GridLocaleText,\n  type GridPaginationModel,\n  type GridRowModel,\n  type GridValidRowModel,\n  type GridSortModel,\n  type GridFilterModel\n} from '@mui/x-data-grid';\nimport { merge } from 'lodash';\nimport { useEffect, useMemo, useState, type JSX } from 'react';\nimport { FontNormalSxProps } from '../../../_constants';\nimport { QuickSearchToolbar } from './_QuickSearchToolbar';\n\nexport interface AoaTableData<T extends GridValidRowModel = GridValidRowModel> {\n  /**\n   * Additional `pageInfo` for advanced use-cases.\n   * `hasNextPage`: When row count is unknown/estimated, `hasNextPage` will be used to check if more records are available on server.\n   */\n  pageInfo?: {\n    hasNextPage?: boolean;\n    nextCursor?: string;\n  };\n  /**\n   * To reflect updates in total `rowCount` (optional).\n   * Useful when the `rowCount` is inaccurate (for example when filtering) or not available upfront.\n   */\n  rowCount?: number;\n  /**\n   * The paged, filtered and sorted items from the database\n   */\n  rows: GridRowModel<T>[];\n}\n\nexport type AoaTableColumns<T extends object = any> = GridColDef<T>[];\n\nexport type AoaTableQueryOptions = GridPaginationModel & Omit<GridGetRowsParams, 'end' | 'paginationModel' | 'start'>;\n\ntype ModeProps =\n  /**\n   * Overwrites the default mode (server) when you need pagination, filtering and sorting on the client side\n   */\n  | { getData?: never; mode: 'client' }\n  /**\n   * The Redux action that takes PaginationModel as parameter to retrieve data from the server\n   */\n  | { getData(queryOptions: AoaTableQueryOptions): Promise<void> | void; mode?: 'server' };\n\nexport type AoaTableProps<T extends object = any> = ModeProps & {\n  /**\n   * Action buttons shown in the toolbar of the table\n   */\n  readonly actionButtons?: JSX.Element[];\n  /**\n   * The column structure to display the data\n   */\n  readonly columns: GridColDef<T>[];\n  /**\n   * The TableData object to be displayed in the table\n   */\n  readonly data: AoaTableData<T>;\n  /**\n   * Data-qa tag for E2E test purposes\n   */\n  readonly 'data-qa'?: string;\n  /**\n   * Overwrite a safe selection of the {@link DataGrid} properties\n   */\n  readonly dataGridOverridableProps?: Pick<\n    DataGridProps<T>,\n    | 'checkboxSelection'\n    | 'disableColumnFilter'\n    | 'disableRowSelectionOnClick'\n    | 'getRowId'\n    | 'ignoreDiacritics'\n    | 'isRowSelectable'\n    | 'loading'\n    | 'onRowSelectionModelChange'\n    | 'rowSelectionModel'\n  >;\n  /**\n   * Sets the initial sortModel in case the required sorting differs from the back-end's default sorting\n   */\n  readonly initialSort?: { field: string; sort: 'asc' | 'desc' };\n  /**\n   * Overwrites the default labels when you need a different language than Dutch\n   */\n  readonly localeText?: GridLocaleText & { refreshTable: string };\n  /**\n   * Material UI's property to apply styling\n   */\n  readonly sx?: SxProps;\n};\n\n/**\n * Constructs a table using pre-defined Rijks styling\n *\n * @param props - Props to pass to the button\n * @example\n * ```jsx\n * <AoaTable\n *  getData={(queryOptions) => getMockData(queryOptions)}\n *  data={mockData}\n *  columns={[{ field: \"id\" }, { field: \"title\" }, { field: \"completed\" }]}\n * />\n * ```\n */\n\nexport function AoaTable<T extends object = any>({ ...props }: AoaTableProps<T>) {\n  const [isLoading, setIsLoading] = useState(false);\n  const [paginationModel, setPaginationModel] = useState<GridPaginationModel>({\n    page: 0,\n    pageSize: 10\n  });\n  const [sortModel, setSortModel] = useState<GridSortModel>([]);\n  const [filterModel, setFilterModel] = useState<GridFilterModel>({\n    items: []\n  });\n  const [filterButtonEl, setFilterButtonEl] = useState<HTMLButtonElement | null>(null);\n\n  const [rowCountState, setRowCountState] = useState(props.data?.rowCount ?? 0);\n\n  const mode = props.mode ?? 'server';\n  const isServerMode = mode === 'server';\n\n  async function getData(paginationModel: GridPaginationModel, sortModel: GridSortModel, filterModel: GridFilterModel) {\n    if (isServerMode && props.getData) {\n      const fetchData = async () => {\n        await props.getData({ ...paginationModel, sortModel, filterModel });\n      };\n\n      setIsLoading(true);\n      await fetchData();\n      setIsLoading(false);\n    }\n  }\n\n  useEffect(() => {\n    setRowCountState((prevRowCountState) => props.data?.rowCount ?? prevRowCountState);\n  }, [props.data?.rowCount, setRowCountState]);\n\n  useEffect(() => {\n    void getData(paginationModel, sortModel, filterModel);\n    // ESLint tells us here that we should add the `getData` function, however,\n    // doing so will cause the fetching to loop infinity until the JavaScript heap overflows.\n    // eslint-disable-next-line react-compiler/react-compiler\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [paginationModel, sortModel, filterModel]);\n\n  const initialState: GridInitialState = useMemo(\n    () => ({\n      pagination: {\n        paginationModel: {\n          page: 0,\n          pageSize: 10\n        },\n        rowCount: 0\n      },\n      sorting: {\n        sortModel: props.initialSort ? [props.initialSort] : []\n      },\n      filter: {\n        filterModel: {\n          items: [],\n          logicOperator: GridLogicOperator.And,\n          quickFilterLogicOperator: GridLogicOperator.And,\n          quickFilterValues: []\n        }\n      }\n    }),\n    [props.initialSort]\n  );\n\n  const mergedLocaleText = merge<\n    Partial<GridLocaleText & { refreshTable: string }>,\n    (GridLocaleText & { refreshTable: string }) | undefined\n  >(\n    {\n      columnHeaderSortIconLabel: 'Sorteren',\n      filterPanelColumns: 'Kolom',\n      filterPanelInputLabel: 'Zoekterm',\n      filterPanelInputPlaceholder: 'Zoeken...',\n      toolbarQuickFilterPlaceholder: 'Zoeken...',\n      toolbarQuickFilterLabel: 'Zoeken',\n      toolbarQuickFilterDeleteIconLabel: 'Wissen',\n      noRowsLabel: 'Geen regels beschikbaar',\n      noResultsOverlayLabel: 'Geen regels gevonden.',\n      paginationItemAriaLabel: (type) => {\n        switch (type) {\n          /* v8 ignore next */\n          case 'first':\n            /* v8 ignore next */\n            return 'Ga naar eerste pagina';\n          /* v8 ignore next */\n          case 'last':\n            /* v8 ignore next */\n            return 'Ga naar laatste pagina';\n          case 'next':\n            return 'Ga naar volgende pagina';\n          case 'previous':\n            return 'Ga naar vorige pagina';\n        }\n      },\n      paginationDisplayedRows: ({ from, to, count }) => `${from} - ${to} van ${count}`,\n      paginationRowsPerPage: 'Regels per pagina',\n      footerRowSelected: (count) => `${count} regels geselecteerd`\n    },\n    props.localeText\n  );\n\n  return (\n    <DataGrid\n      columns={props.columns}\n      disableColumnFilter\n      disableColumnMenu\n      disableColumnSelector\n      disableDensitySelector\n      disableRowSelectionOnClick\n      disableVirtualization\n      filterMode={mode}\n      getRowHeight={() => 'auto'}\n      ignoreDiacritics\n      initialState={initialState}\n      loading={isLoading}\n      localeText={mergedLocaleText}\n      onFilterModelChange={(filterModel) => setFilterModel(filterModel)}\n      onPaginationModelChange={setPaginationModel}\n      onSortModelChange={(sortModel) => setSortModel(sortModel)}\n      pageSizeOptions={[5, 10, 20, 40, 80]}\n      paginationMode={mode}\n      paginationModel={paginationModel}\n      rowCount={isServerMode ? rowCountState : undefined}\n      rows={props.data?.rows}\n      showToolbar\n      slotProps={{\n        filterPanel: {\n          filterFormProps: {\n            operatorInputProps: {\n              disabled: true,\n              sx: { display: 'none' }\n            },\n            valueInputProps: {\n              sx: {\n                marginLeft: '15px'\n              }\n            }\n          }\n        },\n        panel: {\n          target: filterButtonEl\n        },\n        toolbar: {\n          setFilterButtonEl,\n          showQuickFilter: props.dataGridOverridableProps?.disableColumnFilter === false,\n          quickFilterProps: { debounceMs: 500 },\n          mode,\n          getData: async () => getData(paginationModel, sortModel, filterModel),\n          actionButtons: props.actionButtons,\n          localeText: props.localeText\n        },\n        root: {\n          'data-qa': props['data-qa']\n        }\n      }}\n      slots={{ toolbar: QuickSearchToolbar }}\n      sortingMode={mode}\n      sx={merge(\n        {\n          border: 0,\n          color: 'var(--color-text)',\n          letterSpacing: 'normal',\n          minHeight: '300px',\n\n          [`&.${gridClasses['root--densityCompact']}`]: {\n            [`.${gridClasses.cell}`]: {\n              py: '8px'\n            }\n          },\n          [`&.${gridClasses['root--densityStandard']}`]: {\n            [`.${gridClasses.cell}`]: {\n              py: '15px'\n            }\n          },\n          [`&.${gridClasses['root--densityComfortable']}`]: {\n            [`.${gridClasses.cell}`]: {\n              py: '22px'\n            }\n          },\n\n          /**\n           * The 'no results' message does not show if the DataGrid does not have a fixed height.\n           * Because a fixed height is not desirable, we set a min-height on the DataGrid and set\n           * the min-height of the virtualScroller to half of that height.\n           */\n          [`.${gridClasses.virtualScroller}`]: {\n            minHeight: '150px',\n            overflow: 'hidden',\n            position: 'relative'\n          },\n\n          [`.${gridClasses.columnHeader}`]: {\n            '--DataGrid-containerBackground': 'var(--color-rijks-skyblue)',\n            backgroundColor: 'var(--color-rijks-skyblue)',\n            color: 'var(--color-text-light)'\n          },\n\n          [`.${gridClasses.row}`]: {\n            ':hover': {\n              backgroundColor: 'var(--color-rijks-skyblue-light)'\n            },\n\n            ':nth-of-type(even)': {\n              backgroundColor: 'var(--color-rijks-grey-1)',\n\n              ':hover': {\n                backgroundColor: 'var(--color-rijks-skyblue-light)'\n              }\n            }\n          },\n\n          [`.${gridClasses.columnHeader}, .${gridClasses.cell}, .MuiDataGrid-columnsContainer`]: {\n            borderRight: '1px solid var(--color-rijks-grey-2)'\n          },\n\n          [`.${gridClasses.cell}`]: {\n            color: 'var(--color-text)'\n          },\n\n          [`.${paginationItemClasses.root}`]: {\n            borderRadius: 0\n          },\n\n          [`.${checkboxClasses.root}`]: {\n            color: 'var(--color-primary)',\n\n            ':focus': {\n              outline: '2px dashed var(--color-text)',\n              outlineOffset: '-9px',\n              borderRadius: 0\n            },\n\n            ':disabled': {\n              color: 'var(--color-disabled)'\n            }\n          },\n\n          [`.${gridClasses.columnHeader} .${checkboxClasses.root}`]: {\n            color: 'white'\n          }\n        },\n        props.sx,\n        FontNormalSxProps\n      )}\n      {...props.dataGridOverridableProps}\n    />\n  );\n}\n"],"names":["AoaTable","props","isLoading","setIsLoading","useState","paginationModel","setPaginationModel","page","pageSize","sortModel","setSortModel","filterModel","setFilterModel","items","filterButtonEl","setFilterButtonEl","rowCountState","setRowCountState","data","rowCount","mode","isServerMode","getData","fetchData","useEffect","prevRowCountState","initialState","useMemo","pagination","sorting","initialSort","filter","logicOperator","GridLogicOperator","And","quickFilterLogicOperator","quickFilterValues","mergedLocaleText","merge","columnHeaderSortIconLabel","filterPanelColumns","filterPanelInputLabel","filterPanelInputPlaceholder","toolbarQuickFilterPlaceholder","toolbarQuickFilterLabel","toolbarQuickFilterDeleteIconLabel","noRowsLabel","noResultsOverlayLabel","paginationItemAriaLabel","type","paginationDisplayedRows","from","to","count","paginationRowsPerPage","footerRowSelected","localeText","jsx","DataGrid","columns","undefined","rows","filterPanel","filterFormProps","operatorInputProps","disabled","sx","display","valueInputProps","marginLeft","panel","target","toolbar","showQuickFilter","dataGridOverridableProps","disableColumnFilter","quickFilterProps","debounceMs","actionButtons","root","QuickSearchToolbar","border","color","letterSpacing","minHeight","gridClasses","cell","py","virtualScroller","overflow","position","columnHeader","backgroundColor","row","borderRight","paginationItemClasses","borderRadius","checkboxClasses","outline","outlineOffset","FontNormalSxProps"],"mappings":";;;;;;;AAmHO,SAASA,EAAiC;AAAA,EAAE,GAAGC;AAAwB,GAAG;AAC/E,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAiBC,CAAkB,IAAIF,EAA8B;AAAA,IAC1EG,MAAM;AAAA,IACNC,UAAU;AAAA,EAAA,CACX,GACK,CAACC,GAAWC,CAAY,IAAIN,EAAwB,CAAA,CAAE,GACtD,CAACO,GAAaC,CAAc,IAAIR,EAA0B;AAAA,IAC9DS,OAAO,CAAA;AAAA,EAAA,CACR,GACK,CAACC,GAAgBC,CAAiB,IAAIX,EAAmC,IAAI,GAE7E,CAACY,GAAeC,CAAgB,IAAIb,EAASH,EAAMiB,MAAMC,YAAY,CAAC,GAEtEC,IAAOnB,EAAMmB,QAAQ,UACrBC,IAAeD,MAAS;AAE9B,iBAAeE,EAAQjB,GAAsCI,GAA0BE,GAA8B;AACnH,QAAIU,KAAgBpB,EAAMqB,SAAS;AACjC,YAAMC,IAAY,YAAY;AAC5B,cAAMtB,EAAMqB,QAAQ;AAAA,UAAE,GAAGjB;AAAAA,UAAiBI,WAAAA;AAAAA,UAAWE,aAAAA;AAAAA,QAAAA,CAAa;AAAA,MAAA;AAGpER,MAAAA,EAAa,EAAI,GACjB,MAAMoB,EAAAA,GACNpB,EAAa,EAAK;AAAA,IAAA;AAAA,EACpB;AAGFqB,EAAAA,EAAU,MAAM;AACdP,IAAAA,EAAkBQ,CAAAA,MAAsBxB,EAAMiB,MAAMC,YAAYM,CAAiB;AAAA,EAAA,GAChF,CAACxB,EAAMiB,MAAMC,UAAUF,CAAgB,CAAC,GAE3CO,EAAU,MAAM;AACd,IAAKF,EAAQjB,GAAiBI,GAAWE,CAAW;AAAA,EAAA,GAKnD,CAACN,GAAiBI,GAAWE,CAAW,CAAC;AAE5C,QAAMe,IAAiCC,EACrC,OAAO;AAAA,IACLC,YAAY;AAAA,MACVvB,iBAAiB;AAAA,QACfE,MAAM;AAAA,QACNC,UAAU;AAAA,MAAA;AAAA,MAEZW,UAAU;AAAA,IAAA;AAAA,IAEZU,SAAS;AAAA,MACPpB,WAAWR,EAAM6B,cAAc,CAAC7B,EAAM6B,WAAW,IAAI,CAAA;AAAA,IAAA;AAAA,IAEvDC,QAAQ;AAAA,MACNpB,aAAa;AAAA,QACXE,OAAO,CAAA;AAAA,QACPmB,eAAeC,EAAkBC;AAAAA,QACjCC,0BAA0BF,EAAkBC;AAAAA,QAC5CE,mBAAmB,CAAA;AAAA,MAAA;AAAA,IACrB;AAAA,EACF,IAEF,CAACnC,EAAM6B,WAAW,CACpB,GAEMO,IAAmBC,EAAAA,MAIvB;AAAA,IACEC,2BAA2B;AAAA,IAC3BC,oBAAoB;AAAA,IACpBC,uBAAuB;AAAA,IACvBC,6BAA6B;AAAA,IAC7BC,+BAA+B;AAAA,IAC/BC,yBAAyB;AAAA,IACzBC,mCAAmC;AAAA,IACnCC,aAAa;AAAA,IACbC,uBAAuB;AAAA,IACvBC,yBAA0BC,CAAAA,MAAS;AACjC,cAAQA,GAAAA;AAAAA;AAAAA,QAEN,KAAK;AAEH,iBAAO;AAAA;AAAA,QAET,KAAK;AAEH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,MAAA;AAAA,IACX;AAAA,IAEFC,yBAAyBA,CAAC;AAAA,MAAEC,MAAAA;AAAAA,MAAMC,IAAAA;AAAAA,MAAIC,OAAAA;AAAAA,IAAAA,MAAY,GAAGF,CAAI,MAAMC,CAAE,QAAQC,CAAK;AAAA,IAC9EC,uBAAuB;AAAA,IACvBC,mBAAoBF,CAAAA,MAAU,GAAGA,CAAK;AAAA,EAAA,GAExCpD,EAAMuD,UACR;AAEA,SACE,gBAAAC,EAACC,GAAA,EACC,SAASzD,EAAM0D,SACf,qBAAmB,IACnB,mBAAiB,IACjB,uBAAqB,IACrB,wBAAsB,IACtB,4BAA0B,IAC1B,uBAAqB,IACrB,YAAYvC,GACZ,cAAc,MAAM,QACpB,kBAAgB,IAChB,cAAAM,GACA,SAASxB,GACT,YAAYmC,GACZ,qBAAsB1B,CAAAA,MAAgBC,EAAeD,CAAW,GAChE,yBAAyBL,GACzB,mBAAoBG,CAAAA,MAAcC,EAAaD,CAAS,GACxD,iBAAiB,CAAC,GAAG,IAAI,IAAI,IAAI,EAAE,GACnC,gBAAgBW,GAChB,iBAAAf,GACA,UAAUgB,IAAeL,IAAgB4C,QACzC,MAAM3D,EAAMiB,MAAM2C,MAClB,aAAW,IACX,WAAW;AAAA,IACTC,aAAa;AAAA,MACXC,iBAAiB;AAAA,QACfC,oBAAoB;AAAA,UAClBC,UAAU;AAAA,UACVC,IAAI;AAAA,YAAEC,SAAS;AAAA,UAAA;AAAA,QAAO;AAAA,QAExBC,iBAAiB;AAAA,UACfF,IAAI;AAAA,YACFG,YAAY;AAAA,UAAA;AAAA,QACd;AAAA,MACF;AAAA,IACF;AAAA,IAEFC,OAAO;AAAA,MACLC,QAAQzD;AAAAA,IAAAA;AAAAA,IAEV0D,SAAS;AAAA,MACPzD,mBAAAA;AAAAA,MACA0D,iBAAiBxE,EAAMyE,0BAA0BC,wBAAwB;AAAA,MACzEC,kBAAkB;AAAA,QAAEC,YAAY;AAAA,MAAA;AAAA,MAChCzD,MAAAA;AAAAA,MACAE,SAAS,YAAYA,EAAQjB,GAAiBI,GAAWE,CAAW;AAAA,MACpEmE,eAAe7E,EAAM6E;AAAAA,MACrBtB,YAAYvD,EAAMuD;AAAAA,IAAAA;AAAAA,IAEpBuB,MAAM;AAAA,MACJ,WAAW9E,EAAM,SAAS;AAAA,IAAA;AAAA,EAC5B,GAEF,OAAO;AAAA,IAAEuE,SAASQ;AAAAA,EAAAA,GAClB,aAAa5D,GACb,IAAIkB,QACF;AAAA,IACE2C,QAAQ;AAAA,IACRC,OAAO;AAAA,IACPC,eAAe;AAAA,IACfC,WAAW;AAAA,IAEX,CAAC,KAAKC,EAAY,sBAAsB,CAAC,EAAE,GAAG;AAAA,MAC5C,CAAC,IAAIA,EAAYC,IAAI,EAAE,GAAG;AAAA,QACxBC,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,IAEF,CAAC,KAAKF,EAAY,uBAAuB,CAAC,EAAE,GAAG;AAAA,MAC7C,CAAC,IAAIA,EAAYC,IAAI,EAAE,GAAG;AAAA,QACxBC,IAAI;AAAA,MAAA;AAAA,IACN;AAAA,IAEF,CAAC,KAAKF,EAAY,0BAA0B,CAAC,EAAE,GAAG;AAAA,MAChD,CAAC,IAAIA,EAAYC,IAAI,EAAE,GAAG;AAAA,QACxBC,IAAI;AAAA,MAAA;AAAA,IACN;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQF,CAAC,IAAIF,EAAYG,eAAe,EAAE,GAAG;AAAA,MACnCJ,WAAW;AAAA,MACXK,UAAU;AAAA,MACVC,UAAU;AAAA,IAAA;AAAA,IAGZ,CAAC,IAAIL,EAAYM,YAAY,EAAE,GAAG;AAAA,MAChC,kCAAkC;AAAA,MAClCC,iBAAiB;AAAA,MACjBV,OAAO;AAAA,IAAA;AAAA,IAGT,CAAC,IAAIG,EAAYQ,GAAG,EAAE,GAAG;AAAA,MACvB,UAAU;AAAA,QACRD,iBAAiB;AAAA,MAAA;AAAA,MAGnB,sBAAsB;AAAA,QACpBA,iBAAiB;AAAA,QAEjB,UAAU;AAAA,UACRA,iBAAiB;AAAA,QAAA;AAAA,MACnB;AAAA,IACF;AAAA,IAGF,CAAC,IAAIP,EAAYM,YAAY,MAAMN,EAAYC,IAAI,iCAAiC,GAAG;AAAA,MACrFQ,aAAa;AAAA,IAAA;AAAA,IAGf,CAAC,IAAIT,EAAYC,IAAI,EAAE,GAAG;AAAA,MACxBJ,OAAO;AAAA,IAAA;AAAA,IAGT,CAAC,IAAIa,EAAsBhB,IAAI,EAAE,GAAG;AAAA,MAClCiB,cAAc;AAAA,IAAA;AAAA,IAGhB,CAAC,IAAIC,EAAgBlB,IAAI,EAAE,GAAG;AAAA,MAC5BG,OAAO;AAAA,MAEP,UAAU;AAAA,QACRgB,SAAS;AAAA,QACTC,eAAe;AAAA,QACfH,cAAc;AAAA,MAAA;AAAA,MAGhB,aAAa;AAAA,QACXd,OAAO;AAAA,MAAA;AAAA,IACT;AAAA,IAGF,CAAC,IAAIG,EAAYM,YAAY,KAAKM,EAAgBlB,IAAI,EAAE,GAAG;AAAA,MACzDG,OAAO;AAAA,IAAA;AAAA,EACT,GAEFjF,EAAMiE,IACNkC,CACF,GACA,GAAInG,EAAMyE,0BAAyB;AAGzC;"}

package/dist/components/atoms/table/_QuickSearchToolbar.d.ts

@@ -1,5 +1,5 @@
 import { GridLocaleText, GridToolbarProps, ToolbarPropsOverrides } from '@mui/x-data-grid';
-import { Dispatch, SetStateAction } from 'react';
+import { Dispatch, JSX, SetStateAction } from 'react';
 declare module '@mui/x-data-grid' {
     interface ToolbarPropsOverrides {
         actionButtons?: JSX.Element[];
@@ -9,7 +9,8 @@ declare module '@mui/x-data-grid' {
         };
         mode: 'client' | 'server';
         setFilterButtonEl: Dispatch<SetStateAction<HTMLButtonElement | null>>;
+        showQuickFilter: boolean;
     }
 }
-export declare function QuickSearchToolbar({ mode, actionButtons, localeText, getData, setFilterButtonEl }: GridToolbarProps & ToolbarPropsOverrides): import("react/jsx-runtime").JSX.Element;
+export declare function QuickSearchToolbar({ mode, actionButtons, localeText, showQuickFilter, getData, setFilterButtonEl }: GridToolbarProps & ToolbarPropsOverrides): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=_QuickSearchToolbar.d.ts.map

package/dist/components/atoms/table/_QuickSearchToolbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"_QuickSearchToolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/table/_QuickSearchToolbar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAOL,KAAK,cAAc,EACnB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC3B,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,KAAK,QAAQ,EAAkB,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAI3E,OAAO,QAAQ,kBAAkB,CAAC;IAChC,UAAiB,qBAAqB;QACpC,aAAa,CAAC,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC;QAC9B,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;QAC1B,UAAU,CAAC,EAAE,cAAc,GAAG;YAC5B,YAAY,EAAE,MAAM,CAAC;SACtB,CAAC;QACF,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAAC;QAC1B,iBAAiB,EAAE,QAAQ,CAAC,cAAc,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC,CAAC;KACvE;CACF;AAED,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,aAAa,EACb,UAAU,EACV,OAAO,EACP,iBAAiB,EAClB,EAAE,gBAAgB,GAAG,qBAAqB,2CA0J1C"}
+{"version":3,"file":"_QuickSearchToolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/table/_QuickSearchToolbar.tsx"],"names":[],"mappings":"AAKA,OAAO,EAOL,KAAK,cAAc,EACnB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC3B,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,GAAG,EAAkB,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAIrF,OAAO,QAAQ,kBAAkB,CAAC;IAChC,UAAiB,qBAAqB;QACpC,aAAa,CAAC,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC;QAC9B,OAAO,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC;QAC1B,UAAU,CAAC,EAAE,cAAc,GAAG;YAC5B,YAAY,EAAE,MAAM,CAAC;SACtB,CAAC;QACF,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAAC;QAC1B,iBAAiB,EAAE,QAAQ,CAAC,cAAc,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC,CAAC;QACtE,eAAe,EAAE,OAAO,CAAC;KAC1B;CACF;AAED,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,aAAa,EACb,UAAU,EACV,eAAe,EACf,OAAO,EACP,iBAAiB,EAClB,EAAE,gBAAgB,GAAG,qBAAqB,2CA4J1C"}