メニュー
Use ShadTimePicker and ShadTimePickerFormField for time selection; trailing widget, period variant. Use when adding time pickers or time form fields in a Flutter shadcn_ui app or ShadForm.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
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.
SOC 職業分類に基づく
| name | shadcn_ui-time-picker |
| description | Use ShadTimePicker and ShadTimePickerFormField for time selection; trailing widget, period variant. Use when adding time pickers or time form fields in a Flutter shadcn_ui app or ShadForm. |
ShadTimePicker is a time picker component. Optional trailing widget (e.g. icon). For forms use ShadTimePickerFormField with label, description, onChanged, and validator. Use ShadTimePickerFormField.period for AM/PM period selection.
const ShadTimePicker(
trailing: Padding(
padding: EdgeInsets.only(left: 8, top: 14),
child: Icon(LucideIcons.clock4),
),
)
ShadTimePickerFormField(
label: const Text('Pick a time'),
onChanged: print,
description: const Text('The time of the day you want to pick'),
validator: (v) => v == null ? 'A time is required' : null,
)
ShadTimePickerFormField.period(
label: const Text('Pick a time'),
onChanged: print,
description: const Text('The time of the day you want to pick'),
validator: (v) => v == null ? 'A time is required' : null,
)