Examples

Read-only inspector

Lock built-in mutating controls while keeping values reachable and copyable.

Read-only behavior

readOnly disables built-in mutation paths in the inspector. Host-owned custom inspector content should apply the same non-mutating rule.

tsx

import "@aigentive/wire-react/styles.css";
import { WireInspector, WireProvider, WireViewer } from "@aigentive/wire-react";

export function ReadOnlyInspector({ diagram, optionCatalog }) {
  return (
    <WireProvider diagram={diagram} history={false}>
      <WireViewer diagram={diagram} fitView />
      <WireInspector
        nodeId="qualify"
        optionCatalog={optionCatalog}
        readOnly
      />
    </WireProvider>
  );
}