Segmented Button

<!-- Single-select (default): clicking a segment selects it and deselects the rest. -->
<mdc-segmented-button-set>
    <mdc-segmented-button>Day</mdc-segmented-button>
    <mdc-segmented-button selected>Week</mdc-segmented-button>
    <mdc-segmented-button>Month</mdc-segmented-button>
</mdc-segmented-button-set>

<!-- Multiselect: any number of segments may be selected at once. -->
<mdc-segmented-button-set multiselect>
    <mdc-segmented-button selected>Bold</mdc-segmented-button>
    <mdc-segmented-button>Italic</mdc-segmented-button>
    <mdc-segmented-button selected>Underline</mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set multiselect>
    <mdc-segmented-button selected>
        <mdc-icon slot="icon" name="format_bold"></mdc-icon>
        Bold
    </mdc-segmented-button>
    <mdc-segmented-button selected>
        <mdc-icon slot="icon" name="format_italic"></mdc-icon>
        Italic
    </mdc-segmented-button>
    <mdc-segmented-button selected>
        <mdc-icon slot="icon" name="format_underlined"></mdc-icon>
        Underline
    </mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set>
    <mdc-segmented-button disabled>Day</mdc-segmented-button>
    <mdc-segmented-button>Week</mdc-segmented-button>
    <mdc-segmented-button>Month</mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set>
    <mdc-segmented-button>Day</mdc-segmented-button>
    <mdc-segmented-button disabled selected>Week</mdc-segmented-button>
    <mdc-segmented-button>Month</mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set>
    <mdc-segmented-button disabled>
        <mdc-icon slot="icon" name="list"></mdc-icon>
        List
    </mdc-segmented-button>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="grid_view"></mdc-icon>
        Grid
    </mdc-segmented-button>
    <mdc-segmented-button disabled>
        <mdc-icon slot="icon" name="table_rows"></mdc-icon>
        Table
    </mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="list"></mdc-icon>
        List
    </mdc-segmented-button>
    <mdc-segmented-button selected>
        <mdc-icon slot="icon" name="grid_view"></mdc-icon>
        Grid
    </mdc-segmented-button>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="table_rows"></mdc-icon>
        Table
    </mdc-segmented-button>
</mdc-segmented-button-set>

<!-- Icon-only segments: when selected, the checkmark is drawn beside the icon. -->
<mdc-segmented-button-set>
    <mdc-segmented-button selected>
        <mdc-icon slot="icon" name="favorite"></mdc-icon>
    </mdc-segmented-button>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="favorite_border"></mdc-icon>
    </mdc-segmented-button>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="favorite"></mdc-icon>
    </mdc-segmented-button>
</mdc-segmented-button-set>

<!-- Icon + label, with the checkmark suppressed. -->
<mdc-segmented-button-set>
    <mdc-segmented-button no-checkmark selected>
        <mdc-icon slot="icon" name="format_bold"></mdc-icon>
        Bold
    </mdc-segmented-button>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="format_italic"></mdc-icon>
        Italic
    </mdc-segmented-button>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="format_underlined"></mdc-icon>
        Underline
    </mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set>
    <mdc-segmented-button selected no-checkmark>Day</mdc-segmented-button>
    <mdc-segmented-button>Week</mdc-segmented-button>
    <mdc-segmented-button>Month</mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set>
    <mdc-segmented-button>Day</mdc-segmented-button>
    <mdc-segmented-button no-checkmark>Week</mdc-segmented-button>
    <mdc-segmented-button selected>Month</mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set multiselect>
    <mdc-segmented-button selected no-checkmark>
        <mdc-icon slot="icon" name="format_bold"></mdc-icon>
        Bold
    </mdc-segmented-button>
    <mdc-segmented-button selected>
        <mdc-icon slot="icon" name="format_italic"></mdc-icon>
        Italic
    </mdc-segmented-button>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="format_underlined"></mdc-icon>
        Underline
    </mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set>
    <mdc-segmented-button>Day</mdc-segmented-button>
    <mdc-segmented-button>Week</mdc-segmented-button>
    <mdc-segmented-button>Month</mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set>
    <mdc-segmented-button>Day</mdc-segmented-button>
    <mdc-segmented-button selected>Week</mdc-segmented-button>
    <mdc-segmented-button>Month</mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set multiselect>
    <mdc-segmented-button selected>Bold</mdc-segmented-button>
    <mdc-segmented-button>Italic</mdc-segmented-button>
    <mdc-segmented-button selected>Underline</mdc-segmented-button>
</mdc-segmented-button-set>

<mdc-segmented-button-set>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="list"></mdc-icon>
        List
    </mdc-segmented-button>
    <mdc-segmented-button selected>
        <mdc-icon slot="icon" name="grid_view"></mdc-icon>
        Grid
    </mdc-segmented-button>
    <mdc-segmented-button>
        <mdc-icon slot="icon" name="table_rows"></mdc-icon>
        Table
    </mdc-segmented-button>
</mdc-segmented-button-set>