package.json 12.1 KB
{
  "name": "@bootstrap-vue/calendar",
  "version": "1.0.0",
  "meta": {
    "title": "Calendar",
    "slug": "calendar",
    "version": "2.5.0",
    "description": "BootstrapVue custom calendar widget for selecting dates and controlling other components, fully WAI-ARIA accessible (a11y) and supports internationalization (i18n).",
    "components": [
      {
        "component": "BCalendar",
        "version": "2.5.0",
        "props": [
          {
            "prop": "block",
            "description": "Makes the calendar full width"
          },
          {
            "prop": "dateDisabledFn",
            "description": "Set to a function reference which returns `true` if the date is disabled, or `false` if the date should be enabled. See documentation for details"
          },
          {
            "prop": "dateFormatOptions",
            "version": "2.6.0",
            "description": "Format object for displayed text string that is passed to `Intl.DateTimeFormat`"
          },
          {
            "prop": "dateInfoFn",
            "description": "Set to a function reference which returns a class (string), or classes (array of strings) to apply to the date cell. See documentation for details"
          },
          {
            "prop": "direction",
            "description": "Set to the string 'rtl' or 'ltr' to explicitly force the calendar to render in right-to-left or left-ro-right (respectively) mode. Defaults to the resolved locale's directionality"
          },
          {
            "prop": "disabled",
            "description": "Places the calendar in a non-interactive disabled state"
          },
          {
            "prop": "headerTag",
            "version": "2.22.0",
            "description": "Specify the HTML tag to render instead of the default tag for the footer"
          },
          {
            "prop": "hidden",
            "description": "When `true`, renders a comment node instead of the calendar widget while keeping the Vue instance active. Mainly used when implementing a custom date picker"
          },
          {
            "prop": "hideHeader",
            "description": "When `true`, visually hides the selected date header"
          },
          {
            "prop": "initialDate",
            "version": "2.7.0",
            "description": "When a `value` is not specified, sets the initial calendar month date that will be presented to the user. Accepts a value in `YYYY-MM-DD` format or a `Date` object. Defaults to the current date (or min or max if the current date is out of range)"
          },
          {
            "prop": "labelCalendar",
            "description": "Value of the `aria-label` and `role-description` attributes applied to the calendar grid"
          },
          {
            "prop": "labelCurrentMonth",
            "description": "Value of the `aria-label` and `title` attributes on the `Current Month` navigation button"
          },
          {
            "prop": "labelHelp",
            "description": "Help text that appears at the bottom of the calendar grid"
          },
          {
            "prop": "labelNav",
            "description": "Value of the `aria-label` attribute on to the calendar navigation button wrapper"
          },
          {
            "prop": "labelNextDecade",
            "version": "2.11.0",
            "description": "Value of the `aria-label` and `title` attributes on the optional `Next Decade` navigation button"
          },
          {
            "prop": "labelNextMonth",
            "description": "Value of the `aria-label` and `title` attributes on the `Next Month` navigation button"
          },
          {
            "prop": "labelNextYear",
            "description": "Value of the `aria-label` and `title` attributes on the `Next Year` navigation button"
          },
          {
            "prop": "labelNoDateSelected",
            "description": "Label to use when no date is currently selected"
          },
          {
            "prop": "labelPrevDecade",
            "version": "2.11.0",
            "description": "Value of the `aria-label` and `title` attributes on the optional `Previous Decade` navigation button"
          },
          {
            "prop": "labelPrevMonth",
            "description": "Value of the `aria-label` and `title` attributes on the `Previous Month` navigation button"
          },
          {
            "prop": "labelPrevYear",
            "description": "Value of the `aria-label` and `title` attributes on the `Previous Year` navigation button"
          },
          {
            "prop": "labelSelected",
            "description": "Value of the `aria-label` attribute set on the calendar grid date button that is selected"
          },
          {
            "prop": "labelToday",
            "description": "Value of the `aria-label` attribute for the calendar grid date button to signify that the date is today's date"
          },
          {
            "prop": "locale",
            "description": "Locale (or locales) for the calendar to use. When passing an array of locales, the order of the locales is from most preferred to least preferred"
          },
          {
            "prop": "max",
            "description": "The maximum date the calendar will show"
          },
          {
            "prop": "min",
            "description": "The minimum date the calendar will show"
          },
          {
            "prop": "navButtonVariant",
            "version": "2.17.0",
            "description": "Theme color variant to use for the navigation buttons"
          },
          {
            "prop": "noHighlightToday",
            "description": "Disabled the highlighting of todays date in the calendar"
          },
          {
            "prop": "noKeyNav",
            "description": "Disable keyboard navigation of the calendar components"
          },
          {
            "prop": "readonly",
            "description": "Places the calendar in an interactive readonly state. Disables updating the v-model, while still allowing date navigation"
          },
          {
            "prop": "roleDescription",
            "description": "Sets a value for the `role-description` attribute on the component"
          },
          {
            "prop": "selectedVariant",
            "description": "Theme color variant to use for the selected date button"
          },
          {
            "prop": "showDecadeNav",
            "version": "2.11.0",
            "description": "When `true`, shows the +/- decade navigation buttons"
          },
          {
            "prop": "startWeekday",
            "description": "Day of week to start the calendar. `0` for Sunday, `1` for Monday, `6` for Saturday, etc"
          },
          {
            "prop": "todayVariant",
            "description": "Theme color variant to use for highlighting todays date button. Defaults to the `selectedVariant` prop"
          },
          {
            "prop": "value",
            "description": "Initially selected date value. Accepts either a `YYYY-MM-DD` string or a `Date` object"
          },
          {
            "prop": "valueAsDate",
            "description": "Returns a `Date` object for the v-model instead of a `YYYY-MM-DD` string"
          },
          {
            "prop": "weekdayHeaderFormat",
            "version": "2.12.0",
            "description": "Format to use for the calendar weekday headings. Possible values are `long`, `short` (default), or `narrow`"
          },
          {
            "prop": "width",
            "description": "The width of the calendar. Has no effect if prop `block` is set"
          }
        ],
        "events": [
          {
            "event": "context",
            "description": "Emitted when when the user changes the active date via date navigation buttons or cursor control",
            "args": [
              {
                "arg": "context",
                "description": "The context object. See documentaion for details",
                "type": [
                  "Object"
                ]
              }
            ]
          },
          {
            "event": "input",
            "description": "Emitted when updating the v-model",
            "args": [
              {
                "arg": "date",
                "description": "Either a string in the format of `YYYY-MM-DD` or a `Date` object (if `value-as-date` prop is `true`)",
                "type": [
                  "String",
                  "Date"
                ]
              }
            ]
          },
          {
            "event": "selected",
            "description": "Emitted when user has selected (clicked) a date. Note this event will also be emitted if the user clicks on the currently selected date",
            "args": [
              {
                "arg": "ymd",
                "description": "The selected date as a string in the format of `YYYY-MM-DD`",
                "type": "String"
              },
              {
                "arg": "date",
                "description": "The selected date as a `Date` object",
                "type": "Date"
              }
            ]
          }
        ],
        "slots": [
          {
            "name": "default",
            "description": "Used to place custom controls at the bottom of the calendar component"
          },
          {
            "name": "nav-next-decade",
            "version": "2.12.0",
            "description": "Used to place custom content in the next decade navigation button",
            "scope": [
              {
                "prop": "isRTL",
                "type": "Boolean",
                "description": "Will be `true` if the date navigation bar is rendered right to left"
              }
            ]
          },
          {
            "name": "nav-next-month",
            "version": "2.12.0",
            "description": "Used to place custom content in the next month navigation button",
            "scope": [
              {
                "prop": "isRTL",
                "type": "Boolean",
                "description": "Will be `true` if the date navigation bar is rendered right to left"
              }
            ]
          },
          {
            "name": "nav-next-year",
            "version": "2.12.0",
            "description": "Used to place custom content in the next year navigation button",
            "scope": [
              {
                "prop": "isRTL",
                "type": "Boolean",
                "description": "Will be `true` if the date navigation bar is rendered right to left"
              }
            ]
          },
          {
            "name": "nav-prev-decade",
            "version": "2.12.0",
            "description": "Used to place custom content in the previous decade navigation button",
            "scope": [
              {
                "prop": "isRTL",
                "type": "Boolean",
                "description": "Will be `true` if the nav bar is rendered right to left"
              }
            ]
          },
          {
            "name": "nav-prev-month",
            "version": "2.12.0",
            "description": "Used to place custom content in the previous month navigation button",
            "scope": [
              {
                "prop": "isRTL",
                "type": "Boolean",
                "description": "Will be `true` if the date navigation bar is rendered right to left"
              }
            ]
          },
          {
            "name": "nav-prev-year",
            "version": "2.12.0",
            "description": "Used to place custom content in the previous year navigation button",
            "scope": [
              {
                "prop": "isRTL",
                "type": "Boolean",
                "description": "Will be `true` if the date navigation bar is rendered right to left"
              }
            ]
          },
          {
            "name": "nav-this-month",
            "version": "2.12.0",
            "description": "Used to place custom content in the this month/day navigation button",
            "scope": [
              {
                "prop": "isRTL",
                "type": "Boolean",
                "description": "Will be `true` if the date navigation bar is rendered right to left"
              }
            ]
          }
        ]
      }
    ]
  }
}