# Vtičnik za obrazce

`@tailwindcss/forms` je 1:1 PHP prenos uradnega vtičnika za obrazce. Določa začetne sloge za kontrolnike obrazcev — besedilna vnosna polja, večvrstična besedilna polja, izbirna polja, potrditvena polja in izbirne gumbe — ter jih poenoti (ponastavi videz, obrobe, notranji odmik, obrobo fokusa, puščico po meri za izbirna polja ter ikoni za potrditvena polja in izbirne gumbe), nato pa jih lahko preglasite s pripomočki.

## Uporaba

Naložite vtičnik z `@plugin` in uvozite plast pripomočkov:

```php
use TailwindPHP\tw;

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

## Strategija

Z možnostjo `strategy` določite, kako se uporabijo slogi:

| Strategija | Delovanje |
|----------|----------|
| `base` | Izvorne elemente obrazcev oblikuje globalno s selektorji, kot so `[type='text']`, `textarea` in `select`. |
| `class` | Oblikuje samo izrecno navedene razrede `form-*`, elementi brez razreda pa ostanejo nedotaknjeni. |

Če možnost `strategy` izpustite, se uporabita **obe** strategiji — izvorni elementi dobijo osnovne sloge, na voljo pa so tudi razredi `form-*`. Če želite izključiti drugo strategijo, nastavite samo eno:

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

## Strategija razredov

Pri strategiji `class` (ali privzeti strategiji) te razrede izrecno dodajte elementom, ki jih želite oblikovati:

| Razred | Element |
|-------|---------|
| `form-input` | Besedilna vnosna polja |
| `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";
    '
);
```

Vsak razred ponastavi videz kontrolnika ter nastavi obrobe, notranji odmik in obrobo fokusa; `form-select` doda sliko ozadja s puščico, `form-checkbox`/`form-radio` pa ikoni za označeno stanje. Vse to lahko preglasite z običajnimi pripomočki (na primer `class="form-input rounded-lg border-gray-300"`).

Direktivo `@plugin` in navodila za nalaganje najdete v razdelku [Vtičniki](https://tailwindphp.inline0.dev/sl/docs/plugins).