菜单
Use ShadTextarea for multi-line text input; placeholder. ShadTextareaFormField for forms with validation. Use when adding multi-line text fields or bio/description inputs in a Flutter shadcn_ui app.
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
基于 SOC 职业分类
Build collapsible accordions with ShadAccordion and ShadAccordionItem; single or multiple open items. Use when adding expandable sections, FAQs, or vertically stacked reveal content in a Flutter shadcn_ui app.
Show callout alerts with ShadAlert and ShadAlert.destructive; icon, title, description. Use when displaying warnings, errors, or important messages in a Flutter shadcn_ui app.
Display user avatars with ShadAvatar; image URL with optional placeholder. Use when showing user profile images or fallback initials in a Flutter shadcn_ui app.
Display badges with ShadBadge; primary, secondary, destructive, outline variants. Use when showing tags, status labels, or count indicators in a Flutter shadcn_ui app.
Build breadcrumb navigation with ShadBreadcrumb, ShadBreadcrumbLink, ShadBreadcrumbDropdown, custom separator. Use when showing navigation path, hierarchy of links, or dropdown breadcrumb in a Flutter shadcn_ui app.
Use Shadcn UI buttons (ShadButton variants: primary, secondary, destructive, outline, ghost, link); leading icon, loading state, gradient and shadow. Use when adding buttons, CTAs, or button-style widgets in a Flutter shadcn_ui app.
| name | shadcn_ui-textarea |
| description | Use ShadTextarea for multi-line text input; placeholder. ShadTextareaFormField for forms with validation. Use when adding multi-line text fields or bio/description inputs in a Flutter shadcn_ui app. |
ShadTextarea displays a multi-line form field or textarea-like component. Use placeholder and optional initialValue. For forms use ShadTextareaFormField with id, label, placeholder, description, and validator.
const ShadTextarea(
placeholder: Text('Type your message here'),
)
ShadTextareaFormField(
id: 'bio',
label: const Text('Bio'),
placeholder: const Text('Tell us a little bit about yourself'),
description: const Text(
'You can @mention other users and organizations.'),
validator: (v) {
if (v.length < 10) return 'Bio must be at least 10 characters.';
return null;
},
)