euedujbarrios-uiby edujbarrios
Back to components

Inputs

Prompt Version Select

A styled select control for pinning prompt versions in AI release workflows.

promptversionselect

Installation

Copy and paste the code into your project.

Accessibility notes

The select is wrapped by a visible label so the control has a clear name.

Preview accent

TypeScript
const versions = ["v3.2 production", "v3.1 stable", "v2.9 fallback"];

export function PromptVersionSelect() {
  return (
    <label className="grid w-full max-w-sm gap-2 rounded-lg border border-white/12 bg-[#0b0f14]/82 p-4 shadow-2xl">
      <span className="text-xs font-semibold uppercase tracking-[0.18em] text-[#40E0D0]">Prompt version</span>
      <select className="rounded-md border border-[#40E0D0]/24 bg-white/[0.05] px-3 py-2.5 text-sm font-semibold text-white outline-none transition focus:border-[#40E0D0]/60">
        {versions.map((version) => (
          <option key={version}>{version}</option>
        ))}
      </select>
      <span className="text-xs text-slate-400">Pinned for deterministic release reviews</span>
    </label>
  );
}
Usage
<PromptVersionSelect />

Related components

Inputs

AI Chat Input

Intermediate

A responsive prompt composer with textarea, label, and high-contrast send button.

aichatform
View component
Prompt tuned

Badges

Prompt Badge

Beginner

A small status badge for prompt state, tuning, review, or evaluation labels.

promptstatusbadge
View component

Inputs

Neural Search Input

Beginner

A rounded search field for command palettes, component galleries, and prompt libraries.

searchcommandinput
View component