@form-engine-ts/mui 2.9.2 → 2.9.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,333 +1,1141 @@
1
- // src/index.tsx
2
- import {
3
- Add,
4
- ArrowDownward,
5
- ArrowUpward,
6
- Close,
7
- Delete,
8
- DragHandle,
9
- Edit,
10
- Settings,
11
- Translate
12
- } from "@mui/icons-material";
13
- import {
14
- Alert,
15
- Box,
16
- Button,
17
- Checkbox,
18
- FormControl,
19
- FormControlLabel,
20
- FormHelperText,
21
- IconButton,
22
- InputLabel,
23
- MenuItem,
24
- Paper,
25
- Select,
26
- TextField,
27
- Typography
28
- } from "@mui/material";
29
- import { jsx, jsxs } from "react/jsx-runtime";
30
- function MuiButtonAdapter({
31
- id,
32
- className,
33
- disabled,
34
- "aria-label": ariaLabel,
35
- onClick,
36
- children,
37
- title,
38
- variant = "secondary",
39
- action,
40
- targetId
41
- }) {
42
- return /* @__PURE__ */ jsx(
43
- Button,
44
- {
45
- id,
46
- className,
47
- type: "button",
48
- disabled,
49
- "aria-label": ariaLabel,
50
- title,
51
- "data-builder-action": action,
52
- "data-target-id": targetId,
53
- onClick,
54
- color: variant === "danger" ? "error" : "primary",
55
- variant: variant === "primary" ? "contained" : "outlined",
56
- children
57
- }
58
- );
1
+ // src/adapters/Button.tsx
2
+ import { Button } from "@mui/material";
3
+
4
+ // src/types.ts
5
+ function resolveMuiAdapterOptions(options = {}) {
6
+ return {
7
+ size: options.size ?? "medium",
8
+ variant: options.variant ?? "outlined",
9
+ buttonVariant: options.buttonVariant ?? "contained",
10
+ fullWidth: options.fullWidth ?? true,
11
+ dense: options.dense ?? false
12
+ };
59
13
  }
60
- function MuiIconButtonAdapter({
61
- id,
62
- className,
63
- disabled,
64
- readOnly,
65
- "aria-label": ariaLabel,
66
- "aria-describedby": ariaDescribedBy,
67
- "aria-labelledby": ariaLabelledBy,
68
- onClick,
69
- icon,
70
- title
71
- }) {
72
- return /* @__PURE__ */ jsx(
73
- IconButton,
74
- {
75
- id,
76
- className,
77
- component: "button",
78
- type: "button",
79
- disabled: disabled || readOnly,
80
- "aria-label": ariaLabel ?? title,
81
- "aria-describedby": ariaDescribedBy,
82
- "aria-labelledby": ariaLabelledBy,
83
- title,
84
- onClick,
85
- sx: { minWidth: 0, padding: 0.5 },
86
- children: icon
87
- }
88
- );
89
- }
90
- function MuiTextInputAdapter({
91
- id,
92
- className,
93
- disabled,
94
- readOnly,
95
- "aria-label": ariaLabel,
96
- "aria-describedby": ariaDescribedBy,
97
- "aria-labelledby": ariaLabelledBy,
98
- name,
99
- label,
100
- required,
101
- error,
102
- helperText,
103
- value,
104
- onChange,
105
- placeholder,
106
- maxLength,
107
- inputMode,
108
- type = "text",
109
- min,
110
- max,
111
- step
112
- }) {
113
- return /* @__PURE__ */ jsx(
114
- TextField,
115
- {
116
- id,
117
- className,
118
- name,
119
- label,
120
- required,
121
- error,
122
- helperText,
123
- value,
124
- disabled,
125
- slotProps: {
126
- htmlInput: { maxLength, min, max, step, inputMode },
127
- input: { readOnly },
128
- formHelperText: { id: ariaDescribedBy }
129
- },
130
- type,
131
- placeholder,
132
- "aria-label": ariaLabel,
133
- "aria-describedby": ariaDescribedBy,
134
- "aria-labelledby": ariaLabelledBy,
135
- fullWidth: true,
136
- variant: "outlined",
137
- onChange: (event) => onChange(event.currentTarget.value)
138
- }
139
- );
140
- }
141
- function MuiTextAreaAdapter({
142
- id,
143
- className,
144
- disabled,
145
- readOnly,
146
- "aria-label": ariaLabel,
147
- "aria-describedby": ariaDescribedBy,
148
- "aria-labelledby": ariaLabelledBy,
149
- name,
150
- label,
151
- required,
152
- error,
153
- helperText,
154
- value,
155
- onChange,
156
- placeholder,
157
- maxLength,
158
- rows
159
- }) {
160
- return /* @__PURE__ */ jsx(
161
- TextField,
162
- {
163
- id,
164
- className,
165
- name,
166
- label,
167
- required,
168
- error,
169
- helperText,
170
- value,
171
- disabled,
172
- slotProps: {
173
- htmlInput: { maxLength },
174
- input: { readOnly },
175
- formHelperText: { id: ariaDescribedBy }
176
- },
177
- multiline: true,
178
- rows,
179
- placeholder,
180
- "aria-label": ariaLabel,
181
- "aria-describedby": ariaDescribedBy,
182
- "aria-labelledby": ariaLabelledBy,
183
- fullWidth: true,
184
- variant: "outlined",
185
- onChange: (event) => onChange(event.currentTarget.value)
186
- }
187
- );
188
- }
189
- function MuiSelectAdapter({
190
- id,
191
- className,
192
- disabled,
193
- readOnly,
194
- "aria-label": ariaLabel,
195
- "aria-describedby": ariaDescribedBy,
196
- "aria-labelledby": ariaLabelledBy,
197
- name,
198
- label,
199
- required,
200
- error,
201
- helperText,
202
- value,
203
- onChange,
204
- options
205
- }) {
206
- const labelId = id === void 0 ? void 0 : `${id}-label`;
207
- const handleChange = (event) => onChange(event.target.value);
208
- return /* @__PURE__ */ jsxs(FormControl, { className, fullWidth: true, error, required, disabled, children: [
209
- label === void 0 ? null : /* @__PURE__ */ jsx(InputLabel, { id: labelId, children: label }),
210
- /* @__PURE__ */ jsx(
211
- Select,
14
+
15
+ // src/adapters/Button.tsx
16
+ import { jsx } from "react/jsx-runtime";
17
+ function createMuiButtonAdapter(options) {
18
+ const resolved = resolveMuiAdapterOptions(options);
19
+ return function MuiButton({
20
+ id,
21
+ className,
22
+ disabled,
23
+ readOnly,
24
+ "aria-label": ariaLabel,
25
+ "aria-describedby": ariaDescribedBy,
26
+ "aria-labelledby": ariaLabelledBy,
27
+ onClick,
28
+ children,
29
+ title,
30
+ variant,
31
+ action,
32
+ targetId
33
+ }) {
34
+ return /* @__PURE__ */ jsx(
35
+ Button,
212
36
  {
213
37
  id,
214
- labelId,
215
- name,
216
- label,
217
- value,
218
- onChange: handleChange,
219
- readOnly,
38
+ className,
39
+ type: "button",
40
+ size: resolved.size,
41
+ disabled: disabled || readOnly,
220
42
  "aria-label": ariaLabel,
221
43
  "aria-describedby": ariaDescribedBy,
222
44
  "aria-labelledby": ariaLabelledBy,
223
- variant: "outlined",
224
- children: options.map((option) => /* @__PURE__ */ jsx(MenuItem, { value: option.value, disabled: option.disabled, children: option.label }, option.value))
45
+ title,
46
+ "data-builder-action": action,
47
+ "data-target-id": targetId,
48
+ onClick,
49
+ color: variant === "danger" ? "error" : "primary",
50
+ variant: resolved.buttonVariant,
51
+ fullWidth: resolved.fullWidth,
52
+ children
225
53
  }
226
- ),
227
- helperText === void 0 || helperText.length === 0 ? null : /* @__PURE__ */ jsx(FormHelperText, { id: ariaDescribedBy, children: helperText })
228
- ] });
54
+ );
55
+ };
229
56
  }
230
- function MuiCheckboxAdapter({
231
- id,
232
- className,
233
- disabled,
234
- readOnly,
235
- "aria-label": ariaLabel,
236
- checked,
237
- onChange,
238
- label
239
- }) {
240
- return /* @__PURE__ */ jsx(
241
- FormControlLabel,
242
- {
243
- className,
244
- label,
245
- control: /* @__PURE__ */ jsx(
246
- Checkbox,
57
+ var MuiButtonAdapter = createMuiButtonAdapter();
58
+
59
+ // src/adapters/Checkbox.tsx
60
+ import { Checkbox, FormControl, FormControlLabel, FormHelperText } from "@mui/material";
61
+ import { jsx as jsx2, jsxs } from "react/jsx-runtime";
62
+ function createMuiCheckboxAdapter(options) {
63
+ const resolved = resolveMuiAdapterOptions(options);
64
+ return function MuiCheckbox({
65
+ id,
66
+ className,
67
+ disabled,
68
+ readOnly,
69
+ "aria-label": ariaLabel,
70
+ "aria-describedby": ariaDescribedBy,
71
+ "aria-labelledby": ariaLabelledBy,
72
+ name,
73
+ required,
74
+ error,
75
+ helperText,
76
+ checked,
77
+ onChange,
78
+ label
79
+ }) {
80
+ return /* @__PURE__ */ jsxs(FormControl, { className, error: Boolean(error), required, disabled: disabled || readOnly, children: [
81
+ /* @__PURE__ */ jsx2(
82
+ FormControlLabel,
247
83
  {
248
- id,
249
- checked,
250
- disabled: disabled || readOnly,
251
- inputProps: { "aria-label": ariaLabel },
252
- onChange: (event) => onChange(event.target.checked)
84
+ label,
85
+ control: /* @__PURE__ */ jsx2(
86
+ Checkbox,
87
+ {
88
+ id,
89
+ name,
90
+ size: resolved.size,
91
+ checked,
92
+ required,
93
+ disabled: disabled || readOnly,
94
+ inputProps: {
95
+ "aria-label": ariaLabel,
96
+ "aria-describedby": ariaDescribedBy,
97
+ "aria-labelledby": ariaLabelledBy
98
+ },
99
+ onChange: (event) => onChange(event.target.checked)
100
+ }
101
+ )
253
102
  }
254
- )
255
- }
256
- );
103
+ ),
104
+ helperText === void 0 || helperText.length === 0 ? null : /* @__PURE__ */ jsx2(FormHelperText, { id: ariaDescribedBy, children: helperText })
105
+ ] });
106
+ };
257
107
  }
258
- function MuiSectionAdapter({
259
- id,
260
- className,
261
- title,
262
- description,
263
- headingId,
264
- "aria-label": ariaLabel,
265
- children
266
- }) {
267
- return /* @__PURE__ */ jsxs(
268
- Paper,
269
- {
270
- id,
271
- className,
272
- "aria-label": ariaLabel,
273
- "aria-labelledby": title === void 0 ? void 0 : headingId,
274
- sx: { p: 2, mb: 2 },
275
- children: [
276
- title === void 0 ? null : /* @__PURE__ */ jsx(Typography, { id: headingId, variant: "h6", children: title }),
277
- description === void 0 ? null : /* @__PURE__ */ jsx(Typography, { variant: "body2", children: description }),
278
- children
279
- ]
280
- }
281
- );
108
+ var MuiCheckboxAdapter = createMuiCheckboxAdapter();
109
+
110
+ // src/adapters/ErrorMessage.tsx
111
+ import { Alert } from "@mui/material";
112
+ import { jsx as jsx3 } from "react/jsx-runtime";
113
+ function createMuiErrorMessageAdapter(_options) {
114
+ return function MuiErrorMessage({
115
+ id,
116
+ className,
117
+ "aria-label": ariaLabel,
118
+ "aria-describedby": ariaDescribedBy,
119
+ "aria-labelledby": ariaLabelledBy,
120
+ message
121
+ }) {
122
+ return /* @__PURE__ */ jsx3(
123
+ Alert,
124
+ {
125
+ id,
126
+ className,
127
+ severity: "error",
128
+ "aria-label": ariaLabel,
129
+ "aria-describedby": ariaDescribedBy,
130
+ "aria-labelledby": ariaLabelledBy,
131
+ sx: { my: 1 },
132
+ children: message
133
+ }
134
+ );
135
+ };
282
136
  }
283
- function MuiFieldsetAdapter({ className, legend, disabled, children }) {
284
- return /* @__PURE__ */ jsxs(Box, { component: "fieldset", className, disabled, sx: { border: 0, m: 0, p: 0 }, children: [
285
- legend === void 0 ? null : /* @__PURE__ */ jsx(Typography, { component: "legend", variant: "subtitle1", children: legend }),
137
+ var MuiErrorMessageAdapter = createMuiErrorMessageAdapter();
138
+
139
+ // src/adapters/Fieldset.tsx
140
+ import { Box, Typography } from "@mui/material";
141
+ import { jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
142
+ function createMuiFieldsetAdapter(options) {
143
+ const resolved = resolveMuiAdapterOptions(options);
144
+ return function MuiFieldset({ className, legend, disabled, children }) {
145
+ return /* @__PURE__ */ jsxs2(
146
+ Box,
147
+ {
148
+ component: "fieldset",
149
+ className,
150
+ disabled,
151
+ sx: {
152
+ border: 0,
153
+ m: 0,
154
+ p: 0,
155
+ minWidth: 0,
156
+ display: "grid",
157
+ gap: resolved.dense ? 1 : 2,
158
+ "& > div:not(.MuiStack-root):not(.MuiPaper-root)": {
159
+ display: "grid",
160
+ gap: resolved.dense ? 1 : 2
161
+ }
162
+ },
163
+ children: [
164
+ legend === void 0 ? null : /* @__PURE__ */ jsx4(Typography, { component: "legend", variant: "subtitle1", fontWeight: "bold", sx: { mb: 1 }, children: legend }),
165
+ children
166
+ ]
167
+ }
168
+ );
169
+ };
170
+ }
171
+ var MuiFieldsetAdapter = createMuiFieldsetAdapter();
172
+
173
+ // src/adapters/IconButton.tsx
174
+ import { IconButton, Tooltip } from "@mui/material";
175
+ import { jsx as jsx5 } from "react/jsx-runtime";
176
+ var ACTION_LABELS = {
177
+ moveUp: "\u4E0A\u3078\u79FB\u52D5",
178
+ moveDown: "\u4E0B\u3078\u79FB\u52D5",
179
+ delete: "\u524A\u9664",
180
+ add: "\u8FFD\u52A0",
181
+ edit: "\u7DE8\u96C6",
182
+ settings: "\u8A2D\u5B9A",
183
+ translate: "\u7FFB\u8A33",
184
+ close: "\u9589\u3058\u308B",
185
+ dragHandle: "\u4E26\u3079\u66FF\u3048"
186
+ };
187
+ function createMuiIconButtonAdapter(options) {
188
+ const resolved = resolveMuiAdapterOptions(options);
189
+ return function MuiIconButton({
190
+ id,
191
+ className,
192
+ disabled,
193
+ readOnly,
194
+ "aria-label": ariaLabel,
195
+ "aria-describedby": ariaDescribedBy,
196
+ "aria-labelledby": ariaLabelledBy,
197
+ onClick,
198
+ icon,
199
+ actionType,
200
+ title
201
+ }) {
202
+ const actionLabel = actionType === void 0 ? "\u64CD\u4F5C" : ACTION_LABELS[actionType];
203
+ const tooltip = title ?? actionLabel;
204
+ const color = actionType === "delete" ? "error" : actionType === "add" ? "primary" : "default";
205
+ return /* @__PURE__ */ jsx5(Tooltip, { title: tooltip, children: /* @__PURE__ */ jsx5("span", { children: /* @__PURE__ */ jsx5(
206
+ IconButton,
207
+ {
208
+ id,
209
+ className,
210
+ type: "button",
211
+ size: resolved.size,
212
+ color,
213
+ disabled: disabled || readOnly,
214
+ "aria-label": ariaLabel ?? tooltip,
215
+ "aria-describedby": ariaDescribedBy,
216
+ "aria-labelledby": ariaLabelledBy,
217
+ onClick,
218
+ children: icon
219
+ }
220
+ ) }) });
221
+ };
222
+ }
223
+ var MuiIconButtonAdapter = createMuiIconButtonAdapter();
224
+
225
+ // src/adapters/Section.tsx
226
+ import { Paper, Typography as Typography2 } from "@mui/material";
227
+ import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
228
+ function createMuiSectionAdapter(options) {
229
+ const resolved = resolveMuiAdapterOptions(options);
230
+ return function MuiSection({
231
+ id,
232
+ className,
233
+ title,
234
+ description,
235
+ headingId,
236
+ "aria-label": ariaLabel,
237
+ onClickCapture,
286
238
  children
287
- ] });
239
+ }) {
240
+ return /* @__PURE__ */ jsxs3(
241
+ Paper,
242
+ {
243
+ id,
244
+ className,
245
+ elevation: 0,
246
+ "aria-label": ariaLabel,
247
+ "aria-labelledby": title === void 0 ? void 0 : headingId,
248
+ onClickCapture,
249
+ sx: {
250
+ p: resolved.dense ? 1.5 : 2,
251
+ mb: resolved.dense ? 1 : 2,
252
+ border: 1,
253
+ borderColor: "divider",
254
+ borderRadius: 1,
255
+ display: "grid",
256
+ gap: resolved.dense ? 1 : 2,
257
+ "& > div:not(.MuiStack-root):not(.MuiPaper-root)": {
258
+ display: "grid",
259
+ gap: resolved.dense ? 1 : 2
260
+ }
261
+ },
262
+ children: [
263
+ title === void 0 ? null : /* @__PURE__ */ jsx6(Typography2, { id: headingId, variant: "subtitle1", fontWeight: "bold", children: title }),
264
+ description === void 0 ? null : /* @__PURE__ */ jsx6(Typography2, { variant: "body2", color: "text.secondary", sx: { mb: resolved.dense ? 0.5 : 1.5 }, children: description }),
265
+ children
266
+ ]
267
+ }
268
+ );
269
+ };
270
+ }
271
+ var MuiSectionAdapter = createMuiSectionAdapter();
272
+
273
+ // src/adapters/Select.tsx
274
+ import { FormControl as FormControl2, FormHelperText as FormHelperText2, InputLabel, MenuItem, Select } from "@mui/material";
275
+ import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
276
+ function createMuiSelectAdapter(options) {
277
+ const resolved = resolveMuiAdapterOptions(options);
278
+ return function MuiSelect({
279
+ id,
280
+ className,
281
+ disabled,
282
+ readOnly,
283
+ "aria-label": ariaLabel,
284
+ "aria-describedby": ariaDescribedBy,
285
+ "aria-labelledby": ariaLabelledBy,
286
+ name,
287
+ label,
288
+ required,
289
+ error,
290
+ helperText,
291
+ value,
292
+ onChange,
293
+ options: selectOptions
294
+ }) {
295
+ const labelId = id === void 0 || label === void 0 ? void 0 : `${id}-label`;
296
+ const handleChange = (event) => onChange(event.target.value);
297
+ return /* @__PURE__ */ jsxs4(
298
+ FormControl2,
299
+ {
300
+ className,
301
+ fullWidth: resolved.fullWidth,
302
+ size: resolved.size,
303
+ variant: resolved.variant,
304
+ error: Boolean(error),
305
+ required,
306
+ disabled,
307
+ children: [
308
+ label === void 0 ? null : /* @__PURE__ */ jsx7(InputLabel, { id: labelId, children: label }),
309
+ /* @__PURE__ */ jsx7(
310
+ Select,
311
+ {
312
+ id,
313
+ labelId,
314
+ name,
315
+ label,
316
+ value,
317
+ onChange: handleChange,
318
+ required,
319
+ readOnly,
320
+ inputProps: {
321
+ "aria-label": ariaLabel,
322
+ "aria-describedby": ariaDescribedBy,
323
+ "aria-labelledby": ariaLabelledBy
324
+ },
325
+ children: selectOptions.map((option) => /* @__PURE__ */ jsx7(MenuItem, { value: option.value, disabled: option.disabled, children: option.label }, option.value))
326
+ }
327
+ ),
328
+ helperText === void 0 || helperText.length === 0 ? null : /* @__PURE__ */ jsx7(FormHelperText2, { id: ariaDescribedBy, children: helperText })
329
+ ]
330
+ }
331
+ );
332
+ };
288
333
  }
289
- function MuiErrorMessageAdapter({ className, message }) {
290
- return /* @__PURE__ */ jsx(Alert, { className, severity: "error", children: message });
334
+ var MuiSelectAdapter = createMuiSelectAdapter();
335
+
336
+ // src/adapters/TextArea.tsx
337
+ import { TextField } from "@mui/material";
338
+ import { jsx as jsx8 } from "react/jsx-runtime";
339
+ function createMuiTextAreaAdapter(options) {
340
+ const resolved = resolveMuiAdapterOptions(options);
341
+ return function MuiTextArea({
342
+ id,
343
+ className,
344
+ disabled,
345
+ readOnly,
346
+ "aria-label": ariaLabel,
347
+ "aria-describedby": ariaDescribedBy,
348
+ "aria-labelledby": ariaLabelledBy,
349
+ name,
350
+ label,
351
+ required,
352
+ error,
353
+ helperText,
354
+ value,
355
+ onChange,
356
+ placeholder,
357
+ maxLength,
358
+ rows
359
+ }) {
360
+ return /* @__PURE__ */ jsx8(
361
+ TextField,
362
+ {
363
+ id,
364
+ className,
365
+ name,
366
+ label,
367
+ required,
368
+ error: Boolean(error),
369
+ helperText,
370
+ value,
371
+ disabled,
372
+ slotProps: {
373
+ htmlInput: {
374
+ maxLength,
375
+ "aria-label": ariaLabel,
376
+ "aria-describedby": ariaDescribedBy,
377
+ "aria-labelledby": ariaLabelledBy
378
+ },
379
+ input: { readOnly },
380
+ formHelperText: { id: ariaDescribedBy }
381
+ },
382
+ multiline: true,
383
+ rows,
384
+ placeholder,
385
+ fullWidth: resolved.fullWidth,
386
+ size: resolved.size,
387
+ variant: resolved.variant,
388
+ onChange: (event) => onChange(event.currentTarget.value)
389
+ }
390
+ );
391
+ };
291
392
  }
393
+ var MuiTextAreaAdapter = createMuiTextAreaAdapter();
394
+
395
+ // src/adapters/TextInput.tsx
396
+ import { TextField as TextField2 } from "@mui/material";
397
+ import { jsx as jsx9 } from "react/jsx-runtime";
398
+ function createMuiTextInputAdapter(options) {
399
+ const resolved = resolveMuiAdapterOptions(options);
400
+ return function MuiTextInput({
401
+ id,
402
+ className,
403
+ disabled,
404
+ readOnly,
405
+ "aria-label": ariaLabel,
406
+ "aria-describedby": ariaDescribedBy,
407
+ "aria-labelledby": ariaLabelledBy,
408
+ name,
409
+ label,
410
+ required,
411
+ error,
412
+ helperText,
413
+ value,
414
+ onChange,
415
+ placeholder,
416
+ maxLength,
417
+ inputMode,
418
+ type = "text",
419
+ min,
420
+ max,
421
+ step
422
+ }) {
423
+ return /* @__PURE__ */ jsx9(
424
+ TextField2,
425
+ {
426
+ id,
427
+ className,
428
+ name,
429
+ label,
430
+ required,
431
+ error: Boolean(error),
432
+ helperText,
433
+ value,
434
+ disabled,
435
+ slotProps: {
436
+ htmlInput: {
437
+ maxLength,
438
+ min,
439
+ max,
440
+ step,
441
+ inputMode,
442
+ "aria-label": ariaLabel,
443
+ "aria-describedby": ariaDescribedBy,
444
+ "aria-labelledby": ariaLabelledBy
445
+ },
446
+ input: { readOnly },
447
+ formHelperText: { id: ariaDescribedBy }
448
+ },
449
+ type,
450
+ placeholder,
451
+ fullWidth: resolved.fullWidth,
452
+ size: resolved.size,
453
+ variant: resolved.variant,
454
+ onChange: (event) => onChange(event.currentTarget.value)
455
+ }
456
+ );
457
+ };
458
+ }
459
+ var MuiTextInputAdapter = createMuiTextInputAdapter();
460
+
461
+ // src/icons.tsx
462
+ import {
463
+ Add,
464
+ ArrowDownward,
465
+ ArrowUpward,
466
+ Close,
467
+ Delete,
468
+ DragHandle,
469
+ Edit,
470
+ Settings,
471
+ Translate
472
+ } from "@mui/icons-material";
473
+ import { jsx as jsx10 } from "react/jsx-runtime";
292
474
  function muiDefaultIconResolver(actionType) {
293
475
  switch (actionType) {
294
476
  case "moveUp":
295
- return /* @__PURE__ */ jsx(ArrowUpward, { fontSize: "small" });
477
+ return /* @__PURE__ */ jsx10(ArrowUpward, { fontSize: "small" });
296
478
  case "moveDown":
297
- return /* @__PURE__ */ jsx(ArrowDownward, { fontSize: "small" });
479
+ return /* @__PURE__ */ jsx10(ArrowDownward, { fontSize: "small" });
298
480
  case "delete":
299
- return /* @__PURE__ */ jsx(Delete, { fontSize: "small" });
481
+ return /* @__PURE__ */ jsx10(Delete, { fontSize: "small" });
300
482
  case "add":
301
- return /* @__PURE__ */ jsx(Add, { fontSize: "small" });
483
+ return /* @__PURE__ */ jsx10(Add, { fontSize: "small" });
302
484
  case "edit":
303
- return /* @__PURE__ */ jsx(Edit, { fontSize: "small" });
485
+ return /* @__PURE__ */ jsx10(Edit, { fontSize: "small" });
304
486
  case "settings":
305
- return /* @__PURE__ */ jsx(Settings, { fontSize: "small" });
487
+ return /* @__PURE__ */ jsx10(Settings, { fontSize: "small" });
306
488
  case "translate":
307
- return /* @__PURE__ */ jsx(Translate, { fontSize: "small" });
489
+ return /* @__PURE__ */ jsx10(Translate, { fontSize: "small" });
308
490
  case "close":
309
- return /* @__PURE__ */ jsx(Close, { fontSize: "small" });
491
+ return /* @__PURE__ */ jsx10(Close, { fontSize: "small" });
310
492
  case "dragHandle":
311
- return /* @__PURE__ */ jsx(DragHandle, { fontSize: "small" });
493
+ return /* @__PURE__ */ jsx10(DragHandle, { fontSize: "small" });
312
494
  }
313
495
  }
314
- var muiBuilderComponents = {
315
- Button: MuiButtonAdapter,
316
- IconButton: MuiIconButtonAdapter,
317
- TextInput: MuiTextInputAdapter,
318
- TextArea: MuiTextAreaAdapter,
319
- Select: MuiSelectAdapter,
320
- Checkbox: MuiCheckboxAdapter,
321
- Section: MuiSectionAdapter,
322
- Fieldset: MuiFieldsetAdapter,
323
- ErrorMessage: MuiErrorMessageAdapter,
324
- renderIcon: muiDefaultIconResolver
496
+
497
+ // src/components.ts
498
+ function isAdapterOptions(value) {
499
+ return "size" in value || "variant" in value || "buttonVariant" in value || "fullWidth" in value || "dense" in value;
500
+ }
501
+ function buildMuiBuilderComponents(options) {
502
+ return {
503
+ Button: createMuiButtonAdapter(options),
504
+ IconButton: createMuiIconButtonAdapter(options),
505
+ TextInput: createMuiTextInputAdapter(options),
506
+ TextArea: createMuiTextAreaAdapter(options),
507
+ Select: createMuiSelectAdapter(options),
508
+ Checkbox: createMuiCheckboxAdapter(options),
509
+ Section: createMuiSectionAdapter(options),
510
+ Fieldset: createMuiFieldsetAdapter(options),
511
+ ErrorMessage: createMuiErrorMessageAdapter(options),
512
+ renderIcon: muiDefaultIconResolver
513
+ };
514
+ }
515
+ var muiBuilderComponents = buildMuiBuilderComponents();
516
+ function createMuiBuilderComponents(optionsOrOverrides = {}, customOverrides) {
517
+ const options = isAdapterOptions(optionsOrOverrides) ? optionsOrOverrides : void 0;
518
+ const overrides = customOverrides ?? (options === void 0 ? optionsOrOverrides : {});
519
+ return { ...buildMuiBuilderComponents(options), ...overrides };
520
+ }
521
+
522
+ // src/slots/FieldEditor.tsx
523
+ import { Card, Stack as Stack3, Typography as Typography3 } from "@mui/material";
524
+
525
+ // src/slots/OptionEditor.tsx
526
+ import { Stack } from "@mui/material";
527
+ import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
528
+ function createMuiOptionEditorSlot(options) {
529
+ const resolved = resolveMuiAdapterOptions(options);
530
+ return function MuiOptionEditor({
531
+ field,
532
+ option,
533
+ index,
534
+ currentLocale,
535
+ readOnly,
536
+ actions,
537
+ components
538
+ }) {
539
+ const { IconButton: IconButton2, TextInput } = components;
540
+ const describedBy = option.label.trim().length === 0 ? `mui-option-${option.id}-error` : void 0;
541
+ return /* @__PURE__ */ jsxs5(Stack, { "data-mui-slot": "option-editor", spacing: resolved.dense ? 0.75 : 1, children: [
542
+ /* @__PURE__ */ jsxs5(Stack, { direction: { xs: "column", sm: "row" }, spacing: 1, alignItems: { sm: "flex-start" }, children: [
543
+ /* @__PURE__ */ jsx11(
544
+ TextInput,
545
+ {
546
+ id: `mui-option-${option.id}`,
547
+ label: `Option ${index + 1}`,
548
+ value: option.label,
549
+ required: true,
550
+ error: option.label.trim().length === 0,
551
+ helperText: option.label.trim().length === 0 ? "Required" : "",
552
+ "aria-describedby": describedBy,
553
+ disabled: readOnly,
554
+ onChange: (value) => actions.updateOption(field.id, option.id, (current) => ({ ...current, label: value }))
555
+ }
556
+ ),
557
+ /* @__PURE__ */ jsxs5(Stack, { direction: "row", spacing: 0.5, children: [
558
+ /* @__PURE__ */ jsx11(
559
+ IconButton2,
560
+ {
561
+ actionType: "moveUp",
562
+ title: `Move ${option.label} up`,
563
+ disabled: readOnly || index === 0,
564
+ onClick: () => actions.moveOption(field.id, option.id, index - 1)
565
+ }
566
+ ),
567
+ /* @__PURE__ */ jsx11(
568
+ IconButton2,
569
+ {
570
+ actionType: "moveDown",
571
+ title: `Move ${option.label} down`,
572
+ disabled: readOnly || index === field.options.length - 1,
573
+ onClick: () => actions.moveOption(field.id, option.id, index + 1)
574
+ }
575
+ ),
576
+ /* @__PURE__ */ jsx11(
577
+ IconButton2,
578
+ {
579
+ actionType: "delete",
580
+ title: `Delete ${option.label}`,
581
+ disabled: readOnly || field.options.length <= 1,
582
+ onClick: () => actions.removeOption(field.id, option.id)
583
+ }
584
+ )
585
+ ] })
586
+ ] }),
587
+ currentLocale.length === 0 ? null : /* @__PURE__ */ jsx11(
588
+ TextInput,
589
+ {
590
+ id: `mui-option-${option.id}-${currentLocale}`,
591
+ label: `${currentLocale} translation`,
592
+ value: option.translations?.[currentLocale] ?? "",
593
+ disabled: readOnly,
594
+ onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "option", id: option.id }, "label", value)
595
+ }
596
+ )
597
+ ] });
598
+ };
599
+ }
600
+ var MuiOptionEditorSlot = createMuiOptionEditorSlot();
601
+
602
+ // src/slots/Toolbar.tsx
603
+ import { Stack as Stack2 } from "@mui/material";
604
+ import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
605
+ function createMuiToolbarSlot(options) {
606
+ const resolved = resolveMuiAdapterOptions(options);
607
+ return function MuiToolbar({
608
+ kind,
609
+ index,
610
+ total,
611
+ title,
612
+ onMoveUp,
613
+ onMoveDown,
614
+ onRemove,
615
+ readOnly,
616
+ components
617
+ }) {
618
+ const { IconButton: IconButton2 } = components;
619
+ return /* @__PURE__ */ jsxs6(
620
+ Stack2,
621
+ {
622
+ "data-mui-slot": "toolbar",
623
+ direction: "row",
624
+ spacing: resolved.dense ? 0.5 : 1,
625
+ alignItems: "center",
626
+ sx: { mb: resolved.dense ? 1 : 2 },
627
+ children: [
628
+ /* @__PURE__ */ jsx12(
629
+ IconButton2,
630
+ {
631
+ actionType: "moveUp",
632
+ title: `Move ${title} up`,
633
+ disabled: readOnly || index === 0,
634
+ onClick: onMoveUp
635
+ }
636
+ ),
637
+ /* @__PURE__ */ jsx12(
638
+ IconButton2,
639
+ {
640
+ actionType: "moveDown",
641
+ title: `Move ${title} down`,
642
+ disabled: readOnly || index === total - 1,
643
+ onClick: onMoveDown
644
+ }
645
+ ),
646
+ /* @__PURE__ */ jsx12(
647
+ IconButton2,
648
+ {
649
+ actionType: "delete",
650
+ title: `Delete ${title}`,
651
+ disabled: readOnly || kind !== "page" && total <= 1,
652
+ onClick: onRemove
653
+ }
654
+ )
655
+ ]
656
+ }
657
+ );
658
+ };
659
+ }
660
+ var MuiToolbarSlot = createMuiToolbarSlot();
661
+
662
+ // src/slots/FieldEditor.tsx
663
+ import { jsx as jsx13, jsxs as jsxs7 } from "react/jsx-runtime";
664
+ var FIELD_TYPES = [
665
+ "text",
666
+ "textarea",
667
+ "number",
668
+ "rating",
669
+ "select",
670
+ "multi-select",
671
+ "checkbox",
672
+ "radio"
673
+ ];
674
+ function isFieldType(value) {
675
+ return FIELD_TYPES.some((type) => type === value);
676
+ }
677
+ function numericValue(value) {
678
+ if (value.trim().length === 0) return void 0;
679
+ const parsed = Number(value);
680
+ return Number.isFinite(parsed) ? parsed : void 0;
681
+ }
682
+ function updateBound(field, property, value) {
683
+ if (field.type !== "number" && field.type !== "rating") return field;
684
+ const nextValue = numericValue(value);
685
+ if (nextValue !== void 0) return { ...field, [property]: nextValue };
686
+ const { [property]: _removed, ...remaining } = field;
687
+ return remaining;
688
+ }
689
+ function createMuiFieldEditorSlot(options) {
690
+ const resolved = resolveMuiAdapterOptions(options);
691
+ const Toolbar = createMuiToolbarSlot(options);
692
+ const OptionEditor = createMuiOptionEditorSlot(options);
693
+ return function MuiFieldEditor({
694
+ schema,
695
+ field,
696
+ index,
697
+ currentLocale,
698
+ policy,
699
+ readOnly,
700
+ actions,
701
+ components
702
+ }) {
703
+ const { Button: Button2, Checkbox: Checkbox2, Select: Select2, TextArea, TextInput } = components;
704
+ const allowedTypes = policy?.allowedFieldTypes ?? FIELD_TYPES;
705
+ const pageId = schema.pages?.find((page) => page.questionIds.includes(field.id))?.id ?? "";
706
+ const condition = field.displayCondition;
707
+ const conditionSources = schema.fields.slice(0, index);
708
+ const titleErrorId = field.title.trim().length === 0 ? `mui-field-${field.id}-title-error` : void 0;
709
+ return /* @__PURE__ */ jsxs7(
710
+ Card,
711
+ {
712
+ "data-mui-slot": "field-editor",
713
+ variant: "outlined",
714
+ sx: { mb: resolved.dense ? 1 : 2, p: resolved.dense ? 1.5 : 2 },
715
+ children: [
716
+ /* @__PURE__ */ jsx13(
717
+ Toolbar,
718
+ {
719
+ schema,
720
+ kind: "field",
721
+ targetId: field.id,
722
+ index,
723
+ total: schema.fields.length,
724
+ title: field.title,
725
+ onMoveUp: () => actions.moveField(field.id, index - 1),
726
+ onMoveDown: () => actions.moveField(field.id, index + 1),
727
+ onRemove: () => actions.removeField(field.id),
728
+ readOnly,
729
+ actions,
730
+ components
731
+ }
732
+ ),
733
+ /* @__PURE__ */ jsxs7(Stack3, { spacing: resolved.dense ? 1 : 2, children: [
734
+ /* @__PURE__ */ jsx13(Typography3, { variant: "subtitle1", fontWeight: "bold", children: field.title }),
735
+ /* @__PURE__ */ jsxs7(Stack3, { direction: { xs: "column", md: "row" }, spacing: resolved.dense ? 1 : 2, children: [
736
+ /* @__PURE__ */ jsx13(
737
+ TextInput,
738
+ {
739
+ id: `mui-field-${field.id}-title`,
740
+ name: `fields.${field.id}.title`,
741
+ label: "Question title",
742
+ value: field.title,
743
+ required: true,
744
+ error: field.title.trim().length === 0,
745
+ helperText: field.title.trim().length === 0 ? "Required" : "",
746
+ "aria-describedby": titleErrorId,
747
+ disabled: readOnly,
748
+ onChange: (value) => actions.setSourceText({ kind: "field", id: field.id }, "title", value)
749
+ }
750
+ ),
751
+ /* @__PURE__ */ jsx13(
752
+ Select2,
753
+ {
754
+ id: `mui-field-${field.id}-type`,
755
+ name: `fields.${field.id}.type`,
756
+ label: "Type",
757
+ value: field.type,
758
+ options: FIELD_TYPES.map((type) => ({
759
+ value: type,
760
+ label: type,
761
+ disabled: !allowedTypes.includes(type)
762
+ })),
763
+ disabled: readOnly,
764
+ onChange: (value) => {
765
+ if (isFieldType(value)) actions.changeFieldType(field.id, value);
766
+ }
767
+ }
768
+ )
769
+ ] }),
770
+ /* @__PURE__ */ jsx13(
771
+ TextArea,
772
+ {
773
+ id: `mui-field-${field.id}-description`,
774
+ name: `fields.${field.id}.description`,
775
+ label: "Description",
776
+ value: field.description ?? "",
777
+ rows: resolved.dense ? 2 : 3,
778
+ disabled: readOnly,
779
+ onChange: (value) => actions.setSourceText({ kind: "field", id: field.id }, "description", value)
780
+ }
781
+ ),
782
+ /* @__PURE__ */ jsx13(
783
+ Checkbox2,
784
+ {
785
+ id: `mui-field-${field.id}-required`,
786
+ name: `fields.${field.id}.required`,
787
+ label: "Required",
788
+ checked: field.required,
789
+ disabled: readOnly,
790
+ onChange: (checked) => actions.updateField(field.id, (current) => ({ ...current, required: checked }))
791
+ }
792
+ ),
793
+ schema.pages === void 0 ? null : /* @__PURE__ */ jsx13(
794
+ Select2,
795
+ {
796
+ id: `mui-field-${field.id}-page`,
797
+ label: "Page",
798
+ value: pageId,
799
+ options: [
800
+ { value: "", label: "Unassigned" },
801
+ ...schema.pages.map((page) => ({ value: page.id, label: page.title ?? page.id }))
802
+ ],
803
+ disabled: readOnly,
804
+ onChange: (value) => actions.assignFieldToPage(field.id, value.length === 0 ? null : value)
805
+ }
806
+ ),
807
+ field.type === "number" || field.type === "rating" ? /* @__PURE__ */ jsxs7(Stack3, { direction: { xs: "column", sm: "row" }, spacing: resolved.dense ? 1 : 2, children: [
808
+ /* @__PURE__ */ jsx13(
809
+ TextInput,
810
+ {
811
+ id: `mui-field-${field.id}-minimum`,
812
+ label: "Minimum",
813
+ type: "number",
814
+ value: field.min === void 0 ? "" : String(field.min),
815
+ disabled: readOnly,
816
+ onChange: (value) => actions.updateField(field.id, (current) => updateBound(current, "min", value))
817
+ }
818
+ ),
819
+ /* @__PURE__ */ jsx13(
820
+ TextInput,
821
+ {
822
+ id: `mui-field-${field.id}-maximum`,
823
+ label: "Maximum",
824
+ type: "number",
825
+ value: field.max === void 0 ? "" : String(field.max),
826
+ disabled: readOnly,
827
+ onChange: (value) => actions.updateField(field.id, (current) => updateBound(current, "max", value))
828
+ }
829
+ )
830
+ ] }) : null,
831
+ conditionSources.length === 0 ? null : /* @__PURE__ */ jsxs7(Stack3, { direction: { xs: "column", md: "row" }, spacing: resolved.dense ? 1 : 2, children: [
832
+ /* @__PURE__ */ jsx13(
833
+ Select2,
834
+ {
835
+ id: `mui-field-${field.id}-condition-source`,
836
+ label: "Display condition",
837
+ value: condition?.questionId ?? "",
838
+ options: [
839
+ { value: "", label: "Always visible" },
840
+ ...conditionSources.map((source) => ({ value: source.id, label: source.title }))
841
+ ],
842
+ disabled: readOnly,
843
+ onChange: (value) => actions.setDisplayCondition(
844
+ field.id,
845
+ value.length === 0 ? void 0 : { questionId: value, operator: "equals", value: "" }
846
+ )
847
+ }
848
+ ),
849
+ condition === void 0 ? null : /* @__PURE__ */ jsx13(
850
+ TextInput,
851
+ {
852
+ id: `mui-field-${field.id}-condition-value`,
853
+ label: "Condition value",
854
+ value: condition.value === void 0 ? "" : String(condition.value),
855
+ disabled: readOnly,
856
+ onChange: (value) => actions.setDisplayCondition(field.id, { ...condition, value })
857
+ }
858
+ )
859
+ ] }),
860
+ currentLocale.length === 0 ? null : /* @__PURE__ */ jsxs7(Stack3, { spacing: resolved.dense ? 1 : 2, children: [
861
+ /* @__PURE__ */ jsxs7(Typography3, { variant: "subtitle2", children: [
862
+ currentLocale,
863
+ " translation"
864
+ ] }),
865
+ /* @__PURE__ */ jsx13(
866
+ TextInput,
867
+ {
868
+ id: `mui-field-${field.id}-${currentLocale}-title`,
869
+ label: "Translated question title",
870
+ value: field.translations?.[currentLocale]?.title ?? "",
871
+ disabled: readOnly,
872
+ onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "field", id: field.id }, "title", value)
873
+ }
874
+ ),
875
+ /* @__PURE__ */ jsx13(
876
+ TextArea,
877
+ {
878
+ id: `mui-field-${field.id}-${currentLocale}-description`,
879
+ label: "Translated description",
880
+ value: field.translations?.[currentLocale]?.description ?? "",
881
+ disabled: readOnly,
882
+ onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "field", id: field.id }, "description", value)
883
+ }
884
+ )
885
+ ] }),
886
+ "options" in field ? /* @__PURE__ */ jsxs7(Stack3, { "data-mui-slot": "options", spacing: resolved.dense ? 1 : 2, children: [
887
+ /* @__PURE__ */ jsx13(Typography3, { variant: "subtitle2", children: "Options" }),
888
+ field.options.map((option, optionIndex) => /* @__PURE__ */ jsx13(
889
+ OptionEditor,
890
+ {
891
+ schema,
892
+ field,
893
+ option,
894
+ index: optionIndex,
895
+ currentLocale,
896
+ readOnly,
897
+ actions,
898
+ components
899
+ },
900
+ option.id
901
+ )),
902
+ /* @__PURE__ */ jsx13(
903
+ Button2,
904
+ {
905
+ action: "addOption",
906
+ targetId: field.id,
907
+ disabled: readOnly || policy?.maxOptionsPerField !== void 0 && field.options.length >= policy.maxOptionsPerField,
908
+ onClick: () => actions.addOption(field.id),
909
+ children: "Add option"
910
+ }
911
+ )
912
+ ] }) : null
913
+ ] })
914
+ ]
915
+ }
916
+ );
917
+ };
918
+ }
919
+ var MuiFieldEditorSlot = createMuiFieldEditorSlot();
920
+
921
+ // src/slots/Localization.tsx
922
+ import { Box as Box2, Stack as Stack4, Tab, Tabs, Typography as Typography4 } from "@mui/material";
923
+ import { useState } from "react";
924
+ import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
925
+ function createMuiLocalizationSlot(options) {
926
+ const resolved = resolveMuiAdapterOptions(options);
927
+ return function MuiLocalization({
928
+ schema,
929
+ currentLocale,
930
+ onCurrentLocaleChange,
931
+ onAutoTranslate,
932
+ isTranslating,
933
+ translationError,
934
+ readOnly,
935
+ actions,
936
+ components
937
+ }) {
938
+ const { Button: Button2, ErrorMessage, TextArea, TextInput } = components;
939
+ const [newLocale, setNewLocale] = useState("");
940
+ const locales = Array.from(
941
+ /* @__PURE__ */ new Set([
942
+ ...schema.supportedLocales ?? [],
943
+ ...schema.defaultLocale === void 0 ? [] : [schema.defaultLocale]
944
+ ])
945
+ );
946
+ const handleTabChange = (_event, value) => onCurrentLocaleChange(value);
947
+ const addLocale = () => {
948
+ const normalized = newLocale.trim();
949
+ if (normalized.length === 0) return;
950
+ const result = actions.addLocale(normalized);
951
+ if (!result.success) return;
952
+ onCurrentLocaleChange(normalized);
953
+ setNewLocale("");
954
+ };
955
+ return /* @__PURE__ */ jsx14(
956
+ Box2,
957
+ {
958
+ "data-mui-slot": "localization",
959
+ sx: {
960
+ mt: resolved.dense ? 1 : 2,
961
+ p: resolved.dense ? 1.5 : 2,
962
+ border: 1,
963
+ borderColor: "divider",
964
+ borderRadius: 1
965
+ },
966
+ children: /* @__PURE__ */ jsxs8(Stack4, { spacing: resolved.dense ? 1 : 2, children: [
967
+ /* @__PURE__ */ jsx14(Typography4, { variant: "subtitle1", fontWeight: "bold", children: "Localization" }),
968
+ /* @__PURE__ */ jsx14(
969
+ TextInput,
970
+ {
971
+ id: "mui-builder-completion-message",
972
+ label: "Completion message",
973
+ value: schema.completionMessage ?? "",
974
+ disabled: readOnly,
975
+ onChange: (value) => actions.setSourceText({ kind: "form" }, "completionMessage", value)
976
+ }
977
+ ),
978
+ /* @__PURE__ */ jsxs8(Stack4, { direction: { xs: "column", sm: "row" }, spacing: resolved.dense ? 1 : 2, children: [
979
+ /* @__PURE__ */ jsx14(
980
+ TextInput,
981
+ {
982
+ id: "mui-builder-default-locale",
983
+ label: "Default locale",
984
+ value: schema.defaultLocale ?? "",
985
+ disabled: readOnly,
986
+ onChange: (value) => actions.setDefaultLocale(value)
987
+ }
988
+ ),
989
+ /* @__PURE__ */ jsx14(
990
+ TextInput,
991
+ {
992
+ id: "mui-builder-new-locale",
993
+ label: "Add locale",
994
+ value: newLocale,
995
+ disabled: readOnly,
996
+ onChange: setNewLocale
997
+ }
998
+ ),
999
+ /* @__PURE__ */ jsx14(Button2, { disabled: readOnly || newLocale.trim().length === 0, onClick: addLocale, children: "Add locale" })
1000
+ ] }),
1001
+ locales.length === 0 ? null : /* @__PURE__ */ jsx14(
1002
+ Tabs,
1003
+ {
1004
+ value: locales.includes(currentLocale) ? currentLocale : false,
1005
+ onChange: handleTabChange,
1006
+ variant: "scrollable",
1007
+ scrollButtons: "auto",
1008
+ "aria-label": "Translation locale",
1009
+ children: locales.map((locale) => /* @__PURE__ */ jsx14(Tab, { value: locale, label: locale, disabled: readOnly && locale !== currentLocale }, locale))
1010
+ }
1011
+ ),
1012
+ /* @__PURE__ */ jsx14(
1013
+ Button2,
1014
+ {
1015
+ variant: "secondary",
1016
+ disabled: readOnly || currentLocale.length === 0 || isTranslating,
1017
+ onClick: onAutoTranslate,
1018
+ children: isTranslating ? "Translating\u2026" : "Translate all text"
1019
+ }
1020
+ ),
1021
+ translationError === void 0 ? null : /* @__PURE__ */ jsx14(ErrorMessage, { message: translationError }),
1022
+ currentLocale.length === 0 ? /* @__PURE__ */ jsx14(Typography4, { variant: "body2", color: "text.secondary", children: "Select a locale to edit translations." }) : /* @__PURE__ */ jsxs8(Stack4, { spacing: resolved.dense ? 1 : 2, children: [
1023
+ /* @__PURE__ */ jsx14(
1024
+ TextInput,
1025
+ {
1026
+ id: `mui-builder-${currentLocale}-form-title`,
1027
+ label: "Translated form title",
1028
+ value: schema.translations?.[currentLocale]?.title ?? "",
1029
+ disabled: readOnly,
1030
+ onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "form" }, "title", value)
1031
+ }
1032
+ ),
1033
+ /* @__PURE__ */ jsx14(
1034
+ TextArea,
1035
+ {
1036
+ id: `mui-builder-${currentLocale}-form-description`,
1037
+ label: "Translated form description",
1038
+ value: schema.translations?.[currentLocale]?.description ?? "",
1039
+ disabled: readOnly,
1040
+ onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "form" }, "description", value)
1041
+ }
1042
+ ),
1043
+ /* @__PURE__ */ jsx14(
1044
+ TextInput,
1045
+ {
1046
+ id: `mui-builder-${currentLocale}-completion-message`,
1047
+ label: "Translated completion message",
1048
+ value: schema.translations?.[currentLocale]?.completionMessage ?? "",
1049
+ disabled: readOnly,
1050
+ onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "form" }, "completionMessage", value)
1051
+ }
1052
+ )
1053
+ ] })
1054
+ ] })
1055
+ }
1056
+ );
1057
+ };
1058
+ }
1059
+ var MuiLocalizationSlot = createMuiLocalizationSlot();
1060
+
1061
+ // src/slots/index.ts
1062
+ var muiBuilderSlots = {
1063
+ toolbar: createMuiToolbarSlot(),
1064
+ fieldEditor: createMuiFieldEditorSlot(),
1065
+ optionEditor: createMuiOptionEditorSlot(),
1066
+ localization: createMuiLocalizationSlot()
325
1067
  };
326
- function createMuiBuilderComponents(customOverrides = {}) {
327
- return { ...muiBuilderComponents, ...customOverrides };
1068
+ function createMuiBuilderSlots(options, customOverrides = {}) {
1069
+ return {
1070
+ toolbar: createMuiToolbarSlot(options),
1071
+ fieldEditor: createMuiFieldEditorSlot(options),
1072
+ optionEditor: createMuiOptionEditorSlot(options),
1073
+ localization: createMuiLocalizationSlot(options),
1074
+ ...customOverrides
1075
+ };
1076
+ }
1077
+
1078
+ // src/builderProps.ts
1079
+ function createMuiBuilderProps(options, overrides = {}) {
1080
+ return {
1081
+ disableDefaultStyles: true,
1082
+ components: createMuiBuilderComponents(options, overrides.components),
1083
+ slots: createMuiBuilderSlots(options, overrides.slots)
1084
+ };
1085
+ }
1086
+
1087
+ // src/MuiFormBuilder.tsx
1088
+ import {
1089
+ FormBuilder
1090
+ } from "@form-engine-ts/react";
1091
+ import { useMemo } from "react";
1092
+ import { jsx as jsx15 } from "react/jsx-runtime";
1093
+ function MuiFormBuilder({
1094
+ muiOptions,
1095
+ components: customComponents,
1096
+ slots: customSlots,
1097
+ ...props
1098
+ }) {
1099
+ const components = useMemo(
1100
+ () => createMuiBuilderComponents(muiOptions, customComponents),
1101
+ [muiOptions, customComponents]
1102
+ );
1103
+ const slots = useMemo(() => createMuiBuilderSlots(muiOptions, customSlots), [muiOptions, customSlots]);
1104
+ return /* @__PURE__ */ jsx15(FormBuilder, { ...props, components, disableDefaultStyles: true, slots });
328
1105
  }
329
1106
  export {
1107
+ MuiButtonAdapter,
1108
+ MuiCheckboxAdapter,
1109
+ MuiErrorMessageAdapter,
1110
+ MuiFieldEditorSlot,
1111
+ MuiFieldsetAdapter,
1112
+ MuiFormBuilder,
1113
+ MuiIconButtonAdapter,
1114
+ MuiLocalizationSlot,
1115
+ MuiOptionEditorSlot,
1116
+ MuiSectionAdapter,
1117
+ MuiSelectAdapter,
1118
+ MuiTextAreaAdapter,
1119
+ MuiTextInputAdapter,
1120
+ MuiToolbarSlot,
330
1121
  createMuiBuilderComponents,
1122
+ createMuiBuilderProps,
1123
+ createMuiBuilderSlots,
1124
+ createMuiButtonAdapter,
1125
+ createMuiCheckboxAdapter,
1126
+ createMuiErrorMessageAdapter,
1127
+ createMuiFieldEditorSlot,
1128
+ createMuiFieldsetAdapter,
1129
+ createMuiIconButtonAdapter,
1130
+ createMuiLocalizationSlot,
1131
+ createMuiOptionEditorSlot,
1132
+ createMuiSectionAdapter,
1133
+ createMuiSelectAdapter,
1134
+ createMuiTextAreaAdapter,
1135
+ createMuiTextInputAdapter,
1136
+ createMuiToolbarSlot,
331
1137
  muiBuilderComponents,
332
- muiDefaultIconResolver
1138
+ muiBuilderSlots,
1139
+ muiDefaultIconResolver,
1140
+ resolveMuiAdapterOptions
333
1141
  };