@rws-aoa/react-library 3.6.6 → 5.0.0

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.
Files changed (71) hide show
  1. package/dist/chunks/FieldError.DAUtZvvC.js +143 -0
  2. package/dist/chunks/FieldError.DAUtZvvC.js.map +1 -0
  3. package/dist/chunks/lodash.DOeeRDpT.js +3678 -0
  4. package/dist/chunks/lodash.DOeeRDpT.js.map +1 -0
  5. package/dist/components/atoms/_menu/menu-item/MenuItem.d.ts.map +1 -1
  6. package/dist/components/atoms/_menu/menu-item/MenuItem.js +39 -39
  7. package/dist/components/atoms/_menu/menu-item/MenuItem.js.map +1 -1
  8. package/dist/components/atoms/_menu/user-menu/UserMenu.js +20 -20
  9. package/dist/components/atoms/_menu/user-menu/UserMenu.js.map +1 -1
  10. package/dist/components/atoms/button/Button.d.ts.map +1 -1
  11. package/dist/components/atoms/button/Button.js +33 -33
  12. package/dist/components/atoms/button/Button.js.map +1 -1
  13. package/dist/components/atoms/icon-button/IconButton.js +4 -4
  14. package/dist/components/atoms/icon-button/IconButton.js.map +1 -1
  15. package/dist/components/atoms/input/Input.d.ts.map +1 -1
  16. package/dist/components/atoms/input/Input.js +61 -55
  17. package/dist/components/atoms/input/Input.js.map +1 -1
  18. package/dist/components/atoms/no-permission/NoPermission.d.ts.map +1 -1
  19. package/dist/components/atoms/no-permission/NoPermission.js +10 -10
  20. package/dist/components/atoms/no-permission/NoPermission.js.map +1 -1
  21. package/dist/components/atoms/notification/Notification.d.ts.map +1 -1
  22. package/dist/components/atoms/notification/Notification.js +22 -22
  23. package/dist/components/atoms/notification/Notification.js.map +1 -1
  24. package/dist/components/atoms/section-header/SectionHeader.d.ts.map +1 -1
  25. package/dist/components/atoms/section-header/SectionHeader.js +15 -15
  26. package/dist/components/atoms/section-header/SectionHeader.js.map +1 -1
  27. package/dist/components/atoms/selection-buttons/checkbox/Checkbox.d.ts.map +1 -1
  28. package/dist/components/atoms/selection-buttons/checkbox/Checkbox.js +11 -11
  29. package/dist/components/atoms/selection-buttons/checkbox/Checkbox.js.map +1 -1
  30. package/dist/components/atoms/selection-buttons/radio-button/RadioButton.d.ts.map +1 -1
  31. package/dist/components/atoms/selection-buttons/radio-button/RadioButton.js +10 -10
  32. package/dist/components/atoms/selection-buttons/radio-button/RadioButton.js.map +1 -1
  33. package/dist/components/atoms/selection-buttons/switch-button/SwitchButton.d.ts.map +1 -1
  34. package/dist/components/atoms/selection-buttons/switch-button/SwitchButton.js +10 -10
  35. package/dist/components/atoms/selection-buttons/switch-button/SwitchButton.js.map +1 -1
  36. package/dist/components/atoms/table/Table.d.ts.map +1 -1
  37. package/dist/components/atoms/table/Table.js +60 -62
  38. package/dist/components/atoms/table/Table.js.map +1 -1
  39. package/dist/components/atoms/table/_QuickSearchToolbar.d.ts.map +1 -1
  40. package/dist/components/atoms/table/_QuickSearchToolbar.js +25 -24
  41. package/dist/components/atoms/table/_QuickSearchToolbar.js.map +1 -1
  42. package/dist/components/molecules/field-error/FieldError.d.ts +22 -0
  43. package/dist/components/molecules/field-error/FieldError.d.ts.map +1 -0
  44. package/dist/components/molecules/field-error/FieldError.js +7 -0
  45. package/dist/components/molecules/field-error/FieldError.js.map +1 -0
  46. package/dist/components/molecules/form-error/FormError.d.ts +17 -4
  47. package/dist/components/molecules/form-error/FormError.d.ts.map +1 -1
  48. package/dist/components/molecules/form-error/FormError.js +4 -10
  49. package/dist/components/molecules/form-error/FormError.js.map +1 -1
  50. package/dist/components/molecules/form-modal/FormModal.d.ts +31 -34
  51. package/dist/components/molecules/form-modal/FormModal.d.ts.map +1 -1
  52. package/dist/components/molecules/form-modal/FormModal.js +7 -75
  53. package/dist/components/molecules/form-modal/FormModal.js.map +1 -1
  54. package/dist/components/molecules/modal/Modal.js +12 -12
  55. package/dist/components/molecules/modal/Modal.js.map +1 -1
  56. package/dist/components/molecules/navigation-bar/NavigationBar.js +21 -21
  57. package/dist/components/molecules/navigation-bar/NavigationBar.js.map +1 -1
  58. package/dist/components/molecules/upload-button/UploadButton.d.ts.map +1 -1
  59. package/dist/components/molecules/upload-button/UploadButton.js +26 -24
  60. package/dist/components/molecules/upload-button/UploadButton.js.map +1 -1
  61. package/dist/contexts/TanstackFormContext.d.ts +29 -0
  62. package/dist/contexts/TanstackFormContext.d.ts.map +1 -0
  63. package/dist/contexts/TanstackFormContext.js +11 -0
  64. package/dist/contexts/TanstackFormContext.js.map +1 -0
  65. package/dist/index.d.ts +2 -0
  66. package/dist/index.d.ts.map +1 -1
  67. package/dist/index.js +40 -34
  68. package/dist/index.js.map +1 -1
  69. package/package.json +48 -39
  70. package/dist/chunks/index.DJYQ_-zP.js +0 -489
  71. package/dist/chunks/index.DJYQ_-zP.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/table/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AAC7C,OAAO,EAEL,KAAK,aAAa,EAClB,KAAK,UAAU,EACf,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,aAAa,EACnB,MAAM,kBAAkB,CAAC;AAM1B,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,MAAM,GAAG,GAAG;IAClD;;OAEG;IACH,KAAK,EAAE,CAAC,EAAE,CAAC;IACX;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,MAAM,GAAG,GAAG,IAAI,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;AAEtE,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,WAAW,EAAE,eAAe,CAAC;IAC7B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,SAAS,EAAE,aAAa,CAAC;CAC1B;AAED,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,KAAK,CAAA;CAAE,CAAC;AAExF,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,mBAAmB,GACnB,UAAU,GACV,kBAAkB,GAClB,iBAAiB,GACjB,SAAS,GACT,2BAA2B,GAC3B,mBAAmB,CACtB,CAAC;IACF;;OAEG;IACH,QAAQ,CAAC,WAAW,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,KAAK,GAAG,MAAM,CAAA;KAAE,CAAC;IAC/D;;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;AAOF;;;;;;;;;;;;GAYG;AAEH,iBAAS,kBAAkB,CAAC,CAAC,SAAS,MAAM,GAAG,GAAG,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,2CAmM1E;AAED,eAAO,MAAM,QAAQ,EAA+B,OAAO,kBAAkB,CAAC"}
1
+ {"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/table/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA0C,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AACrF,OAAO,EAGL,KAAK,aAAa,EAClB,KAAK,UAAU,EACf,KAAK,eAAe,EACpB,KAAK,cAAc,EACnB,KAAK,aAAa,EACnB,MAAM,kBAAkB,CAAC;AAM1B,MAAM,WAAW,YAAY,CAAC,CAAC,SAAS,MAAM,GAAG,GAAG;IAClD;;OAEG;IACH,KAAK,EAAE,CAAC,EAAE,CAAC;IACX;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,MAAM,eAAe,CAAC,CAAC,SAAS,MAAM,GAAG,GAAG,IAAI,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC;AAEtE,MAAM,WAAW,oBAAoB;IACnC;;OAEG;IACH,WAAW,EAAE,eAAe,CAAC;IAC7B;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,SAAS,EAAE,aAAa,CAAC;CAC1B;AAED,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,KAAK,CAAA;CAAE,CAAC;AAExF,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,mBAAmB,GACnB,UAAU,GACV,kBAAkB,GAClB,iBAAiB,GACjB,SAAS,GACT,2BAA2B,GAC3B,mBAAmB,CACtB,CAAC;IACF;;OAEG;IACH,QAAQ,CAAC,WAAW,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE,KAAK,GAAG,MAAM,CAAA;KAAE,CAAC;IAC/D;;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;AAOF;;;;;;;;;;;;GAYG;AAEH,iBAAS,kBAAkB,CAAC,CAAC,SAAS,MAAM,GAAG,GAAG,EAAE,KAAK,EAAE,aAAa,CAAC,CAAC,CAAC,2CAiM1E;AAED,eAAO,MAAM,QAAQ,EAA+B,OAAO,kBAAkB,CAAC"}
@@ -1,41 +1,39 @@
1
- import { jsx as w } from "react/jsx-runtime";
2
- import "@mui/material";
3
- import { DataGrid as R } from "@mui/x-data-grid";
4
- import { m as P } from "../../../chunks/index.DJYQ_-zP.js";
5
- import { memo as F, useState as i, useCallback as k, useEffect as v } from "react";
6
- import { FontNormalSxProps as I } from "../../../_constants.js";
7
- import { QuickSearchToolbar as T } from "./_QuickSearchToolbar.js";
8
- function j(e) {
9
- var b, m, M;
10
- const [h, c] = i(!1), [l, D] = i({
1
+ import { jsx as F } from "react/jsx-runtime";
2
+ import { checkboxClasses as h, paginationItemClasses as P } from "@mui/material";
3
+ import { DataGrid as p, gridClasses as o } from "@mui/x-data-grid";
4
+ import { l as T } from "../../../chunks/lodash.DOeeRDpT.js";
5
+ import { memo as j, useState as l, useCallback as f, useEffect as x } from "react";
6
+ import { FontNormalSxProps as H } from "../../../_constants.js";
7
+ import { QuickSearchToolbar as I } from "./_QuickSearchToolbar.js";
8
+ function L(e) {
9
+ var m, k, v;
10
+ const [C, u] = l(!1), [i, S] = l({
11
11
  page: 0,
12
12
  pageSize: 10
13
- }), [n, f] = i([]), [d, x] = i({
13
+ }), [n, M] = l([]), [s, y] = l({
14
14
  items: []
15
- }), r = e.mode ?? "server", s = r === "server", S = k((o) => {
16
- f(o);
17
- }, []), C = k((o) => {
18
- x(o);
19
- }, []), [y, u] = i(((b = e.data) == null ? void 0 : b.totalItems) || 0);
20
- async function g(o, t, a) {
21
- if (s && e.getData) {
22
- const G = async () => {
23
- await e.getData({ ...o, sortModel: t, filterModel: a });
15
+ }), r = e.mode ?? "server", c = r === "server", $ = f((t) => {
16
+ M(t);
17
+ }, []), w = f((t) => {
18
+ y(t);
19
+ }, []), [R, g] = l(((m = e.data) == null ? void 0 : m.totalItems) || 0);
20
+ async function b(t, a, d) {
21
+ if (c && e.getData) {
22
+ const D = async () => {
23
+ await e.getData({ ...t, sortModel: a, filterModel: d });
24
24
  };
25
- c(!0), await G(), c(!1);
25
+ u(!0), await D(), u(!1);
26
26
  }
27
27
  }
28
- return v(() => {
29
- u(
30
- (o) => {
31
- var t, a;
32
- return ((t = e.data) == null ? void 0 : t.totalItems) === void 0 ? o : (a = e.data) == null ? void 0 : a.totalItems;
33
- }
34
- );
35
- }, [(m = e.data) == null ? void 0 : m.totalItems, u]), v(() => {
36
- g(l, n, d);
37
- }, [l, n, d]), /* @__PURE__ */ w(
38
- R,
28
+ return x(() => {
29
+ g((t) => {
30
+ var a;
31
+ return ((a = e.data) == null ? void 0 : a.totalItems) ?? t;
32
+ });
33
+ }, [(k = e.data) == null ? void 0 : k.totalItems, g]), x(() => {
34
+ b(i, n, s);
35
+ }, [i, n, s]), /* @__PURE__ */ F(
36
+ p,
39
37
  {
40
38
  columns: e.columns,
41
39
  "data-qa": e["data-qa"],
@@ -52,7 +50,7 @@ function j(e) {
52
50
  sortModel: e.initialSort ? [e.initialSort] : []
53
51
  }
54
52
  },
55
- loading: h,
53
+ loading: C,
56
54
  localeText: e.localeText ?? {
57
55
  columnHeaderSortIconLabel: "Sorteren",
58
56
  toolbarQuickFilterPlaceholder: "Zoeken...",
@@ -61,52 +59,52 @@ function j(e) {
61
59
  noRowsLabel: "Geen regels beschikbaar",
62
60
  noResultsOverlayLabel: "Geen regels gevonden.",
63
61
  MuiTablePagination: {
64
- labelDisplayedRows: ({ from: o, to: t, count: a }) => `${o} - ${t} van ${a}`,
62
+ labelDisplayedRows: ({ from: t, to: a, count: d }) => `${t} - ${a} van ${d}`,
65
63
  labelRowsPerPage: "Regels per pagina"
66
64
  },
67
- footerRowSelected: (o) => `${o} regels geselecteerd`
65
+ footerRowSelected: (t) => `${t} regels geselecteerd`
68
66
  },
69
- onFilterModelChange: C,
70
- onPaginationModelChange: D,
71
- onSortModelChange: S,
67
+ onFilterModelChange: w,
68
+ onPaginationModelChange: S,
69
+ onSortModelChange: $,
72
70
  pageSizeOptions: [5, 10, 20, 40, 80],
73
71
  paginationMode: r,
74
- paginationModel: l,
75
- rowCount: s ? y : void 0,
76
- rows: (M = e.data) == null ? void 0 : M.items,
72
+ paginationModel: i,
73
+ rowCount: c ? R : void 0,
74
+ rows: (v = e.data) == null ? void 0 : v.items,
77
75
  slotProps: {
78
76
  toolbar: {
79
77
  showQuickFilter: !0,
80
78
  quickFilterProps: { debounceMs: 500 },
81
79
  mode: r,
82
- isServerMode: s,
83
- getData: async () => g(l, n, d),
80
+ isServerMode: c,
81
+ getData: async () => b(i, n, s),
84
82
  actionButtons: e.actionButtons,
85
83
  localeText: e.localeText
86
84
  }
87
85
  },
88
86
  slots: {
89
- toolbar: T
87
+ toolbar: I
90
88
  },
91
89
  sortingMode: r,
92
- sx: P(
90
+ sx: T.merge(
93
91
  {
94
92
  border: 0,
95
93
  color: "var(--color-text)",
96
94
  letterSpacing: "normal",
97
95
  minHeight: "300px",
98
- "&.MuiDataGrid-root--densityCompact": {
99
- ".MuiDataGrid-cell": {
96
+ [`&.${o["root--densityCompact"]}`]: {
97
+ [`.${o.cell}`]: {
100
98
  py: "8px"
101
99
  }
102
100
  },
103
- "&.MuiDataGrid-root--densityStandard": {
104
- ".MuiDataGrid-cell": {
101
+ [`&.${o["root--densityStandard"]}`]: {
102
+ [`.${o.cell}`]: {
105
103
  py: "15px"
106
104
  }
107
105
  },
108
- "&.MuiDataGrid-root--densityComfortable": {
109
- ".MuiDataGrid-cell": {
106
+ [`&.${o["root--densityComfortable"]}`]: {
107
+ [`.${o.cell}`]: {
110
108
  py: "22px"
111
109
  }
112
110
  },
@@ -115,17 +113,17 @@ function j(e) {
115
113
  * Because a fixed height is not desirable, we set a min-height on the DataGrid and set
116
114
  * the min-height of the virtualScroller to half of that height.
117
115
  */
118
- ".MuiDataGrid-virtualScroller": {
116
+ [`.${o.virtualScroller}`]: {
119
117
  minHeight: "150px",
120
118
  overflow: "hidden",
121
119
  position: "relative"
122
120
  },
123
- ".MuiDataGrid-columnHeaders": {
121
+ [`.${o.columnHeaders}`]: {
124
122
  "--DataGrid-containerBackground": "var(--color-rijks-skyblue)",
125
123
  backgroundCcolor: "var(--color-rijks-skyblue)",
126
124
  color: "var(--color-text-light)"
127
125
  },
128
- ".MuiDataGrid-row": {
126
+ [`.${o.row}`]: {
129
127
  ":hover": {
130
128
  backgroundColor: "var(--color-rijks-skyblue-light)"
131
129
  },
@@ -136,16 +134,16 @@ function j(e) {
136
134
  }
137
135
  }
138
136
  },
139
- ".MuiDataGrid-columnHeader, .MuiDataGrid-cell, .MuiDataGrid-columnsContainer, .MuiDataGrid-cell": {
137
+ [`.${o.columnHeader}, .${o.cell}, .MuiDataGrid-columnsContainer`]: {
140
138
  borderRight: "1px solid var(--color-rijks-grey-2)"
141
139
  },
142
- ".MuiDataGrid-cell": {
140
+ [`.${o.cell}`]: {
143
141
  color: "var(--color-text)"
144
142
  },
145
- ".MuiPaginationItem-root": {
143
+ [`.${P.root}`]: {
146
144
  borderRadius: 0
147
145
  },
148
- ".MuiCheckbox-root": {
146
+ [`.${h.root}`]: {
149
147
  color: "var(--color-primary)",
150
148
  ":focus": {
151
149
  outline: "2px dashed var(--color-text)",
@@ -156,19 +154,19 @@ function j(e) {
156
154
  color: "var(--color-disabled)"
157
155
  }
158
156
  },
159
- ".MuiDataGrid-columnHeader .MuiCheckbox-root": {
157
+ [`.${o.columnHeader} .${h.root}`]: {
160
158
  color: "white"
161
159
  }
162
160
  },
163
161
  e.sx,
164
- I
162
+ H
165
163
  ),
166
164
  ...e.dataGridOverridableProps
167
165
  }
168
166
  );
169
167
  }
170
- const q = F(j);
168
+ const E = j(L);
171
169
  export {
172
- q as AoaTable
170
+ E as AoaTable
173
171
  };
174
172
  //# sourceMappingURL=Table.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Table.js","sources":["../../../../src/components/atoms/table/Table.tsx"],"sourcesContent":["import { type SxProps } from '@mui/material';\nimport {\n DataGrid,\n type DataGridProps,\n type GridColDef,\n type GridFilterModel,\n type GridLocaleText,\n type GridSortModel\n} from '@mui/x-data-grid';\nimport merge from 'lodash.merge';\nimport { memo, useCallback, useEffect, useState } from 'react';\nimport { FontNormalSxProps } from '../../../_constants';\nimport { QuickSearchToolbar } from './_QuickSearchToolbar';\n\nexport interface AoaTableData<T extends object = any> {\n /**\n * The paged, filtered and sorted items from the database\n */\n items: T[];\n /**\n * The total number of items present in the database table\n */\n totalItems: number;\n}\n\nexport type AoaTableColumns<T extends object = any> = GridColDef<T>[];\n\nexport interface AoaTableQueryOptions {\n /**\n * Material UI's GridFilterModel\n */\n filterModel: GridFilterModel;\n /**\n * The current page of the table\n */\n page: number;\n /**\n * The maximum number of items that are shown on a page\n */\n pageSize: number;\n /**\n * Material UI's GridSortModel\n */\n sortModel: GridSortModel;\n}\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?: never };\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 | '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\ninterface PaginationModel {\n page: number;\n pageSize: number;\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\nfunction NonMemoizeAoaTable<T extends object = any>(props: AoaTableProps<T>) {\n const [isLoading, setIsLoading] = useState(false);\n const [paginationModel, setPaginationModel] = useState<PaginationModel>({\n page: 0,\n pageSize: 10\n });\n const [sortModel, setSortModel] = useState<GridSortModel>([]);\n const [filterModel, setFilterModel] = useState<GridFilterModel>({\n items: []\n });\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?.totalItems || 0);\n\n async function getData(paginationModel: PaginationModel, 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) =>\n props.data?.totalItems === undefined ? prevRowCountState : props.data?.totalItems\n );\n }, [props.data?.totalItems, 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 return (\n <DataGrid\n columns={props.columns}\n data-qa={props['data-qa']}\n disableColumnFilter\n disableColumnMenu\n disableColumnSelector\n disableDensitySelector\n disableRowSelectionOnClick\n disableVirtualization\n filterMode={mode}\n getRowHeight={() => 'auto'}\n initialState={{\n sorting: {\n sortModel: props.initialSort ? [props.initialSort] : []\n }\n }}\n loading={isLoading}\n localeText={\n props.localeText ?? {\n columnHeaderSortIconLabel: 'Sorteren',\n toolbarQuickFilterPlaceholder: 'Zoeken...',\n toolbarQuickFilterLabel: 'Zoeken',\n toolbarQuickFilterDeleteIconLabel: 'Wissen',\n noRowsLabel: 'Geen regels beschikbaar',\n noResultsOverlayLabel: 'Geen regels gevonden.',\n MuiTablePagination: {\n labelDisplayedRows: ({ from, to, count }) => `${from} - ${to} van ${count}`,\n labelRowsPerPage: 'Regels per pagina'\n },\n footerRowSelected: (count) => `${count} regels geselecteerd`\n }\n }\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?.items}\n slotProps={{\n toolbar: {\n showQuickFilter: true,\n quickFilterProps: { debounceMs: 500 },\n mode,\n isServerMode,\n getData: async () => getData(paginationModel, sortModel, filterModel),\n actionButtons: props.actionButtons,\n localeText: props.localeText\n }\n }}\n slots={{\n toolbar: QuickSearchToolbar\n }}\n sortingMode={mode}\n sx={merge(\n {\n border: 0,\n color: 'var(--color-text)',\n letterSpacing: 'normal',\n minHeight: '300px',\n\n '&.MuiDataGrid-root--densityCompact': {\n '.MuiDataGrid-cell': {\n py: '8px'\n }\n },\n '&.MuiDataGrid-root--densityStandard': {\n '.MuiDataGrid-cell': {\n py: '15px'\n }\n },\n '&.MuiDataGrid-root--densityComfortable': {\n '.MuiDataGrid-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 '.MuiDataGrid-virtualScroller': {\n minHeight: '150px',\n overflow: 'hidden',\n position: 'relative'\n },\n\n '.MuiDataGrid-columnHeaders': {\n '--DataGrid-containerBackground': 'var(--color-rijks-skyblue)',\n backgroundCcolor: 'var(--color-rijks-skyblue)',\n color: 'var(--color-text-light)'\n },\n\n '.MuiDataGrid-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 '.MuiDataGrid-columnHeader, .MuiDataGrid-cell, .MuiDataGrid-columnsContainer, .MuiDataGrid-cell': {\n borderRight: '1px solid var(--color-rijks-grey-2)'\n },\n\n '.MuiDataGrid-cell': {\n color: 'var(--color-text)'\n },\n\n '.MuiPaginationItem-root': {\n borderRadius: 0\n },\n\n '.MuiCheckbox-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 '.MuiDataGrid-columnHeader .MuiCheckbox-root': {\n color: 'white'\n }\n },\n props.sx,\n FontNormalSxProps\n )}\n {...props.dataGridOverridableProps}\n />\n );\n}\n\nexport const AoaTable = memo(NonMemoizeAoaTable) as typeof NonMemoizeAoaTable;\n"],"names":["NonMemoizeAoaTable","props","isLoading","setIsLoading","useState","paginationModel","setPaginationModel","sortModel","setSortModel","filterModel","setFilterModel","mode","isServerMode","handleSortModelChange","useCallback","onFilterChange","rowCountState","setRowCountState","_a","getData","fetchData","useEffect","prevRowCountState","_b","jsx","DataGrid","from","to","count","_c","QuickSearchToolbar","merge","FontNormalSxProps","AoaTable","memo"],"mappings":"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"}
1
+ {"version":3,"file":"Table.js","sources":["../../../../src/components/atoms/table/Table.tsx"],"sourcesContent":["import { checkboxClasses, paginationItemClasses, type SxProps } from '@mui/material';\nimport {\n DataGrid,\n gridClasses,\n type DataGridProps,\n type GridColDef,\n type GridFilterModel,\n type GridLocaleText,\n type GridSortModel\n} from '@mui/x-data-grid';\nimport { merge } from 'lodash';\nimport { memo, useCallback, useEffect, useState } from 'react';\nimport { FontNormalSxProps } from '../../../_constants';\nimport { QuickSearchToolbar } from './_QuickSearchToolbar';\n\nexport interface AoaTableData<T extends object = any> {\n /**\n * The paged, filtered and sorted items from the database\n */\n items: T[];\n /**\n * The total number of items present in the database table\n */\n totalItems: number;\n}\n\nexport type AoaTableColumns<T extends object = any> = GridColDef<T>[];\n\nexport interface AoaTableQueryOptions {\n /**\n * Material UI's GridFilterModel\n */\n filterModel: GridFilterModel;\n /**\n * The current page of the table\n */\n page: number;\n /**\n * The maximum number of items that are shown on a page\n */\n pageSize: number;\n /**\n * Material UI's GridSortModel\n */\n sortModel: GridSortModel;\n}\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?: never };\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 | '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\ninterface PaginationModel {\n page: number;\n pageSize: number;\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\nfunction NonMemoizeAoaTable<T extends object = any>(props: AoaTableProps<T>) {\n const [isLoading, setIsLoading] = useState(false);\n const [paginationModel, setPaginationModel] = useState<PaginationModel>({\n page: 0,\n pageSize: 10\n });\n const [sortModel, setSortModel] = useState<GridSortModel>([]);\n const [filterModel, setFilterModel] = useState<GridFilterModel>({\n items: []\n });\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?.totalItems || 0);\n\n async function getData(paginationModel: PaginationModel, 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?.totalItems ?? prevRowCountState);\n }, [props.data?.totalItems, 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 return (\n <DataGrid\n columns={props.columns}\n data-qa={props['data-qa']}\n disableColumnFilter\n disableColumnMenu\n disableColumnSelector\n disableDensitySelector\n disableRowSelectionOnClick\n disableVirtualization\n filterMode={mode}\n getRowHeight={() => 'auto'}\n initialState={{\n sorting: {\n sortModel: props.initialSort ? [props.initialSort] : []\n }\n }}\n loading={isLoading}\n localeText={\n props.localeText ?? {\n columnHeaderSortIconLabel: 'Sorteren',\n toolbarQuickFilterPlaceholder: 'Zoeken...',\n toolbarQuickFilterLabel: 'Zoeken',\n toolbarQuickFilterDeleteIconLabel: 'Wissen',\n noRowsLabel: 'Geen regels beschikbaar',\n noResultsOverlayLabel: 'Geen regels gevonden.',\n MuiTablePagination: {\n labelDisplayedRows: ({ from, to, count }) => `${from} - ${to} van ${count}`,\n labelRowsPerPage: 'Regels per pagina'\n },\n footerRowSelected: (count) => `${count} regels geselecteerd`\n }\n }\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?.items}\n slotProps={{\n toolbar: {\n showQuickFilter: true,\n quickFilterProps: { debounceMs: 500 },\n mode,\n isServerMode,\n getData: async () => getData(paginationModel, sortModel, filterModel),\n actionButtons: props.actionButtons,\n localeText: props.localeText\n }\n }}\n slots={{\n toolbar: QuickSearchToolbar\n }}\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.columnHeaders}`]: {\n '--DataGrid-containerBackground': 'var(--color-rijks-skyblue)',\n backgroundCcolor: '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\nexport const AoaTable = memo(NonMemoizeAoaTable) as typeof NonMemoizeAoaTable;\n"],"names":["NonMemoizeAoaTable","props","isLoading","setIsLoading","useState","paginationModel","setPaginationModel","sortModel","setSortModel","filterModel","setFilterModel","mode","isServerMode","handleSortModelChange","useCallback","onFilterChange","rowCountState","setRowCountState","_a","getData","fetchData","useEffect","prevRowCountState","_b","jsx","DataGrid","from","to","count","_c","QuickSearchToolbar","merge","gridClasses","paginationItemClasses","checkboxClasses","FontNormalSxProps","AoaTable","memo"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"_QuickSearchToolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/table/_QuickSearchToolbar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC3B,MAAM,kBAAkB,CAAC;AAI1B,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,YAAY,EAAE,OAAO,CAAC;QACtB,UAAU,CAAC,EAAE,cAAc,GAAG;YAC5B,YAAY,EAAE,MAAM,CAAC;SACtB,CAAC;QACF,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAAC;KAC3B;CACF;AAED,eAAO,MAAM,kBAAkB,qHAQ1B,gBAAgB,GAAG,qBAAqB,6CAmG5C,CAAC"}
1
+ {"version":3,"file":"_QuickSearchToolbar.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/table/_QuickSearchToolbar.tsx"],"names":[],"mappings":"AAWA,OAAO,EAEL,KAAK,cAAc,EACnB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC3B,MAAM,kBAAkB,CAAC;AAI1B,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,YAAY,EAAE,OAAO,CAAC;QACtB,UAAU,CAAC,EAAE,cAAc,GAAG;YAC5B,YAAY,EAAE,MAAM,CAAC;SACtB,CAAC;QACF,IAAI,EAAE,QAAQ,GAAG,QAAQ,CAAC;KAC3B;CACF;AAED,eAAO,MAAM,kBAAkB,qHAQ1B,gBAAgB,GAAG,qBAAqB,6CAoG5C,CAAC"}
@@ -1,41 +1,42 @@
1
- import { jsxs as s, jsx as i } from "react/jsx-runtime";
2
- import { Refresh as d } from "@mui/icons-material";
3
- import { Box as x } from "@mui/material";
4
- import { GridToolbarQuickFilter as l } from "@mui/x-data-grid";
5
- import { memo as h } from "react";
6
- import { AoaIconButton as m } from "../icon-button/IconButton.js";
7
- const k = h(
1
+ import { jsxs as d, jsx as e } from "react/jsx-runtime";
2
+ import { Refresh as x } from "@mui/icons-material";
3
+ import { Box as h, formControlClasses as m, textFieldClasses as g, inputClasses as f, buttonBaseClasses as i, touchRippleClasses as b, svgIconClasses as t, inputBaseClasses as c } from "@mui/material";
4
+ import { GridToolbarQuickFilter as u } from "@mui/x-data-grid";
5
+ import { memo as v } from "react";
6
+ import { AoaIconButton as k } from "../icon-button/IconButton.js";
7
+ const R = v(
8
8
  ({
9
- mode: e,
10
- isServerMode: t,
9
+ mode: s,
10
+ isServerMode: a,
11
11
  actionButtons: o,
12
12
  getData: n,
13
13
  localeText: r,
14
14
  quickFilterProps: p
15
- }) => /* @__PURE__ */ s(
16
- x,
15
+ }) => /* @__PURE__ */ d(
16
+ h,
17
17
  {
18
- className: `${e}-mode`,
18
+ className: `${s}-mode`,
19
19
  sx: {
20
20
  display: "flex",
21
21
  alignItems: "center",
22
22
  justifyContent: "flex-end",
23
23
  paddingBottom: "10px",
24
+ /* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */
24
25
  "&.server-mode :nth-child(2)": {
25
26
  marginLeft: "auto"
26
27
  },
27
- ".MuiButtonBase-root": {
28
+ [`.${i.root}`]: {
28
29
  width: "48px",
29
30
  marginRight: "10px"
30
31
  },
31
- ".MuiFormControl-root.MuiTextField-root": {
32
+ [`.${m.root}.${g.root}`]: {
32
33
  paddingBottom: 0,
33
- ".MuiInput-root": {
34
+ [`.${f.root}`]: {
34
35
  position: "relative",
35
36
  ":before, :after": {
36
37
  borderBottom: "transparent"
37
38
  },
38
- ".MuiSvgIcon-root": {
39
+ [`.${t.root}`]: {
39
40
  position: "absolute",
40
41
  right: "-1px",
41
42
  width: "24px",
@@ -48,7 +49,7 @@ const k = h(
48
49
  whiteSpace: "nowrap",
49
50
  boxSizing: "content-box"
50
51
  },
51
- ".MuiInputBase-input": {
52
+ [`.${c.input}`]: {
52
53
  color: "var(--color-text)",
53
54
  fontFamily: "RijksoverheidSansText, Verdana, Arial, sans-serif",
54
55
  fontSize: "1.125rem",
@@ -72,20 +73,20 @@ const k = h(
72
73
  `
73
74
  }
74
75
  },
75
- ".MuiButtonBase-root": {
76
+ [`.${i.root}`]: {
76
77
  position: "absolute",
77
78
  right: "48px",
78
79
  height: "24px",
79
80
  width: "24px",
80
81
  marginRight: "4px",
81
- ".MuiSvgIcon-root": {
82
+ [`.${t.root}`]: {
82
83
  color: "var(--color-primary)",
83
84
  background: "none"
84
85
  },
85
86
  ":hover, :active, :focus": {
86
87
  backgroundColor: "transparent"
87
88
  },
88
- ".MuiTouchRipple-root": {
89
+ [`.${b.root}`]: {
89
90
  display: "none"
90
91
  }
91
92
  }
@@ -93,14 +94,14 @@ const k = h(
93
94
  }
94
95
  },
95
96
  children: [
96
- t && /* @__PURE__ */ i(m, { icon: /* @__PURE__ */ i(d, {}), label: (r == null ? void 0 : r.refreshTable) ?? "Ververs tabel", onClick: n }),
97
- o == null ? void 0 : o.map((a) => a),
98
- /* @__PURE__ */ i(l, { ...p })
97
+ a && /* @__PURE__ */ e(k, { icon: /* @__PURE__ */ e(x, {}), label: (r == null ? void 0 : r.refreshTable) ?? "Ververs tabel", onClick: n }),
98
+ o == null ? void 0 : o.map((l) => l),
99
+ /* @__PURE__ */ e(u, { ...p })
99
100
  ]
100
101
  }
101
102
  )
102
103
  );
103
104
  export {
104
- k as QuickSearchToolbar
105
+ R as QuickSearchToolbar
105
106
  };
106
107
  //# sourceMappingURL=_QuickSearchToolbar.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"_QuickSearchToolbar.js","sources":["../../../../src/components/atoms/table/_QuickSearchToolbar.tsx"],"sourcesContent":["import { Refresh as RefreshIcon } from '@mui/icons-material';\nimport { Box } from '@mui/material';\nimport {\n GridToolbarQuickFilter,\n type GridLocaleText,\n type GridToolbarProps,\n type ToolbarPropsOverrides\n} from '@mui/x-data-grid';\nimport { memo } from 'react';\nimport { AoaIconButton } from '../icon-button/IconButton';\n\ndeclare module '@mui/x-data-grid' {\n export interface ToolbarPropsOverrides {\n actionButtons?: JSX.Element[];\n getData(this: void): void;\n isServerMode: boolean;\n localeText?: GridLocaleText & {\n refreshTable: string;\n };\n mode: 'client' | 'server';\n }\n}\n\nexport const QuickSearchToolbar = memo(\n ({\n mode,\n isServerMode,\n actionButtons,\n getData,\n localeText,\n quickFilterProps\n }: GridToolbarProps & ToolbarPropsOverrides) => (\n <Box\n className={`${mode}-mode`}\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n paddingBottom: '10px',\n\n '&.server-mode :nth-child(2)': {\n marginLeft: 'auto'\n },\n\n '.MuiButtonBase-root': {\n width: '48px',\n marginRight: '10px'\n },\n\n '.MuiFormControl-root.MuiTextField-root': {\n paddingBottom: 0,\n\n '.MuiInput-root': {\n position: 'relative',\n\n ':before, :after': {\n borderBottom: 'transparent'\n },\n\n '.MuiSvgIcon-root': {\n position: 'absolute',\n right: '-1px',\n width: '24px',\n height: '24px',\n padding: '12px',\n background: '#007bc7',\n color: '#ffffff',\n fontWeight: '700',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n boxSizing: 'content-box'\n },\n\n '.MuiInputBase-input': {\n color: 'var(--color-text)',\n fontFamily: 'RijksoverheidSansText, Verdana, Arial, sans-serif',\n fontSize: '1.125rem',\n boxSizing: 'border-box',\n flex: '1 1',\n height: '48px',\n margin: '0',\n padding: '0 85px 0 14px',\n background: 'var(--color-text-light)',\n border: '1px solid var(--color-rijks-grey-3)',\n boxShadow: 'inset 1px 1px 3px hsl(0deg 0% 41% / 10%)',\n lineHeight: '1.5',\n maxWidth: '100%',\n\n ':focus': {\n borderColor: 'var(--color-rijks-skyblue)',\n outline: '0 !important',\n boxShadow: `\n inset 1px 1px 3px hsl(0deg 0% 41% / 10%),\n inset 0 0 0 1px var(--color-rijks-skyblue),\n 0 0 5px rgb(0 115 191 / 50%);\n `\n }\n },\n\n '.MuiButtonBase-root': {\n position: 'absolute',\n right: '48px',\n height: '24px',\n width: '24px',\n marginRight: '4px',\n\n '.MuiSvgIcon-root': {\n color: 'var(--color-primary)',\n background: 'none'\n },\n\n ':hover, :active, :focus': {\n backgroundColor: 'transparent'\n },\n\n '.MuiTouchRipple-root': {\n display: 'none'\n }\n }\n }\n }\n }}\n >\n {isServerMode && (\n <AoaIconButton icon={<RefreshIcon />} label={localeText?.refreshTable ?? 'Ververs tabel'} onClick={getData} />\n )}\n {actionButtons?.map((button: JSX.Element) => button)}\n <GridToolbarQuickFilter {...quickFilterProps} />\n </Box>\n )\n);\n"],"names":["QuickSearchToolbar","memo","mode","isServerMode","actionButtons","getData","localeText","quickFilterProps","jsxs","Box","jsx","AoaIconButton","RefreshIcon","button","GridToolbarQuickFilter"],"mappings":";;;;;;AAuBO,MAAMA,IAAqBC;AAAA,EAChC,CAAC;AAAA,IACC,MAAAC;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,SAAAC;AAAA,IACA,YAAAC;AAAA,IACA,kBAAAC;AAAA,EAAA,MAEA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAW,GAAGP,CAAI;AAAA,MAClB,IAAI;AAAA,QACF,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,eAAe;AAAA,QAEf,+BAA+B;AAAA,UAC7B,YAAY;AAAA,QACd;AAAA,QAEA,uBAAuB;AAAA,UACrB,OAAO;AAAA,UACP,aAAa;AAAA,QACf;AAAA,QAEA,0CAA0C;AAAA,UACxC,eAAe;AAAA,UAEf,kBAAkB;AAAA,YAChB,UAAU;AAAA,YAEV,mBAAmB;AAAA,cACjB,cAAc;AAAA,YAChB;AAAA,YAEA,oBAAoB;AAAA,cAClB,UAAU;AAAA,cACV,OAAO;AAAA,cACP,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,OAAO;AAAA,cACP,YAAY;AAAA,cACZ,UAAU;AAAA,cACV,YAAY;AAAA,cACZ,WAAW;AAAA,YACb;AAAA,YAEA,uBAAuB;AAAA,cACrB,OAAO;AAAA,cACP,YAAY;AAAA,cACZ,UAAU;AAAA,cACV,WAAW;AAAA,cACX,MAAM;AAAA,cACN,QAAQ;AAAA,cACR,QAAQ;AAAA,cACR,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,QAAQ;AAAA,cACR,WAAW;AAAA,cACX,YAAY;AAAA,cACZ,UAAU;AAAA,cAEV,UAAU;AAAA,gBACR,aAAa;AAAA,gBACb,SAAS;AAAA,gBACT,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,cAAA;AAAA,YAMf;AAAA,YAEA,uBAAuB;AAAA,cACrB,UAAU;AAAA,cACV,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,OAAO;AAAA,cACP,aAAa;AAAA,cAEb,oBAAoB;AAAA,gBAClB,OAAO;AAAA,gBACP,YAAY;AAAA,cACd;AAAA,cAEA,2BAA2B;AAAA,gBACzB,iBAAiB;AAAA,cACnB;AAAA,cAEA,wBAAwB;AAAA,gBACtB,SAAS;AAAA,cAAA;AAAA,YACX;AAAA,UACF;AAAA,QACF;AAAA,MAEJ;AAAA,MAEC,UAAA;AAAA,QACCC,KAAA,gBAAAO,EAACC,GAAc,EAAA,MAAO,gBAAAD,EAAAE,GAAA,CAAA,CAAY,GAAI,QAAON,KAAA,gBAAAA,EAAY,iBAAgB,iBAAiB,SAASD,EAAS,CAAA;AAAA,QAE7GD,KAAA,gBAAAA,EAAe,IAAI,CAACS,MAAwBA;AAAA,QAC7C,gBAAAH,EAACI,GAAwB,EAAA,GAAGP,EAAkB,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpD;"}
1
+ {"version":3,"file":"_QuickSearchToolbar.js","sources":["../../../../src/components/atoms/table/_QuickSearchToolbar.tsx"],"sourcesContent":["import { Refresh as RefreshIcon } from '@mui/icons-material';\nimport {\n Box,\n inputBaseClasses,\n inputClasses,\n formControlClasses,\n svgIconClasses,\n touchRippleClasses,\n textFieldClasses,\n buttonBaseClasses\n} from '@mui/material';\nimport {\n GridToolbarQuickFilter,\n type GridLocaleText,\n type GridToolbarProps,\n type ToolbarPropsOverrides\n} from '@mui/x-data-grid';\nimport { memo } from 'react';\nimport { AoaIconButton } from '../icon-button/IconButton';\n\ndeclare module '@mui/x-data-grid' {\n export interface ToolbarPropsOverrides {\n actionButtons?: JSX.Element[];\n getData(this: void): void;\n isServerMode: boolean;\n localeText?: GridLocaleText & {\n refreshTable: string;\n };\n mode: 'client' | 'server';\n }\n}\n\nexport const QuickSearchToolbar = memo(\n ({\n mode,\n isServerMode,\n actionButtons,\n getData,\n localeText,\n quickFilterProps\n }: GridToolbarProps & ToolbarPropsOverrides) => (\n <Box\n className={`${mode}-mode`}\n sx={{\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n paddingBottom: '10px',\n\n /* emotion-disable-server-rendering-unsafe-selector-warning-please-do-not-use-this-the-warning-exists-for-a-reason */\n '&.server-mode :nth-child(2)': {\n marginLeft: 'auto'\n },\n\n [`.${buttonBaseClasses.root}`]: {\n width: '48px',\n marginRight: '10px'\n },\n\n [`.${formControlClasses.root}.${textFieldClasses.root}`]: {\n paddingBottom: 0,\n\n [`.${inputClasses.root}`]: {\n position: 'relative',\n\n ':before, :after': {\n borderBottom: 'transparent'\n },\n\n [`.${svgIconClasses.root}`]: {\n position: 'absolute',\n right: '-1px',\n width: '24px',\n height: '24px',\n padding: '12px',\n background: '#007bc7',\n color: '#ffffff',\n fontWeight: '700',\n overflow: 'hidden',\n whiteSpace: 'nowrap',\n boxSizing: 'content-box'\n },\n\n [`.${inputBaseClasses.input}`]: {\n color: 'var(--color-text)',\n fontFamily: 'RijksoverheidSansText, Verdana, Arial, sans-serif',\n fontSize: '1.125rem',\n boxSizing: 'border-box',\n flex: '1 1',\n height: '48px',\n margin: '0',\n padding: '0 85px 0 14px',\n background: 'var(--color-text-light)',\n border: '1px solid var(--color-rijks-grey-3)',\n boxShadow: 'inset 1px 1px 3px hsl(0deg 0% 41% / 10%)',\n lineHeight: '1.5',\n maxWidth: '100%',\n\n ':focus': {\n borderColor: 'var(--color-rijks-skyblue)',\n outline: '0 !important',\n boxShadow: `\n inset 1px 1px 3px hsl(0deg 0% 41% / 10%),\n inset 0 0 0 1px var(--color-rijks-skyblue),\n 0 0 5px rgb(0 115 191 / 50%);\n `\n }\n },\n\n [`.${buttonBaseClasses.root}`]: {\n position: 'absolute',\n right: '48px',\n height: '24px',\n width: '24px',\n marginRight: '4px',\n\n [`.${svgIconClasses.root}`]: {\n color: 'var(--color-primary)',\n background: 'none'\n },\n\n ':hover, :active, :focus': {\n backgroundColor: 'transparent'\n },\n\n [`.${touchRippleClasses.root}`]: {\n display: 'none'\n }\n }\n }\n }\n }}\n >\n {isServerMode && (\n <AoaIconButton icon={<RefreshIcon />} label={localeText?.refreshTable ?? 'Ververs tabel'} onClick={getData} />\n )}\n {actionButtons?.map((button: JSX.Element) => button)}\n <GridToolbarQuickFilter {...quickFilterProps} />\n </Box>\n )\n);\n"],"names":["QuickSearchToolbar","memo","mode","isServerMode","actionButtons","getData","localeText","quickFilterProps","jsxs","Box","buttonBaseClasses","formControlClasses","textFieldClasses","inputClasses","svgIconClasses","inputBaseClasses","touchRippleClasses","jsx","AoaIconButton","RefreshIcon","button","GridToolbarQuickFilter"],"mappings":";;;;;;AAgCO,MAAMA,IAAqBC;AAAA,EAChC,CAAC;AAAA,IACC,MAAAC;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,SAAAC;AAAA,IACA,YAAAC;AAAA,IACA,kBAAAC;AAAA,EAAA,MAEA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAW,GAAGP,CAAI;AAAA,MAClB,IAAI;AAAA,QACF,SAAS;AAAA,QACT,YAAY;AAAA,QACZ,gBAAgB;AAAA,QAChB,eAAe;AAAA;AAAA,QAGf,+BAA+B;AAAA,UAC7B,YAAY;AAAA,QACd;AAAA,QAEA,CAAC,IAAIQ,EAAkB,IAAI,EAAE,GAAG;AAAA,UAC9B,OAAO;AAAA,UACP,aAAa;AAAA,QACf;AAAA,QAEA,CAAC,IAAIC,EAAmB,IAAI,IAAIC,EAAiB,IAAI,EAAE,GAAG;AAAA,UACxD,eAAe;AAAA,UAEf,CAAC,IAAIC,EAAa,IAAI,EAAE,GAAG;AAAA,YACzB,UAAU;AAAA,YAEV,mBAAmB;AAAA,cACjB,cAAc;AAAA,YAChB;AAAA,YAEA,CAAC,IAAIC,EAAe,IAAI,EAAE,GAAG;AAAA,cAC3B,UAAU;AAAA,cACV,OAAO;AAAA,cACP,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,OAAO;AAAA,cACP,YAAY;AAAA,cACZ,UAAU;AAAA,cACV,YAAY;AAAA,cACZ,WAAW;AAAA,YACb;AAAA,YAEA,CAAC,IAAIC,EAAiB,KAAK,EAAE,GAAG;AAAA,cAC9B,OAAO;AAAA,cACP,YAAY;AAAA,cACZ,UAAU;AAAA,cACV,WAAW;AAAA,cACX,MAAM;AAAA,cACN,QAAQ;AAAA,cACR,QAAQ;AAAA,cACR,SAAS;AAAA,cACT,YAAY;AAAA,cACZ,QAAQ;AAAA,cACR,WAAW;AAAA,cACX,YAAY;AAAA,cACZ,UAAU;AAAA,cAEV,UAAU;AAAA,gBACR,aAAa;AAAA,gBACb,SAAS;AAAA,gBACT,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,cAAA;AAAA,YAMf;AAAA,YAEA,CAAC,IAAIL,EAAkB,IAAI,EAAE,GAAG;AAAA,cAC9B,UAAU;AAAA,cACV,OAAO;AAAA,cACP,QAAQ;AAAA,cACR,OAAO;AAAA,cACP,aAAa;AAAA,cAEb,CAAC,IAAII,EAAe,IAAI,EAAE,GAAG;AAAA,gBAC3B,OAAO;AAAA,gBACP,YAAY;AAAA,cACd;AAAA,cAEA,2BAA2B;AAAA,gBACzB,iBAAiB;AAAA,cACnB;AAAA,cAEA,CAAC,IAAIE,EAAmB,IAAI,EAAE,GAAG;AAAA,gBAC/B,SAAS;AAAA,cAAA;AAAA,YACX;AAAA,UACF;AAAA,QACF;AAAA,MAEJ;AAAA,MAEC,UAAA;AAAA,QACCb,KAAA,gBAAAc,EAACC,GAAc,EAAA,MAAO,gBAAAD,EAAAE,GAAA,CAAA,CAAY,GAAI,QAAOb,KAAA,gBAAAA,EAAY,iBAAgB,iBAAiB,SAASD,EAAS,CAAA;AAAA,QAE7GD,KAAA,gBAAAA,EAAe,IAAI,CAACgB,MAAwBA;AAAA,QAC7C,gBAAAH,EAACI,GAAwB,EAAA,GAAGd,EAAkB,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpD;"}
@@ -0,0 +1,22 @@
1
+ export interface AoaFieldErrorProps {
2
+ readonly 'data-qa'?: string;
3
+ }
4
+ /**
5
+ * Constructs a custom error message for a field **using pre-defined Rijks styling**
6
+ *
7
+ * This component is intended for internal use only and should always be used through `<field.AoaFieldError />`
8
+ *
9
+ * @internal
10
+ * @param param0 - Props to pass to the field error
11
+ * @returns A custom error message for a field
12
+ * @example
13
+ * ```jsx
14
+ * <form.AppField name='name'>
15
+ * {(field) => {
16
+ * return <field.AoaFieldError />;
17
+ * }}
18
+ * </form.AppField>
19
+ * ```
20
+ */
21
+ export declare function AoaFieldError<TData>({ 'data-qa': dataQa }: AoaFieldErrorProps): import("react/jsx-runtime").JSX.Element | null;
22
+ //# sourceMappingURL=FieldError.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FieldError.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/field-error/FieldError.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,kBAAkB,kDAiB7E"}
@@ -0,0 +1,7 @@
1
+ import "react/jsx-runtime";
2
+ import { A as p } from "../../../chunks/FieldError.DAUtZvvC.js";
3
+ import "../../atoms/notification/Notification.js";
4
+ export {
5
+ p as AoaFieldError
6
+ };
7
+ //# sourceMappingURL=FieldError.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FieldError.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}
@@ -1,7 +1,20 @@
1
- import { DeepKeys, DeepValue, FieldApi, Validator } from '@tanstack/react-form';
2
- export interface AoaFormErrorProps<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>> {
1
+ export interface AoaFormErrorProps {
3
2
  readonly 'data-qa'?: string;
4
- readonly field: FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>;
5
3
  }
6
- export declare function AoaFormError<TParentData, TName extends DeepKeys<TParentData>, TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined, TFormValidator extends Validator<TParentData, unknown> | undefined = undefined, TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>>({ field, 'data-qa': dataQa }: AoaFormErrorProps<TParentData, TName, TFieldValidator, TFormValidator, TData>): import("react/jsx-runtime").JSX.Element | null;
4
+ /**
5
+ * Constructs a custom error message for a form **using pre-defined Rijks styling**
6
+ *
7
+ * This component is intended for internal use only and should always be used through `<form.AoaFormError />`
8
+ *
9
+ * @internal
10
+ * @param param0 - Props to pass to the form error
11
+ * @returns A custom error message for a form
12
+ * @example
13
+ * ```jsx
14
+ * <form.AppForm>
15
+ * <form.AoaFormError />
16
+ * </form.AppForm>
17
+ * ```
18
+ */
19
+ export declare function AoaFormError({ 'data-qa': dataQa }: AoaFormErrorProps): import("react/jsx-runtime").JSX.Element;
7
20
  //# sourceMappingURL=FormError.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"FormError.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/form-error/FormError.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAGrF,MAAM,WAAW,iBAAiB,CAChC,WAAW,EACX,KAAK,SAAS,QAAQ,CAAC,WAAW,CAAC,EACnC,eAAe,SAAS,SAAS,CAAC,SAAS,CAAC,WAAW,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,GAAG,SAAS,GAAG,SAAS,EACjG,cAAc,SAAS,SAAS,CAAC,WAAW,EAAE,OAAO,CAAC,GAAG,SAAS,GAAG,SAAS,EAC9E,KAAK,SAAS,SAAS,CAAC,WAAW,EAAE,KAAK,CAAC,GAAG,SAAS,CAAC,WAAW,EAAE,KAAK,CAAC;IAE3E,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,KAAK,EAAE,QAAQ,CAAC,WAAW,EAAE,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,KAAK,CAAC,CAAC;CACtF;AAED,wBAAgB,YAAY,CAC1B,WAAW,EACX,KAAK,SAAS,QAAQ,CAAC,WAAW,CAAC,EACnC,eAAe,SAAS,SAAS,CAAC,SAAS,CAAC,WAAW,EAAE,KAAK,CAAC,EAAE,OAAO,CAAC,GAAG,SAAS,GAAG,SAAS,EACjG,cAAc,SAAS,SAAS,CAAC,WAAW,EAAE,OAAO,CAAC,GAAG,SAAS,GAAG,SAAS,EAC9E,KAAK,SAAS,SAAS,CAAC,WAAW,EAAE,KAAK,CAAC,GAAG,SAAS,CAAC,WAAW,EAAE,KAAK,CAAC,EAC3E,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,iBAAiB,CAAC,WAAW,EAAE,KAAK,EAAE,eAAe,EAAE,cAAc,EAAE,KAAK,CAAC,kDAW5G"}
1
+ {"version":3,"file":"FormError.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/form-error/FormError.tsx"],"names":[],"mappings":"AAGA,MAAM,WAAW,iBAAiB;IAChC,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,iBAAiB,2CAuBpE"}
@@ -1,13 +1,7 @@
1
- import { jsx as a } from "react/jsx-runtime";
2
- import { AoaNotification as s } from "../../atoms/notification/Notification.js";
3
- function i({ field: r, "data-qa": o }) {
4
- if (r.state.meta.isTouched && r.state.meta.errors.length) {
5
- const t = r.state.meta.errors.at(0), e = typeof t == "string" ? t : "";
6
- return e ? /* @__PURE__ */ a(s, { "data-qa": o ?? "form-error", message: e, severity: "error" }) : null;
7
- }
8
- return null;
9
- }
1
+ import "react/jsx-runtime";
2
+ import { a as p } from "../../../chunks/FieldError.DAUtZvvC.js";
3
+ import "../../atoms/notification/Notification.js";
10
4
  export {
11
- i as AoaFormError
5
+ p as AoaFormError
12
6
  };
13
7
  //# sourceMappingURL=FormError.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"FormError.js","sources":["../../../../src/components/molecules/form-error/FormError.tsx"],"sourcesContent":["import type { DeepKeys, DeepValue, FieldApi, Validator } from '@tanstack/react-form';\nimport { AoaNotification } from '../../atoms/notification/Notification';\n\nexport interface AoaFormErrorProps<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined,\n TFormValidator extends Validator<TParentData, unknown> | undefined = undefined,\n TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>\n> {\n readonly 'data-qa'?: string;\n readonly field: FieldApi<TParentData, TName, TFieldValidator, TFormValidator, TData>;\n}\n\nexport function AoaFormError<\n TParentData,\n TName extends DeepKeys<TParentData>,\n TFieldValidator extends Validator<DeepValue<TParentData, TName>, unknown> | undefined = undefined,\n TFormValidator extends Validator<TParentData, unknown> | undefined = undefined,\n TData extends DeepValue<TParentData, TName> = DeepValue<TParentData, TName>\n>({ field, 'data-qa': dataQa }: AoaFormErrorProps<TParentData, TName, TFieldValidator, TFormValidator, TData>) {\n if (field.state.meta.isTouched && field.state.meta.errors.length) {\n const message = field.state.meta.errors.at(0);\n const stringMessage = typeof message === 'string' ? message : '';\n\n if (!stringMessage) return null;\n\n return <AoaNotification data-qa={dataQa ?? 'form-error'} message={stringMessage} severity='error' />;\n }\n\n return null;\n}\n"],"names":["AoaFormError","field","dataQa","message","stringMessage","jsx","AoaNotification"],"mappings":";;AAcO,SAASA,EAMd,EAAE,OAAAC,GAAO,WAAWC,KAAyF;AACzG,MAAAD,EAAM,MAAM,KAAK,aAAaA,EAAM,MAAM,KAAK,OAAO,QAAQ;AAChE,UAAME,IAAUF,EAAM,MAAM,KAAK,OAAO,GAAG,CAAC,GACtCG,IAAgB,OAAOD,KAAY,WAAWA,IAAU;AAE1D,WAACC,IAEE,gBAAAC,EAACC,KAAgB,WAASJ,KAAU,cAAc,SAASE,GAAe,UAAS,SAAQ,IAFvE;AAAA,EAEuE;AAG7F,SAAA;AACT;"}
1
+ {"version":3,"file":"FormError.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}