MonthPicker

<div class="ui-month">
  <button type="button" class="ui-month__trigger field-control" role="combobox"
    aria-haspopup="dialog" aria-expanded="false" aria-labelledby="month-label">
    <span class="ui-icon ui-icon--calendar ui-month__calendar" aria-hidden="true"></span>
    <span class="ui-month__value">Jun 2024</span>
    <span class="ui-icon ui-icon--chevron-down ui-month__chevron" aria-hidden="true"></span>
  </button>
</div>
<!-- Panel: .ui-month__panel[role=dialog] with yearbar + month cells -->

import { MonthPicker } from 'caustica-design/core'
import 'caustica-design/css'

<MonthPicker
  value={month}
  onChange={setMonth}
  placeholder="Choose month"
  panelLabel="Choose month"
  prevYearLabel="Previous year"
  nextYearLabel="Next year"
  aria-labelledby="month-label"
/>