@quillmark/svelte 0.2.0 → 0.3.0

package/dist/visual/Card.svelte.d.ts

@@ -21,23 +21,19 @@ interface CardOps {
 interface Props {
     card: CardModel;
     doc: Document;
-    /** The schema a prose leaf reads its content through (`ProseField`). */
     quill: Quill;
     index: number;
     isFirst: boolean;
     isLast: boolean;
     kinds: string[];
     ops: CardOps;
-    /** How an option `ops.enumAllowed` refuses draws. Nothing about it is per-card,
-     *  so it sits beside the bundle rather than in it. */
     enumDisallowed?: 'hide' | 'disable';
     onFocus?: (addr: Addr) => void;
     onCaretMove?: (addr: Addr, pos: number) => void;
     onChange?: (addr: Addr) => void;
     onError?: EditorErrorHandler;
-    /** The editor's leaf registry (`leaves.ts`): every field in this card registers
-     *  its landing handle, which is what the editor's `focusField`/`setCaret`
-     *  resolve a `DocPath` to. */
+    /** Every field in this card registers its landing handle here, which is what the
+     *  editor's `focusField`/`setCaret` resolve a `DocPath` to. */
     leaves?: LeafRegistry;
 }
 declare const Card: import("svelte").Component<Props, {

package/dist/visual/CardControls.svelte

@@ -2,7 +2,7 @@
   Card controls, composable cards only.
   Right-aligned in the header: a move-up/move-down chevron pair revealed while the
   pointer or the caret is in the card (each disabled at its edge), then an
-  always-visible delete. Reorder is BUTTONS, not drag (V1). The card scopes that
+  always-visible delete. Reorder is buttons, not drag (V1). The card scopes that
   reveal, so its condition lives in the parent's CSS; the pair keeps the narrower
   guarantee here, that a focused chevron is a visible one. The card also hangs this
   cluster to land these glyphs on its right gutter, and reads `--_qm-glyph-control`

package/dist/visual/DateField.svelte

@@ -11,26 +11,26 @@
  calendar) rather than `DatePicker`: the segments are the entry affordance, and a
  calendar is a second surface this field does not need.
 
- THE BOUNDARY IS A STRING, AND THE LOCAL IS TOO. The primitive speaks
+ The boundary is A string, and the local is too. The primitive speaks
  `CalendarDate`; the document speaks `YYYY-MM-DD`. `CalendarDate` carries no time
  and no zone, so the round-trip is lossless and no local-midnight shift can occur:
  the hazard that makes `new Date('2026-07-25')` the wrong tool here. Authored
- values are data, not input: `parseDate` THROWS on anything malformed, so a bad
+ values are data, not input: `parseDate` throws on anything malformed, so a bad
  string degrades to an empty field rather than taking the editor down with it.
 
- `syncedLocal` reconciles by IDENTITY, so the local must hold the string, not the
+ `syncedLocal` reconciles by identity, so the local must hold the string, not the
  parsed value: a fresh `CalendarDate` is never `===` the last one, which would
  make every reconcile fire and re-render all seven segments on each commit.
 
- THE GHOST IS THE DEFAULT'S DIGITS, NOT A FORMAT HINT. An unset field
+ The ghost is the default'S digits, not A format hint. An unset field
  carrying a `default:` prints the default's digits in the segments, ghost-toned,
  instead of the primitive's `mm`/`dd`/`yyyy` hints, which say "empty" where the
- rung says "will render 2026-01-01". The ghost is painted in the SEGMENT SNIPPET,
+ rung says "will render 2026-01-01". The ghost is painted in the segment snippet,
  over an unset primitive: substituting the default for `value` instead would make
  the field indistinguishable from an authored one to every path that reads it
  (`areAllSegmentsFilled`, Backspace, the hidden input), and the primitive shadows
  a written-back `value` prop it was not `bind:`-ed to, so re-seating the ghost
- after a clear never lands. `placeholder` (the `DateValue` the segments COUNT
+ after a clear never lands. `placeholder` (the `DateValue` the segments count
  from, never one they display) carries the default too, so arrowing an empty
  segment starts at the render's date rather than today's.
 -->
@@ -45,15 +45,15 @@
 		/** The resolved `default:` in the boundary's currency (`YYYY-MM-DD`): parsed
 		 * for display only, shown while unset, never written. */
 		fallback?: string;
-		/** Accessible name for a field NOTHING else names: an object property, whose
+		/** Accessible name for a field nothing else names: an object property, whose
 		 * name is the field label plus the property's. A field's own date takes
 		 * `labelledBy` instead. */
 		label?: string;
-		/** The field label's own id. `for` CANNOT reach this control: the segment
+		/** The field label's own id. `for` cannot reach this control: the segment
 		 * container is not a labelable element; so the association runs the other way,
 		 * and the label's click comes back through {@link focus}. It lands on the
 		 * container, which the primitive gives `role="group"`: the name belongs to the
-		 * SET of segments, and entering any of them announces it. (bits builds each
+		 * set of segments, and entering any of them announces it. (bits builds each
 		 * segment's own `aria-labelledby` from a `DateField.Label` inside its root:
 		 * unreachable from here, since the field's label is a grid child of the field,
 		 * not of the control.) */
@@ -66,7 +66,7 @@
 
 	let wrapEl: HTMLElement | undefined = $state();
 	/** Take the caret: what the label click, and a parent placing focus here, calls.
-	 * The FIRST segment, not the field: focus lives on a segment (which is why the
+	 * The first segment, not the field: focus lives on a segment (which is why the
 	 * ring is `.qm-focus-ring-within`), and the container holds none. `literal` is the
 	 * separator between segments: present, never focusable. */
 	export function focus(): void {
@@ -85,14 +85,14 @@
 		}
 	}
 
-	// Local value synced to `value` as a STRING (see the identity note above);
+	// Local value synced to `value` as a string (see the identity note above);
 	// own-edits stay local, only an external change reconciles back in. Driven
-	// CONTROLLED (`value` + `onValueChange`, never `bind:`) so reconciliation stays
+	// controlled (`value` + `onValueChange`, never `bind:`) so reconciliation stays
 	// the package's.
 	const local = syncedLocal(() => value?.slice(0, 10) ?? '');
 	const parsed = $derived(toDateValue(local.value));
 	// The date the empty segments ghost, or undefined when there is nothing to ghost:
-	// the field is unset AND the default has a date form. A non-blank local that
+	// the field is unset and the default has a date form. A non-blank local that
 	// fails to parse is AUTHORED-but-malformed, which the empty field states
 	// honestly: the ghost would claim it unset. Held as the parsed value rather than
 	// a boolean so the substitution below narrows on the one fact it needs.
@@ -101,10 +101,10 @@
 
 	// What one segment prints, and whether that text is shown-never-written.
 	//
-	// An UNFILLED segment is always shown-never-written, whether it prints the
+	// An unfilled segment is always shown-never-written, whether it prints the
 	// default's digits or the primitive's own `mm`/`dd`/`yyyy` hint: both state
 	// "nothing authored here". Only an unfilled segment ghosts: a half-entered date
-	// holds digits while the VALUE is still undefined (one unfilled segment unsets
+	// holds digits while the value is still undefined (one unfilled segment unsets
 	// the whole field), so ghosting unconditionally would paint over, and dim, the
 	// digits just typed. The segment's own text is the tell: its unfilled hint is
 	// alphabetic in every locale bits ships (`mm`/`yyyy`, `аа`, `年`), a filled one
@@ -142,7 +142,7 @@
 	>
 		<!-- `data-ghosted` states the rung the way the enum trigger does. The date
 		 primitive emits no per-segment placeholder marker (only bits' `select`
-		 does), so the TONE rides the same attribute, set per segment from the
+		 does), so the tone rides the same attribute, set per segment from the
 		 substitution itself; which is also what keeps a half-typed date's own
 		 digits at full ink while the segments around them ghost. -->
 		<BitsDateField.Input
@@ -153,7 +153,7 @@
 			data-ghosted={ghost ? '' : undefined}
 		>
 			{#snippet children({ segments })}
-				<!-- Keyed by INDEX: `part` repeats (the `literal` separators between
+				<!-- Keyed by index: `part` repeats (the `literal` separators between
 				 segments all carry it) so a part-keyed block collides. -->
 				{#each segments as seg, i (i)}
 					{@const shown = segmentText(seg.part, seg.value)}
@@ -171,7 +171,7 @@
 </span>
 
 <style>
-	/* A primitive renders its OWN element, which a scoped selector cannot reach:
+	/* A primitive renders its own element, which a scoped selector cannot reach:
 	 styled through the wrapper with `:global`. */
 	/* The box is `.qm-control-box` (controls.css), carried on the primitive's own
 	   element beside `.qm-focus-ring-within`; the segments inherit its size and ink
@@ -183,7 +183,7 @@
 		box-sizing: border-box;
 	}
 	/* The ring rides `.qm-focus-ring-within` (controls.css) rather than the plain
-	   marker: focus lives on the SEGMENT, so it rings the field, not the segment
+	   marker: focus lives on the segment, so it rings the field, not the segment
 	   the caret happens to be in. */
 	.qm-date-wrap :global(.qm-date-segment) {
 		padding: 0 var(--_qm-space-half);

package/dist/visual/DateField.svelte.d.ts

@@ -4,15 +4,15 @@ interface Props {
     /** The resolved `default:` in the boundary's currency (`YYYY-MM-DD`): parsed
      * for display only, shown while unset, never written. */
     fallback?: string;
-    /** Accessible name for a field NOTHING else names: an object property, whose
+    /** Accessible name for a field nothing else names: an object property, whose
      * name is the field label plus the property's. A field's own date takes
      * `labelledBy` instead. */
     label?: string;
-    /** The field label's own id. `for` CANNOT reach this control: the segment
+    /** The field label's own id. `for` cannot reach this control: the segment
      * container is not a labelable element; so the association runs the other way,
      * and the label's click comes back through {@link focus}. It lands on the
      * container, which the primitive gives `role="group"`: the name belongs to the
-     * SET of segments, and entering any of them announces it. (bits builds each
+     * set of segments, and entering any of them announces it. (bits builds each
      * segment's own `aria-labelledby` from a `DateField.Label` inside its root:
      * unreachable from here, since the field's label is a grid child of the field,
      * not of the control.) */

package/dist/visual/DiagnosticList.svelte

@@ -1,6 +1,6 @@
 <!--
  Inline diagnostic display (VISUAL_EDITOR §Diagnostics), severity-styled via
- CSS vars, NON-GATING: purely additive, never disables the field it sits
+ CSS vars, non-gating: purely additive, never disables the field it sits
  under. Shared by `Field.svelte` (a scalar/prose field) and `Card.svelte` (the
  body leaf, which has no `Field.svelte` wrapper), so a card's body diagnostics
  render the same way a field's do.

package/dist/visual/EnumField.svelte

@@ -1,9 +1,9 @@
 <!--
  A `string`+`enum` (or `type: 'enum'`) field → a styled listbox over `enum ??
- values`, on bits-ui. When nothing is authored the list shows a distinct UNSET
- sentinel that GHOSTS the `default:` (muted, shown-never-written), distinguishable
+ values`, on bits-ui. When nothing is authored the list shows a distinct unset
+ sentinel that ghosts the `default:` (muted, shown-never-written), distinguishable
  from an authored pick and re-selectable; so re-picking the default fires a
- change. The sentinel commits nothing; any real pick: INCLUDING the
+ change. The sentinel commits nothing; any real pick: including the
  value that equals the default: commits via the parent's typed `writer.set`.
  Explicitly picking the default is the one place "commit the default" is genuine
  intent, expressible. The sentinel stays in the list once a value is authored, as
@@ -22,7 +22,7 @@
 		value: string | undefined;
 		values: string[];
 		fallback?: string;
-		/** Accessible name for a trigger NOTHING else names: an object property, whose
+		/** Accessible name for a trigger nothing else names: an object property, whose
 		 * name is the field label plus the property's. A field's own trigger takes `id`
 		 * instead and is named by the `<label for>` beside it (the trigger is a
 		 * `<button>`, so `for` reaches it and a label click opens the list: what the
@@ -35,7 +35,7 @@
 		describedBy?: string;
 		onCommit: (v: string | undefined) => void;
 		/** Consumer policy: `false` marks an option unavailable, so it can't be picked.
-		 * The UNSET sentinel is exempt: clear-to-default always works. */
+		 * The unset sentinel is exempt: clear-to-default always works. */
 		optionAllowed?: (value: string) => boolean;
 		/** How a refused option draws: greyed and unpickable, or left out of the list. */
 		enumDisallowed?: 'hide' | 'disable';
@@ -59,7 +59,7 @@
 
 	// Local selection synced to `value` (sentinel when unauthored); own-picks stay
 	// local, only an external change reconciles back in (see `syncedLocal`). Driven
-	// CONTROLLED (`value` + `onValueChange`, never `bind:`) so reconciliation stays
+	// controlled (`value` + `onValueChange`, never `bind:`) so reconciliation stays
 	// the package's rather than the primitive's.
 	const local = syncedLocal(() => value ?? UNSET);
 
@@ -71,16 +71,16 @@
 	/** What the closed trigger shows: the pick, or the ghosted default while unset. */
 	const shown = $derived(unset ? ghostText : dash(local.value));
 
-	/** The root to portal INTO: `document.body` would escape the consumer's dials
+	/** The root to portal into: `document.body` would escape the consumer's dials
 	 * along with the editor's subtree. `undefined` falls back to bits-ui's default. */
 	let wrapEl = $state<HTMLElement | undefined>(undefined);
 	const portalTarget = $derived(wrapEl?.closest<HTMLElement>('[data-qm-root]') ?? undefined);
 </script>
 
 <span class="qm-select-wrap" bind:this={wrapEl}>
-	<!-- `allowDeselect={false}`: the UNSET sentinel is the clear-to-default
+	<!-- `allowDeselect={false}`: the unset sentinel is the clear-to-default
 	 affordance, so the primitive's own deselect must stay off. It reports a
-	 deselect as `''`: INDISTINGUISHABLE from picking the empty-string enum
+	 deselect as `''`: indistinguishable from picking the empty-string enum
 	 member the reference quill actually declares. -->
 	<Select.Root
 		type="single"
@@ -106,18 +106,18 @@
 		</Select.Trigger>
 		<Select.Portal to={portalTarget}>
 			<Select.Content sideOffset={4}>
-				<!-- The list PORTALS out of the trigger's DOM but INTO the nearest
+				<!-- The list portals out of the trigger's DOM but into the nearest
 				     `[data-qm-root]`, and carries the marker itself, like FormatPopover.
 				     The pill is this
 				     element (not the primitive's) because scoped CSS keys off which
-				     component OWNS the markup: a `class` passed to a primitive is a
+				     component owns the markup: a `class` passed to a primitive is a
 				     plain string and never picks up the scoping hash. -->
 				<div class="qm-menu-surface qm-select-content" data-qm-root>
 					<Select.Viewport>
 						<Select.Item class="qm-menu-item qm-select-item" value={UNSET} label={ghostText}>
 							<span class="qm-select-ghost">{ghostText}</span>
 						</Select.Item>
-						<!-- A refused option still draws under `'disable'`, and under EITHER
+						<!-- A refused option still draws under `'disable'`, and under either
 						     policy when it is the one selected: a listbox whose selected value
 						     has no row shows nothing for what the document says, and offers none
 						     for the primitive to mark, type-ahead to, or key onto
@@ -145,10 +145,10 @@
 </span>
 
 <style>
-	/* A primitive renders its OWN element, which a scoped selector cannot reach:
+	/* A primitive renders its own element, which a scoped selector cannot reach:
 	 styled through the wrapper with `:global`. */
 	/* The box is `.qm-control-box` (controls.css), carried on the primitive's own
-	   element the same way `.qm-focus-ring` is; only what a TRIGGER adds over a typed
+	   element the same way `.qm-focus-ring` is; only what a trigger adds over a typed
 	   value's box is here. */
 	.qm-select-wrap :global(.qm-select) {
 		display: flex;
@@ -167,7 +167,7 @@
 		color: var(--_qm-ink-ghost);
 	}
 	/* The open list is `.qm-menu-surface` and its rows `.qm-menu-item` (controls.css):
-	 the lift, the inset and the highlight are the shared menu recipe. What a LISTBOX
+	 the lift, the inset and the highlight are the shared menu recipe. What a listbox
 	 adds over a menu is here: it spans its trigger rather than its own content, it
 	 scrolls past a screenful, and it marks the value already stored. */
 	.qm-select-content {
@@ -176,7 +176,7 @@
 		overflow-y: auto;
 	}
 	.qm-select-content :global(.qm-select-item[data-selected]) {
-		font-weight: var(--_qm-weight-label);
+		font-weight: var(--_qm-weight-strong);
 	}
 	/* Consumer policy, for a refused option the list still draws: offered, unpickable. */
 	.qm-select-content :global(.qm-select-item[data-disabled]) {

package/dist/visual/EnumField.svelte.d.ts

@@ -3,7 +3,7 @@ interface Props {
     value: string | undefined;
     values: string[];
     fallback?: string;
-    /** Accessible name for a trigger NOTHING else names: an object property, whose
+    /** Accessible name for a trigger nothing else names: an object property, whose
      * name is the field label plus the property's. A field's own trigger takes `id`
      * instead and is named by the `<label for>` beside it (the trigger is a
      * `<button>`, so `for` reaches it and a label click opens the list: what the
@@ -16,7 +16,7 @@ interface Props {
     describedBy?: string;
     onCommit: (v: string | undefined) => void;
     /** Consumer policy: `false` marks an option unavailable, so it can't be picked.
-     * The UNSET sentinel is exempt: clear-to-default always works. */
+     * The unset sentinel is exempt: clear-to-default always works. */
     optionAllowed?: (value: string) => boolean;
     /** How a refused option draws: greyed and unpickable, or left out of the list. */
     enumDisallowed?: 'hide' | 'disable';

package/dist/visual/Field.svelte

@@ -3,15 +3,15 @@
  {@link FieldModel} and its live value, render the label + the control the type
  maps to. Array controls own their label (paired with the add affordance in
  {@link ArrayField}); other types render the label here. Prose leaves take a
- parent-built LIVE `addr` (its `card` a getter over the stable-id→index map) so
+ parent-built live `addr` (its `card` a getter over the stable-id→index map) so
  a reorder re-targets without a remount; scalars, arrays, and objects commit
- their value UP through `onCommitScalar`, which the parent lowers to the typed
+ their value up through `onCommitScalar`, which the parent lowers to the typed
  writer.
 
  `diagnostics` is the routed `Diagnostic[]` for this field (VisualEditor's
  `diagByKey`, merging `quill.validate`, local commit errors, and the external
  `diagnostics` prop (VISUAL_EDITOR §Diagnostics)) rendered via the shared
- `DiagnosticList`, severity-styled, NON-GATING.
+ `DiagnosticList`, severity-styled, non-gating.
 -->
 <script lang="ts">
 	import type { Document, Quill, Addr, Diagnostic, ResolvedField } from '@quillmark/wasm';
@@ -42,7 +42,7 @@
 		doc: Document;
 		/** The schema a prose leaf reads its content through (`ProseField`). */
 		quill: Quill;
-		/** This field's LIVE address (getter-`card`, so a card reorder re-targets in
+		/** This field's live address (getter-`card`, so a card reorder re-targets in
 		 *  place): the prose leaf commits to it, and a focus reports it. */
 		addr: Addr;
 		leafKey: string;
@@ -92,7 +92,7 @@
 	const ghost = $derived(ghostDefault(provenance));
 	const defaultStr = $derived(stringifyGhost(ghost));
 
-	// `for` reaches a LABELABLE control and the browser does the rest. The other four
+	// `for` reaches a labelable control and the browser does the rest. The other four
 	// are not labelable (the prose leaf's `contenteditable`, the date field's segment
 	// container, the object subform, an array's N inputs) so `for` there would be
 	// both inert and invalid markup; they take `aria-labelledby` and a click handoff.
@@ -159,7 +159,7 @@
 	});
 
 	/**
-	 * A form control has no controller to report its focus through, so the WRAPPER
+	 * A form control has no controller to report its focus through, so the wrapper
 	 * reports: `focusin` bubbles, so one handler covers a plain input, an array's N
 	 * elements and an object's properties alike, and the active leaf names a scalar
 	 * field the way it names a prose one. A prose leaf reports through its own
@@ -181,137 +181,150 @@
 			description={field.description}
 		/>
 	{/if}
-	<div class="qm-field-control" bind:this={controlEl} onfocusin={reportFocus}>
-		{#if field.control === 'prose'}
-			<ProseField
-				{quill}
-				bind:this={proseEl}
-				{doc}
-				{addr}
-				inline={field.inline}
-				plaintext={field.plaintext}
-				labelledBy={domIds.label}
-				{describedBy}
-				{leafKey}
-				{onFocus}
-				{onCaretMove}
-				{onChange}
-				{onError}
-				{leaves}
-			/>
-		{:else if field.control === 'enum'}
-			<EnumField
-				value={value as string | undefined}
-				values={enumValues(field.schema) ?? []}
-				fallback={ghost as string | undefined}
-				id={domIds.control}
-				{describedBy}
-				onCommit={onCommitScalar}
-				{optionAllowed}
-				{enumDisallowed}
-			/>
-		{:else if field.control === 'number'}
-			<NumberField
-				value={value as number | undefined}
-				integer={field.schema.type === 'integer'}
-				fallback={ghost as number | undefined}
-				id={domIds.control}
-				{describedBy}
-				onCommit={onCommitScalar}
-			/>
-		{:else if field.control === 'boolean'}
-			<BooleanField
-				value={value as boolean | undefined}
-				fallback={ghost as boolean | undefined}
-				id={domIds.control}
-				{describedBy}
-				onCommit={onCommitScalar}
-			/>
-		{:else if field.control === 'date'}
-			<DateField
-				bind:this={dateEl}
-				value={value as string | undefined}
-				fallback={defaultStr}
-				labelledBy={domIds.label}
-				{describedBy}
-				onCommit={onCommitScalar}
-			/>
-		{:else if field.control === 'array'}
-			<ArrayField
-				bind:this={arrayEl}
-				value={value as unknown[] | undefined}
-				items={field.schema.items}
-				label={field.label}
-				required={field.required}
-				description={field.description}
-				labelId={domIds.label}
-				descriptionId={domIds.description}
-				onCommit={onCommitScalar}
-			/>
-		{:else if field.control === 'object'}
-			<ObjectField
-				bind:this={objectEl}
-				value={value as Record<string, unknown> | undefined}
-				properties={field.schema.properties}
-				label={field.label}
-				labelledBy={domIds.label}
-				{describedBy}
-				onCommit={onCommitScalar}
-			/>
-		{:else}
-			<TextField
-				value={value as string | undefined}
-				placeholder={defaultStr}
-				id={domIds.control}
-				{describedBy}
-				onCommit={onCommitScalar}
-			/>
-		{/if}
-	</div>
+	<!-- The control and what hangs under it, in one grid cell: the diagnostics stack
+	 inside the control's track rather than claiming a track of their own (the subgrid
+	 rule below holds why). One markup for both spans; a field owning its row nests a
+	 level and measures the same. -->
+	<div class="qm-field-stack">
+		<div class="qm-field-control" bind:this={controlEl} onfocusin={reportFocus}>
+			{#if field.control === 'prose'}
+				<ProseField
+					{quill}
+					bind:this={proseEl}
+					{doc}
+					{addr}
+					inline={field.inline}
+					plaintext={field.plaintext}
+					labelledBy={domIds.label}
+					{describedBy}
+					{leafKey}
+					{onFocus}
+					{onCaretMove}
+					{onChange}
+					{onError}
+					{leaves}
+				/>
+			{:else if field.control === 'enum'}
+				<EnumField
+					value={value as string | undefined}
+					values={enumValues(field.schema) ?? []}
+					fallback={ghost as string | undefined}
+					id={domIds.control}
+					{describedBy}
+					onCommit={onCommitScalar}
+					{optionAllowed}
+					{enumDisallowed}
+				/>
+			{:else if field.control === 'number'}
+				<NumberField
+					value={value as number | undefined}
+					integer={field.schema.type === 'integer'}
+					fallback={ghost as number | undefined}
+					id={domIds.control}
+					{describedBy}
+					onCommit={onCommitScalar}
+				/>
+			{:else if field.control === 'boolean'}
+				<BooleanField
+					value={value as boolean | undefined}
+					fallback={ghost as boolean | undefined}
+					id={domIds.control}
+					{describedBy}
+					onCommit={onCommitScalar}
+				/>
+			{:else if field.control === 'date'}
+				<DateField
+					bind:this={dateEl}
+					value={value as string | undefined}
+					fallback={defaultStr}
+					labelledBy={domIds.label}
+					{describedBy}
+					onCommit={onCommitScalar}
+				/>
+			{:else if field.control === 'array'}
+				<ArrayField
+					bind:this={arrayEl}
+					value={value as unknown[] | undefined}
+					items={field.schema.items}
+					label={field.label}
+					required={field.required}
+					description={field.description}
+					labelId={domIds.label}
+					descriptionId={domIds.description}
+					onCommit={onCommitScalar}
+				/>
+			{:else if field.control === 'object'}
+				<ObjectField
+					bind:this={objectEl}
+					value={value as Record<string, unknown> | undefined}
+					properties={field.schema.properties}
+					label={field.label}
+					labelledBy={domIds.label}
+					{describedBy}
+					onCommit={onCommitScalar}
+				/>
+			{:else}
+				<TextField
+					value={value as string | undefined}
+					placeholder={defaultStr}
+					id={domIds.control}
+					{describedBy}
+					onCommit={onCommitScalar}
+				/>
+			{/if}
+		</div>
 
-	<DiagnosticList {diagnostics} />
+		<DiagnosticList {diagnostics} />
+	</div>
 </div>
 
 <style>
 	/* The `full` span, and the base every field starts from: its own row, a plain
 	   stack. Nothing shares the row, so there are no internals to align against.
 
-	   THE ACTION COLUMN IS THE FIELD'S INSET, not the section's:
-	   a row action's tap target plus the grid's own column gutter, held clear at the
-	   end of whatever the field spans. On the SECTION it reserves one trailing column
-	   for the whole grid, which reaches only a field that stops short of it. The array
-	   carries the only row action there is, and it always owns its row (structure.ts
-	   `packable`), so it spans that reservation with every other column: the one field
-	   a section could reserve for is the one it would miss. Per field the reservation
-	   travels with the thing that uses it: one right edge per track, every control in a
-	   row ending on it, and an array reaching back across its own to put its remove
-	   past it (ArrayField). Every field pays the width, including one with no action in
-	   it; a right edge that moved with a field's contents is the raggedness this
-	   removes. */
+	   No inset at the end: the right edge is the track's and every control in a row ends
+	   on it, a row action sitting inside the element that carries it (ArrayField) rather
+	   than in a column every field would hold clear. */
 	.qm-field {
 		display: flex;
 		flex-direction: column;
 		gap: var(--_qm-space);
 		grid-column: 1 / -1;
 		min-width: 0;
-		padding-right: var(--action-col);
 	}
 	/* A row-sharing field subgrids onto the section's row tracks instead of sizing its
-	 own: three tracks (label, control, diagnostics) taken from the parent, so every
-	 control in a visual row starts at the same y however tall a neighbour's label
-	 wrapped, and one field's diagnostic lifts none of the others out of line. Source
-	 order IS track order; `align-items: start` keeps a short control from stretching
-	 to a taller sibling's track. `row-gap` overrides the section's inter-row gutter
-	 for the tracks this field spans: inside a field the rhythm is tighter than
-	 between rows. */
+	 own: two tracks, the label and the control's stack, taken from the parent, so
+	 every control in a visual row starts at the same y however tall a neighbour's
+	 label wrapped. Source order is track order; `align-items: start` keeps a short
+	 control from stretching to a taller sibling's track. `row-gap` overrides the
+	 section's inter-row gutter for the tracks this field spans: inside a field the
+	 rhythm is tighter than between rows.
+
+	 Two tracks, and not a third for the diagnostics: a track is permanent where a
+	 diagnostic is occasional, and an empty track still costs the gutter above it, so
+	 a third stands a rung of dead space under every field on the path where nothing
+	 is wrong. That rung is the one place a field's box outruns its ink. It is what
+	 makes a run of row-sharing fields read looser than the arrays and prose leaves
+	 beside them, whose boxes end where their ink does. What a third track buys is the
+	 diagnostics of one row starting at one y; the alignment a row is read by is the
+	 controls', and the label track holds that. A diagnostic grows its row instead. */
 	.qm-field.cell,
 	.qm-field.lone {
 		display: grid;
-		grid-row: span 3;
+		grid-row: span 2;
 		grid-template-rows: subgrid;
 		row-gap: var(--_qm-space);
 		align-items: start;
 	}
+	/* The stack the control's track holds: the control, and the diagnostics when
+	 there are any. Its gap is the field's own, so a diagnostic sits the same rung
+	 under its control that the control sits under its label. */
+	.qm-field-stack {
+		display: flex;
+		flex-direction: column;
+		gap: var(--_qm-space);
+		min-width: 0;
+	}
 	.qm-field.cell {
 		grid-column: span 1;
 	}

package/dist/visual/Field.svelte.d.ts

@@ -14,7 +14,7 @@ interface Props {
     doc: Document;
     /** The schema a prose leaf reads its content through (`ProseField`). */
     quill: Quill;
-    /** This field's LIVE address (getter-`card`, so a card reorder re-targets in
+    /** This field's live address (getter-`card`, so a card reorder re-targets in
      *  place): the prose leaf commits to it, and a focus reports it. */
     addr: Addr;
     leafKey: string;