Skip to content

Wildcard V1: Controls: `RadioButton`, `Checkbox`, `Select`

Warren Gifford requested to merge tr/wildcard-v1-controls into main

Created by: umpox

Wildcard V1 Controls

Apologies for the large-ish PR, these are all closely related so it would be difficult to split them apart without stacking branches.

This PR adds initial base wrappers to core form field components with additional type enforcement. This PR doesn't add or change the existing Bootstrap/redesign styles. The plan for this:

  1. Fully migrate to using these components (and catch any areas where the existing styles aren't suitable).
  2. Refactor styles into CSS module, consider removing Bootstrap dependency if suitable

RadioButton

image

Checkbox

image

Select

image Note: We support both native and custom styles here (only the 'button' select style is custom). This is because we're using both extensively across the app. It should be possible to align this better when we refactor.

Other notable additions

Grid

Related to @5h1rU's RFC, this layout component is something which I've often had to make simple CSS files to replicate. I've used the pattern across multiple stories so it felt useful to add to Wildcard as an initial component.

AccessibleFieldType

This type enforces that consumers build accessible forms by requiring either: a. A valid label and id to associate visual descriptive text with a form field. b. A valid aria-label string to associate hidden descriptive text with a form field.

Closes https://github.com/sourcegraph/sourcegraph/issues/22844 Closes https://github.com/sourcegraph/sourcegraph/issues/22842

Merge request reports

Loading