R◈roma Resource-first framework
Documentation / Components · Studio

Studio ReferencePicker

Canonical ROM reference normalization around the shared picker.

ROM 0.1.0 · SOURCE CANDIDATE Markdown

Select a ROM Resource reference with canonical ROM ID normalization.

Public import

ts
import { ReferencePicker } from "rom-studio/ui/components";

Studio and shared UI

Studio wraps the ROM UI picker and supplies canonical reference normalization. The host supplies an authorized lookup, an authority token and change callbacks. Unlike the shared ROM UI component, the Studio wrapper does not require a normalizeId prop.

Wrapper contract

The following source comes from the captured Studio 0.1.0 candidate.

svelte
<script lang="ts">
  import { ReferencePicker as SharedReferencePicker } from "rom-ui/ui/components";
  import type { ReferencePickerMessages } from "rom-ui/ui/components";
  import type { ReferenceLookup } from "./reference-lookup.ts";
  import type { WireValue } from "../../client/types.ts";
  import { normalizeValue } from "../../client/codec.ts";
  let { kind, lookup, authorityToken, messages = {}, value, label, path = label,
    onchange, onerror = () => {}, readonly = false, showLabel = true,
  }: { kind: string; lookup?: ReferenceLookup; authorityToken: unknown;
    messages?: Partial<ReferencePickerMessages>; value: WireValue; label: string;
    path?: string; onchange: (value: WireValue) => void;
    onerror?: (message: string) => void; readonly?: boolean; showLabel?: boolean;
  } = $props();
  function normalizeId(text: string, referenceKind: string, fieldPath: string): string {
    const normalized = normalizeValue({ type: "reference", value: { kind: referenceKind } }, text, fieldPath);
    if (typeof normalized !== "string") throw TypeError("Invalid reference ID.");
    return normalized;
  }
  function change(next: unknown) {
    if (typeof next !== "string") throw TypeError("Invalid reference ID.");
    onchange(next);
  }
</script>
<SharedReferencePicker {kind} {normalizeId} {lookup} {authorityToken} {messages}
  {value} {label} {path} onchange={change} {onerror} {readonly} {showLabel} />

See the shared picker for presentation behavior.

This page follows the captured repository source.View the source