
# Плагин форм

`@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"`.

См. раздел [Плагины](https://tailwindphp.inline0.dev/ru/docs/plugins), посвященный директиве `@plugin` и загрузке плагинов.
