@rws-aoa/react-library 8.1.0 → 8.2.2

package/dist/components-generic/atoms/selection-buttons/checkbox/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Checkbox.js","sources":["../../../../../src/components-generic/atoms/selection-buttons/checkbox/Checkbox.tsx"],"sourcesContent":["import { CheckBox as CheckBoxIcon, CheckBoxOutlineBlank as CheckBoxOutlineBlankIcon } from '@mui/icons-material';\nimport { Checkbox as MUICheckbox, FormControlLabel as MUIFormControlLabel, typographyClasses, type CheckboxProps as MUICheckboxProps } from '@mui/material';\nimport { merge } from 'lodash';\nimport { FontNormalSxProps } from '../../../../_constants';\n\nexport interface AoaCheckboxProps extends Omit<MUICheckboxProps, 'checkedIcon' | 'icon'> {\n  /**\n   * Whether this checkbox is checked\n   */\n  readonly checked: boolean;\n  /**\n   * Data-qa tag for E2E test purposes\n   */\n  readonly 'data-qa'?: string;\n  /**\n   * The label that is shown after the checkbox\n   */\n  readonly label: string;\n}\n\n/**\n * Constructs a checkbox using pre-defined Rijks styling\n *\n * @param props - Props to pass to the checkbox\n * @example\n * ```jsx\n * <AoaCheckbox label=\"Demo checkbox\" checked={true} onChange={handleChange} />} />\n * ```\n */\n\nexport function AoaCheckbox({ label, ...props }: AoaCheckboxProps) {\n  return (\n    <MUIFormControlLabel\n      control={\n        <MUICheckbox\n          {...props}\n          checkedIcon={<CheckBoxIcon color='inherit' fontSize='small' />}\n          icon={<CheckBoxOutlineBlankIcon color='inherit' fontSize='small' />}\n          sx={merge(\n            {\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            props.sx\n          )}\n        />\n      }\n      label={label}\n      sx={{ [`.${typographyClasses.root}`]: FontNormalSxProps }}\n    />\n  );\n}\n"],"names":["AoaCheckbox","label","props","jsx","MUIFormControlLabel","MUICheckbox","CheckBoxIcon","CheckBoxOutlineBlankIcon","merge","color","outline","outlineOffset","borderRadius","sx","typographyClasses","root","FontNormalSxProps"],"mappings":";;;;;AA8BO,SAASA,EAAY;AAAA,EAAEC,OAAAA;AAAAA,EAAO,GAAGC;AAAwB,GAAG;AACjE,SACE,gBAAAC,EAACC,GAAA,EACC,SACE,gBAAAD,EAACE,GAAA,EACC,GAAIH,GACJ,aAAa,gBAAAC,EAACG,GAAA,EAAa,OAAM,WAAU,UAAS,QAAA,CAAO,GAC3D,MAAM,gBAAAH,EAACI,GAAA,EAAyB,OAAM,WAAU,UAAS,QAAA,CAAO,GAChE,IAAIC,EAAAA,MACF;AAAA,IACEC,OAAO;AAAA,IAEP,UAAU;AAAA,MACRC,SAAS;AAAA,MACTC,eAAe;AAAA,MACfC,cAAc;AAAA,IAAA;AAAA,IAGhB,aAAa;AAAA,MACXH,OAAO;AAAA,IAAA;AAAA,EACT,GAEFP,EAAMW,EACR,EAAA,CAAE,GAGN,OAAAZ,GACA,IAAI;AAAA,IAAE,CAAC,IAAIa,EAAkBC,IAAI,EAAE,GAAGC;AAAAA,EAAAA,GAAoB;AAGhE;"}

package/dist/components-generic/atoms/selection-buttons/radio-button/RadioButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.d.ts","sourceRoot":"","sources":["../../../../../src/components-generic/atoms/selection-buttons/radio-button/RadioButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuF,KAAK,UAAU,IAAI,mBAAmB,EAAE,MAAM,eAAe,CAAC;AAI5J,MAAM,WAAW,mBAAoB,SAAQ,mBAAmB;IAC9D;;OAEG;IACH,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;GAQG;AAEH,wBAAgB,cAAc,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,2CA2BtE"}

package/dist/components-generic/atoms/selection-buttons/radio-button/RadioButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RadioButton.js","sources":["../../../../../src/components-generic/atoms/selection-buttons/radio-button/RadioButton.tsx"],"sourcesContent":["import { FormControlLabel as MUIFormControlLabel, Radio as MUIRadioButton, typographyClasses, type RadioProps as MUIRadioButtonProps } from '@mui/material';\nimport { merge } from 'lodash';\nimport { FontNormalSxProps } from '../../../../_constants';\n\nexport interface AoaRadioButtonProps extends MUIRadioButtonProps {\n  /**\n   * Whether this radio button is checked\n   */\n  readonly checked: boolean;\n  /**\n   * Data-qa tag for E2E test purposes\n   */\n  readonly 'data-qa'?: string;\n  /**\n   * The label that is shown after the radio button\n   */\n  readonly label: string;\n}\n\n/**\n * Constructs a radio button using pre-defined Rijks styling\n *\n * @param props - Props to pass to the radio button\n * @example\n * ```jsx\n * <AoaRadioButton label=\"Demo radio button\" />} />\n * ```\n */\n\nexport function AoaRadioButton({ label, ...props }: AoaRadioButtonProps) {\n  return (\n    <MUIFormControlLabel\n      control={\n        <MUIRadioButton\n          {...props}\n          sx={merge(\n            {\n              color: 'var(--color-primary)',\n\n              ':focus': {\n                outline: '2px dashed var(--color-text)',\n                outlineOffset: '-8px'\n              },\n\n              ':disabled': {\n                color: 'var(--color-disabled)'\n              }\n            },\n            props.sx\n          )}\n        />\n      }\n      label={label}\n      sx={{ [`.${typographyClasses.root}`]: FontNormalSxProps }}\n    />\n  );\n}\n"],"names":["AoaRadioButton","label","props","jsx","MUIFormControlLabel","MUIRadioButton","merge","color","outline","outlineOffset","sx","typographyClasses","root","FontNormalSxProps"],"mappings":";;;;AA6BO,SAASA,EAAe;AAAA,EAAEC,OAAAA;AAAAA,EAAO,GAAGC;AAA2B,GAAG;AACvE,SACE,gBAAAC,EAACC,KACC,SACE,gBAAAD,EAACE,KACC,GAAIH,GACJ,IAAII,QACF;AAAA,IACEC,OAAO;AAAA,IAEP,UAAU;AAAA,MACRC,SAAS;AAAA,MACTC,eAAe;AAAA,IAAA;AAAA,IAGjB,aAAa;AAAA,MACXF,OAAO;AAAA,IAAA;AAAA,EACT,GAEFL,EAAMQ,EACR,EAAA,CAAE,GAGN,OAAAT,GACA,IAAI;AAAA,IAAE,CAAC,IAAIU,EAAkBC,IAAI,EAAE,GAAGC;AAAAA,EAAAA,GAAoB;AAGhE;"}

package/dist/components-generic/atoms/selection-buttons/switch-button/SwitchButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchButton.d.ts","sourceRoot":"","sources":["../../../../../src/components-generic/atoms/selection-buttons/switch-button/SwitchButton.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,WAAW,IAAI,oBAAoB,EAEzC,MAAM,eAAe,CAAC;AAGvB,MAAM,WAAW,oBAAqB,SAAQ,oBAAoB;IAChE;;OAEG;IACH,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;IAC1B;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;;;GAQG;AAEH,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,2CA+BxE"}

package/dist/components-generic/atoms/selection-buttons/switch-button/SwitchButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwitchButton.js","sources":["../../../../../src/components-generic/atoms/selection-buttons/switch-button/SwitchButton.tsx"],"sourcesContent":["import {\n  FormControlLabel as MUIFormControlLabel,\n  Switch as MUISwitchButton,\n  typographyClasses,\n  type SwitchProps as MUISwitchButtonProps,\n  switchClasses\n} from '@mui/material';\nimport { FontNormalSxProps } from '../../../../_constants';\n\nexport interface AoaSwitchButtonProps extends MUISwitchButtonProps {\n  /**\n   * Whether this switch button is checked\n   */\n  readonly checked: boolean;\n  /**\n   * Data-qa tag for E2E test purposes\n   */\n  readonly 'data-qa'?: string;\n  /**\n   * The label that is shown after the switch button\n   */\n  readonly label: string;\n}\n\n/**\n * Constructs a switch button using pre-defined Rijks styling\n *\n * @param props - Props to pass to the switch button\n * @example\n * ```jsx\n * <AoaSwitchButton label=\"Demo switch button\"  checked={true} onChange={handleChange} />} />\n * ```\n */\n\nexport function AoaSwitchButton({ label, ...props }: AoaSwitchButtonProps) {\n  return (\n    <MUIFormControlLabel\n      control={<MUISwitchButton {...props} />}\n      label={label}\n      sx={{\n        [`.${typographyClasses.root}`]: FontNormalSxProps,\n        [`.${switchClasses.root}`]: {\n          color: 'var(--color-primary)',\n          width: '64px',\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          [`.${switchClasses.track}`]: {\n            height: '22px',\n            marginTop: '-4px',\n            marginLeft: '-3px',\n            borderRadius: '11px'\n          }\n        }\n      }}\n    />\n  );\n}\n"],"names":["AoaSwitchButton","label","props","jsx","MUIFormControlLabel","MUISwitchButton","typographyClasses","root","FontNormalSxProps","switchClasses","color","width","outline","outlineOffset","borderRadius","track","height","marginTop","marginLeft"],"mappings":";;;AAkCO,SAASA,EAAgB;AAAA,EAAEC,OAAAA;AAAAA,EAAO,GAAGC;AAA4B,GAAG;AACzE,SACE,gBAAAC,EAACC,KACC,SAAS,gBAAAD,EAACE,KAAgB,GAAIH,EAAAA,CAAM,GACpC,OAAAD,GACA,IAAI;AAAA,IACF,CAAC,IAAIK,EAAkBC,IAAI,EAAE,GAAGC;AAAAA,IAChC,CAAC,IAAIC,EAAcF,IAAI,EAAE,GAAG;AAAA,MAC1BG,OAAO;AAAA,MACPC,OAAO;AAAA,MAEP,UAAU;AAAA,QACRC,SAAS;AAAA,QACTC,eAAe;AAAA,QACfC,cAAc;AAAA,MAAA;AAAA,MAGhB,aAAa;AAAA,QACXJ,OAAO;AAAA,MAAA;AAAA,MAGT,CAAC,IAAID,EAAcM,KAAK,EAAE,GAAG;AAAA,QAC3BC,QAAQ;AAAA,QACRC,WAAW;AAAA,QACXC,YAAY;AAAA,QACZJ,cAAc;AAAA,MAAA;AAAA,IAChB;AAAA,EACF,GACA;AAGR;"}

package/dist/components-generic/atoms/table/Table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../src/components-generic/atoms/table/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA0C,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AACrF,OAAO,EAIL,KAAK,aAAa,EAClB,KAAK,UAAU,EACf,KAAK,iBAAiB,EAEtB,KAAK,cAAc,EACnB,KAAK,mBAAmB,EACxB,KAAK,YAAY,EACjB,KAAK,iBAAiB,EAGvB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAgC,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAI/D,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,iBAAiB,GAAG,iBAAiB;IAC3E;;;OAGG;IACH,QAAQ,CAAC,EAAE;QACT,WAAW,CAAC,EAAE,OAAO,CAAC;QACtB,UAAU,CAAC,EAAE,MAAM,CAAC;KACrB,CAAC;IACF;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;OAEG;IACH,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;CACzB;AAED,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,MAAM,GAAG,GAAG,IAAI,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;AAEtE,MAAM,MAAM,oBAAoB,GAAG,mBAAmB,GAAG,IAAI,CAAC,iBAAiB,EAAE,KAAK,GAAG,iBAAiB,GAAG,OAAO,CAAC,CAAC;AAEtH,KAAK,SAAS;AACZ;;GAEG;AACD;IAAE,OAAO,CAAC,EAAE,KAAK,CAAC;IAAC,IAAI,EAAE,QAAQ,CAAA;CAAE;AACrC;;GAEG;GACD;IAAE,OAAO,CAAC,YAAY,EAAE,oBAAoB,GAAG,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;IAAC,IAAI,CAAC,EAAE,QAAQ,CAAA;CAAE,CAAC;AAE3F,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,GAAG,IAAI,SAAS,GAAG;IAC9D;;OAEG;IACH,QAAQ,CAAC,aAAa,CAAC,EAAE,GAAG,CAAC,OAAO,EAAE,CAAC;IACvC;;OAEG;IACH,QAAQ,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,CAAC;IAC/B;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,wBAAwB,CAAC,EAAE,IAAI,CACtC,aAAa,CAAC,CAAC,CAAC,EACd,QAAQ,GACR,mBAAmB,GACnB,qBAAqB,GACrB,4BAA4B,GAC5B,UAAU,GACV,kBAAkB,GAClB,iBAAiB,GACjB,SAAS,GACT,2BAA2B,GAC3B,mBAAmB,CACtB,CAAC;IACF;;OAEG;IACH,QAAQ,CAAC,mBAAmB,CAAC,EAAE,mBAAmB,GAAG,IAAI,CAAC,iBAAiB,EAAE,KAAK,GAAG,iBAAiB,GAAG,OAAO,CAAC,CAAC;IAClH;;OAEG;IACH,QAAQ,CAAC,UAAU,CAAC,EAAE,cAAc,GAAG;QAAE,YAAY,EAAE,MAAM,CAAA;KAAE,CAAC;IAChE;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF;;;;;;;;;;;;GAYG;AAEH,wBAAgB,QAAQ,CAAC,CAAC,SAAS,MAAM,GAAG,GAAG,EAAE,EAAE,GAAG,KAAK,EAAE,EAAE,aAAa,CAAC,CAAC,CAAC,2CAgP9E"}

package/dist/{components → components-generic}/atoms/table/Table.js

@@ -57,12 +57,12 @@ function z({
     noResultsOverlayLabel: "Geen regels gevonden.",
     paginationItemAriaLabel: (o) => {
       switch (o) {
-        /* v8 ignore next */
+        /* v8 ignore start */
         case "first":
           return "Ga naar eerste pagina";
-        /* v8 ignore next */
         case "last":
           return "Ga naar laatste pagina";
+        /* v8 ignore stop */
         case "next":
           return "Ga naar volgende pagina";
         case "previous":

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

@@ -0,0 +1 @@
+{"version":3,"file":"Table.js","sources":["../../../../src/components-generic/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    | 'apiRef'\n    | 'checkboxSelection'\n    | 'disableColumnFilter'\n    | 'disableRowSelectionOnClick'\n    | 'getRowId'\n    | 'ignoreDiacritics'\n    | 'isRowSelectable'\n    | 'loading'\n    | 'onRowSelectionModelChange'\n    | 'rowSelectionModel'\n  >;\n  /**\n   * Sets the initial query options to retain query details after opening a page and returning to the table\n   */\n  readonly initialQueryOptions?: GridPaginationModel & Omit<GridGetRowsParams, 'end' | 'paginationModel' | 'start'>;\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: props.initialQueryOptions?.page ?? 0,\n    pageSize: props.initialQueryOptions?.pageSize ?? 10\n  });\n  const [sortModel, setSortModel] = useState<GridSortModel>(props.initialQueryOptions?.sortModel ?? []);\n  const [filterModel, setFilterModel] = useState<GridFilterModel>(\n    props.initialQueryOptions?.filterModel ?? {\n      items: [],\n      logicOperator: GridLogicOperator.And,\n      quickFilterLogicOperator: GridLogicOperator.And,\n      quickFilterValues: []\n    }\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        rowCount: 0\n      },\n      sorting: {\n        sortModel\n      },\n      filter: {\n        filterModel\n      }\n    }),\n    [paginationModel, sortModel, filterModel]\n  );\n\n  const mergedLocaleText = merge<Partial<GridLocaleText & { refreshTable: string }>, (GridLocaleText & { refreshTable: string }) | undefined>(\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 start */\n          case 'first':\n            return 'Ga naar eerste pagina';\n          case 'last':\n            return 'Ga naar laatste pagina';\n          /* v8 ignore stop */\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","initialQueryOptions","pageSize","sortModel","setSortModel","filterModel","setFilterModel","items","logicOperator","GridLogicOperator","And","quickFilterLogicOperator","quickFilterValues","filterButtonEl","setFilterButtonEl","rowCountState","setRowCountState","data","rowCount","mode","isServerMode","getData","fetchData","useEffect","prevRowCountState","initialState","useMemo","pagination","sorting","filter","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":";;;;;;;AAoHO,SAASA,EAAiC;AAAA,EAAE,GAAGC;AAAwB,GAAG;AAC/E,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAiBC,CAAkB,IAAIF,EAA8B;AAAA,IAC1EG,MAAMN,EAAMO,qBAAqBD,QAAQ;AAAA,IACzCE,UAAUR,EAAMO,qBAAqBC,YAAY;AAAA,EAAA,CAClD,GACK,CAACC,GAAWC,CAAY,IAAIP,EAAwBH,EAAMO,qBAAqBE,aAAa,EAAE,GAC9F,CAACE,GAAaC,CAAc,IAAIT,EACpCH,EAAMO,qBAAqBI,eAAe;AAAA,IACxCE,OAAO,CAAA;AAAA,IACPC,eAAeC,EAAkBC;AAAAA,IACjCC,0BAA0BF,EAAkBC;AAAAA,IAC5CE,mBAAmB,CAAA;AAAA,EAAA,CAEvB,GACM,CAACC,GAAgBC,CAAiB,IAAIjB,EAAmC,IAAI,GAE7E,CAACkB,GAAeC,CAAgB,IAAInB,EAASH,EAAMuB,MAAMC,YAAY,CAAC,GAEtEC,IAAOzB,EAAMyB,QAAQ,UACrBC,IAAeD,MAAS;AAE9B,iBAAeE,EAAQvB,GAAsCK,GAA0BE,GAA8B;AACnH,QAAIe,KAAgB1B,EAAM2B,SAAS;AACjC,YAAMC,IAAY,YAAY;AAC5B,cAAM5B,EAAM2B,QAAQ;AAAA,UAAE,GAAGvB;AAAAA,UAAiBK,WAAAA;AAAAA,UAAWE,aAAAA;AAAAA,QAAAA,CAAa;AAAA,MACpE;AAEAT,MAAAA,EAAa,EAAI,GACjB,MAAM0B,EAAAA,GACN1B,EAAa,EAAK;AAAA,IACpB;AAAA,EACF;AAEA2B,EAAAA,EAAU,MAAM;AACdP,IAAAA,EAAkBQ,CAAAA,MAAsB9B,EAAMuB,MAAMC,YAAYM,CAAiB;AAAA,EACnF,GAAG,CAAC9B,EAAMuB,MAAMC,UAAUF,CAAgB,CAAC,GAE3CO,EAAU,MAAM;AACd,IAAKF,EAAQvB,GAAiBK,GAAWE,CAAW;AAAA,EAKtD,GAAG,CAACP,GAAiBK,GAAWE,CAAW,CAAC;AAE5C,QAAMoB,IAAiCC,EACrC,OAAO;AAAA,IACLC,YAAY;AAAA,MACV7B,iBAAAA;AAAAA,MACAoB,UAAU;AAAA,IAAA;AAAA,IAEZU,SAAS;AAAA,MACPzB,WAAAA;AAAAA,IAAAA;AAAAA,IAEF0B,QAAQ;AAAA,MACNxB,aAAAA;AAAAA,IAAAA;AAAAA,EACF,IAEF,CAACP,GAAiBK,GAAWE,CAAW,CAC1C,GAEMyB,IAAmBC,EAAAA,MACvB;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;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA;AAAA,QAET,KAAK;AACH,iBAAO;AAAA,QACT,KAAK;AACH,iBAAO;AAAA,MAAA;AAAA,IAEb;AAAA,IACAC,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,YAAYjC,GACZ,cAAc,MAAM,QACpB,kBAAgB,IAChB,cAAAM,GACA,SAAS9B,GACT,YAAYmC,GACZ,qBAAsBzB,CAAAA,MAAgBC,EAAeD,CAAW,GAChE,yBAAyBN,GACzB,mBAAoBI,CAAAA,MAAcC,EAAaD,CAAS,GACxD,iBAAiB,CAAC,GAAG,IAAI,IAAI,IAAI,EAAE,GACnC,gBAAgBgB,GAChB,iBAAArB,GACA,UAAUsB,IAAeL,IAAgBsC,QACzC,MAAM3D,EAAMuB,MAAMqC,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,QAAQnD;AAAAA,IAAAA;AAAAA,IAEVoD,SAAS;AAAA,MACPnD,mBAAAA;AAAAA,MACAoD,iBAAiBxE,EAAMyE,0BAA0BC,wBAAwB;AAAA,MACzEC,kBAAkB;AAAA,QAAEC,YAAY;AAAA,MAAA;AAAA,MAChCnD,MAAAA;AAAAA,MACAE,SAAS,YAAYA,EAAQvB,GAAiBK,GAAWE,CAAW;AAAA,MACpEkE,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,aAAatD,GACb,IAAIY,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-generic/atoms/table/_QuickSearchToolbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"_QuickSearchToolbar.d.ts","sourceRoot":"","sources":["../../../../src/components-generic/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,EAAE,IAAI,EAAE,aAAa,EAAE,UAAU,EAAE,eAAe,EAAE,OAAO,EAAE,iBAAiB,EAAE,EAAE,gBAAgB,GAAG,qBAAqB,2CA+I5J"}

package/dist/{components → components-generic}/atoms/table/_QuickSearchToolbar.js

@@ -3533,7 +3533,7 @@ function _i({
       n && /* @__PURE__ */ K(jr, { title: "Filteren", children: /* @__PURE__ */ K(Nr, { ref: i, render: ({
         ref: f,
         ...d
-      }, p) => /* @__PURE__ */ K(ot, { ...d, material: {
+      }, p) => /* @__PURE__ */ K(ot, { ...d, "aria-label": "Filteren", material: {
         sx: {
           color: "var(--color-primary)",
           border: "1px solid var(--color-primary)",
@@ -3557,50 +3557,40 @@ function _i({
       /* @__PURE__ */ K(Br, { render: ({
         ref: f,
         ...d
-      }) => /* @__PURE__ */ K(
-        _r,
-        {
-          ...d,
-          "aria-label": r?.toolbarQuickFilterLabel ?? "Zoeken",
-          inputRef: f,
-          placeholder: r?.toolbarQuickFilterPlaceholder ?? "Zoeken...",
-          slotProps: {
-            input: {
-              endAdornment: /* @__PURE__ */ K(Rr, { position: "end", children: /* @__PURE__ */ K(vi, { sx: {
-                position: "absolute",
-                right: "-1px",
-                width: "24px",
-                height: "24px",
-                padding: "12px",
-                background: "#007bc7",
-                color: "#ffffff",
-                fontWeight: "700",
-                overflow: "hidden",
-                whiteSpace: "nowrap",
-                boxSizing: "content-box"
-              } }) }),
-              ...d.slotProps?.input
-            },
-            ...d.slotProps
-          },
-          sx: {
-            [`.${kr.input}`]: {
-              color: "var(--color-text)",
-              fontFamily: "RijksoverheidSansText, Verdana, Arial, sans-serif",
-              fontSize: "1.125rem",
-              boxSizing: "border-box",
-              flex: "1 1",
-              height: "42px",
-              margin: "0",
-              padding: "0 85px 0 14px",
-              background: "var(--color-text-light)",
-              boxShadow: "inset 1px 1px 3px hsl(0deg 0% 41% / 10%)",
-              lineHeight: "1.5",
-              maxWidth: "100%"
-            }
-          }
+      }) => /* @__PURE__ */ K(_r, { ...d, "aria-label": r?.toolbarQuickFilterLabel ?? "Zoeken", inputRef: f, placeholder: r?.toolbarQuickFilterPlaceholder ?? "Zoeken...", slotProps: {
+        input: {
+          endAdornment: /* @__PURE__ */ K(Rr, { position: "end", children: /* @__PURE__ */ K(vi, { sx: {
+            position: "absolute",
+            right: "-1px",
+            width: "24px",
+            height: "24px",
+            padding: "12px",
+            background: "#007bc7",
+            color: "#ffffff",
+            fontWeight: "700",
+            overflow: "hidden",
+            whiteSpace: "nowrap",
+            boxSizing: "content-box"
+          } }) }),
+          ...d.slotProps?.input
+        },
+        ...d.slotProps
+      }, sx: {
+        [`.${kr.input}`]: {
+          color: "var(--color-text)",
+          fontFamily: "RijksoverheidSansText, Verdana, Arial, sans-serif",
+          fontSize: "1.125rem",
+          boxSizing: "border-box",
+          flex: "1 1",
+          height: "42px",
+          margin: "0",
+          padding: "0 85px 0 14px",
+          background: "var(--color-text-light)",
+          boxShadow: "inset 1px 1px 3px hsl(0deg 0% 41% / 10%)",
+          lineHeight: "1.5",
+          maxWidth: "100%"
         }
-      ) }),
+      } }) }),
       l.expanded && l.value !== "" && /* @__PURE__ */ K(
         Dr,
         {