@rws-aoa/react-library 8.0.0 → 8.2.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.
- package/dist/chunks/FieldError.Bo2QpEMu.js +230 -0
- package/dist/chunks/FieldError.Bo2QpEMu.js.map +1 -0
- package/dist/components/atoms/_menu/user-menu/UserMenu.js.map +1 -1
- package/dist/components/atoms/icon-button/IconButton.js.map +1 -1
- package/dist/components/atoms/list/List.d.ts +42 -0
- package/dist/components/atoms/list/List.d.ts.map +1 -0
- package/dist/components/atoms/list/List.js +38 -0
- package/dist/components/atoms/list/List.js.map +1 -0
- package/dist/components/atoms/logo/Logo.js.map +1 -1
- package/dist/components/atoms/notification/_icons/Error.js.map +1 -1
- package/dist/components/atoms/notification/_icons/Success.js.map +1 -1
- package/dist/components/atoms/notification/_icons/Warning.js.map +1 -1
- package/dist/components/atoms/table/Table.d.ts.map +1 -1
- package/dist/components/atoms/table/Table.js +2 -2
- package/dist/components/atoms/table/Table.js.map +1 -1
- package/dist/components/atoms/table/_QuickSearchToolbar.d.ts.map +1 -1
- package/dist/components/atoms/table/_QuickSearchToolbar.js +34 -44
- package/dist/components/atoms/table/_QuickSearchToolbar.js.map +1 -1
- package/dist/components/atoms/zero-width-space/ZeroWidthSpace.js.map +1 -1
- package/dist/components/molecules/field-error/FieldError.js +1 -1
- package/dist/components/molecules/file-dropzone/FileDropzone.js.map +1 -1
- package/dist/components/molecules/form-error/FormError.js +1 -1
- package/dist/components/molecules/form-modal/FormModal.js +1 -1
- package/dist/components/molecules/modal/Modal.js.map +1 -1
- package/dist/components/molecules/modal-close-button/ModalCloseButton.js.map +1 -1
- package/dist/components/molecules/navigation-bar/NavigationBar.js.map +1 -1
- package/dist/components/molecules/no-label-number-field/NoLabelNumberField.d.ts +120 -0
- package/dist/components/molecules/no-label-number-field/NoLabelNumberField.d.ts.map +1 -0
- package/dist/components/molecules/no-label-number-field/NoLabelNumberField.js +9 -0
- package/dist/components/molecules/no-label-number-field/NoLabelNumberField.js.map +1 -0
- package/dist/components/molecules/upload-button/UploadButton.js.map +1 -1
- package/dist/contexts/TanstackFormContext.d.ts +4 -0
- package/dist/contexts/TanstackFormContext.d.ts.map +1 -1
- package/dist/contexts/TanstackFormContext.js +1 -1
- package/dist/index.d.ts +2 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +47 -44
- package/dist/index.js.map +1 -1
- package/package.json +27 -19
- package/dist/chunks/FieldError.5EPMwcGp.js +0 -170
- package/dist/chunks/FieldError.5EPMwcGp.js.map +0 -1
|
@@ -0,0 +1,230 @@
|
|
|
1
|
+
import { jsx as m, jsxs as R } from "react/jsx-runtime";
|
|
2
|
+
import { c as I } from "./compiler-runtime.CrLvXwKf.js";
|
|
3
|
+
import { createFormHookContexts as ee, createFormHook as te } from "@tanstack/react-form";
|
|
4
|
+
import { AoaNotification as j } from "../components/atoms/notification/Notification.js";
|
|
5
|
+
import { DialogTitle as oe, DialogContent as re, Dialog as ae, DialogActions as se, TextField as ie, inputBaseClasses as J } from "@mui/material";
|
|
6
|
+
import { l as $ } from "./lodash.DPVO3Hgf.js";
|
|
7
|
+
import { AoaButton as z } from "../components/atoms/button/Button.js";
|
|
8
|
+
import { AoaModalCloseButton as ne } from "../components/molecules/modal-close-button/ModalCloseButton.js";
|
|
9
|
+
import { AoaTooltip as le } from "../components/atoms/tooltip/Tooltip.js";
|
|
10
|
+
function me(a) {
|
|
11
|
+
const e = I.c(5), {
|
|
12
|
+
"data-qa": n
|
|
13
|
+
} = a, r = V();
|
|
14
|
+
let i;
|
|
15
|
+
e[0] !== n ? (i = (s) => {
|
|
16
|
+
if (s.length) {
|
|
17
|
+
const o = s.at(0);
|
|
18
|
+
if (typeof o == "string")
|
|
19
|
+
return /* @__PURE__ */ m(j, { "data-qa": n ?? "form-error", message: o, severity: "error" });
|
|
20
|
+
if (o && typeof o == "object") {
|
|
21
|
+
const l = ["error", "info", "success", "warning"].includes(o.level) ? o.level : "error";
|
|
22
|
+
return /* @__PURE__ */ m(j, { "data-qa": n ?? "form-error", message: o.message, severity: l });
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
return null;
|
|
26
|
+
}, e[0] = n, e[1] = i) : i = e[1];
|
|
27
|
+
let t;
|
|
28
|
+
return e[2] !== r.Subscribe || e[3] !== i ? (t = /* @__PURE__ */ m(r.Subscribe, { selector: ce, children: i }), e[2] = r.Subscribe, e[3] = i, e[4] = t) : t = e[4], t;
|
|
29
|
+
}
|
|
30
|
+
function ce(a) {
|
|
31
|
+
return a.errors;
|
|
32
|
+
}
|
|
33
|
+
function de(a) {
|
|
34
|
+
const e = I.c(56), {
|
|
35
|
+
formModalQas: n,
|
|
36
|
+
formLabels: r,
|
|
37
|
+
formName: i,
|
|
38
|
+
DialogProps: t,
|
|
39
|
+
DialogTitleProps: s,
|
|
40
|
+
DialogContentProps: o,
|
|
41
|
+
AoaSubmitButtonProps: l,
|
|
42
|
+
modalQas: c,
|
|
43
|
+
open: u,
|
|
44
|
+
topic: P,
|
|
45
|
+
dialogContent: w,
|
|
46
|
+
closeAction: p
|
|
47
|
+
} = a;
|
|
48
|
+
let b;
|
|
49
|
+
e[0] !== l ? (b = l === void 0 ? {} : l, e[0] = l, e[1] = b) : b = e[1];
|
|
50
|
+
let f, g;
|
|
51
|
+
e[2] !== b ? ({
|
|
52
|
+
disableWithFormState: g,
|
|
53
|
+
...f
|
|
54
|
+
} = b, e[2] = b, e[3] = f, e[4] = g) : (f = e[3], g = e[4]);
|
|
55
|
+
const d = V();
|
|
56
|
+
let D;
|
|
57
|
+
e[5] !== f || e[6] !== g || e[7] !== d.Subscribe || e[8] !== r.submit || e[9] !== n?.submitButton ? (D = g ? /* @__PURE__ */ m(d.Subscribe, { selector: ue, children: (T) => {
|
|
58
|
+
const [L, G] = T;
|
|
59
|
+
return /* @__PURE__ */ m(z, { ...f, "aria-disabled": L || !G, buttonType: "submit", "data-qa": n?.submitButton ?? "submit-form", disabled: L || !G, type: "primary", children: r.submit });
|
|
60
|
+
} }) : /* @__PURE__ */ m(z, { ...f, buttonType: "submit", "data-qa": n?.submitButton ?? "submit-form", type: "primary", children: r.submit }), e[5] = f, e[6] = g, e[7] = d.Subscribe, e[8] = r.submit, e[9] = n?.submitButton, e[10] = D) : D = e[10];
|
|
61
|
+
const E = D, k = c?.modal ?? "modal", Q = !!u;
|
|
62
|
+
let x;
|
|
63
|
+
e[11] !== t?.sx ? (x = $.merge({
|
|
64
|
+
"> div > div": {
|
|
65
|
+
borderRadius: 0
|
|
66
|
+
}
|
|
67
|
+
}, t?.sx), e[11] = t?.sx, e[12] = x) : x = e[12];
|
|
68
|
+
const U = c?.title ?? "modal-title";
|
|
69
|
+
let h;
|
|
70
|
+
e[13] !== s?.sx ? (h = $.merge({
|
|
71
|
+
padding: "3rem 3rem 1rem",
|
|
72
|
+
color: "var(--color-rijks-logoblue)",
|
|
73
|
+
fontSize: "1.1rem",
|
|
74
|
+
fontWeight: "bolder"
|
|
75
|
+
}, s?.sx), e[13] = s?.sx, e[14] = h) : h = e[14];
|
|
76
|
+
let v;
|
|
77
|
+
e[15] !== s || e[16] !== U || e[17] !== h || e[18] !== P ? (v = /* @__PURE__ */ m(oe, { ...s, "data-qa": U, maxWidth: "sm", sx: h, children: P }), e[15] = s, e[16] = U, e[17] = h, e[18] = P, e[19] = v) : v = e[19];
|
|
78
|
+
let C;
|
|
79
|
+
e[20] !== p ? (C = /* @__PURE__ */ m(ne, { closeAction: p }), e[20] = p, e[21] = C) : C = e[21];
|
|
80
|
+
const _ = n?.form ?? "form";
|
|
81
|
+
let y;
|
|
82
|
+
e[22] !== d ? (y = async (T) => {
|
|
83
|
+
T.preventDefault(), T.stopPropagation(), await d.handleSubmit();
|
|
84
|
+
}, e[22] = d, e[23] = y) : y = e[23];
|
|
85
|
+
const M = c?.content ?? "modal-content";
|
|
86
|
+
let A;
|
|
87
|
+
e[24] !== o?.sx ? (A = $.merge({
|
|
88
|
+
padding: "0 3rem 2rem"
|
|
89
|
+
}, o?.sx), e[24] = o?.sx, e[25] = A) : A = e[25];
|
|
90
|
+
let F;
|
|
91
|
+
e[26] !== o || e[27] !== w || e[28] !== M || e[29] !== A ? (F = /* @__PURE__ */ m(re, { ...o, "data-qa": M, sx: A, children: w }), e[26] = o, e[27] = w, e[28] = M, e[29] = A, e[30] = F) : F = e[30];
|
|
92
|
+
const W = n?.dialogActions ?? "dialog-actions", H = n?.cancelButton ?? "cancel-form";
|
|
93
|
+
let S;
|
|
94
|
+
e[31] !== p || e[32] !== d ? (S = () => {
|
|
95
|
+
d.reset(), p();
|
|
96
|
+
}, e[31] = p, e[32] = d, e[33] = S) : S = e[33];
|
|
97
|
+
let q;
|
|
98
|
+
e[34] !== r.cancel || e[35] !== H || e[36] !== S ? (q = /* @__PURE__ */ m(z, { "data-qa": H, onClick: S, type: "secondary", children: r.cancel }), e[34] = r.cancel, e[35] = H, e[36] = S, e[37] = q) : q = e[37];
|
|
99
|
+
let B;
|
|
100
|
+
e[38] !== E || e[39] !== W || e[40] !== q ? (B = /* @__PURE__ */ R(se, { "data-qa": W, children: [
|
|
101
|
+
q,
|
|
102
|
+
E
|
|
103
|
+
] }), e[38] = E, e[39] = W, e[40] = q, e[41] = B) : B = e[41];
|
|
104
|
+
let N;
|
|
105
|
+
e[42] !== i || e[43] !== _ || e[44] !== y || e[45] !== F || e[46] !== B ? (N = /* @__PURE__ */ R("form", { "data-qa": _, name: i, onSubmit: y, children: [
|
|
106
|
+
F,
|
|
107
|
+
B
|
|
108
|
+
] }), e[42] = i, e[43] = _, e[44] = y, e[45] = F, e[46] = B, e[47] = N) : N = e[47];
|
|
109
|
+
let O;
|
|
110
|
+
return e[48] !== t || e[49] !== C || e[50] !== N || e[51] !== k || e[52] !== Q || e[53] !== x || e[54] !== v ? (O = /* @__PURE__ */ R(ae, { ...t, "data-qa": k, open: Q, sx: x, children: [
|
|
111
|
+
v,
|
|
112
|
+
C,
|
|
113
|
+
N
|
|
114
|
+
] }), e[48] = t, e[49] = C, e[50] = N, e[51] = k, e[52] = Q, e[53] = x, e[54] = v, e[55] = O) : O = e[55], O;
|
|
115
|
+
}
|
|
116
|
+
function ue(a) {
|
|
117
|
+
return [a.isSubmitting, a.canSubmit];
|
|
118
|
+
}
|
|
119
|
+
var fe = Object.defineProperty, K = (a, e) => fe(a, "name", { value: e, configurable: !0 });
|
|
120
|
+
function X(a) {
|
|
121
|
+
return a == null;
|
|
122
|
+
}
|
|
123
|
+
K(X, "isNullOrUndefined");
|
|
124
|
+
function Y(a) {
|
|
125
|
+
return X(a) || a.length === 0;
|
|
126
|
+
}
|
|
127
|
+
K(Y, "isNullOrUndefinedOrEmpty");
|
|
128
|
+
function pe({
|
|
129
|
+
"data-qa": a,
|
|
130
|
+
fieldId: e,
|
|
131
|
+
isDisabled: n,
|
|
132
|
+
maxLength: r,
|
|
133
|
+
resetValues: i,
|
|
134
|
+
step: t,
|
|
135
|
+
sx: s,
|
|
136
|
+
tooltip: o
|
|
137
|
+
}) {
|
|
138
|
+
const l = Z(), c = /* @__PURE__ */ m(
|
|
139
|
+
ie,
|
|
140
|
+
{
|
|
141
|
+
"data-qa": `${a}-field`,
|
|
142
|
+
disabled: n,
|
|
143
|
+
id: e,
|
|
144
|
+
name: e,
|
|
145
|
+
onBlur: l.handleBlur,
|
|
146
|
+
onChange: (u) => {
|
|
147
|
+
i && i(), l.handleChange((P) => Y(u.target.value) ? void 0 : u.target.valueAsNumber);
|
|
148
|
+
},
|
|
149
|
+
onInput: (u) => {
|
|
150
|
+
u.target.value.length > r && (u.target.value = u.target.value.slice(0, r));
|
|
151
|
+
},
|
|
152
|
+
slotProps: {
|
|
153
|
+
htmlInput: {
|
|
154
|
+
maxLength: r,
|
|
155
|
+
min: 0,
|
|
156
|
+
max: Number("9".repeat(r)),
|
|
157
|
+
step: t
|
|
158
|
+
}
|
|
159
|
+
},
|
|
160
|
+
sx: $.merge({
|
|
161
|
+
[`.${J.root}`]: {
|
|
162
|
+
[`.${J.input}`]: {
|
|
163
|
+
":disabled": {
|
|
164
|
+
backgroundColor: "var(--color-disabled)",
|
|
165
|
+
borderColor: "var(--color-disabled)"
|
|
166
|
+
}
|
|
167
|
+
}
|
|
168
|
+
}
|
|
169
|
+
}, s),
|
|
170
|
+
type: "number",
|
|
171
|
+
value: l.state.value ?? ""
|
|
172
|
+
}
|
|
173
|
+
);
|
|
174
|
+
return o ? /* @__PURE__ */ m(le, { placement: "top", title: o, children: c }) : c;
|
|
175
|
+
}
|
|
176
|
+
const {
|
|
177
|
+
fieldContext: be,
|
|
178
|
+
formContext: ge,
|
|
179
|
+
useFieldContext: Z,
|
|
180
|
+
useFormContext: V
|
|
181
|
+
} = ee(), {
|
|
182
|
+
useAppForm: Ne,
|
|
183
|
+
withForm: Pe
|
|
184
|
+
} = te({
|
|
185
|
+
fieldContext: be,
|
|
186
|
+
formContext: ge,
|
|
187
|
+
fieldComponents: {
|
|
188
|
+
AoaFieldError: xe
|
|
189
|
+
},
|
|
190
|
+
formComponents: {
|
|
191
|
+
AoaFormModal: de,
|
|
192
|
+
AoaFormError: me,
|
|
193
|
+
AoaNoLabelNumberField: pe
|
|
194
|
+
}
|
|
195
|
+
});
|
|
196
|
+
function xe(a) {
|
|
197
|
+
const e = I.c(11), {
|
|
198
|
+
"data-qa": n
|
|
199
|
+
} = a, r = Z();
|
|
200
|
+
if (r.state.meta.isTouched && r.state.meta.errors.length) {
|
|
201
|
+
let i;
|
|
202
|
+
e[0] !== r.state.meta.errors ? (i = r.state.meta.errors.at(0), e[0] = r.state.meta.errors, e[1] = i) : i = e[1];
|
|
203
|
+
const t = i;
|
|
204
|
+
if (typeof t == "string") {
|
|
205
|
+
const s = n ?? "field-error";
|
|
206
|
+
let o;
|
|
207
|
+
return e[2] !== t || e[3] !== s ? (o = /* @__PURE__ */ m(j, { "data-qa": s, message: t, severity: "error" }), e[2] = t, e[3] = s, e[4] = o) : o = e[4], o;
|
|
208
|
+
} else if (t && typeof t == "object") {
|
|
209
|
+
let s;
|
|
210
|
+
e[5] !== t.level ? (s = ["error", "info", "success", "warning"].includes(t.level) ? t.level : "error", e[5] = t.level, e[6] = s) : s = e[6];
|
|
211
|
+
const o = s, l = n ?? "field-error";
|
|
212
|
+
let c;
|
|
213
|
+
return e[7] !== t.message || e[8] !== o || e[9] !== l ? (c = /* @__PURE__ */ m(j, { "data-qa": l, message: t.message, severity: o }), e[7] = t.message, e[8] = o, e[9] = l, e[10] = c) : c = e[10], c;
|
|
214
|
+
}
|
|
215
|
+
}
|
|
216
|
+
return null;
|
|
217
|
+
}
|
|
218
|
+
export {
|
|
219
|
+
xe as A,
|
|
220
|
+
me as a,
|
|
221
|
+
de as b,
|
|
222
|
+
pe as c,
|
|
223
|
+
be as d,
|
|
224
|
+
ge as e,
|
|
225
|
+
Z as f,
|
|
226
|
+
V as g,
|
|
227
|
+
Ne as u,
|
|
228
|
+
Pe as w
|
|
229
|
+
};
|
|
230
|
+
//# sourceMappingURL=FieldError.Bo2QpEMu.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FieldError.Bo2QpEMu.js","sources":["../../src/components/molecules/form-error/FormError.tsx","../../src/components/molecules/form-modal/FormModal.tsx","../../../../node_modules/@sapphire/utilities/dist/esm/chunk-PAWJFY3S.mjs","../../../../node_modules/@sapphire/utilities/dist/esm/lib/isNullOrUndefined.mjs","../../../../node_modules/@sapphire/utilities/dist/esm/lib/isNullOrUndefinedOrEmpty.mjs","../../src/components/molecules/no-label-number-field/NoLabelNumberField.tsx","../../src/contexts/TanstackFormContext.ts","../../src/components/molecules/field-error/FieldError.tsx"],"sourcesContent":["import { useAoaFormContext } from '../../../contexts/TanstackFormContext';\nimport { AoaNotification, type Severity } from '../../atoms/notification/Notification';\n\nexport interface AoaFormErrorProps {\n readonly 'data-qa'?: string;\n}\n\n/**\n * Constructs a custom error message for a form **using pre-defined Rijks styling**\n *\n * This component is intended for internal use only and should always be used through `<form.AoaFormError />`\n *\n * @internal\n * @param param0 - Props to pass to the form error\n * @returns A custom error message for a form\n * @example\n * ```jsx\n * <form.AppForm>\n * <form.AoaFormError />\n * </form.AppForm>\n * ```\n */\nexport function AoaFormError({ 'data-qa': dataQa }: AoaFormErrorProps) {\n const form = useAoaFormContext();\n\n return (\n <form.Subscribe selector={(state) => state.errors}>\n {(errors) => {\n if (errors.length) {\n const error = errors.at(0);\n\n if (typeof error === 'string') {\n return <AoaNotification data-qa={dataQa ?? 'form-error'} message={error} severity='error' />;\n } else if (error && typeof error === 'object') {\n const parsedLevel = ['error', 'info', 'success', 'warning'].includes(error.level) ? (error.level as Severity) : 'error';\n return <AoaNotification data-qa={dataQa ?? 'form-error'} message={error.message} severity={parsedLevel} />;\n }\n }\n\n return null;\n }}\n </form.Subscribe>\n );\n}\n","import { Dialog, DialogActions, DialogContent, DialogTitle } from '@mui/material';\nimport { merge } from 'lodash';\nimport { useAoaFormContext } from '../../../contexts/TanstackFormContext';\nimport { AoaButton, type AoaButtonProps } from '../../atoms/button/Button';\nimport type { AoaModalProps } from '../modal/Modal';\nimport { AoaModalCloseButton, type AoaModalCloseButtonProps } from '../modal-close-button/ModalCloseButton';\n\nexport interface AoaFormModalQAs {\n /**\n * Data-qa tag applied to the \"cancel\" button\n */\n cancelButton?: string;\n /**\n * Data-qa tag applied to the `DialogActions` component\n */\n dialogActions?: string;\n /**\n * Data-qa tag applied to the HTML `form` element\n */\n form?: string;\n /**\n * Data-qa tag applied to the \"submit\" button\n */\n submitButton?: string;\n}\n\nexport interface AoaFormModalLabels {\n cancel: string;\n submit: string;\n}\n\nexport interface AoaFormModalProps extends Omit<AoaModalProps, 'dialogActions'>, AoaModalCloseButtonProps {\n /**\n * Additional properties to provide to the {@link AoaButton | submit button}\n */\n AoaSubmitButtonProps?: Omit<AoaButtonProps, 'buttonType' | 'data-qa' | 'disabled' | 'onClick' | 'type'> & {\n disableWithFormState?: boolean;\n };\n /**\n * Labels for the buttons in {@link DialogActions}\n */\n formLabels: AoaFormModalLabels;\n /**\n * data-qa tags for the components in the form section of the modal\n */\n formModalQas?: AoaFormModalQAs;\n /**\n * Optionally the `name` property for the HTML form element\n */\n formName?: string;\n}\n\n/**\n * Constructs a modal **for holding a Form** using pre-defined Rijks styling\n *\n * For a modal without a form see `AoaModal`\n *\n * This component is intended for internal use only and should always be used through `<form.AoaFormModal />`\n *\n * @internal\n * @param props - Props to pass to the modal - {@link ModalProps}\n * @example\n * ```jsx\n * <form.AppForm>\n * <form.AoaFormModal\n * open={true}\n * formLabels={{\n * submit: 'submit',\n * cancel: 'cancel'\n * }}\n * formModalQas={{\n * cancelButton: 'cancel-button',\n * dialogActions: 'dialog-actions,\n * form: 'form',\n * submitButton: 'confirm-button'\n * }}\n * closeAction={handleClose}\n * topic='topic'\n * modalQas={{\n * modal: 'modal',\n * content: 'modal-content',\n * title: 'modal-title'\n * }}\n * formName='form'\n * dialogContent={content}\n * />\n * </form.AppForm>\n * ```\n */\nexport function AoaFormModal({\n formModalQas,\n formLabels,\n formName,\n DialogProps,\n DialogTitleProps,\n DialogContentProps,\n AoaSubmitButtonProps: { disableWithFormState, ...AoaSubmitButtonProps } = {},\n modalQas,\n open,\n topic,\n dialogContent,\n closeAction\n}: Readonly<AoaFormModalProps>) {\n const form = useAoaFormContext();\n\n const SubmitButton = disableWithFormState ? (\n <form.Subscribe selector={(state) => [state.isSubmitting, state.canSubmit] as const}>\n {([isSubmitting, canSubmit]) => (\n <AoaButton\n {...AoaSubmitButtonProps}\n aria-disabled={isSubmitting || !canSubmit}\n buttonType='submit'\n data-qa={formModalQas?.submitButton ?? 'submit-form'}\n disabled={isSubmitting || !canSubmit}\n type='primary'\n >\n {formLabels.submit}\n </AoaButton>\n )}\n </form.Subscribe>\n ) : (\n <AoaButton {...AoaSubmitButtonProps} buttonType='submit' data-qa={formModalQas?.submitButton ?? 'submit-form'} type='primary'>\n {formLabels.submit}\n </AoaButton>\n );\n\n return (\n <Dialog\n {...DialogProps}\n data-qa={modalQas?.modal ?? 'modal'}\n open={Boolean(open)}\n sx={merge(\n {\n '> div > div': {\n borderRadius: 0\n }\n },\n DialogProps?.sx\n )}\n >\n <DialogTitle\n {...DialogTitleProps}\n data-qa={modalQas?.title ?? 'modal-title'}\n maxWidth='sm'\n sx={merge(\n {\n padding: '3rem 3rem 1rem',\n color: 'var(--color-rijks-logoblue)',\n fontSize: '1.1rem',\n fontWeight: 'bolder'\n },\n DialogTitleProps?.sx\n )}\n >\n {topic}\n </DialogTitle>\n <AoaModalCloseButton closeAction={closeAction} />\n <form\n data-qa={formModalQas?.form ?? 'form'}\n name={formName}\n onSubmit={async (event) => {\n event.preventDefault();\n event.stopPropagation();\n await form.handleSubmit();\n }}\n >\n <DialogContent\n {...DialogContentProps}\n data-qa={modalQas?.content ?? 'modal-content'}\n sx={merge(\n {\n padding: '0 3rem 2rem'\n },\n DialogContentProps?.sx\n )}\n >\n {dialogContent}\n </DialogContent>\n <DialogActions data-qa={formModalQas?.dialogActions ?? 'dialog-actions'}>\n <AoaButton\n data-qa={formModalQas?.cancelButton ?? 'cancel-form'}\n onClick={() => {\n form.reset();\n closeAction();\n }}\n type='secondary'\n >\n {formLabels.cancel}\n </AoaButton>\n {SubmitButton}\n </DialogActions>\n </form>\n </Dialog>\n );\n}\n","var __defProp = Object.defineProperty;\nvar __name = (target, value) => __defProp(target, \"name\", { value, configurable: true });\n\nexport { __name };\n//# sourceMappingURL=chunk-PAWJFY3S.mjs.map\n//# sourceMappingURL=chunk-PAWJFY3S.mjs.map","import { __name } from '../chunk-PAWJFY3S.mjs';\n\n// src/lib/isNullOrUndefined.ts\nfunction isNullOrUndefined(value) {\n return value === undefined || value === null;\n}\n__name(isNullOrUndefined, \"isNullOrUndefined\");\n\nexport { isNullOrUndefined, isNullOrUndefined as isNullish };\n//# sourceMappingURL=isNullOrUndefined.mjs.map\n//# sourceMappingURL=isNullOrUndefined.mjs.map","import { __name } from '../chunk-PAWJFY3S.mjs';\nimport { isNullish } from './isNullOrUndefined.mjs';\n\nfunction isNullOrUndefinedOrEmpty(value) {\n return isNullish(value) || value.length === 0;\n}\n__name(isNullOrUndefinedOrEmpty, \"isNullOrUndefinedOrEmpty\");\n\nexport { isNullOrUndefinedOrEmpty, isNullOrUndefinedOrEmpty as isNullishOrEmpty };\n//# sourceMappingURL=isNullOrUndefinedOrEmpty.mjs.map\n//# sourceMappingURL=isNullOrUndefinedOrEmpty.mjs.map","import type { SxProps, Theme } from '@mui/material';\nimport { inputBaseClasses, TextField } from '@mui/material';\nimport { isNullishOrEmpty } from '@sapphire/utilities';\nimport { merge } from 'lodash';\nimport { useAoaFieldContext } from '../../../contexts/TanstackFormContext';\nimport { AoaTooltip } from '../../atoms/tooltip/Tooltip';\n\n/**\n * Props for {@link AoaNoLabelNumberField}.\n *\n * @remarks This interface defines the configurable aspects of the number field that is designed\n * to be paired with another field under a single label (\"double label\" pattern). Each prop maps to\n * a specific behavior or visual customization of the underlying MUI {@link TextField}.\n */\nexport interface AoaNoLabelNumberFieldProps {\n /**\n * Base QA / testing identifier. The component appends `-field` when applying it to the DOM as `data-qa`.\n *\n * @remarks Used for automated testing hooks.\n */\n readonly 'data-qa'?: string;\n /**\n * The id and name assigned to the input element.\n *\n * @remarks Must be unique within the form scope so that form state tracking works correctly.\n */\n readonly fieldId: string;\n\n /**\n * Disables the input when true.\n *\n * @defaultValue false\n */\n readonly isDisabled?: boolean;\n /**\n * Maximum number of digits the user can enter.\n *\n * @remarks Also used to compute the numeric max as `Number('9'.repeat(maxLength))`.\n */\n readonly maxLength: number;\n /**\n * Optional callback invoked before updating the field value on change.\n *\n * @remarks Can be used to reset related field values when one side of a range changes.\n */\n readonly resetValues?: CallableFunction;\n /**\n * Numeric step applied to the number input.\n *\n * @remarks Passed directly to the underlying input `step` attribute.\n */\n readonly step?: number;\n /**\n * Style overrides merged with the component's default styling for the root and input states.\n *\n * @see {@link SxProps}\n */\n readonly sx?: SxProps<Theme>;\n /**\n * Optional tooltip text. When provided, wraps the field in an {@link AoaTooltip}.\n */\n readonly tooltip?: string;\n}\n\n/**\n * This is a custom number field to allow for input fields that have one label with multiple fields.\n *\n * This component cannot be used without a proper wrapper around it. Please refer to the example below of how to properly use this component.\n *\n * @example\n * ```tsx\n * <Grid>\n * <InputLabel>My label</InputLabel>\n * <Grid container direction=\"column\">\n * <Grid alignItems=\"center\" container direction=\"row\">\n * <form.AppField name=\"firstField\">\n * {() => (\n * <AoaNoLabelNumberField\n * dataQa=\"first-field\"\n * fieldId=\"first-field\"\n * maxLength={5}\n * sx={{ width: 100 }}\n * />\n * )}\n * </form.AppField>\n * <Box sx={{ mx: 1 }}> / </Box>\n * <form.AppField name=\"secondField\">\n * {() => (\n * <AoaNoLabelNumberField\n * dataQa=\"second-field\"\n * fieldId=\"second-field\"\n * maxLength={5}\n * sx={{ width: 100 }}\n * />\n * )}\n * </form.AppField>\n * </Grid>\n * <form.Subscribe\n * selector={(state) => [\n * state.fieldMeta.firstField,\n * state.fieldMeta.secondField,\n * ]}\n * >\n * {([firstField, secondField]) => {\n * const hasFromError =\n * firstField?.isTouched && Boolean(firstField?.errors?.length);\n * const hasToError =\n * secondField?.isTouched && Boolean(secondField?.errors?.length);\n *\n * if (hasFromError || hasToError) {\n * return (\n * <AoaNotification\n * data-qa=\"first-second-field-error\"\n * message=\"Please correct the errors in the fields above.\"\n * severity=\"error\"\n * />\n * );\n * }\n *\n * return null;\n * }}\n * </form.Subscribe>\n * </Grid>\n * </Grid>;\n * ```\n */\nexport function AoaNoLabelNumberField<TData>({\n 'data-qa': dataQa,\n fieldId,\n isDisabled,\n maxLength,\n resetValues,\n step,\n sx,\n tooltip\n}: AoaNoLabelNumberFieldProps) {\n const field = useAoaFieldContext<TData>();\n\n const FieldComponent = (\n <TextField\n data-qa={`${dataQa}-field`}\n disabled={isDisabled}\n id={fieldId}\n name={fieldId}\n onBlur={field.handleBlur}\n /* v8 ignore start */\n onChange={(event) => {\n if (resetValues) {\n resetValues();\n }\n\n field.handleChange((prev) => (isNullishOrEmpty(event.target.value) ? undefined : (event.target as HTMLInputElement).valueAsNumber) as typeof prev);\n }}\n /* v8 ignore stop */\n onInput={(event) => {\n if ((event.target as HTMLInputElement).value.length > maxLength) {\n (event.target as HTMLInputElement).value = (event.target as HTMLInputElement).value.slice(0, maxLength);\n }\n }}\n slotProps={{\n htmlInput: { maxLength, min: 0, max: Number('9'.repeat(maxLength)), step }\n }}\n sx={merge(\n {\n [`.${inputBaseClasses.root}`]: {\n [`.${inputBaseClasses.input}`]: {\n ':disabled': {\n backgroundColor: 'var(--color-disabled)',\n borderColor: 'var(--color-disabled)'\n }\n }\n }\n },\n sx\n )}\n type='number'\n value={field.state.value ?? ''}\n />\n );\n\n return tooltip ? (\n <AoaTooltip placement='top' title={tooltip}>\n {FieldComponent}\n </AoaTooltip>\n ) : (\n FieldComponent\n );\n}\n","import { createFormHook, createFormHookContexts } from '@tanstack/react-form';\nimport { AoaFieldError } from '../components/molecules/field-error/FieldError';\nimport { AoaFormError } from '../components/molecules/form-error/FormError';\nimport { AoaFormModal } from '../components/molecules/form-modal/FormModal';\nimport { AoaNoLabelNumberField } from '../components/molecules/no-label-number-field/NoLabelNumberField';\n\nexport const {\n fieldContext: aoaFieldContext,\n formContext: aoaFormContext,\n useFieldContext: useAoaFieldContext,\n useFormContext: useAoaFormContext\n} = createFormHookContexts();\n\nexport const { useAppForm: useAoaAppForm, withForm: withAoaForm } = createFormHook({\n fieldContext: aoaFieldContext,\n formContext: aoaFormContext,\n fieldComponents: {\n AoaFieldError\n },\n formComponents: {\n AoaFormModal,\n AoaFormError,\n AoaNoLabelNumberField\n }\n});\n","import { useAoaFieldContext } from '../../../contexts/TanstackFormContext';\nimport { AoaNotification, type Severity } from '../../atoms/notification/Notification';\n\nexport interface AoaFieldErrorProps {\n readonly 'data-qa'?: string;\n}\n\n/**\n * Constructs a custom error message for a field **using pre-defined Rijks styling**\n *\n * This component is intended for internal use only and should always be used through `<field.AoaFieldError />`\n *\n * @internal\n * @param param0 - Props to pass to the field error\n * @returns A custom error message for a field\n * @example\n * ```jsx\n * <form.AppField name='name'>\n * {(field) => {\n * return <field.AoaFieldError />;\n * }}\n * </form.AppField>\n * ```\n */\nexport function AoaFieldError<TData>({ 'data-qa': dataQa }: AoaFieldErrorProps) {\n const field = useAoaFieldContext<TData>();\n\n if (field.state.meta.isTouched && field.state.meta.errors.length) {\n const error = field.state.meta.errors.at(0);\n\n if (typeof error === 'string') {\n return <AoaNotification data-qa={dataQa ?? 'field-error'} message={error} severity='error' />;\n } else if (error && typeof error === 'object') {\n const parsedLevel = ['error', 'info', 'success', 'warning'].includes(error.level) ? (error.level as Severity) : 'error';\n return <AoaNotification data-qa={dataQa ?? 'field-error'} message={error.message} severity={parsedLevel} />;\n }\n }\n\n return null;\n}\n"],"names":["AoaFormError","t0","$","_c","dataQa","form","useAoaFormContext","t1","errors","length","error","at","jsx","AoaNotification","parsedLevel","includes","level","message","t2","Subscribe","_temp","state","AoaFormModal","formModalQas","formLabels","formName","DialogProps","DialogTitleProps","DialogContentProps","AoaSubmitButtonProps","modalQas","open","topic","dialogContent","closeAction","undefined","disableWithFormState","t3","submit","submitButton","t4","isSubmitting","canSubmit","AoaButton","SubmitButton","modal","t5","Boolean","t6","sx","merge","borderRadius","t7","title","t8","padding","color","fontSize","fontWeight","t9","DialogTitle","t10","AoaModalCloseButton","t11","t12","event","preventDefault","stopPropagation","handleSubmit","t13","content","t14","t15","DialogContent","t16","dialogActions","t17","cancelButton","t18","reset","t19","cancel","t20","DialogActions","t21","t22","jsxs","Dialog","__defProp","__name","target","value","isNullOrUndefined","isNullOrUndefinedOrEmpty","isNullish","AoaNoLabelNumberField","fieldId","isDisabled","maxLength","resetValues","step","tooltip","field","useAoaFieldContext","FieldComponent","TextField","handleBlur","handleChange","prev","isNullishOrEmpty","valueAsNumber","slice","htmlInput","min","max","Number","repeat","inputBaseClasses","root","input","backgroundColor","borderColor","AoaTooltip","fieldContext","aoaFieldContext","formContext","aoaFormContext","useFieldContext","useFormContext","createFormHookContexts","useAppForm","useAoaAppForm","withForm","withAoaForm","createFormHook","fieldComponents","AoaFieldError","formComponents","meta","isTouched"],"mappings":"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","x_google_ignoreList":[2,3,4]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UserMenu.js","sources":["../../../../../src/components/atoms/_menu/user-menu/UserMenu.tsx"],"sourcesContent":["import { Avatar, Box, Link as MUILink, MenuItem as MUIMenuItem, Popper, Typography } from '@mui/material';\nimport { Link } from '@tanstack/react-router';\nimport { merge } from 'lodash';\nimport { useState, type MouseEvent } from 'react';\nimport { FontNormalSxProps } from '../../../../_constants';\n\ntype Action =\n /**\n * The path that the menu item links to on click\n */\n | { onClick?: never; to: string }\n /**\n * The onClick function for situations where you don't want to navigate to another page (e.g. logout)\n */\n | { onClick(): void; to?: never };\n\nexport type AoaSetting = Action & {\n /**\n * Optional divider to be shown below menu item\n */\n divider?: boolean;\n /**\n * The label of the menu item\n */\n label: string;\n};\n\ninterface UserMenuProps {\n /**\n * A list of the user menu items\n */\n readonly settings: AoaSetting[];\n /**\n * Username to be displayed on the left of the settings menu icon\n */\n readonly username?: string;\n}\n\n/**\n * Constructs a user menu using pre-defined Rijks styling\n *\n * @param props - Props to pass to the user menu\n * @example\n * ```jsx\n * <AoaUserMenu\n * settings={[\n * { label: \"Logout\", onClick: () => console.log(\"Logout\") }\n * ]}\n * />\n * ```\n */\n\nexport function AoaUserMenu(props: UserMenuProps) {\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n const [open, setOpen] = useState(false);\n\n function handleMenuOpen(event: MouseEvent<HTMLLIElement, globalThis.MouseEvent>) {\n setOpen(true);\n setAnchorEl(event.currentTarget);\n }\n\n function handleMenuClose() {\n setOpen(false);\n setAnchorEl(null);\n }\n\n return (\n <Box alignItems='center' display='flex' role='menu' sx={{ flexGrow: 0, minWidth: 'fit-content' }}>\n {props.username && (\n <Typography component='span' sx={merge({ marginRight: '16px' }, FontNormalSxProps)}>\n {props.username}\n </Typography>\n )}\n <MUIMenuItem\n aria-controls={open ? 'usermenu' : undefined}\n aria-expanded={open ? 'true' : undefined}\n aria-haspopup='true'\n aria-label='User menu'\n onMouseEnter={(event) => handleMenuOpen(event)}\n onMouseLeave={() => handleMenuClose()}\n sx={{\n padding: 0,\n\n ':hover': {\n backgroundColor: 'transparent'\n }\n }}\n >\n <Avatar />\n <Popper\n anchorEl={anchorEl}\n id='usermenu'\n open={open}\n placement='bottom-end'\n sx={{\n backgroundColor: 'var(--color-bg-light)',\n padding: '4px 0',\n borderRadius: '6px',\n marginTop: '8px',\n minWidth: '120px',\n color: 'var(--color-text)',\n boxShadow: `\n rgb(255 255 255) 0 0 0 0,\n rgb(0 0 0 / 5%) 0 0 0 1px,\n rgb(0 0 0 / 10%) 0 10px 15px -3px,\n rgb(0 0 0 / 5%) 0 4px 6px -2px\n `\n }}\n >\n {props.settings.map((setting, index) => (\n <MUIMenuItem\n component={setting.to ? Link : MUILink}\n disableRipple\n divider={setting.divider ?? false}\n key={index}\n onClick={(event: MouseEvent<HTMLAnchorElement, globalThis.MouseEvent>) => {\n event.stopPropagation();\n if (setting.onClick) {\n setting.onClick();\n }\n\n setOpen(false);\n }}\n sx={{ ...FontNormalSxProps }}\n to={setting.to}\n >\n {setting.label}\n </MUIMenuItem>\n ))}\n </Popper>\n </MUIMenuItem>\n </Box>\n );\n}\n"],"names":["AoaUserMenu","props","$","_c","anchorEl","setAnchorEl","useState","open","setOpen","t0","Symbol","for","event","currentTarget","handleMenuOpen","t1","handleMenuClose","t2","flexGrow","minWidth","t3","username","jsx","Typography","merge","marginRight","FontNormalSxProps","t4","undefined","t5","t6","t7","event_0","t8","t9","padding","backgroundColor","Avatar","t10","borderRadius","marginTop","color","boxShadow","t11","settings","t12","setting","index","MUIMenuItem","to","Link","MUILink","divider","event_1","stopPropagation","onClick","label","map","Popper","t13","jsxs","t14","Box"],"mappings":";;;;;;;AAoDO,SAAAA,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAAA,EAAA,EAAA,GACL,CAAAC,GAAAC,CAAA,IAAgCC,
|
|
1
|
+
{"version":3,"file":"UserMenu.js","sources":["../../../../../src/components/atoms/_menu/user-menu/UserMenu.tsx"],"sourcesContent":["import { Avatar, Box, Link as MUILink, MenuItem as MUIMenuItem, Popper, Typography } from '@mui/material';\nimport { Link } from '@tanstack/react-router';\nimport { merge } from 'lodash';\nimport { useState, type MouseEvent } from 'react';\nimport { FontNormalSxProps } from '../../../../_constants';\n\ntype Action =\n /**\n * The path that the menu item links to on click\n */\n | { onClick?: never; to: string }\n /**\n * The onClick function for situations where you don't want to navigate to another page (e.g. logout)\n */\n | { onClick(): void; to?: never };\n\nexport type AoaSetting = Action & {\n /**\n * Optional divider to be shown below menu item\n */\n divider?: boolean;\n /**\n * The label of the menu item\n */\n label: string;\n};\n\ninterface UserMenuProps {\n /**\n * A list of the user menu items\n */\n readonly settings: AoaSetting[];\n /**\n * Username to be displayed on the left of the settings menu icon\n */\n readonly username?: string;\n}\n\n/**\n * Constructs a user menu using pre-defined Rijks styling\n *\n * @param props - Props to pass to the user menu\n * @example\n * ```jsx\n * <AoaUserMenu\n * settings={[\n * { label: \"Logout\", onClick: () => console.log(\"Logout\") }\n * ]}\n * />\n * ```\n */\n\nexport function AoaUserMenu(props: UserMenuProps) {\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n const [open, setOpen] = useState(false);\n\n function handleMenuOpen(event: MouseEvent<HTMLLIElement, globalThis.MouseEvent>) {\n setOpen(true);\n setAnchorEl(event.currentTarget);\n }\n\n function handleMenuClose() {\n setOpen(false);\n setAnchorEl(null);\n }\n\n return (\n <Box alignItems='center' display='flex' role='menu' sx={{ flexGrow: 0, minWidth: 'fit-content' }}>\n {props.username && (\n <Typography component='span' sx={merge({ marginRight: '16px' }, FontNormalSxProps)}>\n {props.username}\n </Typography>\n )}\n <MUIMenuItem\n aria-controls={open ? 'usermenu' : undefined}\n aria-expanded={open ? 'true' : undefined}\n aria-haspopup='true'\n aria-label='User menu'\n onMouseEnter={(event) => handleMenuOpen(event)}\n onMouseLeave={() => handleMenuClose()}\n sx={{\n padding: 0,\n\n ':hover': {\n backgroundColor: 'transparent'\n }\n }}\n >\n <Avatar />\n <Popper\n anchorEl={anchorEl}\n id='usermenu'\n open={open}\n placement='bottom-end'\n sx={{\n backgroundColor: 'var(--color-bg-light)',\n padding: '4px 0',\n borderRadius: '6px',\n marginTop: '8px',\n minWidth: '120px',\n color: 'var(--color-text)',\n boxShadow: `\n rgb(255 255 255) 0 0 0 0,\n rgb(0 0 0 / 5%) 0 0 0 1px,\n rgb(0 0 0 / 10%) 0 10px 15px -3px,\n rgb(0 0 0 / 5%) 0 4px 6px -2px\n `\n }}\n >\n {props.settings.map((setting, index) => (\n <MUIMenuItem\n component={setting.to ? Link : MUILink}\n disableRipple\n divider={setting.divider ?? false}\n key={index}\n onClick={(event: MouseEvent<HTMLAnchorElement, globalThis.MouseEvent>) => {\n event.stopPropagation();\n if (setting.onClick) {\n setting.onClick();\n }\n\n setOpen(false);\n }}\n sx={{ ...FontNormalSxProps }}\n to={setting.to}\n >\n {setting.label}\n </MUIMenuItem>\n ))}\n </Popper>\n </MUIMenuItem>\n </Box>\n );\n}\n"],"names":["AoaUserMenu","props","$","_c","anchorEl","setAnchorEl","useState","open","setOpen","t0","Symbol","for","event","currentTarget","handleMenuOpen","t1","handleMenuClose","t2","flexGrow","minWidth","t3","username","jsx","Typography","merge","marginRight","FontNormalSxProps","t4","undefined","t5","t6","t7","event_0","t8","t9","padding","backgroundColor","Avatar","t10","borderRadius","marginTop","color","boxShadow","t11","settings","t12","setting","index","MUIMenuItem","to","Link","MUILink","divider","event_1","stopPropagation","onClick","label","map","Popper","t13","jsxs","t14","Box"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"IconButton.js","sources":["../../../../src/components/atoms/icon-button/IconButton.tsx"],"sourcesContent":["import { IconButton as MUIIconButton, type SxProps } from '@mui/material';\nimport { merge } from 'lodash';\nimport type { JSX, Ref } from 'react';\nimport { AoaTooltip } from '../tooltip/Tooltip';\n\nexport interface AoaIconButtonProps {\n /**\n * Data-qa tag for E2E test purposes\n */\n readonly 'data-qa'?: string;\n /**\n * Whether this button should be disabled\n */\n readonly disabled?: boolean;\n /**\n * The icon to be displayed as a button\n */\n readonly icon: JSX.Element;\n /**\n * Whether this button is being used inline\n */\n readonly inline?: boolean;\n /**\n * The label that is shown on hover\n */\n readonly label: string;\n /**\n * The action that should be triggered when clicking the button\n */\n onClick(this: void, ..._args: any[]): void;\n /**\n * The ref to the button element\n */\n readonly ref?: Ref<HTMLButtonElement> | undefined;\n /**\n * Material UI's property to apply styling\n */\n readonly sx?: SxProps;\n}\n\n/**\n * Constructs an icon button using pre-defined Rijks styling\n *\n * @param props - Props to pass to the icon button\n * @example\n * ```jsx\n * <AoaIconButton onClick={() => console.log()} label='Order a burger' icon={<Fastfood />} />\n * ```\n */\nexport function AoaIconButton({ ref, ...props }: AoaIconButtonProps) {\n const Button = (\n <MUIIconButton\n aria-label={props.label}\n data-qa={props['data-qa']}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n disabled={props.disabled}\n onClick={props.onClick}\n ref={ref}\n role='button'\n sx={merge(\n {\n color: 'var(--color-primary)',\n border: '1px solid var(--color-primary)',\n borderRadius: 0,\n ':hover, :active, :focus': {\n color: 'var(--color-primary-hover)',\n borderColor: 'var(--color-primary-hover)'\n },\n ':disabled': {\n backgroundColor: 'transparent',\n borderColor: 'var(--color-text-disabled)',\n color: 'var(--color-text-disabled)'\n },\n ':focus': {\n outline: '2px dashed var(--color-text)',\n outlineOffset: 3,\n boxShadow: 'none'\n },\n ...(props.inline && {\n border: 'none',\n padding: 0\n })\n },\n props.sx\n )}\n >\n {props.icon}\n </MUIIconButton>\n );\n\n return (\n <AoaTooltip title={props.label}>\n {props.disabled ? (\n <span aria-label={props.label} data-testid='disabled-span-wrapper' role='tooltip'>\n {Button}\n </span>\n ) : (\n Button\n )}\n </AoaTooltip>\n );\n}\n"],"names":["AoaIconButton","t0","$","_c","T0","props","t1","t10","t2","t3","t4","t5","t6","t7","t8","t9","ref","t11","MUIIconButton","label","disabled","onClick","merge","color","border","borderRadius","borderColor","backgroundColor","outline","outlineOffset","boxShadow","inline","padding","sx","icon","jsx","Button","t12","t13","AoaTooltip"],"mappings":";;;;;AAiDO,SAAAA,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAAA,EAAA,EAAA;AAAA,MAAAC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC,GAAAC;AAAA,MAAAb,SAAAD,GAAA;AAAuB,UAAA;AAAA,MAAAe,KAAAA;AAAAA,MAAA,GAAAC;AAAAA,IAAAA,IAAAhB;AAAAI,IAAAA,IAAAY,GAEzBb,IAAAc,GACaZ,IAAAD,EAAKc,OACRX,IAAAH,EAAM,SAAS,GACxBI,IAAA,IACAC,IAAA,IACAC,IAAA,IACUC,IAAAP,EAAKe,UACNP,IAAAR,EAAKgB,SACTL,IAAAA,GACAD,IAAA,UACDR,IAAAe,EAAAA,
|
|
1
|
+
{"version":3,"file":"IconButton.js","sources":["../../../../src/components/atoms/icon-button/IconButton.tsx"],"sourcesContent":["import { IconButton as MUIIconButton, type SxProps } from '@mui/material';\nimport { merge } from 'lodash';\nimport type { JSX, Ref } from 'react';\nimport { AoaTooltip } from '../tooltip/Tooltip';\n\nexport interface AoaIconButtonProps {\n /**\n * Data-qa tag for E2E test purposes\n */\n readonly 'data-qa'?: string;\n /**\n * Whether this button should be disabled\n */\n readonly disabled?: boolean;\n /**\n * The icon to be displayed as a button\n */\n readonly icon: JSX.Element;\n /**\n * Whether this button is being used inline\n */\n readonly inline?: boolean;\n /**\n * The label that is shown on hover\n */\n readonly label: string;\n /**\n * The action that should be triggered when clicking the button\n */\n onClick(this: void, ..._args: any[]): void;\n /**\n * The ref to the button element\n */\n readonly ref?: Ref<HTMLButtonElement> | undefined;\n /**\n * Material UI's property to apply styling\n */\n readonly sx?: SxProps;\n}\n\n/**\n * Constructs an icon button using pre-defined Rijks styling\n *\n * @param props - Props to pass to the icon button\n * @example\n * ```jsx\n * <AoaIconButton onClick={() => console.log()} label='Order a burger' icon={<Fastfood />} />\n * ```\n */\nexport function AoaIconButton({ ref, ...props }: AoaIconButtonProps) {\n const Button = (\n <MUIIconButton\n aria-label={props.label}\n data-qa={props['data-qa']}\n disableFocusRipple\n disableRipple\n disableTouchRipple\n disabled={props.disabled}\n onClick={props.onClick}\n ref={ref}\n role='button'\n sx={merge(\n {\n color: 'var(--color-primary)',\n border: '1px solid var(--color-primary)',\n borderRadius: 0,\n ':hover, :active, :focus': {\n color: 'var(--color-primary-hover)',\n borderColor: 'var(--color-primary-hover)'\n },\n ':disabled': {\n backgroundColor: 'transparent',\n borderColor: 'var(--color-text-disabled)',\n color: 'var(--color-text-disabled)'\n },\n ':focus': {\n outline: '2px dashed var(--color-text)',\n outlineOffset: 3,\n boxShadow: 'none'\n },\n ...(props.inline && {\n border: 'none',\n padding: 0\n })\n },\n props.sx\n )}\n >\n {props.icon}\n </MUIIconButton>\n );\n\n return (\n <AoaTooltip title={props.label}>\n {props.disabled ? (\n <span aria-label={props.label} data-testid='disabled-span-wrapper' role='tooltip'>\n {Button}\n </span>\n ) : (\n Button\n )}\n </AoaTooltip>\n );\n}\n"],"names":["AoaIconButton","t0","$","_c","T0","props","t1","t10","t2","t3","t4","t5","t6","t7","t8","t9","ref","t11","MUIIconButton","label","disabled","onClick","merge","color","border","borderRadius","borderColor","backgroundColor","outline","outlineOffset","boxShadow","inline","padding","sx","icon","jsx","Button","t12","t13","AoaTooltip"],"mappings":"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"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { SxProps } from '@mui/material';
|
|
2
|
+
import { JSX } from 'react';
|
|
3
|
+
export interface AoaListItem {
|
|
4
|
+
/**
|
|
5
|
+
* Data-qa tag to apply to the list item
|
|
6
|
+
*/
|
|
7
|
+
readonly dataQa?: string;
|
|
8
|
+
/**
|
|
9
|
+
* Key of the list item
|
|
10
|
+
*/
|
|
11
|
+
readonly key: string;
|
|
12
|
+
/**
|
|
13
|
+
* Value of the list item
|
|
14
|
+
*/
|
|
15
|
+
readonly value: JSX.Element | string;
|
|
16
|
+
}
|
|
17
|
+
export interface AoaListProps {
|
|
18
|
+
/**
|
|
19
|
+
* Data-qa tag to apply to the list
|
|
20
|
+
*/
|
|
21
|
+
readonly 'data-qa'?: string;
|
|
22
|
+
/**
|
|
23
|
+
* Key-value pairs to show as a list
|
|
24
|
+
*/
|
|
25
|
+
readonly listItems: AoaListItem[];
|
|
26
|
+
/**
|
|
27
|
+
* Any additional CSSProperties to pass to the component
|
|
28
|
+
*/
|
|
29
|
+
readonly sx?: SxProps;
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* Creates a key-value list using pre-defined Rijkswaterstaat styling
|
|
33
|
+
*
|
|
34
|
+
* @example
|
|
35
|
+
* ```jsx
|
|
36
|
+
*
|
|
37
|
+
* <AoaList listItems={[{ key: 'Name', value: 'John Connor' }]} />
|
|
38
|
+
*
|
|
39
|
+
* ```
|
|
40
|
+
*/
|
|
41
|
+
export declare function AoaList({ listItems, 'data-qa': dataQa, sx }: AoaListProps): import("react/jsx-runtime").JSX.Element;
|
|
42
|
+
//# sourceMappingURL=List.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"List.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/list/List.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAsE,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AAEjH,OAAO,EAAY,KAAK,GAAG,EAAE,MAAM,OAAO,CAAC;AAG3C,MAAM,WAAW,WAAW;IAC1B;;OAEG;IACH,QAAQ,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,QAAQ,CAAC,KAAK,EAAE,GAAG,CAAC,OAAO,GAAG,MAAM,CAAC;CACtC;AAED,MAAM,WAAW,YAAY;IAC3B;;OAEG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,QAAQ,CAAC,SAAS,EAAE,WAAW,EAAE,CAAC;IAClC;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;;;;;;;;GASG;AACH,wBAAgB,OAAO,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,YAAY,2CAsCzE"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import { jsxs as m, jsx as a } from "react/jsx-runtime";
|
|
2
|
+
import { Grid as d, List as i, ListItem as c, ListItemText as u, listItemClasses as f } from "@mui/material";
|
|
3
|
+
import { l as g } from "../../../chunks/lodash.DPVO3Hgf.js";
|
|
4
|
+
import { Fragment as s } from "react";
|
|
5
|
+
import { FontNormalSxProps as x } from "../../../_constants.js";
|
|
6
|
+
function k({
|
|
7
|
+
listItems: o,
|
|
8
|
+
"data-qa": l,
|
|
9
|
+
sx: p
|
|
10
|
+
}) {
|
|
11
|
+
function e(r, t) {
|
|
12
|
+
const n = t === "key";
|
|
13
|
+
return /* @__PURE__ */ a(c, { sx: {
|
|
14
|
+
[`&.${f.root}`]: {
|
|
15
|
+
padding: "0 10px 0 0",
|
|
16
|
+
span: {
|
|
17
|
+
fontSize: "1rem",
|
|
18
|
+
lineHeight: "1.43rem"
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}, children: /* @__PURE__ */ a(u, { "data-qa": n ? null : r.dataQa, primary: r[t], sx: {
|
|
22
|
+
span: {
|
|
23
|
+
fontWeight: n ? "bold" : "normal"
|
|
24
|
+
},
|
|
25
|
+
wrap: n ? "nowrap" : "normal"
|
|
26
|
+
} }) });
|
|
27
|
+
}
|
|
28
|
+
return /* @__PURE__ */ m(d, { container: !0, "data-qa": l ?? null, direction: "row", spacing: 1, sx: g.merge({
|
|
29
|
+
flexWrap: "nowrap"
|
|
30
|
+
}, p, x), children: [
|
|
31
|
+
/* @__PURE__ */ a(i, { children: o.map((r, t) => /* @__PURE__ */ a(s, { children: e(r, "key") }, r.key.toString() + t)) }),
|
|
32
|
+
/* @__PURE__ */ a(i, { children: o.map((r, t) => /* @__PURE__ */ a(s, { children: e(r, "value") }, typeof r.value == "string" ? r.value.toString() + t : t)) })
|
|
33
|
+
] });
|
|
34
|
+
}
|
|
35
|
+
export {
|
|
36
|
+
k as AoaList
|
|
37
|
+
};
|
|
38
|
+
//# sourceMappingURL=List.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"List.js","sources":["../../../../src/components/atoms/list/List.tsx"],"sourcesContent":["import { Grid, List, listItemClasses, ListItemText, ListItem as MUIListItem, type SxProps } from '@mui/material';\nimport { merge } from 'lodash';\nimport { Fragment, type JSX } from 'react';\nimport { FontNormalSxProps } from '../../../_constants';\n\nexport interface AoaListItem {\n /**\n * Data-qa tag to apply to the list item\n */\n readonly dataQa?: string;\n /**\n * Key of the list item\n */\n readonly key: string;\n /**\n * Value of the list item\n */\n readonly value: JSX.Element | string;\n}\n\nexport interface AoaListProps {\n /**\n * Data-qa tag to apply to the list\n */\n readonly 'data-qa'?: string;\n /**\n * Key-value pairs to show as a list\n */\n readonly listItems: AoaListItem[];\n /**\n * Any additional CSSProperties to pass to the component\n */\n readonly sx?: SxProps;\n}\n\n/**\n * Creates a key-value list using pre-defined Rijkswaterstaat styling\n *\n * @example\n * ```jsx\n *\n * <AoaList listItems={[{ key: 'Name', value: 'John Connor' }]} />\n *\n * ```\n */\nexport function AoaList({ listItems, 'data-qa': dataQa, sx }: AoaListProps) {\n function getListItem(item: AoaListItem, type: 'key' | 'value') {\n const isKey = type === 'key';\n return (\n <MUIListItem\n sx={{\n [`&.${listItemClasses.root}`]: {\n padding: `0 10px 0 0`,\n span: {\n fontSize: '1rem',\n lineHeight: '1.43rem'\n }\n }\n }}\n >\n <ListItemText\n data-qa={isKey ? null : item.dataQa}\n primary={item[type]}\n sx={{ span: { fontWeight: isKey ? 'bold' : 'normal' }, wrap: isKey ? 'nowrap' : 'normal' }}\n />\n </MUIListItem>\n );\n }\n\n return (\n <Grid container data-qa={dataQa ?? null} direction='row' spacing={1} sx={merge({ flexWrap: 'nowrap' }, sx, FontNormalSxProps)}>\n <List>\n {listItems.map((item, index) => {\n return <Fragment key={item.key.toString() + index}>{getListItem(item, 'key')}</Fragment>;\n })}\n </List>\n <List>\n {listItems.map((item, index) => {\n return <Fragment key={typeof item.value === 'string' ? item.value.toString() + index : index}>{getListItem(item, 'value')}</Fragment>;\n })}\n </List>\n </Grid>\n );\n}\n"],"names":["AoaList","listItems","dataQa","sx","getListItem","item","type","isKey","jsx","MUIListItem","listItemClasses","root","padding","span","fontSize","lineHeight","ListItemText","fontWeight","wrap","jsxs","Grid","merge","flexWrap","FontNormalSxProps","List","map","index","Fragment","key","toString","value"],"mappings":";;;;;AA6CO,SAASA,EAAQ;AAAA,EAAEC,WAAAA;AAAAA,EAAW,WAAWC;AAAAA,EAAQC,IAAAA;AAAiB,GAAG;AAC1E,WAASC,EAAYC,GAAmBC,GAAuB;AAC7D,UAAMC,IAAQD,MAAS;AACvB,WACE,gBAAAE,EAACC,KACC,IAAI;AAAA,MACF,CAAC,KAAKC,EAAgBC,IAAI,EAAE,GAAG;AAAA,QAC7BC,SAAS;AAAA,QACTC,MAAM;AAAA,UACJC,UAAU;AAAA,UACVC,YAAY;AAAA,QAAA;AAAA,MACd;AAAA,IACF,GAGF,UAAA,gBAAAP,EAACQ,GAAA,EACC,WAAST,IAAQ,OAAOF,EAAKH,QAC7B,SAASG,EAAKC,CAAI,GAClB,IAAI;AAAA,MAAEO,MAAM;AAAA,QAAEI,YAAYV,IAAQ,SAAS;AAAA,MAAA;AAAA,MAAYW,MAAMX,IAAQ,WAAW;AAAA,IAAA,GAAW,EAAA,CAE/F;AAAA,EAEJ;AAEA,SACE,gBAAAY,EAACC,GAAA,EAAK,WAAS,IAAC,WAASlB,KAAU,MAAM,WAAU,OAAM,SAAS,GAAG,IAAImB,EAAAA,MAAM;AAAA,IAAEC,UAAU;AAAA,EAAA,GAAYnB,GAAIoB,CAAiB,GAC1H,UAAA;AAAA,IAAA,gBAAAf,EAACgB,GAAA,EACEvB,UAAAA,EAAUwB,IAAI,CAACpB,GAAMqB,MACb,gBAAAlB,EAACmB,GAAA,EAA4CvB,UAAAA,EAAYC,GAAM,KAAK,KAArDA,EAAKuB,IAAIC,SAAAA,IAAaH,CAAiC,CAC9E,EAAA,CACH;AAAA,sBACCF,GAAA,EACEvB,UAAAA,EAAUwB,IAAI,CAACpB,GAAMqB,MACb,gBAAAlB,EAACmB,GAAA,EAAuFvB,UAAAA,EAAYC,GAAM,OAAO,EAAA,GAAlG,OAAOA,EAAKyB,SAAU,WAAWzB,EAAKyB,MAAMD,SAAAA,IAAaH,IAAQA,CAAmC,CAC3H,EAAA,CACH;AAAA,EAAA,GACF;AAEJ;"}
|