@quillmark/svelte 0.5.1 → 0.6.0

package/dist/visual/VariantField.svelte

@@ -0,0 +1,98 @@
+<!--
+ An `enum` declaring `variants:` → the discriminant's select, and under it the cells
+ the chosen world brings into play (VISUAL_EDITOR §"Enum variants"). The field rests as
+ a container, `{value: <member>, …that member's fields}`, and commits whole: it is one
+ cell to `Addr`, so there is no per-cell write address.
+
+ The cells are {@link ObjectField}, which already draws a scalar field set keyed by
+ name over a container its parent commits by value. It takes the whole container as its
+ `value` and the world's declaration as its `properties`, so what it hands back is the
+ container with one cell written — and cells outside the drawn world ride through
+ untouched rather than needing to be merged back.
+-->
+<script lang="ts">
+	import type { QuillFieldSchema } from '@quillmark/wasm';
+	import EnumField from './EnumField.svelte';
+	import ObjectField from './ObjectField.svelte';
+	import {
+		VARIANT_DISCRIMINANT,
+		commitDiscriminant,
+		variantCells,
+		variantMember
+	} from './structure.js';
+
+	interface Props {
+		/** The stored container, or undefined while the field is unset. */
+		value: Record<string, unknown> | undefined;
+		schema: QuillFieldSchema;
+		/** The resolved `default:`'s member: what an unset field renders as. */
+		ghostMember: string | undefined;
+		/** Field label, the naming prefix the cells' controls compose with. */
+		label: string;
+		/** `<label for>` target: the discriminant trigger, this control's one labelable
+		 * element. The cells are named by their own composed labels. */
+		id?: string;
+		labelledBy?: string;
+		describedBy?: string;
+		onCommit: (v: Record<string, unknown> | undefined) => void;
+		optionAllowed?: (value: string) => boolean;
+		enumDisallowed?: 'hide' | 'disable';
+	}
+	let {
+		value,
+		schema,
+		ghostMember,
+		label,
+		id,
+		labelledBy,
+		describedBy,
+		onCommit,
+		optionAllowed,
+		enumDisallowed
+	}: Props = $props();
+
+	const member = $derived(variantMember(value, ghostMember));
+	const cells = $derived(variantCells(schema, member));
+	const discriminant = $derived(value?.[VARIANT_DISCRIMINANT] as string | undefined);
+</script>
+
+<div class="qm-variant">
+	<EnumField
+		value={discriminant}
+		values={schema.values ?? []}
+		fallback={ghostMember}
+		{id}
+		{describedBy}
+		onCommit={(v) => onCommit(commitDiscriminant(value, v))}
+		{optionAllowed}
+		{enumDisallowed}
+	/>
+	<!-- Keyed on the member so a flip remounts the cells rather than re-targeting
+	     them: two worlds' cells are different fields that happen to occupy one place,
+	     and a control carrying local state (an unreconciled pick, a caret) across the
+	     flip would carry it between them. -->
+	{#if cells}
+		{#key member}
+			<!-- `close`: the discriminant's box directly above IS the cells' top boundary,
+			     so the band's opening stroke would state it twice. -->
+			<ObjectField
+				value={value ?? {}}
+				properties={cells}
+				{label}
+				idBase={id}
+				{labelledBy}
+				{describedBy}
+				edges="close"
+				onCommit={(obj) => onCommit(obj)}
+			/>
+		{/key}
+	{/if}
+</div>
+
+<style>
+	.qm-variant {
+		display: flex;
+		flex-direction: column;
+		gap: var(--_qm-space-2);
+	}
+</style>

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

@@ -0,0 +1,21 @@
+import type { QuillFieldSchema } from '@quillmark/wasm';
+interface Props {
+    /** The stored container, or undefined while the field is unset. */
+    value: Record<string, unknown> | undefined;
+    schema: QuillFieldSchema;
+    /** The resolved `default:`'s member: what an unset field renders as. */
+    ghostMember: string | undefined;
+    /** Field label, the naming prefix the cells' controls compose with. */
+    label: string;
+    /** `<label for>` target: the discriminant trigger, this control's one labelable
+     * element. The cells are named by their own composed labels. */
+    id?: string;
+    labelledBy?: string;
+    describedBy?: string;
+    onCommit: (v: Record<string, unknown> | undefined) => void;
+    optionAllowed?: (value: string) => boolean;
+    enumDisallowed?: 'hide' | 'disable';
+}
+declare const VariantField: import("svelte").Component<Props, {}, "">;
+type VariantField = ReturnType<typeof VariantField>;
+export default VariantField;

package/dist/visual/VisualEditorInner.svelte

@@ -668,14 +668,15 @@
 
 	/**
 	 * Put the caret in a revealed target, at the finest grain it can take: a USV offset
-	 * in a prose leaf, a bare focus everywhere else. An array element is no
-	 * `createField` leaf, and a form control has no coordinate to spend an offset in (an
-	 * `<input type="number">` refuses a selection outright), which is also the whole of
-	 * what a click on plate-placed ink can mean.
+	 * in a prose leaf or an array element, a bare focus everywhere else. A form control
+	 * has no coordinate to spend an offset in (an `<input type="number">` refuses a
+	 * selection outright), which is also the whole of what a click on plate-placed ink
+	 * can mean. An element is no `createField` leaf, so the offset goes down the element
+	 * lane instead, where what it means is the row control's (`leaves.ts`).
 	 */
 	function land(found: Landed, pos: number | undefined): void {
 		if (found.element != null && found.control.focusElement) {
-			return found.control.focusElement(found.element);
+			return found.control.focusElement(found.element, pos);
 		}
 		if (pos != null) {
 			const prose = leaves.prose(found.key);
@@ -898,9 +899,13 @@
 
 	   The column, not only the cards in it: the gutter the stack sits in and the tone
 	   behind it are the surface's own, so a bare `<div>` is a mounting site and nothing
-	   is owed before the editor looks right. Consumer CSS is unlayered and beats all of
-	   it, which is how a host that wants the column back takes it. `border-box`, so a
-	   height from the caller is the height this draws.
+	   is owed before the editor looks right. `border-box`, so a height from the caller is
+	   the height this draws.
+
+	   `:global(:where(…))` puts a promised class at zero rank, and both halves are
+	   load-bearing: `:global` drops the scoping class, `:where` drops the rest
+	   (ARCHITECTURE §Styling). The class is the surface's root wherever it mounts, so
+	   leaving the component's scope costs nothing.
 
 	   The sunken rung, which is what makes a card an island: the cards are the base
 	   plane and this is the one they float on, so the gutter reads as ground rather
@@ -908,7 +913,7 @@
 	   ramp, which is what gives the ground enough of itself to read as ground: at a
 	   narrower one the stack meets whatever frames the surface and the islands are
 	   back to being one block clipped at its edges. */
-	.qm-editor {
+	:global(:where(.qm-editor)) {
 		box-sizing: border-box;
 		display: flex;
 		flex-direction: column;
@@ -933,7 +938,7 @@
 	   site with no height of its own, which is the page form kept. The cards do not
 	   shrink to fit: a flex item's automatic minimum floors each at its own height, so
 	   the stack overflows and scrolls rather than squashing. */
-	.qm-editor.qm-pane {
+	:global(:where(.qm-editor.qm-pane)) {
 		height: 100%;
 		overflow: auto;
 		overscroll-behavior: contain;