
# إضافة النماذج

`@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/ar/docs/plugins) لمعرفة توجيه `@plugin` وتفاصيل التحميل.
