Use the Compound Components pattern: `<Select>` owns the value and `React.createContext()` shares state, while `<Select.Option>` consumes that Context directly. ```tsx <Select value={value} onChange={setValue}> <Select.Option value="a">A</Select.Option> </Select> ```
Installs into .claude/skills of the current project.
Are you the author of React Component Patterns?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/hoangnguyen0403-react-component-patterns-agent-skills-standard)
Use the Compound Components pattern: `<Select>` owns the value and `React.createContext()` shares state, while `<Select.Option>` consumes that Context directly.
```tsx
<Select value={value} onChange={setValue}>
<Select.Option value="a">A</Select.Option>
</Select>
```
