@pixerate/editor-svelte 0.26.1 → 0.27.0

package/README.md

@@ -83,6 +83,7 @@ Tables are on by default in `createRichTextPreset` (`table: false` turns them of
 | `@pixerate/editor-svelte/commands` | `CommandPalette`, `createCommandPalette` (`hotkey: "Mod+K"`; call `destroy()` when done), `createCommandShortcuts`, `useRegisterCommands` over a `CommandRegistry` from `@pixerate/editor/commands` (also re-exported from the root entry) |
 | `@pixerate/editor-svelte/persistence` | `createAutosave` (crash-recovery snapshots bound to a history / dirty flag, flushed on `pagehide`; call `destroy()` when done) and `<RecoveryPrompt>` (also re-exported from the root entry) |
 | `@pixerate/editor-svelte/generation` | `GenerationSettings` (controls generated from a model's capabilities, reference slots by role, plan adjustments; `onchange` / `onaddreference`), `createGenerationPlan(() => request, () => caps)`, `JobProgress`, `createJobProgress` (call `destroy()` when done) over `@pixerate/editor/generation` (also re-exported from the root entry) |
+| `@pixerate/editor-svelte/parameters` | `ParametersPanel` (a whole schema with groups, presets, undo / reset / randomize and keyframe diamonds), `createParameters` (call `destroy()` when done), `useParameterCommands`, and the field controls `ParameterFieldControl`, `ParameterSlider`, `ParameterToggle`, `ParameterSelect`, `ParameterColor`, `ParameterVector`, `ParameterImage`, `ParameterText`, `KeyframeDiamond` over `@pixerate/editor/parameters` (see [the parameters guide](../../docs/parameters.md)) |
 | `@pixerate/editor-svelte/canvas` | Runes for `@xyflow/svelte`: `createCanvasGraph`, `createCanvasClipboard`, `createCanvasDocking`, `createCanvasShortcuts`, `createCanvasInteractions`, `createCanvasExplosion`, `createCanvasNodeSync`, `createCanvasMultiDrag`, `createStreamingCanvas`, `AgentPresenceLayer`, `FloatingHorizontalScrollbar`, plus layout helpers |
 
 Spreadsheet persistence: `createReactiveSpreadsheet` exposes `document` (and passes it to `onDocumentChange`) with the defined names its formulas use in `document.names`, so saving that document and passing it back as `document` restores workbook, sheet-scoped and LAMBDA names. For several sheets, save `controller.getWorkbook()` instead.

package/dist/agentTools.svelte.d.ts

@@ -1,4 +1,4 @@
-import type { AgentToolProvider, ToolRegistry } from "@pixerate/editor/agent";
+import type { AgentToolProvider, ToolRegistry } from "@pixerate/editor/tools";
 type MaybeGetter<T> = T | (() => T);
 /**
  * Registers a tool provider with a `ToolRegistry` for the lifetime of the

package/dist/canvas/createCanvasAnimation.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createCanvasAnimation.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasAnimation.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,KAAK,kBAAkB,EACvB,KAAK,sBAAsB,EAC3B,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EACzB,KAAK,KAAK,EACV,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAE7C,MAAM,WAAW,4BAA4B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU;IAClF,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,mDAAmD;IACnD,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,gFAAgF;IAChF,cAAc,CAAC,EAAE,MAAM,MAAM,EAAE,CAAC;IAChC,+FAA+F;IAC/F,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,uFAAuF;IACvF,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,kBAAkB,EAAE,CAAC;IAC3C,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC;AAED;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EAAE,OAAO,EAAE,4BAA4B,CAAC,KAAK,CAAC;;;;;;;;;;kBA2DnG,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAai1iI,CAAC;;;;;;;;;;;YAAg/C,CAAC;mBAA8B,CAAC;;;;;;;YAAmjB,CAAC;gBAA0B,CAAC;;;EAH78mI;AAED,MAAM,MAAM,qBAAqB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,IAAI,UAAU,CAAC,OAAO,qBAAqB,CAAC,KAAK,CAAC,CAAC,CAAC"}
+{"version":3,"file":"createCanvasAnimation.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasAnimation.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,KAAK,kBAAkB,EACvB,KAAK,sBAAsB,EAC3B,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EACzB,KAAK,KAAK,EACV,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAE7C,MAAM,WAAW,4BAA4B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU;IAClF,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,mDAAmD;IACnD,OAAO,CAAC,EAAE,sBAAsB,CAAC;IACjC,gFAAgF;IAChF,cAAc,CAAC,EAAE,MAAM,MAAM,EAAE,CAAC;IAChC,+FAA+F;IAC/F,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,uFAAuF;IACvF,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,kBAAkB,EAAE,CAAC;IAC3C,MAAM,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAChC;AAED;;;;;;;;GAQG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EAAE,OAAO,EAAE,4BAA4B,CAAC,KAAK,CAAC;;;;;;;;;;kBA2DnG,KAAK,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;kBAai/iI,CAAC;;;;;;;;;;;YAAg/C,CAAC;mBAA8B,CAAC;;;;;;;YAAmjB,CAAC;gBAA0B,CAAC;;;EAH7mnI;AAED,MAAM,MAAM,qBAAqB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,IAAI,UAAU,CAAC,OAAO,qBAAqB,CAAC,KAAK,CAAC,CAAC,CAAC"}

package/dist/canvas/createCanvasArrange.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createCanvasArrange.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasArrange.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAGN,KAAK,sBAAsB,EAC3B,KAAK,mBAAmB,EACxB,KAAK,8BAA8B,EACnC,KAAK,SAAS,EACd,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,8BAA8B,CAAC,GAAG,CAAC,CAAC;AAEvD,MAAM,WAAW,0BAA0B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CAChF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACrE,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,IAAI,CAAC;CAC/C;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EACxE,OAAO,EAAE,0BAA0B,CAAC,KAAK,CAAC;;IAkBzC;;;;;OAKG;wBACiB,MAAM;;;;;;;;;;sBAoDww/E,CAAC;sBAAiE,CAAC;sBAAiE,CAAC;oBAA+D,CAAC;cAAyD,CAAC;gBAAiD,CAAC;;;;;;;;;0BAA8tC,CAAC;;yBAA6kB,CAAC;;0BAAgf,CAAC;;;;;;;;;;EAxCl3kF;AAED,MAAM,MAAM,aAAa,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,IAAI,UAAU,CAAC,OAAO,mBAAmB,CAAC,KAAK,CAAC,CAAC,CAAC;AAEjH,MAAM,WAAW,6BAA6B;IAC7C,OAAO,EAAE;QAAE,SAAS,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,OAAO,CAAA;KAAE,CAAC;IACjE,uEAAuE;IACvE,MAAM,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,OAAO,CAAC;QAAC,QAAQ,EAAE,MAAM,OAAO,CAAA;KAAE,CAAC;IAC1D,aAAa,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IACrC,QAAQ,CAAC,EAAE,SAAS,sBAAsB,EAAE,CAAC;CAC7C;AAED;;;;;GAKG;AACH,wBAAgB,4BAA4B,CAAC,OAAO,EAAE,6BAA6B,GAAG,MAAM,IAAI,CAqB/F"}
+{"version":3,"file":"createCanvasArrange.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasArrange.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAGN,KAAK,sBAAsB,EAC3B,KAAK,mBAAmB,EACxB,KAAK,8BAA8B,EACnC,KAAK,SAAS,EACd,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,8BAA8B,CAAC,GAAG,CAAC,CAAC;AAEvD,MAAM,WAAW,0BAA0B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CAChF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACrE,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,IAAI,CAAC;CAC/C;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EACxE,OAAO,EAAE,0BAA0B,CAAC,KAAK,CAAC;;IAkBzC;;;;;OAKG;wBACiB,MAAM;;;;;;;;;;sBAoDw6/E,CAAC;sBAAiE,CAAC;sBAAiE,CAAC;oBAA+D,CAAC;cAAyD,CAAC;gBAAiD,CAAC;;;;;;;;;0BAA8tC,CAAC;;yBAA6kB,CAAC;;0BAAgf,CAAC;;;;;;;;;;EAxClhlF;AAED,MAAM,MAAM,aAAa,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,IAAI,UAAU,CAAC,OAAO,mBAAmB,CAAC,KAAK,CAAC,CAAC,CAAC;AAEjH,MAAM,WAAW,6BAA6B;IAC7C,OAAO,EAAE;QAAE,SAAS,EAAE,CAAC,MAAM,EAAE,mBAAmB,KAAK,OAAO,CAAA;KAAE,CAAC;IACjE,uEAAuE;IACvE,MAAM,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,OAAO,CAAC;QAAC,QAAQ,EAAE,MAAM,OAAO,CAAA;KAAE,CAAC;IAC1D,aAAa,CAAC,EAAE,WAAW,GAAG,MAAM,CAAC;IACrC,QAAQ,CAAC,EAAE,SAAS,sBAAsB,EAAE,CAAC;CAC7C;AAED;;;;;GAKG;AACH,wBAAgB,4BAA4B,CAAC,OAAO,EAAE,6BAA6B,GAAG,MAAM,IAAI,CAqB/F"}

package/dist/canvas/createCanvasAutoLayout.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createCanvasAutoLayout.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasAutoLayout.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,KAAK,iCAAiC,EACtC,KAAK,SAAS,EACd,KAAK,kBAAkB,EACvB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,iCAAiC,CAAC,GAAG,CAAC,CAAC;AAE1D,MAAM,WAAW,6BAA6B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CACnF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACrE,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,IAAI,CAAC;CAC/C;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EAAE,OAAO,EAAE,6BAA6B,CAAC,KAAK,CAAC;;;IA+BzH,2FAA2F;kBAC7E,OAAO,SAAS,kBAAkB,WAAW,OAAO,EAAE,GAAG,OAAO,EAAE;IAKhF,gFAAgF;0BAC1D,QAAQ,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAIjE,4EAA4E;iBAC/D,MAAM;IAInB;;;OAGG;wBACiB,MAAM;;;;;;;;aAiBu68F,CAAC;;;;aAAiX,CAAC;cAAwB,CAAC;;;;;;;;;;gBAAqrD,CAAC;;;;EAHpghG;AAED,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,IAAI,UAAU,CAAC,OAAO,sBAAsB,CAAC,KAAK,CAAC,CAAC,CAAC"}
+{"version":3,"file":"createCanvasAutoLayout.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasAutoLayout.svelte.ts"],"names":[],"mappings":"AAAA,OAAO,EAEN,KAAK,iCAAiC,EACtC,KAAK,SAAS,EACd,KAAK,kBAAkB,EACvB,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,iCAAiC,CAAC,GAAG,CAAC,CAAC;AAE1D,MAAM,WAAW,6BAA6B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CACnF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,gBAAgB,CAAC;IACrE,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,SAAS,EAAE,KAAK,IAAI,CAAC;CAC/C;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EAAE,OAAO,EAAE,6BAA6B,CAAC,KAAK,CAAC;;;IA+BzH,2FAA2F;kBAC7E,OAAO,SAAS,kBAAkB,WAAW,OAAO,EAAE,GAAG,OAAO,EAAE;IAKhF,gFAAgF;0BAC1D,QAAQ,CAAC;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAIjE,4EAA4E;iBAC/D,MAAM;IAInB;;;OAGG;wBACiB,MAAM;;;;;;;;aAiBuk9F,CAAC;;;;aAAiX,CAAC;cAAwB,CAAC;;;;;;;;;;gBAAqrD,CAAC;;;;EAHpqhG;AAED,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,IAAI,UAAU,CAAC,OAAO,sBAAsB,CAAC,KAAK,CAAC,CAAC,CAAC"}

package/dist/canvas/createCanvasComponents.svelte.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createCanvasComponents.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasComponents.svelte.ts"],"names":[],"mappings":"AACA,OAAO,EAEN,KAAK,iCAAiC,EACtC,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,iCAAiC,CAAC,GAAG,CAAC,CAAC;AAE1D,MAAM,WAAW,6BAA6B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CACnF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,UAAU,CAAC;IAC/D,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,oFAAoF;IACpF,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;;GAQG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EAAE,OAAO,EAAE,6BAA6B,CAAC,KAAK,CAAC;IAazH,gCAAgC;;;;;4BASu84J,CAAC;;UAAmM,CAAC;YAAsB,CAAC;eAAyB,CAAC;;8BAA8E,CAAC;;;;;;;;;;6BAA4nC,CAAC;;;;;;;;eAA6yB,CAAC;;;;;;;oBAAi7B,CAAC;;;;;;;;;;;;;;gBAA07C,CAAC;;EAHrkiK;AAED,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAC"}
+{"version":3,"file":"createCanvasComponents.svelte.d.ts","sourceRoot":"","sources":["../../src/canvas/createCanvasComponents.svelte.ts"],"names":[],"mappings":"AACA,OAAO,EAEN,KAAK,iCAAiC,EACtC,MAAM,yBAAyB,CAAC;AACjC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAI7C,KAAK,WAAW,GAAG,iCAAiC,CAAC,GAAG,CAAC,CAAC;AAE1D,MAAM,WAAW,6BAA6B,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,CACnF,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,UAAU,GAAG,UAAU,CAAC;IAC/D,QAAQ,EAAE,MAAM,KAAK,EAAE,CAAC;IACxB,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAI,CAAC;IACnC,oFAAoF;IACpF,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,KAAK,KAAK,IAAI,CAAC;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;;GAQG;AACH,wBAAgB,sBAAsB,CAAC,KAAK,SAAS,UAAU,GAAG,UAAU,EAAE,OAAO,EAAE,6BAA6B,CAAC,KAAK,CAAC;IAazH,gCAAgC;;;;;4BASum5J,CAAC;;UAAmM,CAAC;YAAsB,CAAC;eAAyB,CAAC;;8BAA8E,CAAC;;;;;;;;;;6BAA4nC,CAAC;;;;;;;;eAA6yB,CAAC;;;;;;;oBAAi7B,CAAC;;;;;;;;;;;;;;gBAA07C,CAAC;;EAHruiK;AAED,MAAM,MAAM,gBAAgB,GAAG,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAC"}

package/dist/parameters/KeyframeDiamond.svelte

@@ -0,0 +1,41 @@
+<script lang="ts">
+  import type { ParameterKeyState } from '@pixerate/editor/parameters';
+
+  interface Props {
+    state: ParameterKeyState;
+    ontoggle: () => void;
+    /** The parameter's label (for the accessible name). */
+    label: string;
+    disabled?: boolean;
+    class?: string;
+  }
+
+  let { state, ontoggle, label, disabled = false, class: className = '' }: Props = $props();
+
+  const keyed = $derived(state === 'keyed');
+</script>
+
+<!-- A keyframe toggle: filled when a key sits at the playhead, tinted when the value is animated. -->
+<button
+  type="button"
+  data-key-state={state}
+  aria-pressed={keyed}
+  aria-label="{keyed ? 'Remove' : 'Add'} keyframe for {label}"
+  title={keyed ? 'Remove keyframe here' : 'Add keyframe at the playhead'}
+  {disabled}
+  onclick={ontoggle}
+  class="inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-sm focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-primary disabled:opacity-40 {state ===
+  'none'
+    ? 'text-muted-foreground hover:text-foreground'
+    : 'text-amber-500'} {className}"
+>
+  <svg viewBox="0 0 10 10" class="h-2.5 w-2.5" aria-hidden="true">
+    <path
+      d="M5 0.8 9.2 5 5 9.2 0.8 5Z"
+      fill={keyed ? 'currentColor' : 'none'}
+      stroke="currentColor"
+      stroke-width="1.3"
+      opacity={state === 'animated' ? 0.7 : 1}
+    />
+  </svg>
+</button>

package/dist/parameters/KeyframeDiamond.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { ParameterKeyState } from '@pixerate/editor/parameters';
+interface Props {
+    state: ParameterKeyState;
+    ontoggle: () => void;
+    /** The parameter's label (for the accessible name). */
+    label: string;
+    disabled?: boolean;
+    class?: string;
+}
+declare const KeyframeDiamond: import("svelte").Component<Props, {}, "">;
+type KeyframeDiamond = ReturnType<typeof KeyframeDiamond>;
+export default KeyframeDiamond;
+//# sourceMappingURL=KeyframeDiamond.svelte.d.ts.map

package/dist/parameters/KeyframeDiamond.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KeyframeDiamond.svelte.d.ts","sourceRoot":"","sources":["../../src/parameters/KeyframeDiamond.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAGnE,UAAU,KAAK;IACb,KAAK,EAAE,iBAAiB,CAAC;IACzB,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,uDAAuD;IACvD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAsBH,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}

package/dist/parameters/ParameterColor.svelte

@@ -0,0 +1,109 @@
+<script lang="ts">
+  import { normalizeHexColor, parameterLabel, type ColorParameterField } from '@pixerate/editor/parameters';
+  import ParameterCommitInput from './ParameterCommitInput.svelte';
+  import { parameterInputClass, parameterRangeClass } from './styles.js';
+
+  interface Props {
+    field: ColorParameterField;
+    value: string;
+    onchange: (value: string) => void;
+    /** A pick or alpha drag started: merge changes into one undo step until `ongestureend`. */
+    ongesturestart?: () => void;
+    ongestureend?: () => void;
+    disabled?: boolean;
+    id?: string;
+  }
+
+  let { field, value, onchange, ongesturestart, ongestureend, disabled = false, id }: Props = $props();
+
+  const alpha = $derived(!!field.alpha);
+  const hex = $derived(normalizeHexColor(value, true) ?? '#000000ff');
+  const rgb = $derived(hex.slice(0, 7));
+  const a = $derived(hex.slice(7));
+  const shown = $derived(alpha ? hex : rgb);
+  const off = $derived(disabled || !!field.readOnly);
+  const name = $derived(parameterLabel(field));
+
+  let picking = false;
+  function start() {
+    if (picking) return;
+    picking = true;
+    ongesturestart?.();
+  }
+  function end() {
+    if (!picking) return;
+    picking = false;
+    ongestureend?.();
+  }
+</script>
+
+<!-- A colour picker with a hex box, an alpha slider (with `alpha`) and swatches. -->
+<div class="space-y-1.5">
+  <div class="flex items-center gap-2">
+    <span
+      class="relative h-7 w-9 shrink-0 overflow-hidden rounded-md border border-input bg-[repeating-conic-gradient(#d4d4d8_0_25%,#fff_0_50%)] bg-[length:8px_8px]"
+    >
+      <span class="absolute inset-0" style:background={shown}></span>
+      <input
+        type="color"
+        aria-label={name}
+        value={rgb}
+        disabled={off}
+        class="absolute inset-0 h-full w-full cursor-pointer opacity-0 disabled:cursor-not-allowed"
+        oninput={(e) => {
+          start();
+          onchange(alpha ? `${e.currentTarget.value}${a}` : e.currentTarget.value);
+        }}
+        onblur={end}
+      />
+    </span>
+    <ParameterCommitInput
+      {id}
+      aria-label="{name} hex"
+      value={shown}
+      disabled={off}
+      spellcheck={false}
+      class="{parameterInputClass} font-mono"
+      oncommit={(text) => {
+        const next = normalizeHexColor(text, alpha);
+        if (next) onchange(next);
+      }}
+    />
+  </div>
+  {#if alpha}
+    <input
+      type="range"
+      aria-label="{name} opacity"
+      min="0"
+      max="255"
+      step="1"
+      value={parseInt(a, 16)}
+      disabled={off}
+      class={parameterRangeClass}
+      onpointerdown={start}
+      onpointerup={end}
+      onpointercancel={end}
+      onblur={end}
+      oninput={(e) => onchange(`${rgb}${Number(e.currentTarget.value).toString(16).padStart(2, '0')}`)}
+    />
+  {/if}
+  {#if field.swatches && field.swatches.length > 0}
+    <div class="flex flex-wrap gap-1">
+      {#each field.swatches as s (s)}
+        {@const swatch = normalizeHexColor(s, alpha)}
+        {#if swatch}
+          <button
+            type="button"
+            title={swatch}
+            aria-label="{name} {swatch}"
+            aria-pressed={swatch === shown}
+            disabled={off}
+            onclick={() => onchange(swatch)}
+            class="h-5 w-5 rounded border border-input aria-pressed:ring-1 aria-pressed:ring-primary"
+            style:background={swatch}
+          ></button>
+        {/if}
+      {/each}
+    </div>
+  {/if}
+</div>

package/dist/parameters/ParameterColor.svelte.d.ts

@@ -0,0 +1,15 @@
+import { type ColorParameterField } from '@pixerate/editor/parameters';
+interface Props {
+    field: ColorParameterField;
+    value: string;
+    onchange: (value: string) => void;
+    /** A pick or alpha drag started: merge changes into one undo step until `ongestureend`. */
+    ongesturestart?: () => void;
+    ongestureend?: () => void;
+    disabled?: boolean;
+    id?: string;
+}
+declare const ParameterColor: import("svelte").Component<Props, {}, "">;
+type ParameterColor = ReturnType<typeof ParameterColor>;
+export default ParameterColor;
+//# sourceMappingURL=ParameterColor.svelte.d.ts.map

package/dist/parameters/ParameterColor.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParameterColor.svelte.d.ts","sourceRoot":"","sources":["../../src/parameters/ParameterColor.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAqC,KAAK,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAKxG,UAAU,KAAK;IACb,KAAK,EAAE,mBAAmB,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,2FAA2F;IAC3F,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AA8DH,QAAA,MAAM,cAAc,2CAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/parameters/ParameterCommitInput.svelte

@@ -0,0 +1,41 @@
+<script lang="ts">
+  import type { HTMLInputAttributes } from 'svelte/elements';
+  import { parameterInputClass } from './styles.js';
+
+  interface Props extends Omit<HTMLInputAttributes, 'value' | 'class'> {
+    value: string;
+    /** Called with the text and the element (e.g. to show the stored value again after a refused edit). */
+    oncommit: (value: string, input: HTMLInputElement | HTMLTextAreaElement) => void;
+    /** A textarea that commits on blur or Mod+Enter. */
+    multiline?: boolean;
+    class?: string;
+  }
+
+  let { value, oncommit, multiline = false, class: className = parameterInputClass, onkeydown, ...rest }: Props = $props();
+
+  function commit(el: HTMLInputElement | HTMLTextAreaElement) {
+    if (el.value !== value) oncommit(el.value, el);
+  }
+
+  function keydown(e: KeyboardEvent & { currentTarget: HTMLInputElement | HTMLTextAreaElement }) {
+    (onkeydown as ((e: KeyboardEvent) => void) | undefined)?.(e);
+    if (e.defaultPrevented) return;
+    if (e.key === 'Enter' && (!multiline || e.metaKey || e.ctrlKey)) {
+      e.preventDefault();
+      commit(e.currentTarget);
+    }
+    if (e.key === 'Escape') e.currentTarget.value = value;
+  }
+</script>
+
+{#if multiline}
+  <textarea
+    {...rest as any}
+    class="{className} h-auto min-h-[3.5rem] py-1"
+    {value}
+    onblur={(e) => commit(e.currentTarget)}
+    onkeydown={keydown}
+  ></textarea>
+{:else}
+  <input type="text" {...rest} class={className} {value} onblur={(e) => commit(e.currentTarget)} onkeydown={keydown} />
+{/if}

package/dist/parameters/ParameterCommitInput.svelte.d.ts

@@ -0,0 +1,13 @@
+import type { HTMLInputAttributes } from 'svelte/elements';
+interface Props extends Omit<HTMLInputAttributes, 'value' | 'class'> {
+    value: string;
+    /** Called with the text and the element (e.g. to show the stored value again after a refused edit). */
+    oncommit: (value: string, input: HTMLInputElement | HTMLTextAreaElement) => void;
+    /** A textarea that commits on blur or Mod+Enter. */
+    multiline?: boolean;
+    class?: string;
+}
+declare const ParameterCommitInput: import("svelte").Component<Props, {}, "">;
+type ParameterCommitInput = ReturnType<typeof ParameterCommitInput>;
+export default ParameterCommitInput;
+//# sourceMappingURL=ParameterCommitInput.svelte.d.ts.map

package/dist/parameters/ParameterCommitInput.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParameterCommitInput.svelte.d.ts","sourceRoot":"","sources":["../../src/parameters/ParameterCommitInput.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AAIzD,UAAU,KAAM,SAAQ,IAAI,CAAC,mBAAmB,EAAE,OAAO,GAAG,OAAO,CAAC;IAClE,KAAK,EAAE,MAAM,CAAC;IACd,uGAAuG;IACvG,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,gBAAgB,GAAG,mBAAmB,KAAK,IAAI,CAAC;IACjF,oDAAoD;IACpD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AA+BH,QAAA,MAAM,oBAAoB,2CAAwC,CAAC;AACnE,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;AACpE,eAAe,oBAAoB,CAAC"}

package/dist/parameters/ParameterFieldControl.svelte

@@ -0,0 +1,41 @@
+<script lang="ts">
+  import type { ParameterField, ParameterValue } from '@pixerate/editor/parameters';
+  import ParameterColor from './ParameterColor.svelte';
+  import ParameterImage from './ParameterImage.svelte';
+  import ParameterSelect from './ParameterSelect.svelte';
+  import ParameterSlider from './ParameterSlider.svelte';
+  import ParameterText from './ParameterText.svelte';
+  import ParameterToggle from './ParameterToggle.svelte';
+  import ParameterVector from './ParameterVector.svelte';
+
+  interface Props {
+    field: ParameterField;
+    value: ParameterValue;
+    onchange: (value: ParameterValue) => void;
+    ongesturestart?: () => void;
+    ongestureend?: () => void;
+    resolveFile?: (file: File) => string | Promise<string>;
+    disabled?: boolean;
+    id?: string;
+  }
+
+  let { field, value, onchange, ongesturestart, ongestureend, resolveFile, disabled = false, id }: Props = $props();
+  const set = $derived(onchange as (value: any) => void);
+</script>
+
+<!-- The control for any field type. -->
+{#if field.type === 'number' || field.type === 'int'}
+  <ParameterSlider {field} value={value as number} onchange={set} {ongesturestart} {ongestureend} {disabled} {id} />
+{:else if field.type === 'boolean'}
+  <ParameterToggle {field} value={value as boolean} onchange={set} {disabled} {id} />
+{:else if field.type === 'choice'}
+  <ParameterSelect {field} value={value as string | number} onchange={set} {disabled} {id} />
+{:else if field.type === 'color'}
+  <ParameterColor {field} value={value as string} onchange={set} {ongesturestart} {ongestureend} {disabled} {id} />
+{:else if field.type === 'vector'}
+  <ParameterVector {field} value={value as number[]} onchange={set} {disabled} {id} />
+{:else if field.type === 'image'}
+  <ParameterImage {field} value={value as string} onchange={set} {resolveFile} {disabled} {id} />
+{:else if field.type === 'text'}
+  <ParameterText {field} value={value as string} onchange={set} {disabled} {id} />
+{/if}

package/dist/parameters/ParameterFieldControl.svelte.d.ts

@@ -0,0 +1,15 @@
+import type { ParameterField, ParameterValue } from '@pixerate/editor/parameters';
+interface Props {
+    field: ParameterField;
+    value: ParameterValue;
+    onchange: (value: ParameterValue) => void;
+    ongesturestart?: () => void;
+    ongestureend?: () => void;
+    resolveFile?: (file: File) => string | Promise<string>;
+    disabled?: boolean;
+    id?: string;
+}
+declare const ParameterFieldControl: import("svelte").Component<Props, {}, "">;
+type ParameterFieldControl = ReturnType<typeof ParameterFieldControl>;
+export default ParameterFieldControl;
+//# sourceMappingURL=ParameterFieldControl.svelte.d.ts.map

package/dist/parameters/ParameterFieldControl.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParameterFieldControl.svelte.d.ts","sourceRoot":"","sources":["../../src/parameters/ParameterFieldControl.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAUhF,UAAU,KAAK;IACb,KAAK,EAAE,cAAc,CAAC;IACtB,KAAK,EAAE,cAAc,CAAC;IACtB,QAAQ,EAAE,CAAC,KAAK,EAAE,cAAc,KAAK,IAAI,CAAC;IAC1C,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAmCH,QAAA,MAAM,qBAAqB,2CAAwC,CAAC;AACpE,KAAK,qBAAqB,GAAG,UAAU,CAAC,OAAO,qBAAqB,CAAC,CAAC;AACtE,eAAe,qBAAqB,CAAC"}

package/dist/parameters/ParameterImage.svelte

@@ -0,0 +1,77 @@
+<script lang="ts">
+  import { parameterLabel, type ImageParameterField } from '@pixerate/editor/parameters';
+  import ParameterCommitInput from './ParameterCommitInput.svelte';
+  import { parameterButtonClass } from './styles.js';
+
+  interface Props {
+    field: ImageParameterField;
+    value: string;
+    onchange: (value: string) => void;
+    /** Turns a picked file into a URL (upload it, or `URL.createObjectURL`). Without it there is no file button. */
+    resolveFile?: (file: File) => string | Promise<string>;
+    disabled?: boolean;
+    id?: string;
+  }
+
+  let { field, value, onchange, resolveFile, disabled = false, id }: Props = $props();
+
+  const off = $derived(disabled || !!field.readOnly);
+  const name = $derived(parameterLabel(field));
+
+  async function pick(e: Event & { currentTarget: HTMLInputElement }) {
+    const file = e.currentTarget.files?.[0];
+    e.currentTarget.value = '';
+    if (file && resolveFile) onchange(await resolveFile(file));
+  }
+</script>
+
+<!-- An image picker: suggested thumbnails, a URL box, an optional file button and a clear button. -->
+<div class="space-y-1.5">
+  <div class="flex items-center gap-2">
+    <div class="flex h-12 w-16 shrink-0 items-center justify-center overflow-hidden rounded-md border border-input bg-muted">
+      {#if value}
+        <img src={value} alt={name} class="h-full w-full object-cover" />
+      {:else}
+        <span class="text-[10px] text-muted-foreground">None</span>
+      {/if}
+    </div>
+    <div class="flex min-w-0 flex-1 flex-col gap-1">
+      <ParameterCommitInput
+        {id}
+        aria-label="{name} URL"
+        placeholder="Image URL"
+        value={value.startsWith('data:') ? '' : value}
+        disabled={off}
+        oncommit={(text) => onchange(text.trim())}
+      />
+      <div class="flex gap-1">
+        {#if resolveFile}
+          <label class="{parameterButtonClass} cursor-pointer {off ? 'pointer-events-none opacity-50' : ''}">
+            Choose file…
+            <input type="file" class="sr-only" accept={field.accept ?? 'image/*'} disabled={off} aria-label="{name} file" onchange={pick} />
+          </label>
+        {/if}
+        {#if value}
+          <button type="button" class={parameterButtonClass} disabled={off} onclick={() => onchange('')} aria-label="Clear {name}">Clear</button>
+        {/if}
+      </div>
+    </div>
+  </div>
+  {#if field.options && field.options.length > 0}
+    <div class="flex flex-wrap gap-1">
+      {#each field.options as o (o.url)}
+        <button
+          type="button"
+          title={o.label ?? o.url}
+          aria-label={o.label ?? o.url}
+          aria-pressed={o.url === value}
+          disabled={off}
+          onclick={() => onchange(o.url)}
+          class="h-9 w-12 overflow-hidden rounded border border-input aria-pressed:ring-2 aria-pressed:ring-primary"
+        >
+          <img src={o.url} alt="" class="h-full w-full object-cover" />
+        </button>
+      {/each}
+    </div>
+  {/if}
+</div>

package/dist/parameters/ParameterImage.svelte.d.ts

@@ -0,0 +1,14 @@
+import { type ImageParameterField } from '@pixerate/editor/parameters';
+interface Props {
+    field: ImageParameterField;
+    value: string;
+    onchange: (value: string) => void;
+    /** Turns a picked file into a URL (upload it, or `URL.createObjectURL`). Without it there is no file button. */
+    resolveFile?: (file: File) => string | Promise<string>;
+    disabled?: boolean;
+    id?: string;
+}
+declare const ParameterImage: import("svelte").Component<Props, {}, "">;
+type ParameterImage = ReturnType<typeof ParameterImage>;
+export default ParameterImage;
+//# sourceMappingURL=ParameterImage.svelte.d.ts.map

package/dist/parameters/ParameterImage.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParameterImage.svelte.d.ts","sourceRoot":"","sources":["../../src/parameters/ParameterImage.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,6BAA6B,CAAC;AAKrF,UAAU,KAAK;IACb,KAAK,EAAE,mBAAmB,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,gHAAgH;IAChH,WAAW,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC;IACvD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAyDH,QAAA,MAAM,cAAc,2CAAwC,CAAC;AAC7D,KAAK,cAAc,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AACxD,eAAe,cAAc,CAAC"}

package/dist/parameters/ParameterNumberInput.svelte

@@ -0,0 +1,54 @@
+<script lang="ts">
+  import {
+    clampParameterNumber,
+    formatParameterNumber,
+    parameterLabel,
+    parameterStep,
+    parseParameterNumberInput,
+    type NumberParameterField
+  } from '@pixerate/editor/parameters';
+  import ParameterCommitInput from './ParameterCommitInput.svelte';
+  import { parameterInputClass } from './styles.js';
+
+  interface Props {
+    field: NumberParameterField;
+    value: number;
+    onchange: (value: number) => void;
+    disabled?: boolean;
+    id?: string;
+    'aria-label'?: string;
+  }
+
+  let { field, value, onchange, disabled = false, id, 'aria-label': ariaLabel }: Props = $props();
+
+  const text = $derived(formatParameterNumber({ ...field, unit: undefined }, value));
+
+  function keydown(e: KeyboardEvent) {
+    if (e.key !== 'ArrowUp' && e.key !== 'ArrowDown') return;
+    e.preventDefault();
+    const step = parameterStep(field) * (e.shiftKey ? 10 : 1);
+    onchange(clampParameterNumber(field, value + (e.key === 'ArrowUp' ? step : -step)));
+  }
+</script>
+
+<!-- A number box: type a value (units allowed), or step with the arrow keys (Shift ×10). -->
+<div class="relative min-w-0 flex-1">
+  <ParameterCommitInput
+    {id}
+    inputmode="decimal"
+    aria-label={ariaLabel ?? parameterLabel(field)}
+    value={text}
+    disabled={disabled || field.readOnly}
+    class="{parameterInputClass} {field.unit ? 'pr-6' : ''}"
+    onkeydown={keydown}
+    oncommit={(t, input) => {
+      const n = parseParameterNumberInput(field, t);
+      // Show the stored value again when the text was not a number or clamps to it.
+      if (n === null || n === value) input.value = text;
+      else onchange(n);
+    }}
+  />
+  {#if field.unit}
+    <span class="pointer-events-none absolute right-2 top-1/2 -translate-y-1/2 text-[10px] text-muted-foreground">{field.unit}</span>
+  {/if}
+</div>

package/dist/parameters/ParameterNumberInput.svelte.d.ts

@@ -0,0 +1,13 @@
+import { type NumberParameterField } from '@pixerate/editor/parameters';
+interface Props {
+    field: NumberParameterField;
+    value: number;
+    onchange: (value: number) => void;
+    disabled?: boolean;
+    id?: string;
+    'aria-label'?: string;
+}
+declare const ParameterNumberInput: import("svelte").Component<Props, {}, "">;
+type ParameterNumberInput = ReturnType<typeof ParameterNumberInput>;
+export default ParameterNumberInput;
+//# sourceMappingURL=ParameterNumberInput.svelte.d.ts.map

package/dist/parameters/ParameterNumberInput.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParameterNumberInput.svelte.d.ts","sourceRoot":"","sources":["../../src/parameters/ParameterNumberInput.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAMH,KAAK,oBAAoB,EAC1B,MAAM,6BAA6B,CAAC;AAKrC,UAAU,KAAK;IACb,KAAK,EAAE,oBAAoB,CAAC;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAkCH,QAAA,MAAM,oBAAoB,2CAAwC,CAAC;AACnE,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,oBAAoB,CAAC,CAAC;AACpE,eAAe,oBAAoB,CAAC"}

package/dist/parameters/ParameterSelect.svelte

@@ -0,0 +1,54 @@
+<script lang="ts">
+  import { choiceOptionLabel, getChoiceOptions, parameterLabel, type ChoiceParameterField } from '@pixerate/editor/parameters';
+  import { parameterInputClass } from './styles.js';
+
+  interface Props {
+    field: ChoiceParameterField;
+    value: string | number;
+    onchange: (value: string | number) => void;
+    disabled?: boolean;
+    id?: string;
+  }
+
+  let { field, value, onchange, disabled = false, id }: Props = $props();
+
+  const options = $derived(getChoiceOptions(field));
+  const off = $derived(disabled || !!field.readOnly);
+</script>
+
+<!-- A dropdown (or segmented buttons with `control: 'segmented'`) for `choice` fields. -->
+{#if field.control === 'segmented'}
+  <div role="radiogroup" aria-label={parameterLabel(field)} class="inline-flex flex-wrap rounded-md border border-input bg-muted p-0.5">
+    {#each options as o (o.value)}
+      <button
+        type="button"
+        role="radio"
+        aria-checked={o.value === value}
+        title={o.description}
+        disabled={off}
+        onclick={() => onchange(o.value)}
+        class="rounded px-2 py-0.5 text-xs disabled:opacity-50 {o.value === value
+          ? 'bg-background text-foreground shadow-sm'
+          : 'text-muted-foreground hover:text-foreground'}"
+      >
+        {choiceOptionLabel(o)}
+      </button>
+    {/each}
+  </div>
+{:else}
+  <select
+    {id}
+    aria-label={parameterLabel(field)}
+    value={String(options.findIndex((o) => o.value === value))}
+    disabled={off}
+    class={parameterInputClass}
+    onchange={(e) => {
+      const option = options[Number(e.currentTarget.value)];
+      if (option) onchange(option.value);
+    }}
+  >
+    {#each options as o, i (o.value)}
+      <option value={String(i)} title={o.description}>{choiceOptionLabel(o)}</option>
+    {/each}
+  </select>
+{/if}

package/dist/parameters/ParameterSelect.svelte.d.ts

@@ -0,0 +1,12 @@
+import { type ChoiceParameterField } from '@pixerate/editor/parameters';
+interface Props {
+    field: ChoiceParameterField;
+    value: string | number;
+    onchange: (value: string | number) => void;
+    disabled?: boolean;
+    id?: string;
+}
+declare const ParameterSelect: import("svelte").Component<Props, {}, "">;
+type ParameterSelect = ReturnType<typeof ParameterSelect>;
+export default ParameterSelect;
+//# sourceMappingURL=ParameterSelect.svelte.d.ts.map

package/dist/parameters/ParameterSelect.svelte.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ParameterSelect.svelte.d.ts","sourceRoot":"","sources":["../../src/parameters/ParameterSelect.svelte.ts"],"names":[],"mappings":"AAGA,OAAO,EAAuD,KAAK,oBAAoB,EAAE,MAAM,6BAA6B,CAAC;AAI3H,UAAU,KAAK;IACb,KAAK,EAAE,oBAAoB,CAAC;IAC5B,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,KAAK,IAAI,CAAC;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAoCH,QAAA,MAAM,eAAe,2CAAwC,CAAC;AAC9D,KAAK,eAAe,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC;AAC1D,eAAe,eAAe,CAAC"}