Skip to Content
Welcome to DayFlow 🎉

View Switcher Modes

The switcherMode option controls how the header view switcher is rendered. The library ships with two modes tailored for different layouts:

  • buttons – the default desktop friendly layout with a centered button group.
  • select – condenses the switcher into a dropdown for mobile or compact toolbars.

Use the interactive sample below to compare both modes with identical data and configuration.

January 2026

Mon
Tue
Wed
Thu
Fri
Sat
Sun

January 2026

Mon
Tue
Wed
Thu
Fri
Sat
Sun

Quick Start

import { useCalendarApp, DayFlowCalendar, createMonthView, } from '@dayflow/core'; const calendar = useCalendarApp({ views: [createMonthView()], switcherMode: 'select', // default switcherMode: 'buttons' }); <DayFlowCalendar calendar={calendar} />;

Flip switcherMode between 'buttons' and 'select' to preview the alternate experiences instantly.