@@ -20,6 +20,7 @@ import {

} from '../../utils/date'

import { requestAF } from '../../utils/dom'

import { isArray, isFunction, isPlainObject, isString } from '../../utils/inspect'

import { isLocaleRTL } from '../../utils/locale'

import { toInteger } from '../../utils/number'

import { toString } from '../../utils/string'

import idMixin from '../../mixins/id'

@@ -34,37 +35,6 @@ const NAME = 'BCalendar'

// Key Codes

const { UP, DOWN, LEFT, RIGHT, PAGEUP, PAGEDOWN, HOME, END, ENTER, SPACE } = KeyCodes

// Languages that are RTL

const RTL_LANGS = [

'ar',

'az',

'ckb',

'fa',

'he',

'ks',

'lrc',

'mzn',

'ps',

'sd',

'te',

'ug',

'ur',

'yi'

].map(locale => locale.toLowerCase())

// --- Helper utilities ---

export const isLocaleRTL = locale => {

// Determines if the locale is RTL (only single locale supported)

const parts = toString(locale)

.toLowerCase()

.replace(/-u-.+/, '')

.split('-')

const locale1 = parts.slice(0, 2).join('-')

const locale2 = parts[0]

return arrayIncludes(RTL_LANGS, locale1) || arrayIncludes(RTL_LANGS, locale2)

}

// --- BCalendar component ---

// @vue/component

@@ -667,7 +637,6 @@ export const BCalendar = Vue.extend({

},

onClickDay(day) {

// Clicking on a date "button" to select it

// TODO: Change to lookup the `data-data` attribute

const selectedDate = this.selectedDate

const activeDate = this.activeDate

const clickedDate = parseYMD(day.ymd)

@@ -702,6 +671,12 @@ export const BCalendar = Vue.extend({

},

gotoNextYear() {

this.activeYMD = formatYMD(this.constrainDate(oneYearAhead(this.activeDate)))

},

onHeaderClick() {

if (!this.disabled) {

this.activeYMD = this.selectedYMD || formatYMD(this.getToday())

this.focus()

}

}

},

render(h) {

@@ -719,8 +694,9 @@ export const BCalendar = Vue.extend({

// Flag for making the `aria-live` regions live

const isLive = this.isLive

// Pre-compute some IDs

const idWidget = safeId()

const idValue = safeId('_calendar-value_')

// Thes should be computed props

const idValue = safeId()

const idWidget = safeId('_calendar-wrapper_')

const idNav = safeId('_calendar-nav_')

const idGrid = safeId('_calendar-grid_')

const idGridCaption = safeId('_calendar-grid-caption_')

@@ -737,13 +713,20 @@ export const BCalendar = Vue.extend({

id: idValue,

for: idGrid,

role: 'status',

tabindex: this.disabled ? null : '-1',

// Mainly for testing purposes, as we do not know

// the exact format `Intl` will format the date string

'data-selected': toString(selectedYMD),

// We wait until after mount to enable `aria-live`

// to prevent initial announcement on page render

'aria-live': isLive ? 'polite' : 'off',

'aria-atomic': isLive ? 'true' : null

},

on: {

// Transfer focus/click to focus grid

// and focus active date (or today if no selection)

click: this.onHeaderClick,

focus: this.onHeaderClick

}

},

this.selectedDate