synapse-react-client 4.0.40 → 4.0.42

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

@@ -0,0 +1 @@
+{"version":3,"file":"FormTemplateEditorForm.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FormTemplateEditorForm.tsx"],"sourcesContent":["/*\n * Editing UI for a FormTemplate draft: composes the pure `useFormTemplateDraft` state with save\n * orchestration (`useSaveFormTemplate`) and client-side validation. Receives already-resolved\n * initial data — the caller (`FormTemplateEditor`)\n * owns fetching, so this component never renders a loading state.\n */\nimport { DragDropProvider, DragOverlay } from '@dnd-kit/react'\nimport { FormTemplate } from '@sage-bionetworks/synapse-client'\nimport { SynapseClientError } from '@sage-bionetworks/synapse-client/util/SynapseClientError'\nimport {\n  Accordion,\n  AccordionDetails,\n  AccordionSummary,\n  Alert,\n  Box,\n  Button,\n  Divider,\n  Grid,\n  Paper,\n  TextField,\n  Typography,\n} from '@mui/material'\nimport { ExpandMore as ExpandMoreIcon } from '@mui/icons-material'\nimport { RJSFSchema } from '@rjsf/utils'\nimport { useMemo, useState } from 'react'\nimport { displayToast } from '@/components/ToastMessage'\nimport {\n  propertyKeyToPointer,\n  resolveSchemaPropertyAtPointer,\n} from '@/utils/jsonschema/submissionContext'\nimport { FieldDefinitionDrawer } from './FieldDefinitionDrawer'\nimport { FieldValidationErrorAlert } from './FieldValidationErrorAlert'\nimport { FieldLibrary } from './FieldLibrary'\nimport { FIELD_DRAG_TYPE, readFieldDragData } from './sortableIds'\nimport { FormStructurePanel } from './FormStructurePanel'\nimport { FormTemplatePreview } from './FormTemplatePreview'\nimport { JsonSchemaBodyEditor } from './JsonSchemaBodyEditor'\nimport { detectFieldType, fieldTypeLabel } from './schemaFieldUtils'\nimport {\n  formatSchema$id,\n  resolveFormTemplateSchemaName,\n} from './formTemplateSchema'\nimport { toFormTemplateSteps } from './utils'\nimport {\n  FormTemplateFieldValidationError,\n  validateFormTemplateFields,\n} from './formTemplateValidation'\nimport { useFormTemplateDraft } from './useFormTemplateDraft'\nimport { useFormTemplateDrag } from './useFormTemplateDrag'\nimport { useSaveFormTemplate } from './useSaveFormTemplate'\n\nexport type FormTemplateEditorFormProps = {\n  /** Existing template to edit, or undefined for creating a new one. */\n  initialTemplate?: FormTemplate\n  /**\n   * The JSON Schema body the template's `schema$id` resolves to. Required when editing an\n   * existing template.\n   */\n  initialJsonSchema?: RJSFSchema\n  onSaved?: (template: FormTemplate) => void\n  onCancel?: () => void\n}\n\nexport function FormTemplateEditorForm({\n  initialTemplate,\n  initialJsonSchema,\n  onSaved,\n  onCancel,\n}: FormTemplateEditorFormProps) {\n  const draft = useFormTemplateDraft(initialTemplate, initialJsonSchema)\n  const {\n    name,\n    setName,\n    jsonSchema,\n    setJsonSchema,\n    steps,\n    setSteps,\n    editingPropertyKey,\n    setEditingPropertyKey,\n    usedPaths,\n    existingPropertyKeys,\n    unboundProperties,\n    handleCreateField,\n    renamePropertyKey,\n    handleUpdateProperty,\n    handleReplaceProperty,\n    handleChangeRequired,\n    handleChangeContext,\n    handleRemoveProperty,\n    bindField,\n    previewTemplate,\n  } = draft\n  const dragHandlers = useFormTemplateDrag(draft)\n\n  const { mutateAsync: save, isPending: isSaving } = useSaveFormTemplate()\n  const [saveError, setSaveError] = useState<\n    FormTemplateFieldValidationError[] | null\n  >(null)\n\n  const validationErrors = useMemo(\n    () => validateFormTemplateFields(toFormTemplateSteps(steps), jsonSchema),\n    [steps, jsonSchema],\n  )\n\n  const handleSave = async () => {\n    setSaveError(null)\n    try {\n      const result = await save({\n        initialTemplate,\n        initialJsonSchema,\n        name,\n        jsonSchema,\n        steps,\n      })\n      if (!result.ok) {\n        setSaveError(result.validationErrors)\n        return\n      }\n      displayToast(\n        initialTemplate\n          ? 'Your changes were saved as a new version.'\n          : 'The form template was created.',\n        'success',\n        { title: 'Template saved' },\n      )\n      onSaved?.(result.template)\n    } catch (error) {\n      const clientError = error as SynapseClientError\n      if (clientError.status === 412) {\n        displayToast(\n          'This template was changed by someone else since you opened it. Reload it to see the latest version, then reapply your changes.',\n          'warning',\n          { title: 'Template updated since you started editing' },\n        )\n      } else {\n        displayToast(\n          clientError.reason ?? 'An error occurred while saving.',\n          'danger',\n          { title: 'Could not save template' },\n        )\n      }\n    }\n  }\n\n  const editingResolved =\n    editingPropertyKey !== null\n      ? resolveSchemaPropertyAtPointer(\n          jsonSchema,\n          propertyKeyToPointer(editingPropertyKey),\n        )\n      : undefined\n  const editingProperty: RJSFSchema | null = editingResolved?.subSchema ?? null\n  const editingIsRequired = editingResolved?.isRequired ?? false\n  const editingContext = editingResolved?.context ?? 'ALWAYS'\n  const editingIsUsedInSteps =\n    editingPropertyKey !== null &&\n    usedPaths.has(propertyKeyToPointer(editingPropertyKey))\n\n  const templateSchemaName = resolveFormTemplateSchemaName(\n    name,\n    initialTemplate?.schema$id,\n  )\n\n  return (\n    <DragDropProvider {...dragHandlers}>\n      <Paper sx={{ p: 3 }}>\n        <Typography variant=\"h6\" gutterBottom>\n          {initialTemplate ? 'Edit Form Template' : 'Create Form Template'}\n        </Typography>\n\n        <Divider sx={{ mb: 2 }} />\n\n        <TextField\n          label=\"Internal Name\"\n          value={name}\n          onChange={e => setName(e.target.value)}\n          size=\"small\"\n          fullWidth\n          helperText=\"Used by ACT to identify and find this template. Not shown to requesters.\"\n          sx={{ mb: 1 }}\n        />\n        <Typography\n          variant=\"caption\"\n          color=\"text.secondary\"\n          component=\"p\"\n          sx={{ mb: 3 }}\n        >\n          JSON Schema:{' '}\n          {initialTemplate?.schema$id ?? formatSchema$id(templateSchemaName)}\n          {!initialTemplate && ' (a new version is registered when saved)'}\n        </Typography>\n\n        <Grid container spacing={2} alignItems=\"stretch\">\n          <Grid size={{ xs: 12, md: 4 }}>\n            <FieldLibrary\n              jsonSchema={jsonSchema}\n              usedPaths={usedPaths}\n              selectedPropertyKey={editingPropertyKey}\n              onSelectField={setEditingPropertyKey}\n              onCreateField={handleCreateField}\n            />\n          </Grid>\n          <Grid size={{ xs: 12, md: 4 }}>\n            <FormStructurePanel\n              steps={steps}\n              jsonSchema={jsonSchema}\n              unboundProperties={unboundProperties}\n              formTemplateId={initialTemplate?.id}\n              onStepsChange={setSteps}\n              onBindField={bindField}\n            />\n          </Grid>\n          <Grid size={{ xs: 12, md: 4 }}>\n            <Box sx={{ position: 'sticky', top: 16 }}>\n              <Typography\n                variant=\"subtitle2\"\n                color=\"text.secondary\"\n                gutterBottom\n              >\n                Live Preview\n              </Typography>\n              <FormTemplatePreview\n                template={previewTemplate}\n                jsonSchema={jsonSchema}\n              />\n            </Box>\n          </Grid>\n        </Grid>\n\n        <Accordion\n          sx={{ mt: 3 }}\n          disableGutters\n          elevation={0}\n          variant=\"outlined\"\n        >\n          <AccordionSummary expandIcon={<ExpandMoreIcon />}>\n            <Typography variant=\"subtitle2\">\n              Advanced: Edit raw JSON Schema\n            </Typography>\n          </AccordionSummary>\n          <AccordionDetails>\n            <Alert severity=\"info\" variant=\"outlined\" sx={{ mb: 2 }}>\n              Direct access to the JSON Schema body. Most editing happens in the\n              Fields panel above — use this view for features the simple editor\n              doesn't support (nested objects, advanced validation, etc.).\n            </Alert>\n            <JsonSchemaBodyEditor value={jsonSchema} onChange={setJsonSchema} />\n          </AccordionDetails>\n        </Accordion>\n\n        {validationErrors.length > 0 && (\n          <FieldValidationErrorAlert errors={validationErrors}>\n            Fix the following before saving:\n          </FieldValidationErrorAlert>\n        )}\n\n        {saveError && <FieldValidationErrorAlert errors={saveError} />}\n\n        <Divider sx={{ my: 2 }} />\n\n        <Box sx={{ display: 'flex', justifyContent: 'flex-end', gap: 1 }}>\n          {onCancel && (\n            <Button variant=\"outlined\" onClick={onCancel} disabled={isSaving}>\n              Cancel\n            </Button>\n          )}\n          <Button\n            variant=\"contained\"\n            onClick={() => void handleSave()}\n            disabled={!name || isSaving || validationErrors.length > 0}\n          >\n            {isSaving\n              ? 'Saving…'\n              : initialTemplate\n                ? 'Save Changes'\n                : 'Create Template'}\n          </Button>\n        </Box>\n\n        <FieldDefinitionDrawer\n          open={editingPropertyKey !== null}\n          propertyKey={editingPropertyKey}\n          existingKeys={existingPropertyKeys}\n          property={editingProperty}\n          isRequired={editingIsRequired}\n          context={editingContext}\n          isUsedInSteps={editingIsUsedInSteps}\n          onClose={() => setEditingPropertyKey(null)}\n          onUpdate={patch => {\n            if (editingPropertyKey)\n              handleUpdateProperty(editingPropertyKey, patch)\n          }}\n          onRenameKey={newKey => {\n            if (editingPropertyKey)\n              renamePropertyKey(editingPropertyKey, newKey)\n          }}\n          onReplace={next => {\n            if (editingPropertyKey)\n              handleReplaceProperty(editingPropertyKey, next)\n          }}\n          onChangeRequired={isReq => {\n            if (editingPropertyKey)\n              handleChangeRequired(editingPropertyKey, isReq)\n          }}\n          onChangeContext={context => {\n            if (editingPropertyKey)\n              handleChangeContext(editingPropertyKey, context)\n          }}\n          onRemove={() => {\n            if (editingPropertyKey) handleRemoveProperty(editingPropertyKey)\n          }}\n        />\n      </Paper>\n\n      <DragOverlay>\n        {source => {\n          if (source.type !== FIELD_DRAG_TYPE) return null\n          const propertyKey = readFieldDragData(source.data)\n          if (!propertyKey) return null\n          const property = resolveSchemaPropertyAtPointer(\n            jsonSchema,\n            propertyKeyToPointer(propertyKey),\n          )?.subSchema\n          if (!property) return null\n          return (\n            <Paper\n              elevation={6}\n              sx={{ p: 1.25, cursor: 'grabbing', opacity: 0.95 }}\n            >\n              <Typography variant=\"body2\" fontWeight={500}>\n                {property.title || propertyKey}\n              </Typography>\n              <Typography variant=\"caption\" color=\"text.secondary\">\n                {fieldTypeLabel(detectFieldType(property))}\n              </Typography>\n            </Paper>\n          )\n        }}\n      </DragOverlay>\n    </DragDropProvider>\n  )\n}\n"],"mappings":"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"}

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

@@ -0,0 +1,14 @@
+import { FormTemplate } from '@sage-bionetworks/synapse-client';
+import { RJSFSchema } from '@rjsf/utils';
+type FormTemplatePreviewProps = {
+    template: FormTemplate;
+    jsonSchema: RJSFSchema;
+};
+/**
+ * Renders a live preview of how a FormTemplate + its referenced JSON Schema will appear to a
+ * requester. Computed client-side against the unsaved draft, purely to give ACT instant feedback
+ * while editing.
+ */
+export declare function FormTemplatePreview({ template, jsonSchema, }: FormTemplatePreviewProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=FormTemplatePreview.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FormTemplatePreview.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/FormTemplatePreview.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,YAAY,EACb,MAAM,kCAAkC,CAAA;AAWzC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAGxC,KAAK,wBAAwB,GAAG;IAC9B,QAAQ,EAAE,YAAY,CAAA;IACtB,UAAU,EAAE,UAAU,CAAA;CACvB,CAAA;AAED;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,UAAU,GACX,EAAE,wBAAwB,2CAkE1B"}

package/dist/components/FormTemplateEditor/FormTemplatePreview.js

@@ -0,0 +1,72 @@
+import { JsonSchemaForm as e } from "../JsonSchemaForm/JsonSchemaForm.js";
+import { generateDataAccessSchema as t } from "../../utils/jsonschema/generateDataAccessSchema.js";
+import { useMemo as n, useState as r } from "react";
+import { Box as i, Paper as a, Step as o, StepButton as s, Stepper as c, ToggleButton as l, ToggleButtonGroup as u, Typography as d } from "@mui/material";
+import { Fragment as f, jsx as p, jsxs as m } from "react/jsx-runtime";
+import { DataAccessRequestType as h } from "@sage-bionetworks/synapse-client";
+//#region src/components/FormTemplateEditor/FormTemplatePreview.tsx
+function g({ template: g, jsonSchema: _ }) {
+	let [v, y] = r(0), [b, x] = r(h.REQUEST), { steps: S } = n(() => t(g, _, b), [
+		g,
+		_,
+		b
+	]);
+	if (S.length === 0) return /* @__PURE__ */ p(a, {
+		variant: "outlined",
+		sx: { p: 2 },
+		children: /* @__PURE__ */ p(i, {
+			sx: {
+				py: 4,
+				textAlign: "center"
+			},
+			children: /* @__PURE__ */ p(d, {
+				variant: "body2",
+				color: "text.secondary",
+				children: "Add at least one step with a bound field to preview the form."
+			})
+		})
+	});
+	let C = Math.min(v, S.length - 1), w = S[C];
+	return /* @__PURE__ */ m(a, {
+		variant: "outlined",
+		sx: { p: 2 },
+		children: [
+			/* @__PURE__ */ m(u, {
+				value: b,
+				exclusive: !0,
+				size: "small",
+				onChange: (e, t) => {
+					t && x(t);
+				},
+				sx: { mb: 2 },
+				children: [/* @__PURE__ */ p(l, {
+					value: h.REQUEST,
+					children: "Request"
+				}), /* @__PURE__ */ p(l, {
+					value: h.RENEWAL,
+					children: "Renewal"
+				})]
+			}),
+			S.length > 1 && /* @__PURE__ */ p(c, {
+				activeStep: C,
+				nonLinear: !0,
+				sx: { mb: 2 },
+				children: S.map((e, t) => /* @__PURE__ */ p(o, { children: /* @__PURE__ */ p(s, {
+					onClick: () => y(t),
+					children: e.jsonSchema.title ?? `Step ${t + 1}`
+				}) }, t))
+			}),
+			/* @__PURE__ */ p(e, {
+				schema: w.jsonSchema,
+				uiSchema: w.uiSchema,
+				formContext: { descriptionVariant: "inline" },
+				children: /* @__PURE__ */ p(f, {}),
+				liveValidate: !1
+			})
+		]
+	});
+}
+//#endregion
+export { g as FormTemplatePreview };
+
+//# sourceMappingURL=FormTemplatePreview.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FormTemplatePreview.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FormTemplatePreview.tsx"],"sourcesContent":["import { JsonSchemaForm } from '@/components/JsonSchemaForm/JsonSchemaForm'\nimport { generateDataAccessSchema } from '@/utils/jsonschema/generateDataAccessSchema'\nimport {\n  DataAccessRequestType,\n  FormTemplate,\n} from '@sage-bionetworks/synapse-client'\nimport {\n  Box,\n  Paper,\n  Step,\n  StepButton,\n  Stepper,\n  ToggleButton,\n  ToggleButtonGroup,\n  Typography,\n} from '@mui/material'\nimport { RJSFSchema } from '@rjsf/utils'\nimport { useMemo, useState } from 'react'\n\ntype FormTemplatePreviewProps = {\n  template: FormTemplate\n  jsonSchema: RJSFSchema\n}\n\n/**\n * Renders a live preview of how a FormTemplate + its referenced JSON Schema will appear to a\n * requester. Computed client-side against the unsaved draft, purely to give ACT instant feedback\n * while editing.\n */\nexport function FormTemplatePreview({\n  template,\n  jsonSchema,\n}: FormTemplatePreviewProps) {\n  const [activeStep, setActiveStep] = useState(0)\n  const [requestType, setRequestType] = useState<DataAccessRequestType>(\n    DataAccessRequestType.REQUEST,\n  )\n\n  const { steps } = useMemo(\n    () => generateDataAccessSchema(template, jsonSchema, requestType),\n    [template, jsonSchema, requestType],\n  )\n\n  if (steps.length === 0) {\n    return (\n      <Paper variant=\"outlined\" sx={{ p: 2 }}>\n        <Box sx={{ py: 4, textAlign: 'center' }}>\n          <Typography variant=\"body2\" color=\"text.secondary\">\n            Add at least one step with a bound field to preview the form.\n          </Typography>\n        </Box>\n      </Paper>\n    )\n  }\n\n  const safeIndex = Math.min(activeStep, steps.length - 1)\n  const currentStep = steps[safeIndex]\n\n  return (\n    <Paper variant=\"outlined\" sx={{ p: 2 }}>\n      <ToggleButtonGroup\n        value={requestType}\n        exclusive\n        size=\"small\"\n        onChange={(_, next: DataAccessRequestType | null) => {\n          if (next) setRequestType(next)\n        }}\n        sx={{ mb: 2 }}\n      >\n        <ToggleButton value={DataAccessRequestType.REQUEST}>\n          Request\n        </ToggleButton>\n        <ToggleButton value={DataAccessRequestType.RENEWAL}>\n          Renewal\n        </ToggleButton>\n      </ToggleButtonGroup>\n\n      {steps.length > 1 && (\n        <Stepper activeStep={safeIndex} nonLinear sx={{ mb: 2 }}>\n          {steps.map((step, index) => (\n            <Step key={index}>\n              <StepButton onClick={() => setActiveStep(index)}>\n                {(step.jsonSchema.title as string) ?? `Step ${index + 1}`}\n              </StepButton>\n            </Step>\n          ))}\n        </Stepper>\n      )}\n\n      <JsonSchemaForm\n        schema={currentStep.jsonSchema}\n        uiSchema={currentStep.uiSchema}\n        formContext={{ descriptionVariant: 'inline' }}\n        children={<></>}\n        liveValidate={false}\n      />\n    </Paper>\n  )\n}\n"],"mappings":";;;;;;;AA6BA,SAAgB,EAAoB,EAClC,aACA,iBAC2B;CAC3B,IAAM,CAAC,GAAY,KAAiB,EAAS,CAAC,GACxC,CAAC,GAAa,KAAkB,EACpC,EAAsB,OACxB,GAEM,EAAE,aAAU,QACV,EAAyB,GAAU,GAAY,CAAW,GAChE;EAAC;EAAU;EAAY;CAAW,CACpC;CAEA,IAAI,EAAM,WAAW,GACnB,OACE,kBAAC,GAAD;EAAO,SAAQ;EAAW,IAAI,EAAE,GAAG,EAAE;YACnC,kBAAC,GAAD;GAAK,IAAI;IAAE,IAAI;IAAG,WAAW;GAAS;aACpC,kBAAC,GAAD;IAAY,SAAQ;IAAQ,OAAM;cAAiB;GAEvC,CAAA;EACT,CAAA;CACA,CAAA;CAIX,IAAM,IAAY,KAAK,IAAI,GAAY,EAAM,SAAS,CAAC,GACjD,IAAc,EAAM;CAE1B,OACE,kBAAC,GAAD;EAAO,SAAQ;EAAW,IAAI,EAAE,GAAG,EAAE;YAArC;GACE,kBAAC,GAAD;IACE,OAAO;IACP,WAAA;IACA,MAAK;IACL,WAAW,GAAG,MAAuC;KACnD,AAAI,KAAM,EAAe,CAAI;IAC/B;IACA,IAAI,EAAE,IAAI,EAAE;cAPd,CASE,kBAAC,GAAD;KAAc,OAAO,EAAsB;eAAS;IAEtC,CAAA,GACd,kBAAC,GAAD;KAAc,OAAO,EAAsB;eAAS;IAEtC,CAAA,CACG;;GAElB,EAAM,SAAS,KACd,kBAAC,GAAD;IAAS,YAAY;IAAW,WAAA;IAAU,IAAI,EAAE,IAAI,EAAE;cACnD,EAAM,KAAK,GAAM,MAChB,kBAAC,GAAD,EAAA,UACE,kBAAC,GAAD;KAAY,eAAe,EAAc,CAAK;eAC1C,EAAK,WAAW,SAAoB,QAAQ,IAAQ;IAC5C,CAAA,EACR,GAJK,CAIL,CACP;GACM,CAAA;GAGX,kBAAC,GAAD;IACE,QAAQ,EAAY;IACpB,UAAU,EAAY;IACtB,aAAa,EAAE,oBAAoB,SAAS;IAC5C,UAAU,kBAAA,GAAA,CAAI,CAAA;IACd,cAAc;GACf,CAAA;EACI;;AAEX"}

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

@@ -0,0 +1,13 @@
+import { RJSFSchema } from '@rjsf/utils';
+type JsonSchemaBodyEditorProps = {
+    value: RJSFSchema;
+    onChange: (next: RJSFSchema) => void;
+};
+/**
+ * Edits a JSON Schema as raw JSON. Calls `onChange` only when the text parses; otherwise shows
+ * the parse error. `value` is read only on mount, so remount with a new `key` to load a
+ * different schema.
+ */
+export declare function JsonSchemaBodyEditor({ value, onChange, }: JsonSchemaBodyEditorProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=JsonSchemaBodyEditor.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"JsonSchemaBodyEditor.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/JsonSchemaBodyEditor.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAGxC,KAAK,yBAAyB,GAAG;IAC/B,KAAK,EAAE,UAAU,CAAA;IACjB,QAAQ,EAAE,CAAC,IAAI,EAAE,UAAU,KAAK,IAAI,CAAA;CACrC,CAAA;AAED;;;;GAIG;AACH,wBAAgB,oBAAoB,CAAC,EACnC,KAAK,EACL,QAAQ,GACT,EAAE,yBAAyB,2CAgC3B"}

package/dist/components/FormTemplateEditor/JsonSchemaBodyEditor.js

@@ -0,0 +1,33 @@
+import { useState as e } from "react";
+import { TextField as t } from "@mui/material";
+import { jsx as n } from "react/jsx-runtime";
+//#region src/components/FormTemplateEditor/JsonSchemaBodyEditor.tsx
+function r({ value: r, onChange: i }) {
+	let [a, o] = e(() => JSON.stringify(r, null, 2)), [s, c] = e(null), l = (e) => {
+		o(e);
+		try {
+			let t = JSON.parse(e);
+			c(null), i(t);
+		} catch (e) {
+			c(e instanceof Error ? e.message : "Invalid JSON");
+		}
+	};
+	return /* @__PURE__ */ n(t, {
+		label: "Raw JSON Schema",
+		value: a,
+		onChange: (e) => l(e.target.value),
+		error: !!s,
+		helperText: s ?? " ",
+		multiline: !0,
+		rows: 14,
+		fullWidth: !0,
+		slotProps: { input: { sx: {
+			fontFamily: "monospace",
+			fontSize: "0.85rem"
+		} } }
+	});
+}
+//#endregion
+export { r as JsonSchemaBodyEditor };
+
+//# sourceMappingURL=JsonSchemaBodyEditor.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"JsonSchemaBodyEditor.js","names":[],"sources":["../../../src/components/FormTemplateEditor/JsonSchemaBodyEditor.tsx"],"sourcesContent":["import { TextField } from '@mui/material'\nimport { RJSFSchema } from '@rjsf/utils'\nimport { useState } from 'react'\n\ntype JsonSchemaBodyEditorProps = {\n  value: RJSFSchema\n  onChange: (next: RJSFSchema) => void\n}\n\n/**\n * Edits a JSON Schema as raw JSON. Calls `onChange` only when the text parses; otherwise shows\n * the parse error. `value` is read only on mount, so remount with a new `key` to load a\n * different schema.\n */\nexport function JsonSchemaBodyEditor({\n  value,\n  onChange,\n}: JsonSchemaBodyEditorProps) {\n  const [text, setText] = useState(() => JSON.stringify(value, null, 2))\n  const [error, setError] = useState<string | null>(null)\n\n  const handleChange = (next: string) => {\n    setText(next)\n    try {\n      const parsed = JSON.parse(next)\n      setError(null)\n      onChange(parsed)\n    } catch (e) {\n      setError(e instanceof Error ? e.message : 'Invalid JSON')\n    }\n  }\n\n  return (\n    <TextField\n      label=\"Raw JSON Schema\"\n      value={text}\n      onChange={e => handleChange(e.target.value)}\n      error={!!error}\n      helperText={error ?? ' '}\n      multiline\n      rows={14}\n      fullWidth\n      slotProps={{\n        input: {\n          sx: { fontFamily: 'monospace', fontSize: '0.85rem' },\n        },\n      }}\n    />\n  )\n}\n"],"mappings":";;;;AAcA,SAAgB,EAAqB,EACnC,UACA,eAC4B;CAC5B,IAAM,CAAC,GAAM,KAAW,QAAe,KAAK,UAAU,GAAO,MAAM,CAAC,CAAC,GAC/D,CAAC,GAAO,KAAY,EAAwB,IAAI,GAEhD,KAAgB,MAAiB;EACrC,EAAQ,CAAI;EACZ,IAAI;GACF,IAAM,IAAS,KAAK,MAAM,CAAI;GAE9B,AADA,EAAS,IAAI,GACb,EAAS,CAAM;EACjB,SAAS,GAAG;GACV,EAAS,aAAa,QAAQ,EAAE,UAAU,cAAc;EAC1D;CACF;CAEA,OACE,kBAAC,GAAD;EACE,OAAM;EACN,OAAO;EACP,WAAU,MAAK,EAAa,EAAE,OAAO,KAAK;EAC1C,OAAO,CAAC,CAAC;EACT,YAAY,KAAS;EACrB,WAAA;EACA,MAAM;EACN,WAAA;EACA,WAAW,EACT,OAAO,EACL,IAAI;GAAE,YAAY;GAAa,UAAU;EAAU,EACrD,EACF;CACD,CAAA;AAEL"}

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

@@ -0,0 +1,25 @@
+import { FormTemplateStep } from '@sage-bionetworks/synapse-client';
+import { RJSFSchema } from '@rjsf/utils';
+import { ResolvedSchemaProperty } from '@/utils/jsonschema/submissionContext';
+import { EditableFormTemplateStep } from './utils';
+export type StepCardProps = {
+    step: EditableFormTemplateStep;
+    stepIndex: number;
+    isFirst: boolean;
+    isLast: boolean;
+    /** Properties not yet bound to any step in the template. */
+    unboundProperties: ResolvedSchemaProperty[];
+    /** The full JSON Schema, used to resolve display labels for slot rows. */
+    jsonSchema: RJSFSchema;
+    /** The FormTemplate's id, if it has been saved. Threaded down to file-field template uploads. */
+    formTemplateId: string | undefined;
+    /** If true, render expanded by default (first step). */
+    defaultExpanded: boolean;
+    onChange: (patch: Partial<FormTemplateStep>) => void;
+    onBindField: (propertyKey: string) => void;
+    onMoveUp: () => void;
+    onMoveDown: () => void;
+    onRemove: () => void;
+};
+export declare function StepCard({ step, stepIndex, isFirst, isLast, unboundProperties, jsonSchema, formTemplateId, defaultExpanded, onChange, onBindField, onMoveUp, onMoveDown, onRemove, }: StepCardProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StepCard.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StepCard.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/StepCard.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,gBAAgB,EACjB,MAAM,kCAAkC,CAAA;AAmBzC,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAGxC,OAAO,EAGL,sBAAsB,EAEvB,MAAM,sCAAsC,CAAA;AAa7C,OAAO,EAAoB,wBAAwB,EAAY,MAAM,SAAS,CAAA;AAS9E,MAAM,MAAM,aAAa,GAAG;IAC1B,IAAI,EAAE,wBAAwB,CAAA;IAC9B,SAAS,EAAE,MAAM,CAAA;IACjB,OAAO,EAAE,OAAO,CAAA;IAChB,MAAM,EAAE,OAAO,CAAA;IACf,4DAA4D;IAC5D,iBAAiB,EAAE,sBAAsB,EAAE,CAAA;IAC3C,0EAA0E;IAC1E,UAAU,EAAE,UAAU,CAAA;IACtB,iGAAiG;IACjG,cAAc,EAAE,MAAM,GAAG,SAAS,CAAA;IAClC,wDAAwD;IACxD,eAAe,EAAE,OAAO,CAAA;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAA;IACpD,WAAW,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;IAC1C,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB,CAAA;AAED,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,SAAS,EACT,OAAO,EACP,MAAM,EACN,iBAAiB,EACjB,UAAU,EACV,cAAc,EACd,eAAe,EACf,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,UAAU,EACV,QAAQ,GACT,EAAE,aAAa,2CAoNf"}

package/dist/components/FormTemplateEditor/StepCard.js

@@ -0,0 +1,203 @@
+import { moveItem as e } from "../../utils/functions/ArrayUtils.js";
+import { pointerToPropertyKey as t, propertyKeyToPointer as n, resolveSchemaPropertyAtPointer as r } from "../../utils/jsonschema/submissionContext.js";
+import i from "./dragHandle.module.js";
+import { FIELD_DRAG_TYPE as a, SLOT_SORTABLE_TYPE as o, STEP_SORTABLE_GROUP as s, STEP_SORTABLE_TYPE as c, slotGroupId as l, slotSortableId as u, stepSortableId as d } from "./sortableIds.js";
+import f from "./dropTarget.module.js";
+import { StepFieldRow as p } from "./StepFieldRow.js";
+import { BIND_FIELD_LABEL as m } from "./utils.js";
+import { useState as h } from "react";
+import { Box as g, Collapse as _, IconButton as v, MenuItem as y, Paper as b, Stack as ee, TextField as x, Typography as S } from "@mui/material";
+import { jsx as C, jsxs as w } from "react/jsx-runtime";
+import { ArrowDownward as T, ArrowUpward as E, Delete as D, DragIndicator as O, ExpandLess as k, ExpandMore as A } from "@mui/icons-material";
+import j from "pluralize";
+import { useDroppable as M } from "@dnd-kit/react";
+import { useSortable as N } from "@dnd-kit/react/sortable";
+//#region src/components/FormTemplateEditor/StepCard.tsx
+var P = 1;
+function F({ step: F, stepIndex: I, isFirst: te, isLast: L, unboundProperties: R, jsonSchema: z, formTemplateId: B, defaultExpanded: V, onChange: H, onBindField: U, onMoveUp: W, onMoveDown: G, onRemove: K }) {
+	let [q, J] = h(V), { ref: Y, handleRef: X, isDragging: Z, isDropTarget: Q } = N({
+		id: d(F),
+		index: I,
+		group: s,
+		type: c,
+		accept: [c, a]
+	}), { ref: ne, isDropTarget: re } = M({
+		id: l(F),
+		accept: o,
+		collisionPriority: P
+	}), ie = (e, t) => {
+		H({ fields: F.fields.map((n, r) => r === e ? {
+			...n,
+			...t
+		} : n) });
+	}, $ = (t, n) => {
+		H({ fields: e(F.fields, t, n) });
+	}, ae = (e) => {
+		H({ fields: F.fields.filter((t, n) => n !== e) });
+	}, oe = j("field", F.fields.length, !0);
+	return /* @__PURE__ */ w(b, {
+		ref: Y,
+		variant: "outlined",
+		className: `${f.dropTarget} ${i.dragSource}`,
+		"data-drop-target": Q,
+		"data-dragging": Z,
+		sx: { p: 1.5 },
+		children: [/* @__PURE__ */ w(g, {
+			sx: {
+				display: "flex",
+				alignItems: "center",
+				gap: .5
+			},
+			children: [
+				/* @__PURE__ */ C(g, {
+					ref: X,
+					role: "button",
+					tabIndex: 0,
+					"aria-label": "Drag to reorder step",
+					className: i.dragHandle,
+					sx: { color: "text.secondary" },
+					children: /* @__PURE__ */ C(O, { fontSize: "small" })
+				}),
+				/* @__PURE__ */ C(v, {
+					size: "small",
+					onClick: () => J((e) => !e),
+					"aria-label": q ? "Collapse step" : "Expand step",
+					children: C(q ? k : A, { fontSize: "small" })
+				}),
+				/* @__PURE__ */ w(g, {
+					sx: {
+						flexGrow: 1,
+						minWidth: 0
+					},
+					children: [/* @__PURE__ */ w(S, {
+						variant: "body2",
+						fontWeight: 500,
+						noWrap: !0,
+						children: [
+							"Step ",
+							I + 1,
+							": ",
+							F.title || "(untitled)"
+						]
+					}), /* @__PURE__ */ C(S, {
+						variant: "caption",
+						color: "text.secondary",
+						children: oe
+					})]
+				}),
+				/* @__PURE__ */ C(v, {
+					size: "small",
+					disabled: te,
+					onClick: W,
+					"aria-label": "Move step up",
+					children: /* @__PURE__ */ C(E, { fontSize: "small" })
+				}),
+				/* @__PURE__ */ C(v, {
+					size: "small",
+					disabled: L,
+					onClick: G,
+					"aria-label": "Move step down",
+					children: /* @__PURE__ */ C(T, { fontSize: "small" })
+				}),
+				/* @__PURE__ */ C(v, {
+					size: "small",
+					onClick: K,
+					"aria-label": "Remove step",
+					children: /* @__PURE__ */ C(D, { fontSize: "small" })
+				})
+			]
+		}), /* @__PURE__ */ C(_, {
+			in: q,
+			unmountOnExit: !0,
+			children: /* @__PURE__ */ w(g, {
+				sx: { pt: 1.5 },
+				children: [
+					/* @__PURE__ */ C(x, {
+						label: "Title",
+						value: F.title,
+						onChange: (e) => H({ title: e.target.value }),
+						size: "small",
+						fullWidth: !0,
+						sx: { mb: 1 }
+					}),
+					/* @__PURE__ */ C(x, {
+						label: "Description",
+						value: F.description ?? "",
+						onChange: (e) => H({ description: e.target.value }),
+						size: "small",
+						multiline: !0,
+						rows: 2,
+						fullWidth: !0,
+						sx: { mb: 1.5 }
+					}),
+					/* @__PURE__ */ C(g, {
+						ref: ne,
+						className: f.dropTarget,
+						"data-drop-target": re,
+						sx: {
+							display: "flex",
+							flexDirection: "column",
+							gap: 1,
+							mb: 1,
+							p: .5,
+							borderRadius: 1
+						},
+						children: F.fields.length === 0 ? /* @__PURE__ */ C(S, {
+							variant: "caption",
+							color: "text.secondary",
+							sx: { p: 1 },
+							children: "Drag a field here, or bind one below."
+						}) : F.fields.map((e, n) => {
+							let i = r(z, e.schemaPath);
+							return /* @__PURE__ */ C(p, {
+								sortableId: u(e),
+								sortableIndex: n,
+								sortableGroup: l(F),
+								field: e,
+								resolvedProperty: i?.subSchema,
+								context: i?.context ?? "ALWAYS",
+								propertyKey: t(e.schemaPath) ?? e.schemaPath,
+								isFirst: n === 0,
+								isLast: n === F.fields.length - 1,
+								formTemplateId: B,
+								onChange: (e) => ie(n, e),
+								onMoveUp: () => $(n, -1),
+								onMoveDown: () => $(n, 1),
+								onRemove: () => ae(n)
+							}, e.schemaPath);
+						})
+					}),
+					/* @__PURE__ */ C(ee, {
+						spacing: 1,
+						children: /* @__PURE__ */ C(x, {
+							select: !0,
+							size: "small",
+							label: m,
+							value: "",
+							onChange: (e) => {
+								e.target.value && U(e.target.value);
+							},
+							disabled: R.length === 0,
+							helperText: R.length === 0 ? "All fields are bound to a step." : "Add a field from the library to this step.",
+							children: R.length === 0 ? /* @__PURE__ */ C(y, {
+								value: "",
+								disabled: !0,
+								children: "All fields bound"
+							}) : R.map((e) => {
+								let t = n(e.propertyKey);
+								return /* @__PURE__ */ C(y, {
+									value: e.propertyKey,
+									children: e.subSchema.title ? `${e.subSchema.title} (${t})` : t
+								}, e.propertyKey);
+							})
+						})
+					})
+				]
+			})
+		})]
+	});
+}
+//#endregion
+export { F as StepCard };
+
+//# sourceMappingURL=StepCard.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StepCard.js","names":[],"sources":["../../../src/components/FormTemplateEditor/StepCard.tsx"],"sourcesContent":["import { useDroppable } from '@dnd-kit/react'\nimport { useSortable } from '@dnd-kit/react/sortable'\nimport {\n  FormTemplateField,\n  FormTemplateStep,\n} from '@sage-bionetworks/synapse-client'\nimport {\n  Box,\n  Collapse,\n  IconButton,\n  MenuItem,\n  Paper,\n  Stack,\n  TextField,\n  Typography,\n} from '@mui/material'\nimport {\n  ArrowDownward as DownIcon,\n  Delete as DeleteIcon,\n  DragIndicator as DragHandleIcon,\n  ExpandLess as ExpandLessIcon,\n  ExpandMore as ExpandMoreIcon,\n  ArrowUpward as UpIcon,\n} from '@mui/icons-material'\nimport { RJSFSchema } from '@rjsf/utils'\nimport pluralize from 'pluralize'\nimport { useState } from 'react'\nimport {\n  pointerToPropertyKey,\n  propertyKeyToPointer,\n  ResolvedSchemaProperty,\n  resolveSchemaPropertyAtPointer,\n} from '@/utils/jsonschema/submissionContext'\nimport dragHandleStyles from './dragHandle.module.scss'\nimport dropTargetStyles from './dropTarget.module.scss'\nimport { StepFieldRow } from './StepFieldRow'\nimport {\n  FIELD_DRAG_TYPE,\n  slotGroupId,\n  SLOT_SORTABLE_TYPE,\n  slotSortableId,\n  stepSortableId,\n  STEP_SORTABLE_GROUP,\n  STEP_SORTABLE_TYPE,\n} from './sortableIds'\nimport { BIND_FIELD_LABEL, EditableFormTemplateStep, moveItem } from './utils'\n\n/**\n * The slot list must lose to the slot rows inside it so that dragging over a populated step\n * targets a row (which resolves to a precise insertion index) and only an empty or below-the-last-\n * row region falls through to the list itself.\n */\nconst SLOT_LIST_COLLISION_PRIORITY = 1\n\nexport type StepCardProps = {\n  step: EditableFormTemplateStep\n  stepIndex: number\n  isFirst: boolean\n  isLast: boolean\n  /** Properties not yet bound to any step in the template. */\n  unboundProperties: ResolvedSchemaProperty[]\n  /** The full JSON Schema, used to resolve display labels for slot rows. */\n  jsonSchema: RJSFSchema\n  /** The FormTemplate's id, if it has been saved. Threaded down to file-field template uploads. */\n  formTemplateId: string | undefined\n  /** If true, render expanded by default (first step). */\n  defaultExpanded: boolean\n  onChange: (patch: Partial<FormTemplateStep>) => void\n  onBindField: (propertyKey: string) => void\n  onMoveUp: () => void\n  onMoveDown: () => void\n  onRemove: () => void\n}\n\nexport function StepCard({\n  step,\n  stepIndex,\n  isFirst,\n  isLast,\n  unboundProperties,\n  jsonSchema,\n  formTemplateId,\n  defaultExpanded,\n  onChange,\n  onBindField,\n  onMoveUp,\n  onMoveDown,\n  onRemove,\n}: StepCardProps) {\n  const [expanded, setExpanded] = useState(defaultExpanded)\n\n  // Step is sortable within its group, and also accepts field drops to bind.\n  const { ref, handleRef, isDragging, isDropTarget } = useSortable({\n    id: stepSortableId(step),\n    index: stepIndex,\n    group: STEP_SORTABLE_GROUP,\n    type: STEP_SORTABLE_TYPE,\n    accept: [STEP_SORTABLE_TYPE, FIELD_DRAG_TYPE],\n  })\n\n  // The slot list is the drop target for slots dragged in from another step, which is the only\n  // way to reach a step whose list is empty and therefore has no slot rows to target.\n  const { ref: slotListRef, isDropTarget: isSlotDropTarget } = useDroppable({\n    id: slotGroupId(step),\n    accept: SLOT_SORTABLE_TYPE,\n    collisionPriority: SLOT_LIST_COLLISION_PRIORITY,\n  })\n\n  const handleFieldChange = (\n    fieldIdx: number,\n    patch: Partial<FormTemplateField>,\n  ) => {\n    onChange({\n      fields: step.fields.map((f, i) =>\n        i === fieldIdx ? { ...f, ...patch } : f,\n      ),\n    })\n  }\n\n  const handleFieldMove = (fieldIdx: number, direction: -1 | 1) => {\n    onChange({ fields: moveItem(step.fields, fieldIdx, direction) })\n  }\n\n  const handleFieldRemove = (fieldIdx: number) => {\n    onChange({ fields: step.fields.filter((_, i) => i !== fieldIdx) })\n  }\n\n  const fieldCountLabel = pluralize('field', step.fields.length, true)\n\n  return (\n    <Paper\n      ref={ref}\n      variant=\"outlined\"\n      className={`${dropTargetStyles.dropTarget} ${dragHandleStyles.dragSource}`}\n      data-drop-target={isDropTarget}\n      data-dragging={isDragging}\n      sx={{ p: 1.5 }}\n    >\n      <Box sx={{ display: 'flex', alignItems: 'center', gap: 0.5 }}>\n        <Box\n          ref={handleRef}\n          role=\"button\"\n          tabIndex={0}\n          aria-label=\"Drag to reorder step\"\n          className={dragHandleStyles.dragHandle}\n          sx={{ color: 'text.secondary' }}\n        >\n          <DragHandleIcon fontSize=\"small\" />\n        </Box>\n        <IconButton\n          size=\"small\"\n          onClick={() => setExpanded(prev => !prev)}\n          aria-label={expanded ? 'Collapse step' : 'Expand step'}\n        >\n          {expanded ? (\n            <ExpandLessIcon fontSize=\"small\" />\n          ) : (\n            <ExpandMoreIcon fontSize=\"small\" />\n          )}\n        </IconButton>\n        <Box sx={{ flexGrow: 1, minWidth: 0 }}>\n          <Typography variant=\"body2\" fontWeight={500} noWrap>\n            Step {stepIndex + 1}: {step.title || '(untitled)'}\n          </Typography>\n          <Typography variant=\"caption\" color=\"text.secondary\">\n            {fieldCountLabel}\n          </Typography>\n        </Box>\n        <IconButton\n          size=\"small\"\n          disabled={isFirst}\n          onClick={onMoveUp}\n          aria-label=\"Move step up\"\n        >\n          <UpIcon fontSize=\"small\" />\n        </IconButton>\n        <IconButton\n          size=\"small\"\n          disabled={isLast}\n          onClick={onMoveDown}\n          aria-label=\"Move step down\"\n        >\n          <DownIcon fontSize=\"small\" />\n        </IconButton>\n        <IconButton size=\"small\" onClick={onRemove} aria-label=\"Remove step\">\n          <DeleteIcon fontSize=\"small\" />\n        </IconButton>\n      </Box>\n\n      <Collapse in={expanded} unmountOnExit>\n        <Box sx={{ pt: 1.5 }}>\n          <TextField\n            label=\"Title\"\n            value={step.title}\n            onChange={e => onChange({ title: e.target.value })}\n            size=\"small\"\n            fullWidth\n            sx={{ mb: 1 }}\n          />\n          <TextField\n            label=\"Description\"\n            value={step.description ?? ''}\n            onChange={e => onChange({ description: e.target.value })}\n            size=\"small\"\n            multiline\n            rows={2}\n            fullWidth\n            sx={{ mb: 1.5 }}\n          />\n\n          <Box\n            ref={slotListRef}\n            className={dropTargetStyles.dropTarget}\n            data-drop-target={isSlotDropTarget}\n            sx={{\n              display: 'flex',\n              flexDirection: 'column',\n              gap: 1,\n              mb: 1,\n              p: 0.5,\n              borderRadius: 1,\n            }}\n          >\n            {step.fields.length === 0 ? (\n              <Typography\n                variant=\"caption\"\n                color=\"text.secondary\"\n                sx={{ p: 1 }}\n              >\n                Drag a field here, or bind one below.\n              </Typography>\n            ) : (\n              step.fields.map((field, fieldIdx) => {\n                const resolved = resolveSchemaPropertyAtPointer(\n                  jsonSchema,\n                  field.schemaPath,\n                )\n                return (\n                  <StepFieldRow\n                    key={field.schemaPath}\n                    sortableId={slotSortableId(field)}\n                    sortableIndex={fieldIdx}\n                    sortableGroup={slotGroupId(step)}\n                    field={field}\n                    resolvedProperty={resolved?.subSchema}\n                    context={resolved?.context ?? 'ALWAYS'}\n                    propertyKey={\n                      pointerToPropertyKey(field.schemaPath) ?? field.schemaPath\n                    }\n                    isFirst={fieldIdx === 0}\n                    isLast={fieldIdx === step.fields.length - 1}\n                    formTemplateId={formTemplateId}\n                    onChange={patch => handleFieldChange(fieldIdx, patch)}\n                    onMoveUp={() => handleFieldMove(fieldIdx, -1)}\n                    onMoveDown={() => handleFieldMove(fieldIdx, 1)}\n                    onRemove={() => handleFieldRemove(fieldIdx)}\n                  />\n                )\n              })\n            )}\n          </Box>\n\n          <Stack spacing={1}>\n            <TextField\n              select\n              size=\"small\"\n              label={BIND_FIELD_LABEL}\n              value=\"\"\n              onChange={e => {\n                if (e.target.value) onBindField(e.target.value)\n              }}\n              disabled={unboundProperties.length === 0}\n              helperText={\n                unboundProperties.length === 0\n                  ? 'All fields are bound to a step.'\n                  : 'Add a field from the library to this step.'\n              }\n            >\n              {unboundProperties.length === 0 ? (\n                <MenuItem value=\"\" disabled>\n                  All fields bound\n                </MenuItem>\n              ) : (\n                unboundProperties.map(p => {\n                  const pointer = propertyKeyToPointer(p.propertyKey)\n                  return (\n                    <MenuItem key={p.propertyKey} value={p.propertyKey}>\n                      {p.subSchema.title\n                        ? `${p.subSchema.title} (${pointer})`\n                        : pointer}\n                    </MenuItem>\n                  )\n                })\n              )}\n            </TextField>\n          </Stack>\n        </Box>\n      </Collapse>\n    </Paper>\n  )\n}\n"],"mappings":"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"}

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

@@ -0,0 +1,34 @@
+import { FormTemplateField } from '@sage-bionetworks/synapse-client';
+import { RJSFSchema } from '@rjsf/utils';
+import { SchemaPropertyContext } from '@/utils/jsonschema/submissionContext';
+export type StepFieldRowProps = {
+    /** Sortable id assigned by parent: `slot:{stepIndex}:{fieldIndex}`. */
+    sortableId: string;
+    /** Position within its step's fields array. */
+    sortableIndex: number;
+    /** Sortable group; slots only reorder within the same step. */
+    sortableGroup: string;
+    field: FormTemplateField;
+    /** The schema property this slot resolves to, if it still exists. */
+    resolvedProperty: RJSFSchema | undefined;
+    /** Which submission context (per the schema's `x-synapse-submissionContext` convention)
+     * gates this field, derived from `resolvedProperty`. */
+    context: SchemaPropertyContext;
+    /** Underlying property key (the segment after `/` in `schemaPath`). */
+    propertyKey: string;
+    isFirst: boolean;
+    isLast: boolean;
+    /** The FormTemplate's id, if it has been saved. Used to build the template file download. */
+    formTemplateId: string | undefined;
+    onChange: (patch: Partial<FormTemplateField>) => void;
+    onMoveUp: () => void;
+    onMoveDown: () => void;
+    onRemove: () => void;
+};
+/**
+ * A slot row inside a step. Compact by default — shows the field's display
+ * name. Expand to reveal slot-specific config: (for file fields) an
+ * optional template file handle. Sortable within its parent step.
+ */
+export declare function StepFieldRow({ sortableId, sortableIndex, sortableGroup, field, resolvedProperty, context, propertyKey, isFirst, isLast, formTemplateId, onChange, onMoveUp, onMoveDown, onRemove, }: StepFieldRowProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=StepFieldRow.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StepFieldRow.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/StepFieldRow.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,iBAAiB,EAAE,MAAM,kCAAkC,CAAA;AAmBpE,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAExC,OAAO,EACL,qBAAqB,EAEtB,MAAM,sCAAsC,CAAA;AAM7C,MAAM,MAAM,iBAAiB,GAAG;IAC9B,uEAAuE;IACvE,UAAU,EAAE,MAAM,CAAA;IAClB,+CAA+C;IAC/C,aAAa,EAAE,MAAM,CAAA;IACrB,+DAA+D;IAC/D,aAAa,EAAE,MAAM,CAAA;IACrB,KAAK,EAAE,iBAAiB,CAAA;IACxB,qEAAqE;IACrE,gBAAgB,EAAE,UAAU,GAAG,SAAS,CAAA;IACxC;4DACwD;IACxD,OAAO,EAAE,qBAAqB,CAAA;IAC9B,uEAAuE;IACvE,WAAW,EAAE,MAAM,CAAA;IACnB,OAAO,EAAE,OAAO,CAAA;IAChB,MAAM,EAAE,OAAO,CAAA;IACf,6FAA6F;IAC7F,cAAc,EAAE,MAAM,GAAG,SAAS,CAAA;IAClC,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAA;IACrD,QAAQ,EAAE,MAAM,IAAI,CAAA;IACpB,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,QAAQ,EAAE,MAAM,IAAI,CAAA;CACrB,CAAA;AAED;;;;GAIG;AACH,wBAAgB,YAAY,CAAC,EAC3B,UAAU,EACV,aAAa,EACb,aAAa,EACb,KAAK,EACL,gBAAgB,EAChB,OAAO,EACP,WAAW,EACX,OAAO,EACP,MAAM,EACN,cAAc,EACd,QAAQ,EACR,QAAQ,EACR,UAAU,EACV,QAAQ,GACT,EAAE,iBAAiB,2CA4HnB"}

package/dist/components/FormTemplateEditor/StepFieldRow.js

@@ -0,0 +1,128 @@
+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 { SLOT_SORTABLE_TYPE as i } from "./sortableIds.js";
+import { TemplateFileHandleField as a } from "./TemplateFileHandleField.js";
+import { useState as o } from "react";
+import { Box as s, Checkbox as c, Collapse as l, FormControlLabel as u, IconButton as d, Paper as f, Stack as p, Typography as m } from "@mui/material";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+import { ArrowDownward as _, ArrowUpward as v, Delete as y, DragIndicator as b, ExpandLess as x, ExpandMore as S } from "@mui/icons-material";
+import { useSortable as C } from "@dnd-kit/react/sortable";
+//#region src/components/FormTemplateEditor/StepFieldRow.tsx
+function w({ sortableId: w, sortableIndex: T, sortableGroup: E, field: D, resolvedProperty: O, context: k, propertyKey: A, isFirst: j, isLast: M, formTemplateId: N, onChange: P, onMoveUp: F, onMoveDown: I, onRemove: L }) {
+	let [R, z] = o(!1), { ref: B, handleRef: V, isDragging: H } = C({
+		id: w,
+		index: T,
+		group: E,
+		type: i,
+		accept: i
+	}), U = O ? t(O) : null, W = O?.title || A, G = U === "file", K = !O, q = `Missing field: ${D.schemaPath}`;
+	if (!K) {
+		let t = [n(U)];
+		k !== "ALWAYS" && t.push(e(k)), D.isPublic && t.push("Public"), q = t.join(" · ");
+	}
+	return /* @__PURE__ */ g(f, {
+		ref: B,
+		variant: "outlined",
+		className: r.dragSource,
+		"data-dragging": H,
+		sx: {
+			p: 1,
+			backgroundColor: "action.hover",
+			borderColor: K ? "error.main" : void 0
+		},
+		children: [/* @__PURE__ */ g(s, {
+			sx: {
+				display: "flex",
+				alignItems: "center",
+				gap: .5
+			},
+			children: [
+				/* @__PURE__ */ h(s, {
+					ref: V,
+					role: "button",
+					tabIndex: 0,
+					"aria-label": "Drag to reorder field",
+					className: r.dragHandle,
+					sx: { color: "text.secondary" },
+					children: /* @__PURE__ */ h(b, { fontSize: "small" })
+				}),
+				/* @__PURE__ */ h(d, {
+					size: "small",
+					onClick: () => z((e) => !e),
+					"aria-label": R ? "Collapse field" : "Expand field",
+					children: h(R ? x : S, { fontSize: "small" })
+				}),
+				/* @__PURE__ */ g(s, {
+					sx: {
+						flexGrow: 1,
+						minWidth: 0
+					},
+					children: [/* @__PURE__ */ h(m, {
+						variant: "body2",
+						noWrap: !0,
+						title: W,
+						children: W
+					}), /* @__PURE__ */ h(m, {
+						variant: "caption",
+						color: K ? "error" : "text.secondary",
+						children: q
+					})]
+				}),
+				/* @__PURE__ */ h(d, {
+					size: "small",
+					disabled: j,
+					onClick: F,
+					"aria-label": "Move field up",
+					children: /* @__PURE__ */ h(v, { fontSize: "small" })
+				}),
+				/* @__PURE__ */ h(d, {
+					size: "small",
+					disabled: M,
+					onClick: I,
+					"aria-label": "Move field down",
+					children: /* @__PURE__ */ h(_, { fontSize: "small" })
+				}),
+				/* @__PURE__ */ h(d, {
+					size: "small",
+					onClick: L,
+					"aria-label": "Remove field from step",
+					children: /* @__PURE__ */ h(y, { fontSize: "small" })
+				})
+			]
+		}), /* @__PURE__ */ h(l, {
+			in: R,
+			unmountOnExit: !0,
+			children: /* @__PURE__ */ g(p, {
+				spacing: 1,
+				sx: {
+					pt: 1,
+					pl: 4
+				},
+				children: [
+					G && /* @__PURE__ */ h(a, {
+						fileHandleId: D.templateFileHandleId,
+						formTemplateId: N,
+						onChange: (e) => P({ templateFileHandleId: e })
+					}),
+					/* @__PURE__ */ h(u, {
+						control: /* @__PURE__ */ h(c, {
+							checked: D.isPublic ?? !1,
+							onChange: (e) => P({ isPublic: e.target.checked })
+						}),
+						label: "Publicly viewable after approval"
+					}),
+					/* @__PURE__ */ h(m, {
+						variant: "caption",
+						color: "text.secondary",
+						children: "Answers appear in this AR's public submission info once a submission is approved. Snapshotted at submit time."
+					})
+				]
+			})
+		})]
+	});
+}
+//#endregion
+export { w as StepFieldRow };
+
+//# sourceMappingURL=StepFieldRow.js.map