Revel
GitHub
GitHub
  • Overview

    • Getting started
    • FAQ
    • Release notes
  • Foundations

    • Meet the standard
    • Accessibility
    • Internationalization
    • Information hierarchy
    • Speed
  • Design

    • Visual principles
    • Colors
    • Space
    • Icons
    • Typography
  • Design tokens
  • Style helpers
  • Content

    • Express your ideas
    • Actionable language
    • Inclusive and accessible language
    • Alternative text
    • Grammar and mechanics
      • Basics
      • Capitalization
      • Dates and units of measurement
      • Punctuation
  • Components

    • Alert
    • Avatar
    • Badge
    • Button
    • Button group
    • Checkbox
    • Date Input
      • dates
      • datetimes
      • ranges
    • Field group
    • File upload
    • Flex
    • Grid
    • Icon
    • Image
    • Input
    • Loader
    • Modal
    • Month picker
    • Pagination
    • Popper
    • Radio
    • Repeater
    • Select
    • Tabs
    • Tile
    • Toast
    • Toggle
  • Directives

    • Click outside
    • Tooltip

Month Picker

The Month Picker component helps the user select months by using simple date inputs with an intuitive interface.

Usage

  import { RMonthPicker } from '@rebilly/revel';

  <r-month-picker v-model="month"/>

Examples

month-picker-simple.vue

API

Props

NameTypeDefaultDescription
labelstring''

Label for the month picker

captionstring''

Help text for the month picker

modelValueMonth

Selected month and year

clearablebooleanfalse

Defines if month picker is clearable

placeholderstring'Select month'

Placeholder of the input if no month is selected

positionPosition'bottomEnd'

Position of popover control

minValueMonthundefined

Minimum month and year

maxValueMonthundefined

Maximum month and year

Events

NameDescription
clearThe month picker is clear
month-changeThe month selected
update:modelValueThe model value updated
year-changeThe year is changed
Edit this page
Last Updated: 8/12/24, 11:25 AM
Contributors: Dasha Baklanova, John Hannagan, Weetbix, Alabi Olasunkanmi, Cesar Level, mehicalen
Prev
Modal
Next
Pagination