# solid-controlled-input

> A controlled input for solid (porting over the same behavior as in react)

Latest version **4.0.3** (published 2024-08-15) · MIT license · 0 weekly downloads

## Install

```sh
npm install solid-controlled-input
pnpm add solid-controlled-input
yarn add solid-controlled-input
bun add solid-controlled-input
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 4.0.3 |
| Published | 2024-08-15 |
| First published | 2023-11-13 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Tronikelis |
| Maintainers | tronikel |

## Links

- npm: https://www.npmjs.com/package/solid-controlled-input
- Repository: https://github.com/Tronikelis/solid-controlled-input
- Homepage: https://github.com/Tronikelis/solid-controlled-input#readme
- Issues: https://github.com/Tronikelis/solid-controlled-input/issues
- npm.io page: https://npm.io/package/solid-controlled-input

## Dependencies (1)

- [@solid-primitives/refs](https://npm.io/package/@solid-primitives/refs.md) ^1.0.6

## Recent versions

- 4.0.3 (latest) — 2024-08-15
- 4.0.2 — 2024-08-15
- 4.0.1 — 2024-08-11
- 4.0.0 — 2024-01-27
- 3.0.2 — 2024-01-27
- 3.0.1 — 2024-01-27
- 3.0.0 — 2024-01-27
- 2.1.0 — 2023-11-17
- 2.0.0 — 2023-11-17
- 1.0.1 — 2023-11-13
- 1.0.0 — 2023-11-13

## README

<h1 align="center">solid-controlled-input</h1>

<h3 align="center">Porting over react controlled input behavior over to solid</h3>

<br />

<div align="center">

<img src="https://img.shields.io/github/stars/Tronikelis/solid-controlled-input?style=flat-square" />
<img src="https://img.shields.io/bundlephobia/minzip/solid-controlled-input?style=flat-square" />
<img src="https://img.shields.io/npm/v/solid-controlled-input?style=flat-square" />

</div>

<br />

# Shouldn't this be the default behavior?

Well no, if you only have touched react, it actually heavily transforms events and inputs to get its behavior.

For example:

-   React's `onChange` fires on every input, while vanilla js doesn't
-   Vanilla JS does not have "controlled" inputs, you need to make them manually

# How to use

```tsx
import { ControlledInput, ControlledTextarea } from "solid-controlled-input";
```

That's it, use this input like you would use the og `<input />` or `<textarea />`

---
_Source: https://npm.io/package/solid-controlled-input · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._