synapse-react-client 4.0.41 → 4.0.42

package/dist/components/FormTemplateEditor/FieldDefinitionDrawer.js

@@ -1,11 +1,11 @@
-import { FIELD_TYPE_OPTIONS as e, applyFieldType as t, detectFieldType as n, sanitizePropertyKey as r } from "./schemaFieldUtils.js";
-import { ChoiceOptionsEditor as i } from "./ChoiceOptionsEditor.js";
-import { useState as a } from "react";
-import { Alert as o, Box as s, Button as c, Drawer as l, FormControlLabel as u, IconButton as d, MenuItem as f, Stack as p, Switch as m, TextField as h, Typography as g } from "@mui/material";
-import { jsx as _, jsxs as v } from "react/jsx-runtime";
-import { Close as y, Delete as b } from "@mui/icons-material";
+import { ChoiceOptionsEditor as e } from "./ChoiceOptionsEditor.js";
+import { FIELD_TYPE_OPTIONS as t, applyFieldType as n, choiceOptions as r, detectFieldType as i, sanitizePropertyKey as a } from "./schemaFieldUtils.js";
+import { useState as o } from "react";
+import { Alert as s, Box as c, Button as l, Drawer as u, FormControlLabel as d, IconButton as f, MenuItem as p, Stack as m, Switch as h, TextField as g, Typography as _ } from "@mui/material";
+import { jsx as v, jsxs as y } from "react/jsx-runtime";
+import { Close as b, Delete as x } from "@mui/icons-material";
 //#region src/components/FormTemplateEditor/FieldDefinitionDrawer.tsx
-var x = [
+var S = [
 	{
 		value: "ALWAYS",
 		label: "Always"
@@ -19,23 +19,23 @@ var x = [
 		label: "Renewal only"
 	}
 ];
-function S({ open: S, propertyKey: C, existingKeys: w, property: T, isRequired: E, context: D, isUsedInSteps: O, onClose: k, onUpdate: A, onRenameKey: j, onReplace: M, onChangeRequired: N, onChangeContext: P, onRemove: F }) {
-	let I = T ? n(T) : null, L = T !== null && I === null, [R, z] = a(null), B = R?.forKey === C ? R.value : C ?? "", V = null;
-	B.length === 0 ? V = "Required" : B !== C && w.has(B) && (V = "Already used by another field");
-	let H = () => {
-		C && !V && B !== C && j(B), z(null);
-	}, U = (e) => {
-		T && M(t(T, e));
+function C({ open: C, propertyKey: w, existingKeys: T, property: E, isRequired: D, context: O, isUsedInSteps: k, onClose: A, onUpdate: j, onRenameKey: M, onReplace: N, onChangeRequired: P, onChangeContext: F, onRemove: I }) {
+	let L = E ? i(E) : null, R = E !== null && L === null, [z, B] = o(null), V = z?.forKey === w ? z.value : w ?? "", H = null;
+	V.length === 0 ? H = "Required" : V !== w && T.has(V) && (H = "Already used by another field");
+	let U = () => {
+		w && !H && V !== w && M(V), B(null);
+	}, W = (e) => {
+		E && N(n(E, e));
 	};
-	return /* @__PURE__ */ _(l, {
-		open: S,
-		onClose: k,
+	return /* @__PURE__ */ v(u, {
+		open: C,
+		onClose: A,
 		anchor: "right",
 		slotProps: { paper: { sx: { width: {
 			xs: "100%",
 			sm: 480
 		} } } },
-		children: /* @__PURE__ */ v(s, {
+		children: /* @__PURE__ */ y(c, {
 			sx: {
 				p: 3,
 				display: "flex",
@@ -43,137 +43,140 @@ function S({ open: S, propertyKey: C, existingKeys: w, property: T, isRequired:
 				height: "100%"
 			},
 			children: [
-				/* @__PURE__ */ v(s, {
+				/* @__PURE__ */ y(c, {
 					sx: {
 						display: "flex",
 						alignItems: "center",
 						mb: 2
 					},
-					children: [/* @__PURE__ */ _(g, {
+					children: [/* @__PURE__ */ v(_, {
 						variant: "h6",
 						sx: { flexGrow: 1 },
 						children: "Edit field"
-					}), /* @__PURE__ */ _(d, {
-						onClick: k,
+					}), /* @__PURE__ */ v(f, {
+						onClick: A,
 						"aria-label": "Close field editor",
-						children: /* @__PURE__ */ _(y, {})
+						children: /* @__PURE__ */ v(b, {})
 					})]
 				}),
-				C && /* @__PURE__ */ _(h, {
+				w && /* @__PURE__ */ v(g, {
 					label: "Property key",
-					value: B,
-					onChange: (e) => z({
-						forKey: C,
-						value: r(e.target.value)
+					value: V,
+					onChange: (e) => B({
+						forKey: w,
+						value: a(e.target.value)
 					}),
-					onBlur: H,
+					onBlur: U,
 					onKeyDown: (e) => {
-						e.key === "Enter" && (e.preventDefault(), H());
+						e.key === "Enter" && (e.preventDefault(), U());
 					},
-					error: V !== null,
-					helperText: V ?? "Identifies this field in the JSON Schema and submitted requests.",
+					error: H !== null,
+					helperText: H ?? "Identifies this field in the JSON Schema and submitted requests.",
 					size: "small",
 					fullWidth: !0,
 					sx: { mb: 2 },
 					slotProps: { input: { sx: { fontFamily: "monospace" } } }
 				}),
-				T && /* @__PURE__ */ _(h, {
+				E && /* @__PURE__ */ v(g, {
 					select: !0,
 					label: "Submission context",
-					value: D,
-					onChange: (e) => P(e.target.value),
+					value: O,
+					onChange: (e) => F(e.target.value),
 					size: "small",
 					fullWidth: !0,
 					sx: { mb: 2 },
 					helperText: "Controls whether requesters are asked this question on an initial request, a renewal, or both.",
-					children: x.map((e) => /* @__PURE__ */ _(f, {
+					children: S.map((e) => /* @__PURE__ */ v(p, {
 						value: e.value,
 						children: e.label
 					}, e.value))
 				}),
-				/* @__PURE__ */ _(s, {
+				/* @__PURE__ */ v(c, {
 					sx: {
 						flexGrow: 1,
 						overflow: "auto"
 					},
-					children: T ? L ? /* @__PURE__ */ _(o, {
+					children: E ? R ? /* @__PURE__ */ v(s, {
 						severity: "warning",
 						variant: "outlined",
 						children: "This field uses settings not supported by the simple editor. Edit it via the advanced raw JSON Schema view."
-					}) : /* @__PURE__ */ v(p, {
+					}) : /* @__PURE__ */ y(m, {
 						spacing: 2,
 						children: [
-							/* @__PURE__ */ _(h, {
+							/* @__PURE__ */ v(g, {
 								label: "Question label",
-								value: T.title ?? "",
-								onChange: (e) => A({ title: e.target.value }),
+								value: E.title ?? "",
+								onChange: (e) => j({ title: e.target.value }),
 								size: "small",
 								fullWidth: !0
 							}),
-							/* @__PURE__ */ _(h, {
+							/* @__PURE__ */ v(g, {
 								label: "Help text",
-								value: T.description ?? "",
-								onChange: (e) => A({ description: e.target.value }),
+								value: E.description ?? "",
+								onChange: (e) => j({ description: e.target.value }),
 								size: "small",
 								multiline: !0,
 								rows: 3,
 								fullWidth: !0,
 								helperText: "Shown to the requester below the question."
 							}),
-							/* @__PURE__ */ v(p, {
+							/* @__PURE__ */ y(m, {
 								direction: "row",
 								spacing: 1,
 								alignItems: "center",
-								children: [/* @__PURE__ */ _(h, {
+								children: [/* @__PURE__ */ v(g, {
 									select: !0,
 									label: "Field type",
-									value: I,
-									onChange: (e) => U(e.target.value),
+									value: L,
+									onChange: (e) => W(e.target.value),
 									size: "small",
 									sx: { flexGrow: 1 },
-									children: e.map((e) => /* @__PURE__ */ _(f, {
+									children: t.map((e) => /* @__PURE__ */ v(p, {
 										value: e.value,
 										children: e.label
 									}, e.value))
-								}), /* @__PURE__ */ _(u, {
-									control: /* @__PURE__ */ _(m, {
-										checked: E,
-										onChange: (e) => N(e.target.checked)
+								}), /* @__PURE__ */ v(d, {
+									control: /* @__PURE__ */ v(h, {
+										checked: D,
+										onChange: (e) => P(e.target.checked)
 									}),
 									label: "Required"
 								})]
 							}),
-							I === "choice" && /* @__PURE__ */ _(i, {
-								options: T.enum ?? [],
-								onChange: (e) => A({ enum: e })
+							(L === "choice" || L === "multiChoice") && /* @__PURE__ */ v(e, {
+								options: r(E),
+								onChange: (e) => j(L === "choice" ? { enum: e } : { items: {
+									...E.items,
+									enum: e
+								} })
 							}),
-							I === "file" && /* @__PURE__ */ _(o, {
+							L === "file" && /* @__PURE__ */ v(s, {
 								severity: "info",
 								variant: "outlined",
 								children: "Requesters will be prompted to upload a file. You can attach a downloadable template to this field on each step that uses it."
 							})
 						]
-					}) : /* @__PURE__ */ _(o, {
+					}) : /* @__PURE__ */ v(s, {
 						severity: "info",
 						children: "No field selected."
 					})
 				}),
-				/* @__PURE__ */ v(s, {
+				/* @__PURE__ */ y(c, {
 					sx: {
 						pt: 2,
 						display: "flex",
 						justifyContent: "space-between",
 						gap: 1
 					},
-					children: [/* @__PURE__ */ _(c, {
+					children: [/* @__PURE__ */ v(l, {
 						color: "error",
-						startIcon: /* @__PURE__ */ _(b, {}),
-						onClick: F,
-						disabled: !T,
-						children: O ? "Delete (will unbind from steps)" : "Delete field"
-					}), /* @__PURE__ */ _(c, {
+						startIcon: /* @__PURE__ */ v(x, {}),
+						onClick: I,
+						disabled: !E,
+						children: k ? "Delete (will remove from form)" : "Delete field"
+					}), /* @__PURE__ */ v(l, {
 						variant: "contained",
-						onClick: k,
+						onClick: A,
 						children: "Done"
 					})]
 				})
@@ -182,6 +185,6 @@ function S({ open: S, propertyKey: C, existingKeys: w, property: T, isRequired:
 	});
 }
 //#endregion
-export { S as FieldDefinitionDrawer };
+export { C as FieldDefinitionDrawer };
 
 //# sourceMappingURL=FieldDefinitionDrawer.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"FieldDefinitionDrawer.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FieldDefinitionDrawer.tsx"],"sourcesContent":["import {\n  Alert,\n  Box,\n  Button,\n  Drawer,\n  FormControlLabel,\n  IconButton,\n  MenuItem,\n  Stack,\n  Switch,\n  TextField,\n  Typography,\n} from '@mui/material'\nimport { Close as CloseIcon, Delete as DeleteIcon } from '@mui/icons-material'\nimport { RJSFSchema } from '@rjsf/utils'\nimport { useState } from 'react'\nimport { SchemaPropertyContext } from '@/utils/jsonschema/submissionContext'\nimport { ChoiceOptionsEditor } from './ChoiceOptionsEditor'\nimport {\n  applyFieldType,\n  detectFieldType,\n  FIELD_TYPE_OPTIONS,\n  sanitizePropertyKey,\n  SimpleFieldType,\n} from './schemaFieldUtils'\n\nconst SUBMISSION_CONTEXT_OPTIONS: {\n  value: SchemaPropertyContext\n  label: string\n}[] = [\n  { value: 'ALWAYS', label: 'Always' },\n  { value: 'REQUEST_ONLY', label: 'Initial request only' },\n  { value: 'RENEWAL_ONLY', label: 'Renewal only' },\n]\n\nexport type FieldDefinitionDrawerProps = {\n  open: boolean\n  propertyKey: string | null\n  /** All property keys currently defined in the schema, including this one. */\n  existingKeys: Set<string>\n  property: RJSFSchema | null\n  isRequired: boolean\n  /**\n   * Which submission context this property applies to (per the schema's\n   * `x-synapse-submissionContext` `allOf` convention). Editable here via a guided select box.\n   * This component only calls `onChangeContext`; a container elsewhere in the authoring flow is\n   * responsible for moving the property's definition between the schema's top-level `properties`\n   * and the matching `allOf` branch so ACT never has to hand-edit `allOf` for the common case.\n   */\n  context: SchemaPropertyContext\n  /** True when this field is bound to one or more steps. Affects delete affordance. */\n  isUsedInSteps: boolean\n  onClose: () => void\n  onUpdate: (patch: Partial<RJSFSchema>) => void\n  onRenameKey: (newKey: string) => void\n  onReplace: (next: RJSFSchema) => void\n  onChangeRequired: (isRequired: boolean) => void\n  onChangeContext: (context: SchemaPropertyContext) => void\n  onRemove: () => void\n}\n\n/**\n * Slide-in drawer for editing a single field's JSON Schema definition (label, help text, type,\n * required, submission context, choice options, file format).\n */\nexport function FieldDefinitionDrawer({\n  open,\n  propertyKey,\n  existingKeys,\n  property,\n  isRequired,\n  context,\n  isUsedInSteps,\n  onClose,\n  onUpdate,\n  onRenameKey,\n  onReplace,\n  onChangeRequired,\n  onChangeContext,\n  onRemove,\n}: FieldDefinitionDrawerProps) {\n  const type = property ? detectFieldType(property) : null\n  const isAdvanced = property !== null && type === null\n\n  // The draft exists only while the key is being edited, and is tagged with the key it was started\n  // from. When `propertyKey` changes underneath it (switching fields, or the container re-slugging\n  // the key from the label) the draft no longer applies and the prop is shown again.\n  const [keyDraft, setKeyDraft] = useState<{\n    forKey: string | null\n    value: string\n  } | null>(null)\n  const displayedKey =\n    keyDraft?.forKey === propertyKey ? keyDraft.value : (propertyKey ?? '')\n\n  let keyError: string | null = null\n  if (displayedKey.length === 0) {\n    keyError = 'Required'\n  } else if (displayedKey !== propertyKey && existingKeys.has(displayedKey)) {\n    keyError = 'Already used by another field'\n  }\n\n  const commitKeyDraft = () => {\n    if (propertyKey && !keyError && displayedKey !== propertyKey) {\n      onRenameKey(displayedKey)\n    }\n    setKeyDraft(null)\n  }\n\n  const handleChangeType = (next: SimpleFieldType) => {\n    if (!property) return\n    onReplace(applyFieldType(property, next))\n  }\n\n  return (\n    <Drawer\n      open={open}\n      onClose={onClose}\n      anchor=\"right\"\n      slotProps={{ paper: { sx: { width: { xs: '100%', sm: 480 } } } }}\n    >\n      <Box\n        sx={{ p: 3, display: 'flex', flexDirection: 'column', height: '100%' }}\n      >\n        <Box sx={{ display: 'flex', alignItems: 'center', mb: 2 }}>\n          <Typography variant=\"h6\" sx={{ flexGrow: 1 }}>\n            Edit field\n          </Typography>\n          <IconButton onClick={onClose} aria-label=\"Close field editor\">\n            <CloseIcon />\n          </IconButton>\n        </Box>\n\n        {propertyKey && (\n          <TextField\n            label=\"Property key\"\n            value={displayedKey}\n            onChange={e =>\n              setKeyDraft({\n                forKey: propertyKey,\n                value: sanitizePropertyKey(e.target.value),\n              })\n            }\n            onBlur={commitKeyDraft}\n            onKeyDown={e => {\n              if (e.key === 'Enter') {\n                e.preventDefault()\n                commitKeyDraft()\n              }\n            }}\n            error={keyError !== null}\n            helperText={\n              keyError ??\n              'Identifies this field in the JSON Schema and submitted requests.'\n            }\n            size=\"small\"\n            fullWidth\n            sx={{ mb: 2 }}\n            slotProps={{ input: { sx: { fontFamily: 'monospace' } } }}\n          />\n        )}\n\n        {property && (\n          <TextField\n            select\n            label=\"Submission context\"\n            value={context}\n            onChange={e =>\n              onChangeContext(e.target.value as SchemaPropertyContext)\n            }\n            size=\"small\"\n            fullWidth\n            sx={{ mb: 2 }}\n            helperText=\"Controls whether requesters are asked this question on an initial request, a renewal, or both.\"\n          >\n            {SUBMISSION_CONTEXT_OPTIONS.map(opt => (\n              <MenuItem key={opt.value} value={opt.value}>\n                {opt.label}\n              </MenuItem>\n            ))}\n          </TextField>\n        )}\n\n        <Box sx={{ flexGrow: 1, overflow: 'auto' }}>\n          {!property ? (\n            <Alert severity=\"info\">No field selected.</Alert>\n          ) : isAdvanced ? (\n            <Alert severity=\"warning\" variant=\"outlined\">\n              This field uses settings not supported by the simple editor. Edit\n              it via the advanced raw JSON Schema view.\n            </Alert>\n          ) : (\n            <Stack spacing={2}>\n              <TextField\n                label=\"Question label\"\n                value={property.title ?? ''}\n                onChange={e => onUpdate({ title: e.target.value })}\n                size=\"small\"\n                fullWidth\n              />\n              <TextField\n                label=\"Help text\"\n                value={property.description ?? ''}\n                onChange={e => onUpdate({ description: e.target.value })}\n                size=\"small\"\n                multiline\n                rows={3}\n                fullWidth\n                helperText=\"Shown to the requester below the question.\"\n              />\n              <Stack direction=\"row\" spacing={1} alignItems=\"center\">\n                <TextField\n                  select\n                  label=\"Field type\"\n                  value={type}\n                  onChange={e =>\n                    handleChangeType(e.target.value as SimpleFieldType)\n                  }\n                  size=\"small\"\n                  sx={{ flexGrow: 1 }}\n                >\n                  {FIELD_TYPE_OPTIONS.map(opt => (\n                    <MenuItem key={opt.value} value={opt.value}>\n                      {opt.label}\n                    </MenuItem>\n                  ))}\n                </TextField>\n                <FormControlLabel\n                  control={\n                    <Switch\n                      checked={isRequired}\n                      onChange={e => onChangeRequired(e.target.checked)}\n                    />\n                  }\n                  label=\"Required\"\n                />\n              </Stack>\n\n              {type === 'choice' && (\n                <ChoiceOptionsEditor\n                  options={(property.enum as string[] | undefined) ?? []}\n                  onChange={next => onUpdate({ enum: next })}\n                />\n              )}\n\n              {type === 'file' && (\n                <Alert severity=\"info\" variant=\"outlined\">\n                  Requesters will be prompted to upload a file. You can attach a\n                  downloadable template to this field on each step that uses it.\n                </Alert>\n              )}\n            </Stack>\n          )}\n        </Box>\n\n        <Box\n          sx={{\n            pt: 2,\n            display: 'flex',\n            justifyContent: 'space-between',\n            gap: 1,\n          }}\n        >\n          <Button\n            color=\"error\"\n            startIcon={<DeleteIcon />}\n            onClick={onRemove}\n            disabled={!property}\n          >\n            {isUsedInSteps ? 'Delete (will unbind from steps)' : 'Delete field'}\n          </Button>\n          <Button variant=\"contained\" onClick={onClose}>\n            Done\n          </Button>\n        </Box>\n      </Box>\n    </Drawer>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"FieldDefinitionDrawer.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FieldDefinitionDrawer.tsx"],"sourcesContent":["import {\n  Alert,\n  Box,\n  Button,\n  Drawer,\n  FormControlLabel,\n  IconButton,\n  MenuItem,\n  Stack,\n  Switch,\n  TextField,\n  Typography,\n} from '@mui/material'\nimport { Close as CloseIcon, Delete as DeleteIcon } from '@mui/icons-material'\nimport { RJSFSchema } from '@rjsf/utils'\nimport { useState } from 'react'\nimport { SchemaPropertyContext } from '@/utils/jsonschema/submissionContext'\nimport { ChoiceOptionsEditor } from './ChoiceOptionsEditor'\nimport {\n  applyFieldType,\n  choiceOptions,\n  detectFieldType,\n  FIELD_TYPE_OPTIONS,\n  sanitizePropertyKey,\n  SimpleFieldType,\n} from './schemaFieldUtils'\n\nconst SUBMISSION_CONTEXT_OPTIONS: {\n  value: SchemaPropertyContext\n  label: string\n}[] = [\n  { value: 'ALWAYS', label: 'Always' },\n  { value: 'REQUEST_ONLY', label: 'Initial request only' },\n  { value: 'RENEWAL_ONLY', label: 'Renewal only' },\n]\n\nexport type FieldDefinitionDrawerProps = {\n  open: boolean\n  propertyKey: string | null\n  /** All property keys currently defined in the schema, including this one. */\n  existingKeys: Set<string>\n  property: RJSFSchema | null\n  isRequired: boolean\n  /**\n   * Which submission context this property applies to (per the schema's\n   * `x-synapse-submissionContext` `allOf` convention). Editable here via a guided select box.\n   * This component only calls `onChangeContext`; a container elsewhere in the authoring flow is\n   * responsible for moving the property's definition between the schema's top-level `properties`\n   * and the matching `allOf` branch so ACT never has to hand-edit `allOf` for the common case.\n   */\n  context: SchemaPropertyContext\n  /** True when this field is bound to one or more steps. Affects delete affordance. */\n  isUsedInSteps: boolean\n  onClose: () => void\n  onUpdate: (patch: Partial<RJSFSchema>) => void\n  onRenameKey: (newKey: string) => void\n  onReplace: (next: RJSFSchema) => void\n  onChangeRequired: (isRequired: boolean) => void\n  onChangeContext: (context: SchemaPropertyContext) => void\n  onRemove: () => void\n}\n\n/**\n * Slide-in drawer for editing a single field's JSON Schema definition (label, help text, type,\n * required, submission context, choice options, file format).\n */\nexport function FieldDefinitionDrawer({\n  open,\n  propertyKey,\n  existingKeys,\n  property,\n  isRequired,\n  context,\n  isUsedInSteps,\n  onClose,\n  onUpdate,\n  onRenameKey,\n  onReplace,\n  onChangeRequired,\n  onChangeContext,\n  onRemove,\n}: FieldDefinitionDrawerProps) {\n  const type = property ? detectFieldType(property) : null\n  const isAdvanced = property !== null && type === null\n\n  // The draft exists only while the key is being edited, and is tagged with the key it was started\n  // from. When `propertyKey` changes underneath it (switching fields, or the container re-slugging\n  // the key from the label) the draft no longer applies and the prop is shown again.\n  const [keyDraft, setKeyDraft] = useState<{\n    forKey: string | null\n    value: string\n  } | null>(null)\n  const displayedKey =\n    keyDraft?.forKey === propertyKey ? keyDraft.value : (propertyKey ?? '')\n\n  let keyError: string | null = null\n  if (displayedKey.length === 0) {\n    keyError = 'Required'\n  } else if (displayedKey !== propertyKey && existingKeys.has(displayedKey)) {\n    keyError = 'Already used by another field'\n  }\n\n  const commitKeyDraft = () => {\n    if (propertyKey && !keyError && displayedKey !== propertyKey) {\n      onRenameKey(displayedKey)\n    }\n    setKeyDraft(null)\n  }\n\n  const handleChangeType = (next: SimpleFieldType) => {\n    if (!property) return\n    onReplace(applyFieldType(property, next))\n  }\n\n  return (\n    <Drawer\n      open={open}\n      onClose={onClose}\n      anchor=\"right\"\n      slotProps={{ paper: { sx: { width: { xs: '100%', sm: 480 } } } }}\n    >\n      <Box\n        sx={{ p: 3, display: 'flex', flexDirection: 'column', height: '100%' }}\n      >\n        <Box sx={{ display: 'flex', alignItems: 'center', mb: 2 }}>\n          <Typography variant=\"h6\" sx={{ flexGrow: 1 }}>\n            Edit field\n          </Typography>\n          <IconButton onClick={onClose} aria-label=\"Close field editor\">\n            <CloseIcon />\n          </IconButton>\n        </Box>\n\n        {propertyKey && (\n          <TextField\n            label=\"Property key\"\n            value={displayedKey}\n            onChange={e =>\n              setKeyDraft({\n                forKey: propertyKey,\n                value: sanitizePropertyKey(e.target.value),\n              })\n            }\n            onBlur={commitKeyDraft}\n            onKeyDown={e => {\n              if (e.key === 'Enter') {\n                e.preventDefault()\n                commitKeyDraft()\n              }\n            }}\n            error={keyError !== null}\n            helperText={\n              keyError ??\n              'Identifies this field in the JSON Schema and submitted requests.'\n            }\n            size=\"small\"\n            fullWidth\n            sx={{ mb: 2 }}\n            slotProps={{ input: { sx: { fontFamily: 'monospace' } } }}\n          />\n        )}\n\n        {property && (\n          <TextField\n            select\n            label=\"Submission context\"\n            value={context}\n            onChange={e =>\n              onChangeContext(e.target.value as SchemaPropertyContext)\n            }\n            size=\"small\"\n            fullWidth\n            sx={{ mb: 2 }}\n            helperText=\"Controls whether requesters are asked this question on an initial request, a renewal, or both.\"\n          >\n            {SUBMISSION_CONTEXT_OPTIONS.map(opt => (\n              <MenuItem key={opt.value} value={opt.value}>\n                {opt.label}\n              </MenuItem>\n            ))}\n          </TextField>\n        )}\n\n        <Box sx={{ flexGrow: 1, overflow: 'auto' }}>\n          {!property ? (\n            <Alert severity=\"info\">No field selected.</Alert>\n          ) : isAdvanced ? (\n            <Alert severity=\"warning\" variant=\"outlined\">\n              This field uses settings not supported by the simple editor. Edit\n              it via the advanced raw JSON Schema view.\n            </Alert>\n          ) : (\n            <Stack spacing={2}>\n              <TextField\n                label=\"Question label\"\n                value={property.title ?? ''}\n                onChange={e => onUpdate({ title: e.target.value })}\n                size=\"small\"\n                fullWidth\n              />\n              <TextField\n                label=\"Help text\"\n                value={property.description ?? ''}\n                onChange={e => onUpdate({ description: e.target.value })}\n                size=\"small\"\n                multiline\n                rows={3}\n                fullWidth\n                helperText=\"Shown to the requester below the question.\"\n              />\n              <Stack direction=\"row\" spacing={1} alignItems=\"center\">\n                <TextField\n                  select\n                  label=\"Field type\"\n                  value={type}\n                  onChange={e =>\n                    handleChangeType(e.target.value as SimpleFieldType)\n                  }\n                  size=\"small\"\n                  sx={{ flexGrow: 1 }}\n                >\n                  {FIELD_TYPE_OPTIONS.map(opt => (\n                    <MenuItem key={opt.value} value={opt.value}>\n                      {opt.label}\n                    </MenuItem>\n                  ))}\n                </TextField>\n                <FormControlLabel\n                  control={\n                    <Switch\n                      checked={isRequired}\n                      onChange={e => onChangeRequired(e.target.checked)}\n                    />\n                  }\n                  label=\"Required\"\n                />\n              </Stack>\n\n              {(type === 'choice' || type === 'multiChoice') && (\n                <ChoiceOptionsEditor\n                  options={choiceOptions(property)}\n                  onChange={next =>\n                    type === 'choice'\n                      ? onUpdate({ enum: next })\n                      : onUpdate({\n                          items: {\n                            ...(property.items as RJSFSchema),\n                            enum: next,\n                          },\n                        })\n                  }\n                />\n              )}\n\n              {type === 'file' && (\n                <Alert severity=\"info\" variant=\"outlined\">\n                  Requesters will be prompted to upload a file. You can attach a\n                  downloadable template to this field on each step that uses it.\n                </Alert>\n              )}\n            </Stack>\n          )}\n        </Box>\n\n        <Box\n          sx={{\n            pt: 2,\n            display: 'flex',\n            justifyContent: 'space-between',\n            gap: 1,\n          }}\n        >\n          <Button\n            color=\"error\"\n            startIcon={<DeleteIcon />}\n            onClick={onRemove}\n            disabled={!property}\n          >\n            {isUsedInSteps ? 'Delete (will remove from form)' : 'Delete field'}\n          </Button>\n          <Button variant=\"contained\" onClick={onClose}>\n            Done\n          </Button>\n        </Box>\n      </Box>\n    </Drawer>\n  )\n}\n"],"mappings":"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"}

package/dist/components/FormTemplateEditor/FieldLibrary.css

@@ -0,0 +1 @@
+._selectedRow_4haeg_1{outline-offset:-2px;border-radius:4px;outline:2px solid #0000}._selectedRow_4haeg_1[data-selected=true]{outline-color:var(--synapse-primary-action-color)}

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

@@ -0,0 +1,17 @@
+import { RJSFSchema } from '@rjsf/utils';
+export type FieldLibraryProps = {
+    jsonSchema: RJSFSchema;
+    /** Set of JSON pointers (e.g. `/institution`) currently bound to a step. */
+    usedPaths: Set<string>;
+    selectedPropertyKey: string | null;
+    onSelectField: (propertyKey: string) => void;
+    onCreateField: () => void;
+};
+/**
+ * Left pane: a compact list of all schema properties (the "fields" the form
+ * collects) -- both unconditional and any gated behind an
+ * `x-synapse-submissionContext` conditional. Each row is clickable and opens
+ * the field definition drawer.
+ */
+export declare function FieldLibrary({ jsonSchema, usedPaths, selectedPropertyKey, onSelectField, onCreateField, }: FieldLibraryProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FieldLibrary.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLibrary.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/FieldLibrary.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AASxC,MAAM,MAAM,iBAAiB,GAAG;IAC9B,UAAU,EAAE,UAAU,CAAA;IACtB,4EAA4E;IAC5E,SAAS,EAAE,GAAG,CAAC,MAAM,CAAC,CAAA;IACtB,mBAAmB,EAAE,MAAM,GAAG,IAAI,CAAA;IAClC,aAAa,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,CAAA;IAC5C,aAAa,EAAE,MAAM,IAAI,CAAA;CAC1B,CAAA;AAED;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,EAC3B,UAAU,EACV,SAAS,EACT,mBAAmB,EACnB,aAAa,EACb,aAAa,GACd,EAAE,iBAAiB,2CA4FnB"}

package/dist/components/FormTemplateEditor/FieldLibrary.js

@@ -0,0 +1,88 @@
+import { listResolvedSchemaProperties as e, propertyKeyToPointer as t } from "../../utils/jsonschema/submissionContext.js";
+import { FieldLibraryRow as n } from "./FieldLibraryRow.js";
+import r from "./FieldLibrary.module.js";
+import { useMemo as i, useState as a } from "react";
+import { Alert as o, Box as s, Button as c, InputAdornment as l, Paper as u, Stack as d, TextField as f, Typography as p } from "@mui/material";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
+import { Add as g, Search as _ } from "@mui/icons-material";
+//#region src/components/FormTemplateEditor/FieldLibrary.tsx
+function v({ jsonSchema: v, usedPaths: y, selectedPropertyKey: b, onSelectField: x, onCreateField: S }) {
+	let [C, w] = a(""), T = i(() => e(v), [v]), E = i(() => {
+		if (!C) return T;
+		let e = C.toLowerCase();
+		return T.filter((t) => `${t.propertyKey} ${t.subSchema.title ?? ""}`.toLowerCase().includes(e));
+	}, [T, C]), D;
+	return D = T.length === 0 ? /* @__PURE__ */ m(o, {
+		severity: "info",
+		children: "No fields yet. Click \"New\" to start collecting information."
+	}) : E.length === 0 ? /* @__PURE__ */ h(o, {
+		severity: "info",
+		children: [
+			"No fields match \"",
+			C,
+			"\"."
+		]
+	}) : /* @__PURE__ */ m(d, {
+		spacing: .75,
+		children: E.map((e) => /* @__PURE__ */ m(s, {
+			className: r.selectedRow,
+			"data-selected": b === e.propertyKey,
+			children: /* @__PURE__ */ m(n, {
+				propertyKey: e.propertyKey,
+				property: e.subSchema,
+				isRequired: e.isRequired,
+				context: e.context,
+				isUsedInSteps: y.has(t(e.propertyKey)),
+				onClick: () => x(e.propertyKey)
+			})
+		}, e.propertyKey))
+	}), /* @__PURE__ */ h(u, {
+		variant: "outlined",
+		sx: {
+			p: 2,
+			height: "100%"
+		},
+		children: [/* @__PURE__ */ h(s, {
+			sx: { mb: 1 },
+			children: [/* @__PURE__ */ m(p, {
+				variant: "subtitle2",
+				children: "Fields"
+			}), /* @__PURE__ */ m(p, {
+				variant: "caption",
+				color: "text.secondary",
+				children: "Define the data you want to collect. Click a field to edit it."
+			})]
+		}), /* @__PURE__ */ h(d, {
+			spacing: 1.5,
+			children: [/* @__PURE__ */ h(d, {
+				direction: "row",
+				spacing: 1,
+				alignItems: "center",
+				children: [/* @__PURE__ */ m(f, {
+					placeholder: "Search fields…",
+					value: C,
+					onChange: (e) => w(e.target.value),
+					size: "small",
+					fullWidth: !0,
+					slotProps: {
+						input: { startAdornment: /* @__PURE__ */ m(l, {
+							position: "start",
+							children: /* @__PURE__ */ m(_, { fontSize: "small" })
+						}) },
+						htmlInput: { "aria-label": "Search fields" }
+					}
+				}), /* @__PURE__ */ m(c, {
+					size: "small",
+					variant: "outlined",
+					startIcon: /* @__PURE__ */ m(g, {}),
+					onClick: S,
+					children: "New"
+				})]
+			}), D]
+		})]
+	});
+}
+//#endregion
+export { v as FieldLibrary };
+
+//# sourceMappingURL=FieldLibrary.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLibrary.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FieldLibrary.tsx"],"sourcesContent":["import {\n  Alert,\n  Box,\n  Button,\n  InputAdornment,\n  Paper,\n  Stack,\n  TextField,\n  Typography,\n} from '@mui/material'\nimport { Add as AddIcon, Search as SearchIcon } from '@mui/icons-material'\nimport { RJSFSchema } from '@rjsf/utils'\nimport { ReactNode, useMemo, useState } from 'react'\nimport {\n  listResolvedSchemaProperties,\n  propertyKeyToPointer,\n} from '@/utils/jsonschema/submissionContext'\nimport { FieldLibraryRow } from './FieldLibraryRow'\nimport fieldLibraryStyles from './FieldLibrary.module.scss'\n\nexport type FieldLibraryProps = {\n  jsonSchema: RJSFSchema\n  /** Set of JSON pointers (e.g. `/institution`) currently bound to a step. */\n  usedPaths: Set<string>\n  selectedPropertyKey: string | null\n  onSelectField: (propertyKey: string) => void\n  onCreateField: () => void\n}\n\n/**\n * Left pane: a compact list of all schema properties (the \"fields\" the form\n * collects) -- both unconditional and any gated behind an\n * `x-synapse-submissionContext` conditional. Each row is clickable and opens\n * the field definition drawer.\n */\nexport function FieldLibrary({\n  jsonSchema,\n  usedPaths,\n  selectedPropertyKey,\n  onSelectField,\n  onCreateField,\n}: FieldLibraryProps) {\n  const [search, setSearch] = useState('')\n\n  const resolvedProperties = useMemo(\n    () => listResolvedSchemaProperties(jsonSchema),\n    [jsonSchema],\n  )\n\n  const filtered = useMemo(() => {\n    if (!search) return resolvedProperties\n    const searchTerm = search.toLowerCase()\n    return resolvedProperties.filter(p => {\n      const entryAsString =\n        `${p.propertyKey} ${p.subSchema.title ?? ''}`.toLowerCase()\n      return entryAsString.includes(searchTerm)\n    })\n  }, [resolvedProperties, search])\n\n  let fieldList: ReactNode\n  if (resolvedProperties.length === 0) {\n    fieldList = (\n      <Alert severity=\"info\">\n        No fields yet. Click \"New\" to start collecting information.\n      </Alert>\n    )\n  } else if (filtered.length === 0) {\n    fieldList = <Alert severity=\"info\">No fields match \"{search}\".</Alert>\n  } else {\n    fieldList = (\n      <Stack spacing={0.75}>\n        {filtered.map(p => (\n          <Box\n            key={p.propertyKey}\n            className={fieldLibraryStyles.selectedRow}\n            data-selected={selectedPropertyKey === p.propertyKey}\n          >\n            <FieldLibraryRow\n              propertyKey={p.propertyKey}\n              property={p.subSchema}\n              isRequired={p.isRequired}\n              context={p.context}\n              isUsedInSteps={usedPaths.has(propertyKeyToPointer(p.propertyKey))}\n              onClick={() => onSelectField(p.propertyKey)}\n            />\n          </Box>\n        ))}\n      </Stack>\n    )\n  }\n\n  return (\n    <Paper variant=\"outlined\" sx={{ p: 2, height: '100%' }}>\n      <Box sx={{ mb: 1 }}>\n        <Typography variant=\"subtitle2\">Fields</Typography>\n        <Typography variant=\"caption\" color=\"text.secondary\">\n          Define the data you want to collect. Click a field to edit it.\n        </Typography>\n      </Box>\n\n      <Stack spacing={1.5}>\n        <Stack direction=\"row\" spacing={1} alignItems=\"center\">\n          <TextField\n            placeholder=\"Search fields…\"\n            value={search}\n            onChange={e => setSearch(e.target.value)}\n            size=\"small\"\n            fullWidth\n            slotProps={{\n              input: {\n                startAdornment: (\n                  <InputAdornment position=\"start\">\n                    <SearchIcon fontSize=\"small\" />\n                  </InputAdornment>\n                ),\n              },\n              htmlInput: { 'aria-label': 'Search fields' },\n            }}\n          />\n          <Button\n            size=\"small\"\n            variant=\"outlined\"\n            startIcon={<AddIcon />}\n            onClick={onCreateField}\n          >\n            New\n          </Button>\n        </Stack>\n\n        {fieldList}\n      </Stack>\n    </Paper>\n  )\n}\n"],"mappings":";;;;;;;;AAmCA,SAAgB,EAAa,EAC3B,eACA,cACA,wBACA,kBACA,oBACoB;CACpB,IAAM,CAAC,GAAQ,KAAa,EAAS,EAAE,GAEjC,IAAqB,QACnB,EAA6B,CAAU,GAC7C,CAAC,CAAU,CACb,GAEM,IAAW,QAAc;EAC7B,IAAI,CAAC,GAAQ,OAAO;EACpB,IAAM,IAAa,EAAO,YAAY;EACtC,OAAO,EAAmB,QAAO,MAE7B,GAAG,EAAE,YAAY,GAAG,EAAE,UAAU,SAAS,KAAK,YACzC,EAAc,SAAS,CAAU,CACzC;CACH,GAAG,CAAC,GAAoB,CAAM,CAAC,GAE3B;CAgCJ,OA/BA,AASE,IATE,EAAmB,WAAW,IAE9B,kBAAC,GAAD;EAAO,UAAS;YAAO;CAEhB,CAAA,IAEA,EAAS,WAAW,IACjB,kBAAC,GAAD;EAAO,UAAS;YAAhB;GAAuB;GAAkB;GAAO;EAAS;MAGnE,kBAAC,GAAD;EAAO,SAAS;YACb,EAAS,KAAI,MACZ,kBAAC,GAAD;GAEE,WAAW,EAAmB;GAC9B,iBAAe,MAAwB,EAAE;aAEzC,kBAAC,GAAD;IACE,aAAa,EAAE;IACf,UAAU,EAAE;IACZ,YAAY,EAAE;IACd,SAAS,EAAE;IACX,eAAe,EAAU,IAAI,EAAqB,EAAE,WAAW,CAAC;IAChE,eAAe,EAAc,EAAE,WAAW;GAC3C,CAAA;EACE,GAZE,EAAE,WAYJ,CACN;CACI,CAAA,GAKT,kBAAC,GAAD;EAAO,SAAQ;EAAW,IAAI;GAAE,GAAG;GAAG,QAAQ;EAAO;YAArD,CACE,kBAAC,GAAD;GAAK,IAAI,EAAE,IAAI,EAAE;aAAjB,CACE,kBAAC,GAAD;IAAY,SAAQ;cAAY;GAAkB,CAAA,GAClD,kBAAC,GAAD;IAAY,SAAQ;IAAU,OAAM;cAAiB;GAEzC,CAAA,CACT;MAEL,kBAAC,GAAD;GAAO,SAAS;aAAhB,CACE,kBAAC,GAAD;IAAO,WAAU;IAAM,SAAS;IAAG,YAAW;cAA9C,CACE,kBAAC,GAAD;KACE,aAAY;KACZ,OAAO;KACP,WAAU,MAAK,EAAU,EAAE,OAAO,KAAK;KACvC,MAAK;KACL,WAAA;KACA,WAAW;MACT,OAAO,EACL,gBACE,kBAAC,GAAD;OAAgB,UAAS;iBACvB,kBAAC,GAAD,EAAY,UAAS,QAAS,CAAA;MAChB,CAAA,EAEpB;MACA,WAAW,EAAE,cAAc,gBAAgB;KAC7C;IACD,CAAA,GACD,kBAAC,GAAD;KACE,MAAK;KACL,SAAQ;KACR,WAAW,kBAAC,GAAD,CAAU,CAAA;KACrB,SAAS;eACV;IAEO,CAAA,CACH;OAEN,CACI;IACF;;AAEX"}

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLibrary.module.js","names":[],"sources":["../../../src/components/FormTemplateEditor/FieldLibrary.module.scss"],"sourcesContent":["// Highlight for the field-library row matching the currently selected property.\n// Toggled with `data-selected` so the component only reports state and the look lives here,\n// matching the pattern used by dropTarget.module.scss.\n.selectedRow {\n  outline: 2px solid transparent;\n  outline-offset: -2px;\n  border-radius: 4px;\n\n  &[data-selected='true'] {\n    outline-color: var(--synapse-primary-action-color);\n  }\n}\n"],"mappings":""}

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

@@ -0,0 +1,12 @@
+// Highlight for the field-library row matching the currently selected property.
+// Toggled with `data-selected` so the component only reports state and the look lives here,
+// matching the pattern used by dropTarget.module.scss.
+.selectedRow {
+  outline: 2px solid transparent;
+  outline-offset: -2px;
+  border-radius: 4px;
+
+  &[data-selected='true'] {
+    outline-color: var(--synapse-primary-action-color);
+  }
+}

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

@@ -0,0 +1,19 @@
+import { RJSFSchema } from '@rjsf/utils';
+import { SchemaPropertyContext } from '@/utils/jsonschema/submissionContext';
+export type FieldLibraryRowProps = {
+    propertyKey: string;
+    property: RJSFSchema;
+    isRequired: boolean;
+    /** Which submission context (per the schema's `x-synapse-submissionContext` convention)
+     * gates this property. `ALWAYS` properties show no badge. */
+    context: SchemaPropertyContext;
+    isUsedInSteps: boolean;
+    onClick: () => void;
+};
+/**
+ * A compact row in the field library. Click anywhere to edit the field's
+ * definition; grab the drag indicator on the left to bind it to a step.
+ * Rows already bound to a step are non-draggable.
+ */
+export declare function FieldLibraryRow({ propertyKey, property, isRequired, context, isUsedInSteps, onClick, }: FieldLibraryRowProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=FieldLibraryRow.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLibraryRow.d.ts","sourceRoot":"","sources":["../../../src/components/FormTemplateEditor/FieldLibraryRow.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EACL,qBAAqB,EAEtB,MAAM,sCAAsC,CAAA;AAK7C,MAAM,MAAM,oBAAoB,GAAG;IACjC,WAAW,EAAE,MAAM,CAAA;IACnB,QAAQ,EAAE,UAAU,CAAA;IACpB,UAAU,EAAE,OAAO,CAAA;IACnB;iEAC6D;IAC7D,OAAO,EAAE,qBAAqB,CAAA;IAC9B,aAAa,EAAE,OAAO,CAAA;IACtB,OAAO,EAAE,MAAM,IAAI,CAAA;CACpB,CAAA;AAED;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,EAC9B,WAAW,EACX,QAAQ,EACR,UAAU,EACV,OAAO,EACP,aAAa,EACb,OAAO,GACR,EAAE,oBAAoB,2CA6GtB"}

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}