# 폼 플러그인

`@tailwindcss/forms`은 공식 폼 플러그인을 1:1로 PHP 포팅한 것입니다. 텍스트 입력란, 텍스트 영역, 선택 메뉴, 체크박스, 라디오 버튼 등 폼 컨트롤을 일관된 기준 상태로 만드는 의견이 반영된 초기화 기능을 제공합니다. 모양 초기화, 테두리, 패딩, 포커스 링, 사용자 정의 선택 화살표, 체크박스 및 라디오 버튼 아이콘을 적용한 뒤 유틸리티로 재정의할 수 있습니다.

## 사용법

`@plugin`으로 플러그인을 불러오고 유틸리티 레이어를 가져오세요:

```php
use TailwindPHP\tw;

$css = tw::generate(
    '<input class="form-input"><select class="form-select"></select>',
    '@plugin "@tailwindcss/forms"; @import "tailwindcss/utilities.css";'
);
```

## 전략

`strategy` 옵션은 스타일 적용 방식을 제어합니다:

| 전략 | 동작 |
|----------|----------|
| `base` | `[type='text']`, `textarea`, `select` 같은 선택자를 사용해 네이티브 폼 요소에 전역으로 스타일을 적용합니다. |
| `class` | 명시적으로 지정된 `form-*` 클래스에만 스타일을 적용하고 클래스가 없는 요소는 그대로 둡니다. |

`strategy`을 생략하면 두 전략을 모두 적용합니다. 네이티브 요소에는 기준 초기화가 적용되고 `form-*` 클래스도 사용할 수 있습니다. 다른 전략을 제외하려면 하나만 설정하세요:

```css
@plugin "@tailwindcss/forms" {
    strategy: "class";
}
```

## 클래스 전략

`class` 전략(또는 기본값)을 사용할 때는 스타일을 적용할 요소에 다음 클래스를 명시적으로 지정하세요:

| 클래스 | 요소 |
|-------|---------|
| `form-input` | 텍스트형 입력 요소 |
| `form-textarea` | `<textarea>` |
| `form-select` | `<select>` |
| `form-multiselect` | `<select multiple>` |
| `form-checkbox` | `<input type="checkbox">` |
| `form-radio` | `<input type="radio">` |

```php
$css = tw::generate(
    '
        <input class="form-input">
        <textarea class="form-textarea"></textarea>
        <select class="form-select"></select>
        <select class="form-multiselect" multiple></select>
        <input type="checkbox" class="form-checkbox">
        <input type="radio" class="form-radio">
    ',
    '
        @plugin "@tailwindcss/forms" {
            strategy: "class";
        }
        @import "tailwindcss/utilities.css";
    '
);
```

각 클래스는 컨트롤의 기본 모양을 초기화하고 테두리, 패딩, 포커스 링을 설정합니다. `form-select`은 배경에 화살표 이미지를 추가하고, `form-checkbox`/`form-radio`는 선택 상태 아이콘을 추가합니다. 일반 유틸리티(예: `class="form-input rounded-lg border-gray-300"`)로 원하는 항목을 재정의할 수 있습니다.

`@plugin` 지시문과 로드 방법은 [플러그인](https://tailwindphp.inline0.dev/ko/docs/plugins)을 참조하세요.