FE-1637: Show read-only property values as text instead of disabled inputs

[kube]

Summary

Before this PR, a read-only net still rendered every property value in the control that edits it, greyed out. A name arrived as a disabled text box, a description as a disabled textarea, and the field labels dimmed along with them, so the values a reader came for were the lowest-contrast text on the panel. Two fields in the arc panel already sidestepped this and printed their value as text.

The properties panel now renders read-only values the way those two arc fields do: the value as text, at full contrast, under a label that no longer greys out. This reaches the embedded Preview, the website's full example view, and the editor whenever the net is read-only, which includes Simulate mode and any live simulation.

Links

• Ticket FE-1637
• Docs Embedded Preview

Changes

Shared

• New PropertyValue, wrapping one field's editing control

  Renders its children on an editable net and the value as text on a read-only one, reading the same useIsReadOnly every panel already consults.
  A missing or blank value renders a caller-chosen stand-in, defaulting to "None".

• DraftFieldInput and the description field render through it

  That covers the name and description of transitions, types, parameters, differential equations, places, and component instances in one place.

• Read-only labels keep full contrast

  Form.Field no longer receives disabled when the only reason was the net being read-only. A read-only field is not a disabled one.

Panels

• Place name, accepted token type, arc type, arc weight, differential-equation type, and component-instance name read as text

  Arc type labels now come from one map shared with the select's options, so the two cannot name a type differently.

• Toggles and checkboxes are unchanged

  A checkbox already shows its value by being ticked, so it reads correctly without a text form.

Known issues

• Complex editors keep their controls on a read-only net

  The type-element list, the initial-state grid, and the arc tables are structures rather than single values, and each needs its own read-only presentation.

Test coverage

• property-value.test.tsx:

  Control on an editable net, text on a read-only one, and the stand-in for undefined, null, and blank values.

• Existing @hashintel/petrinaut unit suite
• Verified in the running embed:

  Selecting a place leaves no text input in the panel, and name, description, and token type render as text.

How to test

• Open SIR embed on Vercel
• Select the Infected place

  Expect name and description as text, labels at full contrast, no input boxes

• Select an arc

  Expect Type and Weight as text

• Open SIR full view and select a transition

  Expect name and description as text

• Switch to Simulate in the full view and select a place

  Expect the same text presentation, since the net is read-only there

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
hash	Ready	Preview	Sep 11, 2026 1:15am UTC
petrinaut	Ready	Preview	Sep 11, 2026 1:15am UTC
petrinaut-docs	Ready	Preview	Sep 11, 2026 1:15am UTC

1 Skipped Deployment

Project	Deployment	Actions	Updated
hashdotdesign-tokens	Ignored	Preview	Sep 11, 2026 1:15am UTC

[cursor]

PR Summary

Low Risk
Presentation-only UI in the properties panel and shared form helpers; no changes to model mutation, auth, or simulation logic.

Overview
Read-only nets (preview embeds, Simulate mode, live simulation) now show scalar property values as plain text instead of greyed-out disabled inputs, with labels at full contrast.

A new PropertyValue wrapper uses useIsReadOnly to render either the child editor or styled text (with configurable empty placeholders). DraftFieldInput and DescriptionField route names and descriptions through it; read-only mode no longer marks Form.Field as disabled or surfaces draft validation errors beside canonical values.

Properties panels for places, arcs (type/weight, shared type labels), differential equations (associated type), and component instances (name) adopt the same pattern. Toggles, checkboxes, and list-style editors are unchanged. Preview docs and a patch changeset describe the behavior; property-value.test.tsx covers editable vs read-only and empty values.

^{Reviewed by Cursor Bugbot for commit ffdea8a. Bugbot is set up for automated code reviews on this repo. Configure here.}

[Copilot]

🟡 Changes recommended

Several simple fields remain disabled controls, and read-only transitions introduce whitespace, validation, and textarea-sizing regressions.

Once you've addressed the issues Copilot identified, you can request another Copilot review.

Pull request overview

Updates Petrinaut’s properties panel to present read-only values as text rather than disabled controls.

Changes:

• Adds a shared PropertyValue component and tests.
• Applies text rendering to names, descriptions, selected types, and arc properties.
• Updates preview documentation and package changeset.

File summaries

File	Description
.changeset/readonly-property-values-as-text.md	Records the user-facing change.
libs/@hashintel/petrinaut/docs/preview.md	Documents read-only value presentation.
.../components/property-value.tsx	Adds editable/read-only rendering.
.../components/property-value.test.tsx	Tests rendering modes and empty values.
.../components/draft-field-input.tsx	Uses text rendering for draft fields.
.../components/description-field.tsx	Uses text rendering for descriptions.
.../place-properties/subviews/main.tsx	Updates place name and token type.
.../differential-equation-properties/subviews/main.tsx	Updates associated type display.
.../component-instance-properties/subviews/main.tsx	Updates instance name display.
.../arc-properties/main.tsx	Updates arc type and weight display.

Review details

• Files reviewed: 10/10 changed files
• Comments generated: 4
• Review effort level: Balanced

---

💡 Configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

[cursor]

Cursor Bugbot has reviewed your changes and found 1 potential issue.

^{❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.}

^{Reviewed by Cursor Bugbot for commit b6c687f. Configure here.}

[kube]

All four addressed in 20b84dbf08.

Description height after editing resumes (also raised by Bugbot): real. The sizing useLayoutEffect keyed on sourceId alone, and the textarea is now unmounted while the net is read-only, so returning to Edit with the same item selected remounted it unmeasured. isReadOnly joins the dependencies.

Stale draft error beside the canonical value: real, and it reached three places. DraftFieldInput now passes errors only while editable, and the place and component-instance panels hide their own error nodes the same way. The draft itself is untouched, so the error returns with it.

trim() eating authored whitespace: right, and it defeated the point of pre-wrap. The trim now only decides whether the value is blank; the text renders as authored.

Docs broader than the behaviour: correct. The sentence in preview.md and the changeset now name what is converted -- names, descriptions, and the single-value fields -- and say the remaining controls stay as controls.