Time Picker

A time picker component.

Preview

Code

class PrimaryTimePicker extends StatelessWidget {
  const PrimaryTimePicker({super.key});

  @override
  Widget build(BuildContext context) {
    return ConstrainedBox(
      constraints: const BoxConstraints(maxWidth: 600),
      child: const ShadTimePicker(
        trailing: Padding(
          padding: EdgeInsets.only(left: 8, top: 14),
          child: ShadImage.square(LucideIcons.clock4, size: 16),
        ),
      ),
    );
  }
}

Form

Preview

Code

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

Preview

Code

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,
),