@form-engine-ts/mui 2.9.2 → 2.9.3

package/dist/index.cjs

@@ -17,319 +17,1173 @@ var __copyProps = (to, from, except, desc) => {
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// src/index.tsx
+// src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  MuiButtonAdapter: () => MuiButtonAdapter,
+  MuiCheckboxAdapter: () => MuiCheckboxAdapter,
+  MuiErrorMessageAdapter: () => MuiErrorMessageAdapter,
+  MuiFieldEditorSlot: () => MuiFieldEditorSlot,
+  MuiFieldsetAdapter: () => MuiFieldsetAdapter,
+  MuiFormBuilder: () => MuiFormBuilder,
+  MuiIconButtonAdapter: () => MuiIconButtonAdapter,
+  MuiLocalizationSlot: () => MuiLocalizationSlot,
+  MuiOptionEditorSlot: () => MuiOptionEditorSlot,
+  MuiSectionAdapter: () => MuiSectionAdapter,
+  MuiSelectAdapter: () => MuiSelectAdapter,
+  MuiTextAreaAdapter: () => MuiTextAreaAdapter,
+  MuiTextInputAdapter: () => MuiTextInputAdapter,
+  MuiToolbarSlot: () => MuiToolbarSlot,
   createMuiBuilderComponents: () => createMuiBuilderComponents,
+  createMuiBuilderProps: () => createMuiBuilderProps,
+  createMuiBuilderSlots: () => createMuiBuilderSlots,
+  createMuiButtonAdapter: () => createMuiButtonAdapter,
+  createMuiCheckboxAdapter: () => createMuiCheckboxAdapter,
+  createMuiErrorMessageAdapter: () => createMuiErrorMessageAdapter,
+  createMuiFieldEditorSlot: () => createMuiFieldEditorSlot,
+  createMuiFieldsetAdapter: () => createMuiFieldsetAdapter,
+  createMuiIconButtonAdapter: () => createMuiIconButtonAdapter,
+  createMuiLocalizationSlot: () => createMuiLocalizationSlot,
+  createMuiOptionEditorSlot: () => createMuiOptionEditorSlot,
+  createMuiSectionAdapter: () => createMuiSectionAdapter,
+  createMuiSelectAdapter: () => createMuiSelectAdapter,
+  createMuiTextAreaAdapter: () => createMuiTextAreaAdapter,
+  createMuiTextInputAdapter: () => createMuiTextInputAdapter,
+  createMuiToolbarSlot: () => createMuiToolbarSlot,
   muiBuilderComponents: () => muiBuilderComponents,
-  muiDefaultIconResolver: () => muiDefaultIconResolver
+  muiBuilderSlots: () => muiBuilderSlots,
+  muiDefaultIconResolver: () => muiDefaultIconResolver,
+  resolveMuiAdapterOptions: () => resolveMuiAdapterOptions
 });
 module.exports = __toCommonJS(index_exports);
-var import_icons_material = require("@mui/icons-material");
+
+// src/adapters/Button.tsx
 var import_material = require("@mui/material");
-var import_jsx_runtime = require("react/jsx-runtime");
-function MuiButtonAdapter({
-  id,
-  className,
-  disabled,
-  "aria-label": ariaLabel,
-  onClick,
-  children,
-  title,
-  variant = "secondary",
-  action,
-  targetId
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_material.Button,
-    {
-      id,
-      className,
-      type: "button",
-      disabled,
-      "aria-label": ariaLabel,
-      title,
-      "data-builder-action": action,
-      "data-target-id": targetId,
-      onClick,
-      color: variant === "danger" ? "error" : "primary",
-      variant: variant === "primary" ? "contained" : "outlined",
-      children
-    }
-  );
-}
-function MuiIconButtonAdapter({
-  id,
-  className,
-  disabled,
-  readOnly,
-  "aria-label": ariaLabel,
-  "aria-describedby": ariaDescribedBy,
-  "aria-labelledby": ariaLabelledBy,
-  onClick,
-  icon,
-  title
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_material.IconButton,
-    {
-      id,
-      className,
-      component: "button",
-      type: "button",
-      disabled: disabled || readOnly,
-      "aria-label": ariaLabel ?? title,
-      "aria-describedby": ariaDescribedBy,
-      "aria-labelledby": ariaLabelledBy,
-      title,
-      onClick,
-      sx: { minWidth: 0, padding: 0.5 },
-      children: icon
-    }
-  );
-}
-function MuiTextInputAdapter({
-  id,
-  className,
-  disabled,
-  readOnly,
-  "aria-label": ariaLabel,
-  "aria-describedby": ariaDescribedBy,
-  "aria-labelledby": ariaLabelledBy,
-  name,
-  label,
-  required,
-  error,
-  helperText,
-  value,
-  onChange,
-  placeholder,
-  maxLength,
-  inputMode,
-  type = "text",
-  min,
-  max,
-  step
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_material.TextField,
-    {
-      id,
-      className,
-      name,
-      label,
-      required,
-      error,
-      helperText,
-      value,
-      disabled,
-      slotProps: {
-        htmlInput: { maxLength, min, max, step, inputMode },
-        input: { readOnly },
-        formHelperText: { id: ariaDescribedBy }
-      },
-      type,
-      placeholder,
-      "aria-label": ariaLabel,
-      "aria-describedby": ariaDescribedBy,
-      "aria-labelledby": ariaLabelledBy,
-      fullWidth: true,
-      variant: "outlined",
-      onChange: (event) => onChange(event.currentTarget.value)
-    }
-  );
-}
-function MuiTextAreaAdapter({
-  id,
-  className,
-  disabled,
-  readOnly,
-  "aria-label": ariaLabel,
-  "aria-describedby": ariaDescribedBy,
-  "aria-labelledby": ariaLabelledBy,
-  name,
-  label,
-  required,
-  error,
-  helperText,
-  value,
-  onChange,
-  placeholder,
-  maxLength,
-  rows
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_material.TextField,
-    {
-      id,
-      className,
-      name,
-      label,
-      required,
-      error,
-      helperText,
-      value,
-      disabled,
-      slotProps: {
-        htmlInput: { maxLength },
-        input: { readOnly },
-        formHelperText: { id: ariaDescribedBy }
-      },
-      multiline: true,
-      rows,
-      placeholder,
-      "aria-label": ariaLabel,
-      "aria-describedby": ariaDescribedBy,
-      "aria-labelledby": ariaLabelledBy,
-      fullWidth: true,
-      variant: "outlined",
-      onChange: (event) => onChange(event.currentTarget.value)
-    }
-  );
+
+// src/types.ts
+function resolveMuiAdapterOptions(options = {}) {
+  return {
+    size: options.size ?? "medium",
+    variant: options.variant ?? "outlined",
+    buttonVariant: options.buttonVariant ?? "contained",
+    fullWidth: options.fullWidth ?? true,
+    dense: options.dense ?? false
+  };
 }
-function MuiSelectAdapter({
-  id,
-  className,
-  disabled,
-  readOnly,
-  "aria-label": ariaLabel,
-  "aria-describedby": ariaDescribedBy,
-  "aria-labelledby": ariaLabelledBy,
-  name,
-  label,
-  required,
-  error,
-  helperText,
-  value,
-  onChange,
-  options
-}) {
-  const labelId = id === void 0 ? void 0 : `${id}-label`;
-  const handleChange = (event) => onChange(event.target.value);
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material.FormControl, { className, fullWidth: true, error, required, disabled, children: [
-    label === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.InputLabel, { id: labelId, children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-      import_material.Select,
+
+// src/adapters/Button.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+function createMuiButtonAdapter(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiButton({
+    id,
+    className,
+    disabled,
+    readOnly,
+    "aria-label": ariaLabel,
+    "aria-describedby": ariaDescribedBy,
+    "aria-labelledby": ariaLabelledBy,
+    onClick,
+    children,
+    title,
+    variant,
+    action,
+    targetId
+  }) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+      import_material.Button,
       {
         id,
-        labelId,
-        name,
-        label,
-        value,
-        onChange: handleChange,
-        readOnly,
+        className,
+        type: "button",
+        size: resolved.size,
+        disabled: disabled || readOnly,
         "aria-label": ariaLabel,
         "aria-describedby": ariaDescribedBy,
         "aria-labelledby": ariaLabelledBy,
-        variant: "outlined",
-        children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.MenuItem, { value: option.value, disabled: option.disabled, children: option.label }, option.value))
+        title,
+        "data-builder-action": action,
+        "data-target-id": targetId,
+        onClick,
+        color: variant === "danger" ? "error" : "primary",
+        variant: resolved.buttonVariant,
+        fullWidth: resolved.fullWidth,
+        children
       }
-    ),
-    helperText === void 0 || helperText.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.FormHelperText, { id: ariaDescribedBy, children: helperText })
-  ] });
+    );
+  };
 }
-function MuiCheckboxAdapter({
-  id,
-  className,
-  disabled,
-  readOnly,
-  "aria-label": ariaLabel,
-  checked,
-  onChange,
-  label
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-    import_material.FormControlLabel,
-    {
-      className,
-      label,
-      control: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
-        import_material.Checkbox,
+var MuiButtonAdapter = createMuiButtonAdapter();
+
+// src/adapters/Checkbox.tsx
+var import_material2 = require("@mui/material");
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function createMuiCheckboxAdapter(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiCheckbox({
+    id,
+    className,
+    disabled,
+    readOnly,
+    "aria-label": ariaLabel,
+    "aria-describedby": ariaDescribedBy,
+    "aria-labelledby": ariaLabelledBy,
+    name,
+    required,
+    error,
+    helperText,
+    checked,
+    onChange,
+    label
+  }) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material2.FormControl, { className, error: Boolean(error), required, disabled: disabled || readOnly, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+        import_material2.FormControlLabel,
         {
-          id,
-          checked,
-          disabled: disabled || readOnly,
-          inputProps: { "aria-label": ariaLabel },
-          onChange: (event) => onChange(event.target.checked)
+          label,
+          control: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            import_material2.Checkbox,
+            {
+              id,
+              name,
+              size: resolved.size,
+              checked,
+              required,
+              disabled: disabled || readOnly,
+              inputProps: {
+                "aria-label": ariaLabel,
+                "aria-describedby": ariaDescribedBy,
+                "aria-labelledby": ariaLabelledBy
+              },
+              onChange: (event) => onChange(event.target.checked)
+            }
+          )
         }
-      )
-    }
-  );
+      ),
+      helperText === void 0 || helperText.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material2.FormHelperText, { id: ariaDescribedBy, children: helperText })
+    ] });
+  };
 }
-function MuiSectionAdapter({
-  id,
-  className,
-  title,
-  description,
-  headingId,
-  "aria-label": ariaLabel,
-  children
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
-    import_material.Paper,
-    {
-      id,
-      className,
-      "aria-label": ariaLabel,
-      "aria-labelledby": title === void 0 ? void 0 : headingId,
-      sx: { p: 2, mb: 2 },
-      children: [
-        title === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { id: headingId, variant: "h6", children: title }),
-        description === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { variant: "body2", children: description }),
-        children
-      ]
-    }
-  );
+var MuiCheckboxAdapter = createMuiCheckboxAdapter();
+
+// src/adapters/ErrorMessage.tsx
+var import_material3 = require("@mui/material");
+var import_jsx_runtime3 = require("react/jsx-runtime");
+function createMuiErrorMessageAdapter(_options) {
+  return function MuiErrorMessage({
+    id,
+    className,
+    "aria-label": ariaLabel,
+    "aria-describedby": ariaDescribedBy,
+    "aria-labelledby": ariaLabelledBy,
+    message
+  }) {
+    return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      import_material3.Alert,
+      {
+        id,
+        className,
+        severity: "error",
+        "aria-label": ariaLabel,
+        "aria-describedby": ariaDescribedBy,
+        "aria-labelledby": ariaLabelledBy,
+        sx: { my: 1 },
+        children: message
+      }
+    );
+  };
+}
+var MuiErrorMessageAdapter = createMuiErrorMessageAdapter();
+
+// src/adapters/Fieldset.tsx
+var import_material4 = require("@mui/material");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function createMuiFieldsetAdapter(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiFieldset({ className, legend, disabled, children }) {
+    return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+      import_material4.Box,
+      {
+        component: "fieldset",
+        className,
+        disabled,
+        sx: {
+          border: 0,
+          m: 0,
+          p: 0,
+          minWidth: 0,
+          display: "grid",
+          gap: resolved.dense ? 1 : 2,
+          "& > div:not(.MuiStack-root):not(.MuiPaper-root)": {
+            display: "grid",
+            gap: resolved.dense ? 1 : 2
+          }
+        },
+        children: [
+          legend === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_material4.Typography, { component: "legend", variant: "subtitle1", fontWeight: "bold", sx: { mb: 1 }, children: legend }),
+          children
+        ]
+      }
+    );
+  };
 }
-function MuiFieldsetAdapter({ className, legend, disabled, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_material.Box, { component: "fieldset", className, disabled, sx: { border: 0, m: 0, p: 0 }, children: [
-    legend === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Typography, { component: "legend", variant: "subtitle1", children: legend }),
+var MuiFieldsetAdapter = createMuiFieldsetAdapter();
+
+// src/adapters/IconButton.tsx
+var import_material5 = require("@mui/material");
+var import_jsx_runtime5 = require("react/jsx-runtime");
+var ACTION_LABELS = {
+  moveUp: "\u4E0A\u3078\u79FB\u52D5",
+  moveDown: "\u4E0B\u3078\u79FB\u52D5",
+  delete: "\u524A\u9664",
+  add: "\u8FFD\u52A0",
+  edit: "\u7DE8\u96C6",
+  settings: "\u8A2D\u5B9A",
+  translate: "\u7FFB\u8A33",
+  close: "\u9589\u3058\u308B",
+  dragHandle: "\u4E26\u3079\u66FF\u3048"
+};
+function createMuiIconButtonAdapter(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiIconButton({
+    id,
+    className,
+    disabled,
+    readOnly,
+    "aria-label": ariaLabel,
+    "aria-describedby": ariaDescribedBy,
+    "aria-labelledby": ariaLabelledBy,
+    onClick,
+    icon,
+    actionType,
+    title
+  }) {
+    const actionLabel = actionType === void 0 ? "\u64CD\u4F5C" : ACTION_LABELS[actionType];
+    const tooltip = title ?? actionLabel;
+    const color = actionType === "delete" ? "error" : actionType === "add" ? "primary" : "default";
+    return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_material5.Tooltip, { title: tooltip, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
+      import_material5.IconButton,
+      {
+        id,
+        className,
+        type: "button",
+        size: resolved.size,
+        color,
+        disabled: disabled || readOnly,
+        "aria-label": ariaLabel ?? tooltip,
+        "aria-describedby": ariaDescribedBy,
+        "aria-labelledby": ariaLabelledBy,
+        onClick,
+        children: icon
+      }
+    ) }) });
+  };
+}
+var MuiIconButtonAdapter = createMuiIconButtonAdapter();
+
+// src/adapters/Section.tsx
+var import_material6 = require("@mui/material");
+var import_jsx_runtime6 = require("react/jsx-runtime");
+function createMuiSectionAdapter(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiSection({
+    id,
+    className,
+    title,
+    description,
+    headingId,
+    "aria-label": ariaLabel,
+    onClickCapture,
     children
-  ] });
+  }) {
+    return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+      import_material6.Paper,
+      {
+        id,
+        className,
+        elevation: 0,
+        "aria-label": ariaLabel,
+        "aria-labelledby": title === void 0 ? void 0 : headingId,
+        onClickCapture,
+        sx: {
+          p: resolved.dense ? 1.5 : 2,
+          mb: resolved.dense ? 1 : 2,
+          border: 1,
+          borderColor: "divider",
+          borderRadius: 1,
+          display: "grid",
+          gap: resolved.dense ? 1 : 2,
+          "& > div:not(.MuiStack-root):not(.MuiPaper-root)": {
+            display: "grid",
+            gap: resolved.dense ? 1 : 2
+          }
+        },
+        children: [
+          title === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_material6.Typography, { id: headingId, variant: "subtitle1", fontWeight: "bold", children: title }),
+          description === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_material6.Typography, { variant: "body2", color: "text.secondary", sx: { mb: resolved.dense ? 0.5 : 1.5 }, children: description }),
+          children
+        ]
+      }
+    );
+  };
 }
-function MuiErrorMessageAdapter({ className, message }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_material.Alert, { className, severity: "error", children: message });
+var MuiSectionAdapter = createMuiSectionAdapter();
+
+// src/adapters/Select.tsx
+var import_material7 = require("@mui/material");
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function createMuiSelectAdapter(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiSelect({
+    id,
+    className,
+    disabled,
+    readOnly,
+    "aria-label": ariaLabel,
+    "aria-describedby": ariaDescribedBy,
+    "aria-labelledby": ariaLabelledBy,
+    name,
+    label,
+    required,
+    error,
+    helperText,
+    value,
+    onChange,
+    options: selectOptions
+  }) {
+    const labelId = id === void 0 || label === void 0 ? void 0 : `${id}-label`;
+    const handleChange = (event) => onChange(event.target.value);
+    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+      import_material7.FormControl,
+      {
+        className,
+        fullWidth: resolved.fullWidth,
+        size: resolved.size,
+        variant: resolved.variant,
+        error: Boolean(error),
+        required,
+        disabled,
+        children: [
+          label === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_material7.InputLabel, { id: labelId, children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+            import_material7.Select,
+            {
+              id,
+              labelId,
+              name,
+              label,
+              value,
+              onChange: handleChange,
+              required,
+              readOnly,
+              inputProps: {
+                "aria-label": ariaLabel,
+                "aria-describedby": ariaDescribedBy,
+                "aria-labelledby": ariaLabelledBy
+              },
+              children: selectOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_material7.MenuItem, { value: option.value, disabled: option.disabled, children: option.label }, option.value))
+            }
+          ),
+          helperText === void 0 || helperText.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_material7.FormHelperText, { id: ariaDescribedBy, children: helperText })
+        ]
+      }
+    );
+  };
+}
+var MuiSelectAdapter = createMuiSelectAdapter();
+
+// src/adapters/TextArea.tsx
+var import_material8 = require("@mui/material");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+function createMuiTextAreaAdapter(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiTextArea({
+    id,
+    className,
+    disabled,
+    readOnly,
+    "aria-label": ariaLabel,
+    "aria-describedby": ariaDescribedBy,
+    "aria-labelledby": ariaLabelledBy,
+    name,
+    label,
+    required,
+    error,
+    helperText,
+    value,
+    onChange,
+    placeholder,
+    maxLength,
+    rows
+  }) {
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      import_material8.TextField,
+      {
+        id,
+        className,
+        name,
+        label,
+        required,
+        error: Boolean(error),
+        helperText,
+        value,
+        disabled,
+        slotProps: {
+          htmlInput: {
+            maxLength,
+            "aria-label": ariaLabel,
+            "aria-describedby": ariaDescribedBy,
+            "aria-labelledby": ariaLabelledBy
+          },
+          input: { readOnly },
+          formHelperText: { id: ariaDescribedBy }
+        },
+        multiline: true,
+        rows,
+        placeholder,
+        fullWidth: resolved.fullWidth,
+        size: resolved.size,
+        variant: resolved.variant,
+        onChange: (event) => onChange(event.currentTarget.value)
+      }
+    );
+  };
 }
+var MuiTextAreaAdapter = createMuiTextAreaAdapter();
+
+// src/adapters/TextInput.tsx
+var import_material9 = require("@mui/material");
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function createMuiTextInputAdapter(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiTextInput({
+    id,
+    className,
+    disabled,
+    readOnly,
+    "aria-label": ariaLabel,
+    "aria-describedby": ariaDescribedBy,
+    "aria-labelledby": ariaLabelledBy,
+    name,
+    label,
+    required,
+    error,
+    helperText,
+    value,
+    onChange,
+    placeholder,
+    maxLength,
+    inputMode,
+    type = "text",
+    min,
+    max,
+    step
+  }) {
+    return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      import_material9.TextField,
+      {
+        id,
+        className,
+        name,
+        label,
+        required,
+        error: Boolean(error),
+        helperText,
+        value,
+        disabled,
+        slotProps: {
+          htmlInput: {
+            maxLength,
+            min,
+            max,
+            step,
+            inputMode,
+            "aria-label": ariaLabel,
+            "aria-describedby": ariaDescribedBy,
+            "aria-labelledby": ariaLabelledBy
+          },
+          input: { readOnly },
+          formHelperText: { id: ariaDescribedBy }
+        },
+        type,
+        placeholder,
+        fullWidth: resolved.fullWidth,
+        size: resolved.size,
+        variant: resolved.variant,
+        onChange: (event) => onChange(event.currentTarget.value)
+      }
+    );
+  };
+}
+var MuiTextInputAdapter = createMuiTextInputAdapter();
+
+// src/icons.tsx
+var import_icons_material = require("@mui/icons-material");
+var import_jsx_runtime10 = require("react/jsx-runtime");
 function muiDefaultIconResolver(actionType) {
   switch (actionType) {
     case "moveUp":
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.ArrowUpward, { fontSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_material.ArrowUpward, { fontSize: "small" });
     case "moveDown":
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.ArrowDownward, { fontSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_material.ArrowDownward, { fontSize: "small" });
     case "delete":
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.Delete, { fontSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_material.Delete, { fontSize: "small" });
     case "add":
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.Add, { fontSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_material.Add, { fontSize: "small" });
     case "edit":
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.Edit, { fontSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_material.Edit, { fontSize: "small" });
     case "settings":
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.Settings, { fontSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_material.Settings, { fontSize: "small" });
     case "translate":
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.Translate, { fontSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_material.Translate, { fontSize: "small" });
     case "close":
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.Close, { fontSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_material.Close, { fontSize: "small" });
     case "dragHandle":
-      return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons_material.DragHandle, { fontSize: "small" });
+      return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_icons_material.DragHandle, { fontSize: "small" });
   }
 }
-var muiBuilderComponents = {
-  Button: MuiButtonAdapter,
-  IconButton: MuiIconButtonAdapter,
-  TextInput: MuiTextInputAdapter,
-  TextArea: MuiTextAreaAdapter,
-  Select: MuiSelectAdapter,
-  Checkbox: MuiCheckboxAdapter,
-  Section: MuiSectionAdapter,
-  Fieldset: MuiFieldsetAdapter,
-  ErrorMessage: MuiErrorMessageAdapter,
-  renderIcon: muiDefaultIconResolver
+
+// src/components.ts
+function isAdapterOptions(value) {
+  return "size" in value || "variant" in value || "buttonVariant" in value || "fullWidth" in value || "dense" in value;
+}
+function buildMuiBuilderComponents(options) {
+  return {
+    Button: createMuiButtonAdapter(options),
+    IconButton: createMuiIconButtonAdapter(options),
+    TextInput: createMuiTextInputAdapter(options),
+    TextArea: createMuiTextAreaAdapter(options),
+    Select: createMuiSelectAdapter(options),
+    Checkbox: createMuiCheckboxAdapter(options),
+    Section: createMuiSectionAdapter(options),
+    Fieldset: createMuiFieldsetAdapter(options),
+    ErrorMessage: createMuiErrorMessageAdapter(options),
+    renderIcon: muiDefaultIconResolver
+  };
+}
+var muiBuilderComponents = buildMuiBuilderComponents();
+function createMuiBuilderComponents(optionsOrOverrides = {}, customOverrides) {
+  const options = isAdapterOptions(optionsOrOverrides) ? optionsOrOverrides : void 0;
+  const overrides = customOverrides ?? (options === void 0 ? optionsOrOverrides : {});
+  return { ...buildMuiBuilderComponents(options), ...overrides };
+}
+
+// src/slots/FieldEditor.tsx
+var import_material12 = require("@mui/material");
+
+// src/slots/OptionEditor.tsx
+var import_material10 = require("@mui/material");
+var import_jsx_runtime11 = require("react/jsx-runtime");
+function createMuiOptionEditorSlot(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiOptionEditor({
+    field,
+    option,
+    index,
+    currentLocale,
+    readOnly,
+    actions,
+    components
+  }) {
+    const { IconButton: IconButton2, TextInput } = components;
+    const describedBy = option.label.trim().length === 0 ? `mui-option-${option.id}-error` : void 0;
+    return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_material10.Stack, { "data-mui-slot": "option-editor", spacing: resolved.dense ? 0.75 : 1, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_material10.Stack, { direction: { xs: "column", sm: "row" }, spacing: 1, alignItems: { sm: "flex-start" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+          TextInput,
+          {
+            id: `mui-option-${option.id}`,
+            label: `Option ${index + 1}`,
+            value: option.label,
+            required: true,
+            error: option.label.trim().length === 0,
+            helperText: option.label.trim().length === 0 ? "Required" : "",
+            "aria-describedby": describedBy,
+            disabled: readOnly,
+            onChange: (value) => actions.updateOption(field.id, option.id, (current) => ({ ...current, label: value }))
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_material10.Stack, { direction: "row", spacing: 0.5, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            IconButton2,
+            {
+              actionType: "moveUp",
+              title: `Move ${option.label} up`,
+              disabled: readOnly || index === 0,
+              onClick: () => actions.moveOption(field.id, option.id, index - 1)
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            IconButton2,
+            {
+              actionType: "moveDown",
+              title: `Move ${option.label} down`,
+              disabled: readOnly || index === field.options.length - 1,
+              onClick: () => actions.moveOption(field.id, option.id, index + 1)
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+            IconButton2,
+            {
+              actionType: "delete",
+              title: `Delete ${option.label}`,
+              disabled: readOnly || field.options.length <= 1,
+              onClick: () => actions.removeOption(field.id, option.id)
+            }
+          )
+        ] })
+      ] }),
+      currentLocale.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+        TextInput,
+        {
+          id: `mui-option-${option.id}-${currentLocale}`,
+          label: `${currentLocale} translation`,
+          value: option.translations?.[currentLocale] ?? "",
+          disabled: readOnly,
+          onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "option", id: option.id }, "label", value)
+        }
+      )
+    ] });
+  };
+}
+var MuiOptionEditorSlot = createMuiOptionEditorSlot();
+
+// src/slots/Toolbar.tsx
+var import_material11 = require("@mui/material");
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function createMuiToolbarSlot(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiToolbar({
+    kind,
+    index,
+    total,
+    title,
+    onMoveUp,
+    onMoveDown,
+    onRemove,
+    readOnly,
+    components
+  }) {
+    const { IconButton: IconButton2 } = components;
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+      import_material11.Stack,
+      {
+        "data-mui-slot": "toolbar",
+        direction: "row",
+        spacing: resolved.dense ? 0.5 : 1,
+        alignItems: "center",
+        sx: { mb: resolved.dense ? 1 : 2 },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+            IconButton2,
+            {
+              actionType: "moveUp",
+              title: `Move ${title} up`,
+              disabled: readOnly || index === 0,
+              onClick: onMoveUp
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+            IconButton2,
+            {
+              actionType: "moveDown",
+              title: `Move ${title} down`,
+              disabled: readOnly || index === total - 1,
+              onClick: onMoveDown
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+            IconButton2,
+            {
+              actionType: "delete",
+              title: `Delete ${title}`,
+              disabled: readOnly || kind !== "page" && total <= 1,
+              onClick: onRemove
+            }
+          )
+        ]
+      }
+    );
+  };
+}
+var MuiToolbarSlot = createMuiToolbarSlot();
+
+// src/slots/FieldEditor.tsx
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var FIELD_TYPES = [
+  "text",
+  "textarea",
+  "number",
+  "rating",
+  "select",
+  "multi-select",
+  "checkbox",
+  "radio"
+];
+function isFieldType(value) {
+  return FIELD_TYPES.some((type) => type === value);
+}
+function numericValue(value) {
+  if (value.trim().length === 0) return void 0;
+  const parsed = Number(value);
+  return Number.isFinite(parsed) ? parsed : void 0;
+}
+function updateBound(field, property, value) {
+  if (field.type !== "number" && field.type !== "rating") return field;
+  const nextValue = numericValue(value);
+  if (nextValue !== void 0) return { ...field, [property]: nextValue };
+  const { [property]: _removed, ...remaining } = field;
+  return remaining;
+}
+function createMuiFieldEditorSlot(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  const Toolbar = createMuiToolbarSlot(options);
+  const OptionEditor = createMuiOptionEditorSlot(options);
+  return function MuiFieldEditor({
+    schema,
+    field,
+    index,
+    currentLocale,
+    policy,
+    readOnly,
+    actions,
+    components
+  }) {
+    const { Button: Button2, Checkbox: Checkbox2, Select: Select2, TextArea, TextInput } = components;
+    const allowedTypes = policy?.allowedFieldTypes ?? FIELD_TYPES;
+    const pageId = schema.pages?.find((page) => page.questionIds.includes(field.id))?.id ?? "";
+    const condition = field.displayCondition;
+    const conditionSources = schema.fields.slice(0, index);
+    const titleErrorId = field.title.trim().length === 0 ? `mui-field-${field.id}-title-error` : void 0;
+    return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
+      import_material12.Card,
+      {
+        "data-mui-slot": "field-editor",
+        variant: "outlined",
+        sx: { mb: resolved.dense ? 1 : 2, p: resolved.dense ? 1.5 : 2 },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+            Toolbar,
+            {
+              schema,
+              kind: "field",
+              targetId: field.id,
+              index,
+              total: schema.fields.length,
+              title: field.title,
+              onMoveUp: () => actions.moveField(field.id, index - 1),
+              onMoveDown: () => actions.moveField(field.id, index + 1),
+              onRemove: () => actions.removeField(field.id),
+              readOnly,
+              actions,
+              components
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_material12.Stack, { spacing: resolved.dense ? 1 : 2, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_material12.Typography, { variant: "subtitle1", fontWeight: "bold", children: field.title }),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_material12.Stack, { direction: { xs: "column", md: "row" }, spacing: resolved.dense ? 1 : 2, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                TextInput,
+                {
+                  id: `mui-field-${field.id}-title`,
+                  name: `fields.${field.id}.title`,
+                  label: "Question title",
+                  value: field.title,
+                  required: true,
+                  error: field.title.trim().length === 0,
+                  helperText: field.title.trim().length === 0 ? "Required" : "",
+                  "aria-describedby": titleErrorId,
+                  disabled: readOnly,
+                  onChange: (value) => actions.setSourceText({ kind: "field", id: field.id }, "title", value)
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                Select2,
+                {
+                  id: `mui-field-${field.id}-type`,
+                  name: `fields.${field.id}.type`,
+                  label: "Type",
+                  value: field.type,
+                  options: FIELD_TYPES.map((type) => ({
+                    value: type,
+                    label: type,
+                    disabled: !allowedTypes.includes(type)
+                  })),
+                  disabled: readOnly,
+                  onChange: (value) => {
+                    if (isFieldType(value)) actions.changeFieldType(field.id, value);
+                  }
+                }
+              )
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              TextArea,
+              {
+                id: `mui-field-${field.id}-description`,
+                name: `fields.${field.id}.description`,
+                label: "Description",
+                value: field.description ?? "",
+                rows: resolved.dense ? 2 : 3,
+                disabled: readOnly,
+                onChange: (value) => actions.setSourceText({ kind: "field", id: field.id }, "description", value)
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              Checkbox2,
+              {
+                id: `mui-field-${field.id}-required`,
+                name: `fields.${field.id}.required`,
+                label: "Required",
+                checked: field.required,
+                disabled: readOnly,
+                onChange: (checked) => actions.updateField(field.id, (current) => ({ ...current, required: checked }))
+              }
+            ),
+            schema.pages === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+              Select2,
+              {
+                id: `mui-field-${field.id}-page`,
+                label: "Page",
+                value: pageId,
+                options: [
+                  { value: "", label: "Unassigned" },
+                  ...schema.pages.map((page) => ({ value: page.id, label: page.title ?? page.id }))
+                ],
+                disabled: readOnly,
+                onChange: (value) => actions.assignFieldToPage(field.id, value.length === 0 ? null : value)
+              }
+            ),
+            field.type === "number" || field.type === "rating" ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_material12.Stack, { direction: { xs: "column", sm: "row" }, spacing: resolved.dense ? 1 : 2, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                TextInput,
+                {
+                  id: `mui-field-${field.id}-minimum`,
+                  label: "Minimum",
+                  type: "number",
+                  value: field.min === void 0 ? "" : String(field.min),
+                  disabled: readOnly,
+                  onChange: (value) => actions.updateField(field.id, (current) => updateBound(current, "min", value))
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                TextInput,
+                {
+                  id: `mui-field-${field.id}-maximum`,
+                  label: "Maximum",
+                  type: "number",
+                  value: field.max === void 0 ? "" : String(field.max),
+                  disabled: readOnly,
+                  onChange: (value) => actions.updateField(field.id, (current) => updateBound(current, "max", value))
+                }
+              )
+            ] }) : null,
+            conditionSources.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_material12.Stack, { direction: { xs: "column", md: "row" }, spacing: resolved.dense ? 1 : 2, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                Select2,
+                {
+                  id: `mui-field-${field.id}-condition-source`,
+                  label: "Display condition",
+                  value: condition?.questionId ?? "",
+                  options: [
+                    { value: "", label: "Always visible" },
+                    ...conditionSources.map((source) => ({ value: source.id, label: source.title }))
+                  ],
+                  disabled: readOnly,
+                  onChange: (value) => actions.setDisplayCondition(
+                    field.id,
+                    value.length === 0 ? void 0 : { questionId: value, operator: "equals", value: "" }
+                  )
+                }
+              ),
+              condition === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                TextInput,
+                {
+                  id: `mui-field-${field.id}-condition-value`,
+                  label: "Condition value",
+                  value: condition.value === void 0 ? "" : String(condition.value),
+                  disabled: readOnly,
+                  onChange: (value) => actions.setDisplayCondition(field.id, { ...condition, value })
+                }
+              )
+            ] }),
+            currentLocale.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_material12.Stack, { spacing: resolved.dense ? 1 : 2, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_material12.Typography, { variant: "subtitle2", children: [
+                currentLocale,
+                " translation"
+              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                TextInput,
+                {
+                  id: `mui-field-${field.id}-${currentLocale}-title`,
+                  label: "Translated question title",
+                  value: field.translations?.[currentLocale]?.title ?? "",
+                  disabled: readOnly,
+                  onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "field", id: field.id }, "title", value)
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                TextArea,
+                {
+                  id: `mui-field-${field.id}-${currentLocale}-description`,
+                  label: "Translated description",
+                  value: field.translations?.[currentLocale]?.description ?? "",
+                  disabled: readOnly,
+                  onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "field", id: field.id }, "description", value)
+                }
+              )
+            ] }),
+            "options" in field ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(import_material12.Stack, { "data-mui-slot": "options", spacing: resolved.dense ? 1 : 2, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_material12.Typography, { variant: "subtitle2", children: "Options" }),
+              field.options.map((option, optionIndex) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                OptionEditor,
+                {
+                  schema,
+                  field,
+                  option,
+                  index: optionIndex,
+                  currentLocale,
+                  readOnly,
+                  actions,
+                  components
+                },
+                option.id
+              )),
+              /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+                Button2,
+                {
+                  action: "addOption",
+                  targetId: field.id,
+                  disabled: readOnly || policy?.maxOptionsPerField !== void 0 && field.options.length >= policy.maxOptionsPerField,
+                  onClick: () => actions.addOption(field.id),
+                  children: "Add option"
+                }
+              )
+            ] }) : null
+          ] })
+        ]
+      }
+    );
+  };
+}
+var MuiFieldEditorSlot = createMuiFieldEditorSlot();
+
+// src/slots/Localization.tsx
+var import_material13 = require("@mui/material");
+var import_react = require("react");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+function createMuiLocalizationSlot(options) {
+  const resolved = resolveMuiAdapterOptions(options);
+  return function MuiLocalization({
+    schema,
+    currentLocale,
+    onCurrentLocaleChange,
+    onAutoTranslate,
+    isTranslating,
+    translationError,
+    readOnly,
+    actions,
+    components
+  }) {
+    const { Button: Button2, ErrorMessage, TextArea, TextInput } = components;
+    const [newLocale, setNewLocale] = (0, import_react.useState)("");
+    const locales = Array.from(
+      /* @__PURE__ */ new Set([
+        ...schema.supportedLocales ?? [],
+        ...schema.defaultLocale === void 0 ? [] : [schema.defaultLocale]
+      ])
+    );
+    const handleTabChange = (_event, value) => onCurrentLocaleChange(value);
+    const addLocale = () => {
+      const normalized = newLocale.trim();
+      if (normalized.length === 0) return;
+      const result = actions.addLocale(normalized);
+      if (!result.success) return;
+      onCurrentLocaleChange(normalized);
+      setNewLocale("");
+    };
+    return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      import_material13.Box,
+      {
+        "data-mui-slot": "localization",
+        sx: {
+          mt: resolved.dense ? 1 : 2,
+          p: resolved.dense ? 1.5 : 2,
+          border: 1,
+          borderColor: "divider",
+          borderRadius: 1
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_material13.Stack, { spacing: resolved.dense ? 1 : 2, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_material13.Typography, { variant: "subtitle1", fontWeight: "bold", children: "Localization" }),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            TextInput,
+            {
+              id: "mui-builder-completion-message",
+              label: "Completion message",
+              value: schema.completionMessage ?? "",
+              disabled: readOnly,
+              onChange: (value) => actions.setSourceText({ kind: "form" }, "completionMessage", value)
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_material13.Stack, { direction: { xs: "column", sm: "row" }, spacing: resolved.dense ? 1 : 2, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+              TextInput,
+              {
+                id: "mui-builder-default-locale",
+                label: "Default locale",
+                value: schema.defaultLocale ?? "",
+                disabled: readOnly,
+                onChange: (value) => actions.setDefaultLocale(value)
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+              TextInput,
+              {
+                id: "mui-builder-new-locale",
+                label: "Add locale",
+                value: newLocale,
+                disabled: readOnly,
+                onChange: setNewLocale
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Button2, { disabled: readOnly || newLocale.trim().length === 0, onClick: addLocale, children: "Add locale" })
+          ] }),
+          locales.length === 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            import_material13.Tabs,
+            {
+              value: locales.includes(currentLocale) ? currentLocale : false,
+              onChange: handleTabChange,
+              variant: "scrollable",
+              scrollButtons: "auto",
+              "aria-label": "Translation locale",
+              children: locales.map((locale) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_material13.Tab, { value: locale, label: locale, disabled: readOnly && locale !== currentLocale }, locale))
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            Button2,
+            {
+              variant: "secondary",
+              disabled: readOnly || currentLocale.length === 0 || isTranslating,
+              onClick: onAutoTranslate,
+              children: isTranslating ? "Translating\u2026" : "Translate all text"
+            }
+          ),
+          translationError === void 0 ? null : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(ErrorMessage, { message: translationError }),
+          currentLocale.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_material13.Typography, { variant: "body2", color: "text.secondary", children: "Select a locale to edit translations." }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_material13.Stack, { spacing: resolved.dense ? 1 : 2, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+              TextInput,
+              {
+                id: `mui-builder-${currentLocale}-form-title`,
+                label: "Translated form title",
+                value: schema.translations?.[currentLocale]?.title ?? "",
+                disabled: readOnly,
+                onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "form" }, "title", value)
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+              TextArea,
+              {
+                id: `mui-builder-${currentLocale}-form-description`,
+                label: "Translated form description",
+                value: schema.translations?.[currentLocale]?.description ?? "",
+                disabled: readOnly,
+                onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "form" }, "description", value)
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+              TextInput,
+              {
+                id: `mui-builder-${currentLocale}-completion-message`,
+                label: "Translated completion message",
+                value: schema.translations?.[currentLocale]?.completionMessage ?? "",
+                disabled: readOnly,
+                onChange: (value) => actions.setLocaleTranslation(currentLocale, { kind: "form" }, "completionMessage", value)
+              }
+            )
+          ] })
+        ] })
+      }
+    );
+  };
+}
+var MuiLocalizationSlot = createMuiLocalizationSlot();
+
+// src/slots/index.ts
+var muiBuilderSlots = {
+  toolbar: createMuiToolbarSlot(),
+  fieldEditor: createMuiFieldEditorSlot(),
+  optionEditor: createMuiOptionEditorSlot(),
+  localization: createMuiLocalizationSlot()
 };
-function createMuiBuilderComponents(customOverrides = {}) {
-  return { ...muiBuilderComponents, ...customOverrides };
+function createMuiBuilderSlots(options, customOverrides = {}) {
+  return {
+    toolbar: createMuiToolbarSlot(options),
+    fieldEditor: createMuiFieldEditorSlot(options),
+    optionEditor: createMuiOptionEditorSlot(options),
+    localization: createMuiLocalizationSlot(options),
+    ...customOverrides
+  };
+}
+
+// src/builderProps.ts
+function createMuiBuilderProps(options, overrides = {}) {
+  return {
+    disableDefaultStyles: true,
+    components: createMuiBuilderComponents(options, overrides.components),
+    slots: createMuiBuilderSlots(options, overrides.slots)
+  };
+}
+
+// src/MuiFormBuilder.tsx
+var import_react2 = require("@form-engine-ts/react");
+var import_react3 = require("react");
+var import_jsx_runtime15 = require("react/jsx-runtime");
+function MuiFormBuilder({
+  muiOptions,
+  components: customComponents,
+  slots: customSlots,
+  ...props
+}) {
+  const components = (0, import_react3.useMemo)(
+    () => createMuiBuilderComponents(muiOptions, customComponents),
+    [muiOptions, customComponents]
+  );
+  const slots = (0, import_react3.useMemo)(() => createMuiBuilderSlots(muiOptions, customSlots), [muiOptions, customSlots]);
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_react2.FormBuilder, { ...props, components, disableDefaultStyles: true, slots });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  MuiButtonAdapter,
+  MuiCheckboxAdapter,
+  MuiErrorMessageAdapter,
+  MuiFieldEditorSlot,
+  MuiFieldsetAdapter,
+  MuiFormBuilder,
+  MuiIconButtonAdapter,
+  MuiLocalizationSlot,
+  MuiOptionEditorSlot,
+  MuiSectionAdapter,
+  MuiSelectAdapter,
+  MuiTextAreaAdapter,
+  MuiTextInputAdapter,
+  MuiToolbarSlot,
   createMuiBuilderComponents,
+  createMuiBuilderProps,
+  createMuiBuilderSlots,
+  createMuiButtonAdapter,
+  createMuiCheckboxAdapter,
+  createMuiErrorMessageAdapter,
+  createMuiFieldEditorSlot,
+  createMuiFieldsetAdapter,
+  createMuiIconButtonAdapter,
+  createMuiLocalizationSlot,
+  createMuiOptionEditorSlot,
+  createMuiSectionAdapter,
+  createMuiSelectAdapter,
+  createMuiTextAreaAdapter,
+  createMuiTextInputAdapter,
+  createMuiToolbarSlot,
   muiBuilderComponents,
-  muiDefaultIconResolver
+  muiBuilderSlots,
+  muiDefaultIconResolver,
+  resolveMuiAdapterOptions
 });