Icon Picker

کامپوننت x-icon-picker یک ورودی انتخاب آیکن برای فرم‌ها است که به کاربر اجازه می‌دهد از میان مجموعه‌ای از آیکن‌ها (مثلاً FontAwesome) یک آیکن را انتخاب کند. این کامپوننت امکاناتی مانند پیشوند و پسوند، قابلیت پاک‌کردن مقدار، پیام راهنما، پیام خطا، غیرفعال‌سازی، شخصی‌سازی کلاس‌ها و ... را ارائه می‌دهد.

---

ویژگی‌ها

• انتخاب آیکن از میان مجموعه آیکن‌ها با جستجو و پیش‌نمایش
• امکان تعیین پیشوند (prefix) و پسوند (suffix)
• قابلیت پاک‌کردن مقدار انتخاب‌شده (clearable)
• پشتیبانی از حالت غیرفعال (disabled)
• نمایش پیام راهنما هنگام غیرفعال بودن (disabledTooltip)
• نمایش پیام خطا و پیام‌های سفارشی با استایل‌های مختلف
• امکان شخصی‌سازی کلاس‌های CSS برای خود و کانتینر
• پشتیبانی از پیام راهنما (hint)
• پشتیبانی از لیبل و فضای رزرو لیبل (labelSpaceReserved)
• فقط‌خواندنی بودن ورودی (ورودی به صورت readonly است)
• پشتیبانی از پیام‌های منطقی و سفارشی‌سازی آن‌ها (suppressLogicMessages)

---

ورودی‌های کامپوننت

نام پراپ	نوع داده	مقدار پیش‌فرض	توضیحات
name	string	—	نام فیلد (اجباری)
label	string	null	لیبل اصلی
labelSpaceReserved	bool	false	آیا فضای لیبل حتی بدون مقدار رزرو شود؟
id	string	null	شناسه یکتا برای ورودی
value	string	null	مقدار اولیه (کلاس آیکن انتخاب‌شده)
placeholder	string	' '	placeholder برای ورودی
prefix	string	null	پیشوند
suffix	string	null	پسوند
required	bool	false	اجباری بودن فیلد
disabled	bool	false	غیرفعال بودن ورودی
clearable	bool	true	امکان پاک‌کردن مقدار انتخاب‌شده
messageStyle	string/enum	"message"	استایل نمایش پیام (message, tooltip, ...)
defaultMessageType	string/enum	"info"	نوع پیام پیش‌فرض (info, error, success, ...)
defaultMessage	string	null	پیام پیش‌فرض برای نمایش
suppressLogicMessages	bool	false	عدم نمایش پیام‌های منطقی
class	string	null	کلاس CSS سفارشی برای خود ورودی
containerClass	string	null	کلاس CSS سفارشی برای کانتینر
hint	string	null	پیام راهنما یا توضیح کوتاه
disabledTooltip	string	null	پیام راهنما هنگام غیرفعال بودن ورودی

---

مثال‌ها

نمونه پایه

<x-icon-picker
    label="انتخاب آیکن"
    name="icon-picker"
    placeholder="لطفا آیکن خود را وارد کنید"
    hint="کامپوننت برای انتخاب آیکن از طریق یک جستجوی آسان استفاده می شود."
/>