synapse-react-client 4.0.40 → 4.0.42

package/dist/components/FormTemplateEditor/FieldLibraryRow.js

@@ -0,0 +1,115 @@
+import { submissionContextLabel as e } from "../../utils/jsonschema/submissionContext.js";
+import { detectFieldType as t, fieldTypeLabel as n } from "./schemaFieldUtils.js";
+import r from "./dragHandle.module.js";
+import { FIELD_DRAG_TYPE as i, fieldDragData as a } from "./sortableIds.js";
+import { Box as o, Chip as s, Paper as c, Stack as l, Typography as u } from "@mui/material";
+import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
+import { DragIndicator as m } from "@mui/icons-material";
+import { useDraggable as h } from "@dnd-kit/react";
+//#region src/components/FormTemplateEditor/FieldLibraryRow.tsx
+function g({ propertyKey: g, property: _, isRequired: v, context: y, isUsedInSteps: b, onClick: x }) {
+	let S = t(_), C = _.title || g, { ref: w, handleRef: T, isDragging: E } = h({
+		id: `field:${g}`,
+		type: i,
+		data: a(g),
+		disabled: b
+	});
+	return /* @__PURE__ */ f(c, {
+		ref: w,
+		variant: "outlined",
+		className: r.dragSource,
+		"data-dragging": E,
+		sx: { p: 1.25 },
+		children: /* @__PURE__ */ p(o, {
+			sx: {
+				display: "flex",
+				alignItems: "center",
+				gap: .5
+			},
+			children: [/* @__PURE__ */ f(o, {
+				ref: T,
+				role: "button",
+				tabIndex: b ? -1 : 0,
+				"aria-label": b ? "Already in a form step" : "Drag to add to a step",
+				className: r.dragHandle,
+				sx: {
+					color: b ? "text.disabled" : "text.secondary",
+					cursor: b ? "not-allowed" : void 0
+				},
+				children: /* @__PURE__ */ f(m, { fontSize: "small" })
+			}), /* @__PURE__ */ p(o, {
+				role: "button",
+				tabIndex: 0,
+				"aria-label": `Edit ${C}`,
+				onClick: x,
+				onKeyDown: (e) => {
+					(e.key === "Enter" || e.key === " ") && (e.preventDefault(), x());
+				},
+				sx: {
+					flexGrow: 1,
+					minWidth: 0,
+					display: "flex",
+					alignItems: "center",
+					gap: .5,
+					cursor: "pointer",
+					borderRadius: 1,
+					p: .5,
+					m: -.5,
+					"&:hover": { backgroundColor: "action.hover" }
+				},
+				children: [/* @__PURE__ */ p(o, {
+					sx: {
+						flexGrow: 1,
+						minWidth: 0
+					},
+					children: [/* @__PURE__ */ f(u, {
+						variant: "body2",
+						fontWeight: 500,
+						noWrap: !0,
+						title: C,
+						children: C
+					}), /* @__PURE__ */ p(l, {
+						direction: "row",
+						spacing: .5,
+						alignItems: "center",
+						sx: { mt: .25 },
+						children: [
+							/* @__PURE__ */ f(u, {
+								variant: "caption",
+								color: "text.secondary",
+								children: n(S)
+							}),
+							v && /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(u, {
+								variant: "caption",
+								color: "text.secondary",
+								children: "·"
+							}), /* @__PURE__ */ f(u, {
+								variant: "caption",
+								color: "text.secondary",
+								children: "Required"
+							})] }),
+							y !== "ALWAYS" && /* @__PURE__ */ p(d, { children: [/* @__PURE__ */ f(u, {
+								variant: "caption",
+								color: "text.secondary",
+								children: "·"
+							}), /* @__PURE__ */ f(u, {
+								variant: "caption",
+								color: "text.secondary",
+								children: e(y)
+							})] })
+						]
+					})]
+				}), /* @__PURE__ */ f(s, {
+					label: b ? "In form" : "Not in form",
+					size: "small",
+					color: b ? "success" : "warning",
+					variant: "outlined"
+				})]
+			})]
+		})
+	});
+}
+//#endregion
+export { g as FieldLibraryRow };
+
+//# sourceMappingURL=FieldLibraryRow.js.map

package/dist/components/FormTemplateEditor/FieldLibraryRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLibraryRow.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FieldLibraryRow.tsx"],"sourcesContent":["import { useDraggable } from '@dnd-kit/react'\nimport { Box, Chip, Paper, Stack, Typography } from '@mui/material'\nimport { DragIndicator as DragHandleIcon } from '@mui/icons-material'\nimport { RJSFSchema } from '@rjsf/utils'\nimport {\n  SchemaPropertyContext,\n  submissionContextLabel,\n} from '@/utils/jsonschema/submissionContext'\nimport styles from './dragHandle.module.scss'\nimport { detectFieldType, fieldTypeLabel } from './schemaFieldUtils'\nimport { FIELD_DRAG_TYPE, fieldDragData } from './sortableIds'\n\nexport type FieldLibraryRowProps = {\n  propertyKey: string\n  property: RJSFSchema\n  isRequired: boolean\n  /** Which submission context (per the schema's `x-synapse-submissionContext` convention)\n   * gates this property. `ALWAYS` properties show no badge. */\n  context: SchemaPropertyContext\n  isUsedInSteps: boolean\n  onClick: () => void\n}\n\n/**\n * A compact row in the field library. Click anywhere to edit the field's\n * definition; grab the drag indicator on the left to bind it to a step.\n * Rows already bound to a step are non-draggable.\n */\nexport function FieldLibraryRow({\n  propertyKey,\n  property,\n  isRequired,\n  context,\n  isUsedInSteps,\n  onClick,\n}: FieldLibraryRowProps) {\n  const type = detectFieldType(property)\n  const displayLabel = property.title || propertyKey\n\n  const { ref, handleRef, isDragging } = useDraggable({\n    id: `field:${propertyKey}`,\n    type: FIELD_DRAG_TYPE,\n    data: fieldDragData(propertyKey),\n    disabled: isUsedInSteps,\n  })\n\n  return (\n    <Paper\n      ref={ref}\n      variant=\"outlined\"\n      className={styles.dragSource}\n      data-dragging={isDragging}\n      sx={{ p: 1.25 }}\n    >\n      <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\n        <Box\n          ref={handleRef}\n          role=\"button\"\n          tabIndex={isUsedInSteps ? -1 : 0}\n          aria-label={\n            isUsedInSteps ? 'Already in a form step' : 'Drag to add to a step'\n          }\n          className={styles.dragHandle}\n          sx={{\n            color: isUsedInSteps ? 'text.disabled' : 'text.secondary',\n            cursor: isUsedInSteps ? 'not-allowed' : undefined,\n          }}\n        >\n          <DragHandleIcon fontSize=\"small\" />\n        </Box>\n        <Box\n          role=\"button\"\n          tabIndex={0}\n          aria-label={`Edit ${displayLabel}`}\n          onClick={onClick}\n          onKeyDown={e => {\n            if (e.key === 'Enter' || e.key === ' ') {\n              e.preventDefault()\n              onClick()\n            }\n          }}\n          sx={{\n            flexGrow: 1,\n            minWidth: 0,\n            display: 'flex',\n            alignItems: 'center',\n            gap: 0.5,\n            cursor: 'pointer',\n            borderRadius: 1,\n            p: 0.5,\n            m: -0.5,\n            '&:hover': { backgroundColor: 'action.hover' },\n          }}\n        >\n          <Box sx={{ flexGrow: 1, minWidth: 0 }}>\n            <Typography\n              variant=\"body2\"\n              fontWeight={500}\n              noWrap\n              title={displayLabel}\n            >\n              {displayLabel}\n            </Typography>\n            <Stack\n              direction=\"row\"\n              spacing={0.5}\n              alignItems=\"center\"\n              sx={{ mt: 0.25 }}\n            >\n              <Typography variant=\"caption\" color=\"text.secondary\">\n                {fieldTypeLabel(type)}\n              </Typography>\n              {isRequired && (\n                <>\n                  <Typography variant=\"caption\" color=\"text.secondary\">\n                    ·\n                  </Typography>\n                  <Typography variant=\"caption\" color=\"text.secondary\">\n                    Required\n                  </Typography>\n                </>\n              )}\n              {context !== 'ALWAYS' && (\n                <>\n                  <Typography variant=\"caption\" color=\"text.secondary\">\n                    ·\n                  </Typography>\n                  <Typography variant=\"caption\" color=\"text.secondary\">\n                    {submissionContextLabel(context)}\n                  </Typography>\n                </>\n              )}\n            </Stack>\n          </Box>\n          <Chip\n            label={isUsedInSteps ? 'In form' : 'Not in form'}\n            size=\"small\"\n            color={isUsedInSteps ? 'success' : 'warning'}\n            variant=\"outlined\"\n          />\n        </Box>\n      </Box>\n    </Paper>\n  )\n}\n"],"mappings":";;;;;;;;;AA4BA,SAAgB,EAAgB,EAC9B,gBACA,aACA,eACA,YACA,kBACA,cACuB;CACvB,IAAM,IAAO,EAAgB,CAAQ,GAC/B,IAAe,EAAS,SAAS,GAEjC,EAAE,QAAK,cAAW,kBAAe,EAAa;EAClD,IAAI,SAAS;EACb,MAAM;EACN,MAAM,EAAc,CAAW;EAC/B,UAAU;CACZ,CAAC;CAED,OACE,kBAAC,GAAD;EACO;EACL,SAAQ;EACR,WAAW,EAAO;EAClB,iBAAe;EACf,IAAI,EAAE,GAAG,KAAK;YAEd,kBAAC,GAAD;GAAK,IAAI;IAAE,SAAS;IAAQ,YAAY;IAAU,KAAK;GAAI;aAA3D,CACE,kBAAC,GAAD;IACE,KAAK;IACL,MAAK;IACL,UAAU,IAAgB,KAAK;IAC/B,cACE,IAAgB,2BAA2B;IAE7C,WAAW,EAAO;IAClB,IAAI;KACF,OAAO,IAAgB,kBAAkB;KACzC,QAAQ,IAAgB,gBAAgB,KAAA;IAC1C;cAEA,kBAAC,GAAD,EAAgB,UAAS,QAAS,CAAA;GAC/B,CAAA,GACL,kBAAC,GAAD;IACE,MAAK;IACL,UAAU;IACV,cAAY,QAAQ;IACX;IACT,YAAW,MAAK;KACd,CAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,eAAe,GACjB,EAAQ;IAEZ;IACA,IAAI;KACF,UAAU;KACV,UAAU;KACV,SAAS;KACT,YAAY;KACZ,KAAK;KACL,QAAQ;KACR,cAAc;KACd,GAAG;KACH,GAAG;KACH,WAAW,EAAE,iBAAiB,eAAe;IAC/C;cAtBF,CAwBE,kBAAC,GAAD;KAAK,IAAI;MAAE,UAAU;MAAG,UAAU;KAAE;eAApC,CACE,kBAAC,GAAD;MACE,SAAQ;MACR,YAAY;MACZ,QAAA;MACA,OAAO;gBAEN;KACS,CAAA,GACZ,kBAAC,GAAD;MACE,WAAU;MACV,SAAS;MACT,YAAW;MACX,IAAI,EAAE,IAAI,IAAK;gBAJjB;OAME,kBAAC,GAAD;QAAY,SAAQ;QAAU,OAAM;kBACjC,EAAe,CAAI;OACV,CAAA;OACX,KACC,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;QAAY,SAAQ;QAAU,OAAM;kBAAiB;OAEzC,CAAA,GACZ,kBAAC,GAAD;QAAY,SAAQ;QAAU,OAAM;kBAAiB;OAEzC,CAAA,CACZ,EAAA,CAAA;OAEH,MAAY,YACX,kBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;QAAY,SAAQ;QAAU,OAAM;kBAAiB;OAEzC,CAAA,GACZ,kBAAC,GAAD;QAAY,SAAQ;QAAU,OAAM;kBACjC,EAAuB,CAAO;OACrB,CAAA,CACZ,EAAA,CAAA;MAEC;OACJ;QACL,kBAAC,GAAD;KACE,OAAO,IAAgB,YAAY;KACnC,MAAK;KACL,OAAO,IAAgB,YAAY;KACnC,SAAQ;IACT,CAAA,CACE;KACF;;CACA,CAAA;AAEX"}

package/dist/components/FormTemplateEditor/FieldValidationErrorAlert.css

@@ -0,0 +1 @@
+._errorList_705k9_1{margin:0;padding-left:1.25em}

package/dist/components/FormTemplateEditor/FieldValidationErrorAlert.d.ts

@@ -0,0 +1,9 @@
+import { PropsWithChildren } from 'react';
+import { FormTemplateFieldValidationError } from './formTemplateValidation';
+type FieldValidationErrorAlertProps = PropsWithChildren<{
+    errors: FormTemplateFieldValidationError[];
+}>;
+/** Lists template field validation errors, after an optional lead-in passed as children. */
+export declare function FieldValidationErrorAlert({ errors, children, }: FieldValidationErrorAlertProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=FieldValidationErrorAlert.d.ts.map

package/dist/components/FormTemplateEditor/FieldValidationErrorAlert.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldValidationErrorAlert.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/FieldValidationErrorAlert.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AACzC,OAAO,EAAE,gCAAgC,EAAE,MAAM,0BAA0B,CAAA;AAG3E,KAAK,8BAA8B,GAAG,iBAAiB,CAAC;IACtD,MAAM,EAAE,gCAAgC,EAAE,CAAA;CAC3C,CAAC,CAAA;AAEF,4FAA4F;AAC5F,wBAAgB,yBAAyB,CAAC,EACxC,MAAM,EACN,QAAQ,GACT,EAAE,8BAA8B,2CAWhC"}

package/dist/components/FormTemplateEditor/FieldValidationErrorAlert.js

@@ -0,0 +1,18 @@
+import e from "./FieldValidationErrorAlert.module.js";
+import { Alert as t } from "@mui/material";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region src/components/FormTemplateEditor/FieldValidationErrorAlert.tsx
+function i({ errors: i, children: a }) {
+	return /* @__PURE__ */ r(t, {
+		severity: "error",
+		sx: { mt: 2 },
+		children: [a, /* @__PURE__ */ n("ul", {
+			className: e.errorList,
+			children: i.map((e, t) => /* @__PURE__ */ n("li", { children: e.message }, t))
+		})]
+	});
+}
+//#endregion
+export { i as FieldValidationErrorAlert };
+
+//# sourceMappingURL=FieldValidationErrorAlert.js.map

package/dist/components/FormTemplateEditor/FieldValidationErrorAlert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldValidationErrorAlert.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FieldValidationErrorAlert.tsx"],"sourcesContent":["import { Alert } from '@mui/material'\nimport { PropsWithChildren } from 'react'\nimport { FormTemplateFieldValidationError } from './formTemplateValidation'\nimport styles from './FieldValidationErrorAlert.module.scss'\n\ntype FieldValidationErrorAlertProps = PropsWithChildren<{\n  errors: FormTemplateFieldValidationError[]\n}>\n\n/** Lists template field validation errors, after an optional lead-in passed as children. */\nexport function FieldValidationErrorAlert({\n  errors,\n  children,\n}: FieldValidationErrorAlertProps) {\n  return (\n    <Alert severity=\"error\" sx={{ mt: 2 }}>\n      {children}\n      <ul className={styles.errorList}>\n        {errors.map((e, i) => (\n          <li key={i}>{e.message}</li>\n        ))}\n      </ul>\n    </Alert>\n  )\n}\n"],"mappings":";;;;AAUA,SAAgB,EAA0B,EACxC,WACA,eACiC;CACjC,OACE,kBAAC,GAAD;EAAO,UAAS;EAAQ,IAAI,EAAE,IAAI,EAAE;YAApC,CACG,GACD,kBAAC,MAAD;GAAI,WAAW,EAAO;aACnB,EAAO,KAAK,GAAG,MACd,kBAAC,MAAD,EAAA,UAAa,EAAE,QAAY,GAAlB,CAAkB,CAC5B;EACC,CAAA,CACC;;AAEX"}

package/dist/components/FormTemplateEditor/FieldValidationErrorAlert.module.js

@@ -0,0 +1,5 @@
+import './FieldValidationErrorAlert.css';var e = { errorList: "_errorList_705k9_1" };
+//#endregion
+export { e as default };
+
+//# sourceMappingURL=FieldValidationErrorAlert.module.js.map

package/dist/components/FormTemplateEditor/FieldValidationErrorAlert.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldValidationErrorAlert.module.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FieldValidationErrorAlert.module.scss"],"sourcesContent":[".errorList {\n  margin: 0;\n  padding-left: 1.25em;\n}\n"],"mappings":""}

package/dist/components/FormTemplateEditor/FieldValidationErrorAlert.module.scss

@@ -0,0 +1,4 @@
+.errorList {
+  margin: 0;
+  padding-left: 1.25em;
+}

package/dist/components/FormTemplateEditor/FormStructurePanel.d.ts

@@ -0,0 +1,21 @@
+import { RJSFSchema } from '@rjsf/utils';
+import { ResolvedSchemaProperty } from '@/utils/jsonschema/submissionContext';
+import { EditableFormTemplateStep } from './utils';
+export type FormStructurePanelProps = {
+    steps: EditableFormTemplateStep[];
+    jsonSchema: RJSFSchema;
+    /** Properties not yet bound to any step in the template. */
+    unboundProperties: ResolvedSchemaProperty[];
+    /** The FormTemplate's id, if it has been saved. Threaded down to file-field template uploads. */
+    formTemplateId: string | undefined;
+    onStepsChange: (next: EditableFormTemplateStep[]) => void;
+    onBindField: (propertyKey: string, stepKey: string) => void;
+};
+/**
+ * Right pane: the multi-step form structure. Steps are collapsible cards;
+ * each step contains a list of field slots (with inline-expand for slot config)
+ * and a "Bind field" dropdown listing any library fields not yet bound to a
+ * step.
+ */
+export declare function FormStructurePanel({ steps, jsonSchema, unboundProperties, formTemplateId, onStepsChange, onBindField, }: FormStructurePanelProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FormStructurePanel.d.ts.map

package/dist/components/FormTemplateEditor/FormStructurePanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormStructurePanel.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/FormStructurePanel.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAEL,sBAAsB,EACvB,MAAM,sCAAsC,CAAA;AAE7C,OAAO,EAGL,wBAAwB,EAEzB,MAAM,SAAS,CAAA;AAEhB,MAAM,MAAM,uBAAuB,GAAG;IACpC,KAAK,EAAE,wBAAwB,EAAE,CAAA;IACjC,UAAU,EAAE,UAAU,CAAA;IACtB,4DAA4D;IAC5D,iBAAiB,EAAE,sBAAsB,EAAE,CAAA;IAC3C,iGAAiG;IACjG,cAAc,EAAE,MAAM,GAAG,SAAS,CAAA;IAClC,aAAa,EAAE,CAAC,IAAI,EAAE,wBAAwB,EAAE,KAAK,IAAI,CAAA;IACzD,WAAW,EAAE,CAAC,WAAW,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,IAAI,CAAA;CAC5D,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,KAAK,EACL,UAAU,EACV,iBAAiB,EACjB,cAAc,EACd,aAAa,EACb,WAAW,GACZ,EAAE,uBAAuB,2CAgGzB"}

package/dist/components/FormTemplateEditor/FormStructurePanel.js

@@ -0,0 +1,108 @@
+import { moveItem as e } from "../../utils/functions/ArrayUtils.js";
+import { propertyKeyToPointer as t } from "../../utils/jsonschema/submissionContext.js";
+import { createEditableStep as n } from "./utils.js";
+import { StepCard as r } from "./StepCard.js";
+import { Alert as i, Box as a, Button as o, Paper as s, Stack as c, Typography as l } from "@mui/material";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import { Add as f } from "@mui/icons-material";
+import p from "pluralize";
+//#region src/components/FormTemplateEditor/FormStructurePanel.tsx
+function m({ steps: m, jsonSchema: h, unboundProperties: g, formTemplateId: _, onStepsChange: v, onBindField: y }) {
+	let b = (e, t) => {
+		v(m.map((n, r) => r === e ? {
+			...n,
+			...t
+		} : n));
+	}, x = () => {
+		v([...m, n()]);
+	}, S = (e) => {
+		v(m.filter((t, n) => n !== e));
+	}, C = (t, n) => {
+		v(e(m, t, n));
+	}, w = g.filter((e) => e.isRequired), T = g.filter((e) => !e.isRequired);
+	return /* @__PURE__ */ d(s, {
+		variant: "outlined",
+		sx: {
+			p: 2,
+			height: "100%"
+		},
+		children: [
+			/* @__PURE__ */ d(a, {
+				sx: {
+					mb: 1.5,
+					display: "flex",
+					justifyContent: "space-between",
+					alignItems: "flex-start",
+					gap: 1
+				},
+				children: [/* @__PURE__ */ d(a, { children: [/* @__PURE__ */ u(l, {
+					variant: "subtitle2",
+					children: "Steps"
+				}), /* @__PURE__ */ u(l, {
+					variant: "caption",
+					color: "text.secondary",
+					children: "Arrange fields into pages requesters will fill out in order."
+				})] }), /* @__PURE__ */ u(o, {
+					size: "small",
+					variant: "outlined",
+					startIcon: /* @__PURE__ */ u(f, {}),
+					onClick: x,
+					children: "Add step"
+				})]
+			}),
+			w.length > 0 && /* @__PURE__ */ d(i, {
+				severity: "error",
+				sx: { mb: 1.5 },
+				children: [
+					p("required field", w.length, !0),
+					" ",
+					p("is", w.length),
+					" not bound to a step and must be bound before saving:",
+					" ",
+					w.map((e) => e.subSchema.title ?? t(e.propertyKey)).join(", "),
+					"."
+				]
+			}),
+			T.length > 0 && /* @__PURE__ */ d(i, {
+				severity: "warning",
+				sx: { mb: 1.5 },
+				children: [
+					p("field", T.length, !0),
+					" ",
+					p("is", T.length),
+					" not yet bound to a step. Use a step's \"",
+					"Bind field",
+					"\" dropdown to add",
+					" ",
+					T.length === 1 ? "it" : "them",
+					"."
+				]
+			}),
+			/* @__PURE__ */ u(c, {
+				spacing: 1.5,
+				children: m.length === 0 ? /* @__PURE__ */ u(i, {
+					severity: "info",
+					children: "No steps yet. Click \"Add step\" to create the first one."
+				}) : m.map((e, t) => /* @__PURE__ */ u(r, {
+					step: e,
+					stepIndex: t,
+					isFirst: t === 0,
+					isLast: t === m.length - 1,
+					unboundProperties: g,
+					jsonSchema: h,
+					formTemplateId: _,
+					defaultExpanded: t === 0,
+					onChange: (e) => b(t, e),
+					onBindField: (t) => y(t, e.uiKey),
+					onMoveUp: () => C(t, -1),
+					onMoveDown: () => C(t, 1),
+					onRemove: () => S(t)
+				}, e.uiKey))
+			})
+		]
+	});
+}
+//#endregion
+export { m as FormStructurePanel };
+
+//# sourceMappingURL=FormStructurePanel.js.map

package/dist/components/FormTemplateEditor/FormStructurePanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormStructurePanel.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FormStructurePanel.tsx"],"sourcesContent":["import { FormTemplateStep } from '@sage-bionetworks/synapse-client'\nimport { Alert, Box, Button, Paper, Stack, Typography } from '@mui/material'\nimport { Add as AddIcon } from '@mui/icons-material'\nimport pluralize from 'pluralize'\nimport { RJSFSchema } from '@rjsf/utils'\nimport {\n  propertyKeyToPointer,\n  ResolvedSchemaProperty,\n} from '@/utils/jsonschema/submissionContext'\nimport { StepCard } from './StepCard'\nimport {\n  BIND_FIELD_LABEL,\n  createEditableStep,\n  EditableFormTemplateStep,\n  moveItem,\n} from './utils'\n\nexport type FormStructurePanelProps = {\n  steps: EditableFormTemplateStep[]\n  jsonSchema: RJSFSchema\n  /** Properties not yet bound to any step in the template. */\n  unboundProperties: ResolvedSchemaProperty[]\n  /** The FormTemplate's id, if it has been saved. Threaded down to file-field template uploads. */\n  formTemplateId: string | undefined\n  onStepsChange: (next: EditableFormTemplateStep[]) => void\n  onBindField: (propertyKey: string, stepKey: string) => void\n}\n\n/**\n * Right pane: the multi-step form structure. Steps are collapsible cards;\n * each step contains a list of field slots (with inline-expand for slot config)\n * and a \"Bind field\" dropdown listing any library fields not yet bound to a\n * step.\n */\nexport function FormStructurePanel({\n  steps,\n  jsonSchema,\n  unboundProperties,\n  formTemplateId,\n  onStepsChange,\n  onBindField,\n}: FormStructurePanelProps) {\n  const handleStepChange = (idx: number, patch: Partial<FormTemplateStep>) => {\n    onStepsChange(steps.map((s, i) => (i === idx ? { ...s, ...patch } : s)))\n  }\n\n  const handleAddStep = () => {\n    onStepsChange([...steps, createEditableStep()])\n  }\n\n  const handleRemoveStep = (idx: number) => {\n    onStepsChange(steps.filter((_, i) => i !== idx))\n  }\n\n  const handleMoveStep = (idx: number, direction: -1 | 1) => {\n    onStepsChange(moveItem(steps, idx, direction))\n  }\n\n  const requiredUnbound = unboundProperties.filter(p => p.isRequired)\n  const optionalUnbound = unboundProperties.filter(p => !p.isRequired)\n\n  return (\n    <Paper variant=\"outlined\" sx={{ p: 2, height: '100%' }}>\n      <Box\n        sx={{\n          mb: 1.5,\n          display: 'flex',\n          justifyContent: 'space-between',\n          alignItems: 'flex-start',\n          gap: 1,\n        }}\n      >\n        <Box>\n          <Typography variant=\"subtitle2\">Steps</Typography>\n          <Typography variant=\"caption\" color=\"text.secondary\">\n            Arrange fields into pages requesters will fill out in order.\n          </Typography>\n        </Box>\n        <Button\n          size=\"small\"\n          variant=\"outlined\"\n          startIcon={<AddIcon />}\n          onClick={handleAddStep}\n        >\n          Add step\n        </Button>\n      </Box>\n\n      {requiredUnbound.length > 0 && (\n        <Alert severity=\"error\" sx={{ mb: 1.5 }}>\n          {pluralize('required field', requiredUnbound.length, true)}{' '}\n          {pluralize('is', requiredUnbound.length)} not bound to a step and must\n          be bound before saving:{' '}\n          {requiredUnbound\n            .map(p => p.subSchema.title ?? propertyKeyToPointer(p.propertyKey))\n            .join(', ')}\n          .\n        </Alert>\n      )}\n\n      {optionalUnbound.length > 0 && (\n        <Alert severity=\"warning\" sx={{ mb: 1.5 }}>\n          {pluralize('field', optionalUnbound.length, true)}{' '}\n          {pluralize('is', optionalUnbound.length)} not yet bound to a step. Use\n          a step's \"{BIND_FIELD_LABEL}\" dropdown to add{' '}\n          {optionalUnbound.length === 1 ? 'it' : 'them'}.\n        </Alert>\n      )}\n\n      <Stack spacing={1.5}>\n        {steps.length === 0 ? (\n          <Alert severity=\"info\">\n            No steps yet. Click \"Add step\" to create the first one.\n          </Alert>\n        ) : (\n          steps.map((step, stepIdx) => (\n            <StepCard\n              key={step.uiKey}\n              step={step}\n              stepIndex={stepIdx}\n              isFirst={stepIdx === 0}\n              isLast={stepIdx === steps.length - 1}\n              unboundProperties={unboundProperties}\n              jsonSchema={jsonSchema}\n              formTemplateId={formTemplateId}\n              defaultExpanded={stepIdx === 0}\n              onChange={patch => handleStepChange(stepIdx, patch)}\n              onBindField={propertyKey => onBindField(propertyKey, step.uiKey)}\n              onMoveUp={() => handleMoveStep(stepIdx, -1)}\n              onMoveDown={() => handleMoveStep(stepIdx, 1)}\n              onRemove={() => handleRemoveStep(stepIdx)}\n            />\n          ))\n        )}\n      </Stack>\n    </Paper>\n  )\n}\n"],"mappings":";;;;;;;;;AAkCA,SAAgB,EAAmB,EACjC,UACA,eACA,sBACA,mBACA,kBACA,kBAC0B;CAC1B,IAAM,KAAoB,GAAa,MAAqC;EAC1E,EAAc,EAAM,KAAK,GAAG,MAAO,MAAM,IAAM;GAAE,GAAG;GAAG,GAAG;EAAM,IAAI,CAAE,CAAC;CACzE,GAEM,UAAsB;EAC1B,EAAc,CAAC,GAAG,GAAO,EAAmB,CAAC,CAAC;CAChD,GAEM,KAAoB,MAAgB;EACxC,EAAc,EAAM,QAAQ,GAAG,MAAM,MAAM,CAAG,CAAC;CACjD,GAEM,KAAkB,GAAa,MAAsB;EACzD,EAAc,EAAS,GAAO,GAAK,CAAS,CAAC;CAC/C,GAEM,IAAkB,EAAkB,QAAO,MAAK,EAAE,UAAU,GAC5D,IAAkB,EAAkB,QAAO,MAAK,CAAC,EAAE,UAAU;CAEnE,OACE,kBAAC,GAAD;EAAO,SAAQ;EAAW,IAAI;GAAE,GAAG;GAAG,QAAQ;EAAO;YAArD;GACE,kBAAC,GAAD;IACE,IAAI;KACF,IAAI;KACJ,SAAS;KACT,gBAAgB;KAChB,YAAY;KACZ,KAAK;IACP;cAPF,CASE,kBAAC,GAAD,EAAA,UAAA,CACE,kBAAC,GAAD;KAAY,SAAQ;eAAY;IAAiB,CAAA,GACjD,kBAAC,GAAD;KAAY,SAAQ;KAAU,OAAM;eAAiB;IAEzC,CAAA,CACT,EAAA,CAAA,GACL,kBAAC,GAAD;KACE,MAAK;KACL,SAAQ;KACR,WAAW,kBAAC,GAAD,CAAU,CAAA;KACrB,SAAS;eACV;IAEO,CAAA,CACL;;GAEJ,EAAgB,SAAS,KACxB,kBAAC,GAAD;IAAO,UAAS;IAAQ,IAAI,EAAE,IAAI,IAAI;cAAtC;KACG,EAAU,kBAAkB,EAAgB,QAAQ,EAAI;KAAG;KAC3D,EAAU,MAAM,EAAgB,MAAM;KAAE;KACjB;KACvB,EACE,KAAI,MAAK,EAAE,UAAU,SAAS,EAAqB,EAAE,WAAW,CAAC,EACjE,KAAK,IAAI;KAAE;IAET;;GAGR,EAAgB,SAAS,KACxB,kBAAC,GAAD;IAAO,UAAS;IAAU,IAAI,EAAE,IAAI,IAAI;cAAxC;KACG,EAAU,SAAS,EAAgB,QAAQ,EAAI;KAAG;KAClD,EAAU,MAAM,EAAgB,MAAM;KAAE;;KACb;KAAkB;KAC7C,EAAgB,WAAW,IAAI,OAAO;KAAO;IACzC;;GAGT,kBAAC,GAAD;IAAO,SAAS;cACb,EAAM,WAAW,IAChB,kBAAC,GAAD;KAAO,UAAS;eAAO;IAEhB,CAAA,IAEP,EAAM,KAAK,GAAM,MACf,kBAAC,GAAD;KAEQ;KACN,WAAW;KACX,SAAS,MAAY;KACrB,QAAQ,MAAY,EAAM,SAAS;KAChB;KACP;KACI;KAChB,iBAAiB,MAAY;KAC7B,WAAU,MAAS,EAAiB,GAAS,CAAK;KAClD,cAAa,MAAe,EAAY,GAAa,EAAK,KAAK;KAC/D,gBAAgB,EAAe,GAAS,EAAE;KAC1C,kBAAkB,EAAe,GAAS,CAAC;KAC3C,gBAAgB,EAAiB,CAAO;IACzC,GAdM,EAAK,KAcX,CACF;GAEE,CAAA;EACF;;AAEX"}

package/dist/components/FormTemplateEditor/FormTemplateEditor.d.ts

@@ -0,0 +1,10 @@
+import { FormTemplate } from '@sage-bionetworks/synapse-client';
+export type FormTemplateEditorProps = {
+    /** Existing template to open for editing, or undefined to create a new one. */
+    templateId?: string;
+    /** Called after the template is successfully created or a new version is saved. */
+    onSaved?: (template: FormTemplate) => void;
+    onCancel?: () => void;
+};
+export declare function FormTemplateEditor({ templateId, onSaved, onCancel, }: FormTemplateEditorProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FormTemplateEditor.d.ts.map

package/dist/components/FormTemplateEditor/FormTemplateEditor.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormTemplateEditor.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/FormTemplateEditor.tsx"],"names":[],"mappings":"AAcA,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAA;AAG/D,MAAM,MAAM,uBAAuB,GAAG;IACpC,+EAA+E;IAC/E,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,mFAAmF;IACnF,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAA;IAC1C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACtB,CAAA;AAED,wBAAgB,kBAAkB,CAAC,EACjC,UAAU,EACV,OAAO,EACP,QAAQ,GACT,EAAE,uBAAuB,2CA0CzB"}

package/dist/components/FormTemplateEditor/FormTemplateEditor.js

@@ -0,0 +1,31 @@
+import { SynapseSpinner as e } from "../LoadingScreen/LoadingScreen.js";
+import { useGetFormTemplate as t } from "../../synapse-queries/dataaccess/useFormTemplate.js";
+import { useGetRegisteredSchema as n } from "../../synapse-queries/jsonschema/useSchema.js";
+import { FormTemplateEditorForm as r } from "./FormTemplateEditorForm.js";
+import { Alert as i, Paper as a } from "@mui/material";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+//#region src/components/FormTemplateEditor/FormTemplateEditor.tsx
+function c({ templateId: c, onSaved: l, onCancel: u }) {
+	let { data: d, isLoading: f, error: p } = t(c), { data: m, isLoading: h, error: g } = n(d?.schema$id ?? "", { enabled: !!d?.schema$id });
+	if (c && (f || d && h)) return /* @__PURE__ */ o(a, {
+		sx: { p: 3 },
+		children: /* @__PURE__ */ o(e, { size: 40 })
+	});
+	let _ = p ?? g;
+	return _ ? /* @__PURE__ */ o(a, {
+		sx: { p: 3 },
+		children: /* @__PURE__ */ s(i, {
+			severity: "error",
+			children: ["Could not load the form template: ", _.reason ?? _.message]
+		})
+	}) : /* @__PURE__ */ o(r, {
+		initialTemplate: d,
+		initialJsonSchema: m,
+		onSaved: l,
+		onCancel: u
+	});
+}
+//#endregion
+export { c as FormTemplateEditor };
+
+//# sourceMappingURL=FormTemplateEditor.js.map

package/dist/components/FormTemplateEditor/FormTemplateEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormTemplateEditor.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FormTemplateEditor.tsx"],"sourcesContent":["/*\n * Data-fetching shell for the FormTemplate authoring experience. Resolves an existing template\n * and the JSON Schema it references (when `templateId` is given), then hands the resolved data\n * to `FormTemplateEditorForm`, which owns the actual editing state and save orchestration.\n * Passing no `templateId` opens a blank editor for creating a new template.\n *\n * The schema is loaded as registered, with its `$ref`s intact, so that saving a new version\n * preserves the reference to the base schema rather than inlining it.\n */\nimport { SynapseSpinner } from '@/components/LoadingScreen/LoadingScreen'\nimport { useGetFormTemplate } from '@/synapse-queries/dataaccess/useFormTemplate'\nimport { useGetRegisteredSchema } from '@/synapse-queries/jsonschema/useSchema'\nimport { Alert, Paper } from '@mui/material'\nimport { RJSFSchema } from '@rjsf/utils'\nimport { FormTemplate } from '@sage-bionetworks/synapse-client'\nimport { FormTemplateEditorForm } from './FormTemplateEditorForm'\n\nexport type FormTemplateEditorProps = {\n  /** Existing template to open for editing, or undefined to create a new one. */\n  templateId?: string\n  /** Called after the template is successfully created or a new version is saved. */\n  onSaved?: (template: FormTemplate) => void\n  onCancel?: () => void\n}\n\nexport function FormTemplateEditor({\n  templateId,\n  onSaved,\n  onCancel,\n}: FormTemplateEditorProps) {\n  const {\n    data: template,\n    isLoading: isLoadingTemplate,\n    error: templateError,\n  } = useGetFormTemplate(templateId)\n\n  const {\n    data: jsonSchema,\n    isLoading: isLoadingSchema,\n    error: schemaError,\n  } = useGetRegisteredSchema(template?.schema$id ?? '', {\n    enabled: !!template?.schema$id,\n  })\n\n  if (templateId && (isLoadingTemplate || (template && isLoadingSchema))) {\n    return (\n      <Paper sx={{ p: 3 }}>\n        <SynapseSpinner size={40} />\n      </Paper>\n    )\n  }\n\n  const error = templateError ?? schemaError\n  if (error) {\n    return (\n      <Paper sx={{ p: 3 }}>\n        <Alert severity=\"error\">\n          Could not load the form template: {error.reason ?? error.message}\n        </Alert>\n      </Paper>\n    )\n  }\n\n  return (\n    <FormTemplateEditorForm\n      initialTemplate={template}\n      initialJsonSchema={jsonSchema as RJSFSchema | undefined}\n      onSaved={onSaved}\n      onCancel={onCancel}\n    />\n  )\n}\n"],"mappings":";;;;;;;AAyBA,SAAgB,EAAmB,EACjC,eACA,YACA,eAC0B;CAC1B,IAAM,EACJ,MAAM,GACN,WAAW,GACX,OAAO,MACL,EAAmB,CAAU,GAE3B,EACJ,MAAM,GACN,WAAW,GACX,OAAO,MACL,EAAuB,GAAU,aAAa,IAAI,EACpD,SAAS,CAAC,CAAC,GAAU,UACvB,CAAC;CAED,IAAI,MAAe,KAAsB,KAAY,IACnD,OACE,kBAAC,GAAD;EAAO,IAAI,EAAE,GAAG,EAAE;YAChB,kBAAC,GAAD,EAAgB,MAAM,GAAK,CAAA;CACtB,CAAA;CAIX,IAAM,IAAQ,KAAiB;CAW/B,OAVI,IAEA,kBAAC,GAAD;EAAO,IAAI,EAAE,GAAG,EAAE;YAChB,kBAAC,GAAD;GAAO,UAAS;aAAhB,CAAwB,sCACa,EAAM,UAAU,EAAM,OACpD;;CACF,CAAA,IAKT,kBAAC,GAAD;EACE,iBAAiB;EACjB,mBAAmB;EACV;EACC;CACX,CAAA;AAEL"}

package/dist/components/FormTemplateEditor/FormTemplateEditorForm.d.ts

@@ -0,0 +1,15 @@
+import { FormTemplate } from '@sage-bionetworks/synapse-client';
+import { RJSFSchema } from '@rjsf/utils';
+export type FormTemplateEditorFormProps = {
+    /** Existing template to edit, or undefined for creating a new one. */
+    initialTemplate?: FormTemplate;
+    /**
+     * The JSON Schema body the template's `schema$id` resolves to. Required when editing an
+     * existing template.
+     */
+    initialJsonSchema?: RJSFSchema;
+    onSaved?: (template: FormTemplate) => void;
+    onCancel?: () => void;
+};
+export declare function FormTemplateEditorForm({ initialTemplate, initialJsonSchema, onSaved, onCancel, }: FormTemplateEditorFormProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FormTemplateEditorForm.d.ts.map

package/dist/components/FormTemplateEditor/FormTemplateEditorForm.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormTemplateEditorForm.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/FormTemplateEditorForm.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAkC,CAAA;AAgB/D,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AA4BxC,MAAM,MAAM,2BAA2B,GAAG;IACxC,sEAAsE;IACtE,eAAe,CAAC,EAAE,YAAY,CAAA;IAC9B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,UAAU,CAAA;IAC9B,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,YAAY,KAAK,IAAI,CAAA;IAC1C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAA;CACtB,CAAA;AAED,wBAAgB,sBAAsB,CAAC,EACrC,eAAe,EACf,iBAAiB,EACjB,OAAO,EACP,QAAQ,GACT,EAAE,2BAA2B,2CAiR7B"}

package/dist/components/FormTemplateEditor/FormTemplateEditorForm.js

@@ -0,0 +1,234 @@
+import { displayToast as e } from "../ToastMessage/ToastMessage.js";
+import "../ToastMessage/index.js";
+import { propertyKeyToPointer as t, resolveSchemaPropertyAtPointer as n } from "../../utils/jsonschema/submissionContext.js";
+import { formatSchema$id as r, resolveFormTemplateSchemaName as i } from "./formTemplateSchema.js";
+import { detectFieldType as ee, fieldTypeLabel as te } from "./schemaFieldUtils.js";
+import { FieldDefinitionDrawer as ne } from "./FieldDefinitionDrawer.js";
+import { FieldValidationErrorAlert as a } from "./FieldValidationErrorAlert.js";
+import { readFieldDragData as re } from "./sortableIds.js";
+import { FieldLibrary as ie } from "./FieldLibrary.js";
+import { toFormTemplateSteps as o } from "./utils.js";
+import { FormStructurePanel as s } from "./FormStructurePanel.js";
+import { FormTemplatePreview as c } from "./FormTemplatePreview.js";
+import { JsonSchemaBodyEditor as l } from "./JsonSchemaBodyEditor.js";
+import { validateFormTemplateFields as u } from "./formTemplateValidation.js";
+import { useFormTemplateDraft as d } from "./useFormTemplateDraft.js";
+import { useFormTemplateDrag as f } from "./useFormTemplateDrag.js";
+import { useSaveFormTemplate as p } from "./useSaveFormTemplate.js";
+import { useMemo as m, useState as h } from "react";
+import { Accordion as g, AccordionDetails as _, AccordionSummary as ae, Alert as oe, Box as v, Button as y, Divider as b, Grid as x, Paper as S, TextField as C, Typography as w } from "@mui/material";
+import { jsx as T, jsxs as E } from "react/jsx-runtime";
+import { ExpandMore as D } from "@mui/icons-material";
+import { DragDropProvider as O, DragOverlay as k } from "@dnd-kit/react";
+//#region src/components/FormTemplateEditor/FormTemplateEditorForm.tsx
+function A({ initialTemplate: A, initialJsonSchema: j, onSaved: M, onCancel: N }) {
+	let P = d(A, j), { name: F, setName: I, jsonSchema: L, setJsonSchema: R, steps: z, setSteps: B, editingPropertyKey: V, setEditingPropertyKey: H, usedPaths: U, existingPropertyKeys: W, unboundProperties: G, handleCreateField: K, renamePropertyKey: q, handleUpdateProperty: se, handleReplaceProperty: ce, handleChangeRequired: le, handleChangeContext: ue, handleRemoveProperty: de, bindField: fe, previewTemplate: pe } = P, me = f(P), { mutateAsync: he, isPending: J } = p(), [Y, X] = h(null), Z = m(() => u(o(z), L), [z, L]), ge = async () => {
+		X(null);
+		try {
+			let t = await he({
+				initialTemplate: A,
+				initialJsonSchema: j,
+				name: F,
+				jsonSchema: L,
+				steps: z
+			});
+			if (!t.ok) {
+				X(t.validationErrors);
+				return;
+			}
+			e(A ? "Your changes were saved as a new version." : "The form template was created.", "success", { title: "Template saved" }), M?.(t.template);
+		} catch (t) {
+			let n = t;
+			n.status === 412 ? e("This template was changed by someone else since you opened it. Reload it to see the latest version, then reapply your changes.", "warning", { title: "Template updated since you started editing" }) : e(n.reason ?? "An error occurred while saving.", "danger", { title: "Could not save template" });
+		}
+	}, Q = V === null ? void 0 : n(L, t(V)), $ = Q?.subSchema ?? null, _e = Q?.isRequired ?? !1, ve = Q?.context ?? "ALWAYS", ye = V !== null && U.has(t(V)), be = i(F, A?.schema$id);
+	return /* @__PURE__ */ E(O, {
+		...me,
+		children: [/* @__PURE__ */ E(S, {
+			sx: { p: 3 },
+			children: [
+				/* @__PURE__ */ T(w, {
+					variant: "h6",
+					gutterBottom: !0,
+					children: A ? "Edit Form Template" : "Create Form Template"
+				}),
+				/* @__PURE__ */ T(b, { sx: { mb: 2 } }),
+				/* @__PURE__ */ T(C, {
+					label: "Internal Name",
+					value: F,
+					onChange: (e) => I(e.target.value),
+					size: "small",
+					fullWidth: !0,
+					helperText: "Used by ACT to identify and find this template. Not shown to requesters.",
+					sx: { mb: 1 }
+				}),
+				/* @__PURE__ */ E(w, {
+					variant: "caption",
+					color: "text.secondary",
+					component: "p",
+					sx: { mb: 3 },
+					children: [
+						"JSON Schema:",
+						" ",
+						A?.schema$id ?? r(be),
+						!A && " (a new version is registered when saved)"
+					]
+				}),
+				/* @__PURE__ */ E(x, {
+					container: !0,
+					spacing: 2,
+					alignItems: "stretch",
+					children: [
+						/* @__PURE__ */ T(x, {
+							size: {
+								xs: 12,
+								md: 4
+							},
+							children: /* @__PURE__ */ T(ie, {
+								jsonSchema: L,
+								usedPaths: U,
+								selectedPropertyKey: V,
+								onSelectField: H,
+								onCreateField: K
+							})
+						}),
+						/* @__PURE__ */ T(x, {
+							size: {
+								xs: 12,
+								md: 4
+							},
+							children: /* @__PURE__ */ T(s, {
+								steps: z,
+								jsonSchema: L,
+								unboundProperties: G,
+								formTemplateId: A?.id,
+								onStepsChange: B,
+								onBindField: fe
+							})
+						}),
+						/* @__PURE__ */ T(x, {
+							size: {
+								xs: 12,
+								md: 4
+							},
+							children: /* @__PURE__ */ E(v, {
+								sx: {
+									position: "sticky",
+									top: 16
+								},
+								children: [/* @__PURE__ */ T(w, {
+									variant: "subtitle2",
+									color: "text.secondary",
+									gutterBottom: !0,
+									children: "Live Preview"
+								}), /* @__PURE__ */ T(c, {
+									template: pe,
+									jsonSchema: L
+								})]
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ E(g, {
+					sx: { mt: 3 },
+					disableGutters: !0,
+					elevation: 0,
+					variant: "outlined",
+					children: [/* @__PURE__ */ T(ae, {
+						expandIcon: /* @__PURE__ */ T(D, {}),
+						children: /* @__PURE__ */ T(w, {
+							variant: "subtitle2",
+							children: "Advanced: Edit raw JSON Schema"
+						})
+					}), /* @__PURE__ */ E(_, { children: [/* @__PURE__ */ T(oe, {
+						severity: "info",
+						variant: "outlined",
+						sx: { mb: 2 },
+						children: "Direct access to the JSON Schema body. Most editing happens in the Fields panel above — use this view for features the simple editor doesn't support (nested objects, advanced validation, etc.)."
+					}), /* @__PURE__ */ T(l, {
+						value: L,
+						onChange: R
+					})] })]
+				}),
+				Z.length > 0 && /* @__PURE__ */ T(a, {
+					errors: Z,
+					children: "Fix the following before saving:"
+				}),
+				Y && /* @__PURE__ */ T(a, { errors: Y }),
+				/* @__PURE__ */ T(b, { sx: { my: 2 } }),
+				/* @__PURE__ */ E(v, {
+					sx: {
+						display: "flex",
+						justifyContent: "flex-end",
+						gap: 1
+					},
+					children: [N && /* @__PURE__ */ T(y, {
+						variant: "outlined",
+						onClick: N,
+						disabled: J,
+						children: "Cancel"
+					}), /* @__PURE__ */ T(y, {
+						variant: "contained",
+						onClick: () => void ge(),
+						disabled: !F || J || Z.length > 0,
+						children: J ? "Saving…" : A ? "Save Changes" : "Create Template"
+					})]
+				}),
+				/* @__PURE__ */ T(ne, {
+					open: V !== null,
+					propertyKey: V,
+					existingKeys: W,
+					property: $,
+					isRequired: _e,
+					context: ve,
+					isUsedInSteps: ye,
+					onClose: () => H(null),
+					onUpdate: (e) => {
+						V && se(V, e);
+					},
+					onRenameKey: (e) => {
+						V && q(V, e);
+					},
+					onReplace: (e) => {
+						V && ce(V, e);
+					},
+					onChangeRequired: (e) => {
+						V && le(V, e);
+					},
+					onChangeContext: (e) => {
+						V && ue(V, e);
+					},
+					onRemove: () => {
+						V && de(V);
+					}
+				})
+			]
+		}), /* @__PURE__ */ T(k, { children: (e) => {
+			if (e.type !== "field") return null;
+			let r = re(e.data);
+			if (!r) return null;
+			let i = n(L, t(r))?.subSchema;
+			return i ? /* @__PURE__ */ E(S, {
+				elevation: 6,
+				sx: {
+					p: 1.25,
+					cursor: "grabbing",
+					opacity: .95
+				},
+				children: [/* @__PURE__ */ T(w, {
+					variant: "body2",
+					fontWeight: 500,
+					children: i.title || r
+				}), /* @__PURE__ */ T(w, {
+					variant: "caption",
+					color: "text.secondary",
+					children: te(ee(i))
+				})]
+			}) : null;
+		} })]
+	});
+}
+//#endregion
+export { A as FormTemplateEditorForm };
+
+//# sourceMappingURL=FormTemplateEditorForm.js.map