Segmented control
Switches between views of the same thing. New in MDS: the app had none, so it follows the reference style on Mafold tokens.
Preview
Anatomy
A --mf-fill-2 track, the chosen option lifted onto --mf-card with a hairline. Two sizes: 32px for page controls, 26px inside cards.
Usage
import { SegmentedControl } from "@/components/reference";
<SegmentedControl options={["Weekly", "Monthly", "Yearly"]} onChange={setRange} />