fix(ui-select,ui-text-input): show messages for non-editable selects

[git-nandor]

Problem

A Select sets its TextInput to readonly to hide the keyboard cursor,
but the form field layer hides messages for readonly fields. Non-editable
Selects and SimpleSelects therefore rendered the error border without the message text.

Fix

• TextInput v2 gets an optional forceMessages prop that keeps messages visible in the readonly state; Select v2 sets it where it forces readonly itself.

Test Plan

• Docs app: a SimpleSelect with error message and no onInputChange should show the message text under the input.

<div>
  <TextInput
    renderLabel="TextInput readonly with forceMessages"
    interaction="readonly"
    defaultValue="Alaska"
    messages={[{ type: 'error', text: 'TextInput error message' }]}
    forceMessages
  />
  <SimpleSelect
    renderLabel="SimpleSelect with an error message"
    messages={[{ type: 'error', text: 'SimpleSelect error message' }]}
  >
    <SimpleSelect.Option id="opt-1" value="1">value 1</SimpleSelect.Option>
    <SimpleSelect.Option id="opt-2" value="2">value 2</SimpleSelect.Option>
  </SimpleSelect>

  <Select
    renderLabel="Select with an error message"
    inputValue="Alaska"
    messages={[{ type: 'error', text: 'Select error message' }]}
  >
    <Select.Option id="opt-1">Alaska</Select.Option>
    <Select.Option id="opt-2">Arizona</Select.Option>
  </Select>
</div>

• Visual regression: the select page has a new MessagesExample (Select + SimpleSelect with an error message)

Fixes INSTUI-5172

🤖 Generated with Claude Code

[github-actions]

PR Preview Action v1.8.1
🚀 View preview at https://instructure.design/pr-preview/pr-2707/
Built to branch gh-pages at 2026-09-03 14:57 UTC. Preview will be ready when the GitHub Pages deployment is complete.

[github-actions]

Visual regression report

Cypress suite: ✅ Passing

Visual diff: ⚠️ Changes detected.

Status	Count
Unchanged	93
Changed	3
New	0
Removed	0

Accessibility (axe): ✅ No violations.

📊 View full report — click a screenshot's ⚠ badge to see each violation boxed on the image, with the offending element named and contrast failures shown as color swatches.

Diff images (3)

select-canvas.png — 164272 pixels differ

select-dark.png — 164080 pixels differ

select-light.png — 164019 pixels differ

_{Baselines come from the visual-baselines branch. They refresh on every merge to master. The Cypress suite line covers the a11y and console-error assertions — a ❌ there means the suite found real issues even if the visual diff is clean.}