\n return h(\n 'div',\n {\n style: this.modalOuterStyle,\n attrs: this.computedAttrs,\n key: `modal-outer-${this[COMPONENT_UID_KEY]}`\n },\n [$modal, $backdrop]\n )\n }\n },\n render(h) {\n if (this.static) {\n return this.lazy && this.isHidden ? h() : this.makeModal(h)\n } else {\n return this.isHidden ? h() : h(BVTransporter, [this.makeModal(h)])\n }\n }\n})\n","import { NAME_MODAL } from '../../constants/components'\nimport { EVENT_NAME_SHOW, EVENT_OPTIONS_PASSIVE } from '../../constants/events'\nimport { CODE_ENTER, CODE_SPACE } from '../../constants/key-codes'\nimport { getAttr, hasAttr, isDisabled, matches, select, setAttr } from '../../utils/dom'\nimport { getRootActionEventName, eventOn, eventOff } from '../../utils/events'\nimport { isString } from '../../utils/inspect'\nimport { keys } from '../../utils/object'\n\n// Emitted show event for modal\nconst ROOT_ACTION_EVENT_NAME_SHOW = getRootActionEventName(NAME_MODAL, EVENT_NAME_SHOW)\n\n// Prop name we use to store info on root element\nconst PROPERTY = '__bv_modal_directive__'\n\nconst getTarget = ({ modifiers = {}, arg, value }) => {\n // Try value, then arg, otherwise pick last modifier\n return isString(value) ? value : isString(arg) ? arg : keys(modifiers).reverse()[0]\n}\n\nconst getTriggerElement = el => {\n // If root element is a dropdown-item or nav-item, we\n // need to target the inner link or button instead\n return el && matches(el, '.dropdown-menu > li, li.nav-item') ? select('a, button', el) || el : el\n}\n\nconst setRole = trigger => {\n // Ensure accessibility on non button elements\n if (trigger && trigger.tagName !== 'BUTTON') {\n // Only set a role if the trigger element doesn't have one\n if (!hasAttr(trigger, 'role')) {\n setAttr(trigger, 'role', 'button')\n }\n // Add a tabindex is not a button or link, and tabindex is not provided\n if (trigger.tagName !== 'A' && !hasAttr(trigger, 'tabindex')) {\n setAttr(trigger, 'tabindex', '0')\n }\n }\n}\n\nconst bind = (el, binding, vnode) => {\n const target = getTarget(binding)\n const trigger = getTriggerElement(el)\n if (target && trigger) {\n const handler = event => {\n // `currentTarget` is the element with the listener on it\n const currentTarget = event.currentTarget\n if (!isDisabled(currentTarget)) {\n const type = event.type\n const key = event.keyCode\n // Open modal only if trigger is not disabled\n if (\n type === 'click' ||\n (type === 'keydown' && (key === CODE_ENTER || key === CODE_SPACE))\n ) {\n vnode.context.$root.$emit(ROOT_ACTION_EVENT_NAME_SHOW, target, currentTarget)\n }\n }\n }\n el[PROPERTY] = { handler, target, trigger }\n // If element is not a button, we add `role=\"button\"` for accessibility\n setRole(trigger)\n // Listen for click events\n eventOn(trigger, 'click', handler, EVENT_OPTIONS_PASSIVE)\n if (trigger.tagName !== 'BUTTON' && getAttr(trigger, 'role') === 'button') {\n // If trigger isn't a button but has role button,\n // we also listen for `keydown.space` && `keydown.enter`\n eventOn(trigger, 'keydown', handler, EVENT_OPTIONS_PASSIVE)\n }\n }\n}\n\nconst unbind = el => {\n const oldProp = el[PROPERTY] || {}\n const trigger = oldProp.trigger\n const handler = oldProp.handler\n if (trigger && handler) {\n eventOff(trigger, 'click', handler, EVENT_OPTIONS_PASSIVE)\n eventOff(trigger, 'keydown', handler, EVENT_OPTIONS_PASSIVE)\n eventOff(el, 'click', handler, EVENT_OPTIONS_PASSIVE)\n eventOff(el, 'keydown', handler, EVENT_OPTIONS_PASSIVE)\n }\n delete el[PROPERTY]\n}\n\nconst componentUpdated = (el, binding, vnode) => {\n const oldProp = el[PROPERTY] || {}\n const target = getTarget(binding)\n const trigger = getTriggerElement(el)\n if (target !== oldProp.target || trigger !== oldProp.trigger) {\n // We bind and rebind if the target or trigger changes\n unbind(el, binding, vnode)\n bind(el, binding, vnode)\n }\n // If trigger element is not a button, ensure `role=\"button\"`\n // is still set for accessibility\n setRole(trigger)\n}\n\nconst updated = () => {}\n\n/*\n * Export our directive\n */\nexport const VBModal = {\n inserted: componentUpdated,\n updated,\n componentUpdated,\n unbind\n}\n","// Plugin for adding `$bvModal` property to all Vue instances\nimport { NAME_MODAL, NAME_MSG_BOX } from '../../../constants/components'\nimport {\n EVENT_NAME_HIDDEN,\n EVENT_NAME_HIDE,\n HOOK_EVENT_NAME_BEFORE_DESTROY,\n HOOK_EVENT_NAME_DESTROYED\n} from '../../../constants/events'\nimport { concat } from '../../../utils/array'\nimport { getComponentConfig } from '../../../utils/config'\nimport { requestAF } from '../../../utils/dom'\nimport { getRootActionEventName } from '../../../utils/events'\nimport { isUndefined, isFunction } from '../../../utils/inspect'\nimport {\n assign,\n defineProperties,\n defineProperty,\n hasOwnProperty,\n keys,\n omit,\n readonlyDescriptor\n} from '../../../utils/object'\nimport { pluginFactory } from '../../../utils/plugins'\nimport { warn, warnNotClient, warnNoPromiseSupport } from '../../../utils/warn'\nimport { BModal, props as modalProps } from '../modal'\n\n// --- Constants ---\n\nconst PROP_NAME = '$bvModal'\nconst PROP_NAME_PRIV = '_bv__modal'\n\n// Base modal props that are allowed\n// Some may be ignored or overridden on some message boxes\n// Prop ID is allowed, but really only should be used for testing\n// We need to add it in explicitly as it comes from the `idMixin`\nconst BASE_PROPS = [\n 'id',\n ...keys(omit(modalProps, ['busy', 'lazy', 'noStacking', 'static', 'visible']))\n]\n\n// Fallback event resolver (returns undefined)\nconst defaultResolver = () => {}\n\n// Map prop names to modal slot names\nconst propsToSlots = {\n msgBoxContent: 'default',\n title: 'modal-title',\n okTitle: 'modal-ok',\n cancelTitle: 'modal-cancel'\n}\n\n// --- Helper methods ---\n\n// Method to filter only recognized props that are not undefined\nconst filterOptions = options => {\n return BASE_PROPS.reduce((memo, key) => {\n if (!isUndefined(options[key])) {\n memo[key] = options[key]\n }\n return memo\n }, {})\n}\n\n// Method to install `$bvModal` VM injection\nconst plugin = Vue => {\n // Create a private sub-component that extends BModal\n // which self-destructs after hidden\n // @vue/component\n const BMsgBox = Vue.extend({\n name: NAME_MSG_BOX,\n extends: BModal,\n destroyed() {\n // Make sure we not in document any more\n if (this.$el && this.$el.parentNode) {\n this.$el.parentNode.removeChild(this.$el)\n }\n },\n mounted() {\n // Self destruct handler\n const handleDestroy = () => {\n this.$nextTick(() => {\n // In a `requestAF()` to release control back to application\n requestAF(() => {\n this.$destroy()\n })\n })\n }\n // Self destruct if parent destroyed\n this.$parent.$once(HOOK_EVENT_NAME_DESTROYED, handleDestroy)\n // Self destruct after hidden\n this.$once(EVENT_NAME_HIDDEN, handleDestroy)\n // Self destruct on route change\n /* istanbul ignore if */\n if (this.$router && this.$route) {\n // Destroy ourselves if route changes\n /* istanbul ignore next */\n this.$once(HOOK_EVENT_NAME_BEFORE_DESTROY, this.$watch('$router', handleDestroy))\n }\n // Show the `BMsgBox`\n this.show()\n }\n })\n\n // Method to generate the on-demand modal message box\n // Returns a promise that resolves to a value returned by the resolve\n const asyncMsgBox = ($parent, props, resolver = defaultResolver) => {\n if (warnNotClient(PROP_NAME) || warnNoPromiseSupport(PROP_NAME)) {\n /* istanbul ignore next */\n return\n }\n // Create an instance of `BMsgBox` component\n const msgBox = new BMsgBox({\n // We set parent as the local VM so these modals can emit events on\n // the app `$root`, as needed by things like tooltips and popovers\n // And it helps to ensure `BMsgBox` is destroyed when parent is destroyed\n parent: $parent,\n // Preset the prop values\n propsData: {\n ...filterOptions(getComponentConfig(NAME_MODAL)),\n // Defaults that user can override\n hideHeaderClose: true,\n hideHeader: !(props.title || props.titleHtml),\n // Add in (filtered) user supplied props\n ...omit(props, keys(propsToSlots)),\n // Props that can't be overridden\n lazy: false,\n busy: false,\n visible: false,\n noStacking: false,\n noEnforceFocus: false\n }\n })\n // Convert certain props to scoped slots\n keys(propsToSlots).forEach(prop => {\n if (!isUndefined(props[prop])) {\n // Can be a string, or array of VNodes.\n // Alternatively, user can use HTML version of prop to pass an HTML string.\n msgBox.$slots[propsToSlots[prop]] = concat(props[prop])\n }\n })\n // Return a promise that resolves when hidden, or rejects on destroyed\n return new Promise((resolve, reject) => {\n let resolved = false\n msgBox.$once(HOOK_EVENT_NAME_DESTROYED, () => {\n if (!resolved) {\n /* istanbul ignore next */\n reject(new Error('BootstrapVue MsgBox destroyed before resolve'))\n }\n })\n msgBox.$on(EVENT_NAME_HIDE, bvModalEvent => {\n if (!bvModalEvent.defaultPrevented) {\n const result = resolver(bvModalEvent)\n // If resolver didn't cancel hide, we resolve\n if (!bvModalEvent.defaultPrevented) {\n resolved = true\n resolve(result)\n }\n }\n })\n // Create a mount point (a DIV) and mount the msgBo which will trigger it to show\n const div = document.createElement('div')\n document.body.appendChild(div)\n msgBox.$mount(div)\n })\n }\n\n // Private utility method to open a user defined message box and returns a promise.\n // Not to be used directly by consumers, as this method may change calling syntax\n const makeMsgBox = ($parent, content, options = {}, resolver = null) => {\n if (\n !content ||\n warnNoPromiseSupport(PROP_NAME) ||\n warnNotClient(PROP_NAME) ||\n !isFunction(resolver)\n ) {\n /* istanbul ignore next */\n return\n }\n return asyncMsgBox($parent, { ...filterOptions(options), msgBoxContent: content }, resolver)\n }\n\n // BvModal instance class\n class BvModal {\n constructor(vm) {\n // Assign the new properties to this instance\n assign(this, { _vm: vm, _root: vm.$root })\n // Set these properties as read-only and non-enumerable\n defineProperties(this, {\n _vm: readonlyDescriptor(),\n _root: readonlyDescriptor()\n })\n }\n\n // --- Instance methods ---\n\n // Show modal with the specified ID args are for future use\n show(id, ...args) {\n if (id && this._root) {\n this._root.$emit(getRootActionEventName(NAME_MODAL, 'show'), id, ...args)\n }\n }\n\n // Hide modal with the specified ID args are for future use\n hide(id, ...args) {\n if (id && this._root) {\n this._root.$emit(getRootActionEventName(NAME_MODAL, 'hide'), id, ...args)\n }\n }\n\n // The following methods require Promise support!\n // IE 11 and others do not support Promise natively, so users\n // should have a Polyfill loaded (which they need anyways for IE 11 support)\n\n // Open a message box with OK button only and returns a promise\n msgBoxOk(message, options = {}) {\n // Pick the modal props we support from options\n const props = {\n ...options,\n // Add in overrides and our content prop\n okOnly: true,\n okDisabled: false,\n hideFooter: false,\n msgBoxContent: message\n }\n return makeMsgBox(this._vm, message, props, () => {\n // Always resolve to true for OK\n return true\n })\n }\n\n // Open a message box modal with OK and CANCEL buttons\n // and returns a promise\n msgBoxConfirm(message, options = {}) {\n // Set the modal props we support from options\n const props = {\n ...options,\n // Add in overrides and our content prop\n okOnly: false,\n okDisabled: false,\n cancelDisabled: false,\n hideFooter: false\n }\n return makeMsgBox(this._vm, message, props, bvModalEvent => {\n const trigger = bvModalEvent.trigger\n return trigger === 'ok' ? true : trigger === 'cancel' ? false : null\n })\n }\n }\n\n // Add our instance mixin\n Vue.mixin({\n beforeCreate() {\n // Because we need access to `$root` for `$emits`, and VM for parenting,\n // we have to create a fresh instance of `BvModal` for each VM\n this[PROP_NAME_PRIV] = new BvModal(this)\n }\n })\n\n // Define our read-only `$bvModal` instance property\n // Placed in an if just in case in HMR mode\n if (!hasOwnProperty(Vue.prototype, PROP_NAME)) {\n defineProperty(Vue.prototype, PROP_NAME, {\n get() {\n /* istanbul ignore next */\n if (!this || !this[PROP_NAME_PRIV]) {\n warn(`\"${PROP_NAME}\" must be accessed from a Vue instance \"this\" context.`, NAME_MODAL)\n }\n return this[PROP_NAME_PRIV]\n }\n })\n }\n}\n\nexport const BVModalPlugin = /*#__PURE__*/ pluginFactory({\n plugins: { plugin }\n})\n","import { BModal } from './modal'\nimport { VBModal } from '../../directives/modal/modal'\nimport { BVModalPlugin } from './helpers/bv-modal'\nimport { pluginFactory } from '../../utils/plugins'\n\nconst ModalPlugin = /*#__PURE__*/ pluginFactory({\n components: { BModal },\n directives: { VBModal },\n // $bvModal injection\n plugins: { BVModalPlugin }\n})\n\nexport { ModalPlugin, BModal }\n","import { Vue, mergeData } from '../../vue'\nimport { NAME_NAV } from '../../constants/components'\nimport { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING } from '../../constants/props'\nimport { makeProp, makePropsConfigurable } from '../../utils/props'\n\n// --- Helper methods ---\n\nconst computeJustifyContent = value => {\n value = value === 'left' ? 'start' : value === 'right' ? 'end' : value\n return `justify-content-${value}`\n}\n\n// --- Props ---\n\nexport const props = makePropsConfigurable(\n {\n align: makeProp(PROP_TYPE_STRING),\n // Set to `true` if placing in a card header\n cardHeader: makeProp(PROP_TYPE_BOOLEAN, false),\n fill: makeProp(PROP_TYPE_BOOLEAN, false),\n justified: makeProp(PROP_TYPE_BOOLEAN, false),\n pills: makeProp(PROP_TYPE_BOOLEAN, false),\n small: makeProp(PROP_TYPE_BOOLEAN, false),\n tabs: makeProp(PROP_TYPE_BOOLEAN, false),\n tag: makeProp(PROP_TYPE_STRING, 'ul'),\n vertical: makeProp(PROP_TYPE_BOOLEAN, false)\n },\n NAME_NAV\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BNav = /*#__PURE__*/ Vue.extend({\n name: NAME_NAV,\n functional: true,\n props,\n render(h, { props, data, children }) {\n const { tabs, pills, vertical, align, cardHeader } = props\n\n return h(\n props.tag,\n mergeData(data, {\n staticClass: 'nav',\n class: {\n 'nav-tabs': tabs,\n 'nav-pills': pills && !tabs,\n 'card-header-tabs': !vertical && cardHeader && tabs,\n 'card-header-pills': !vertical && cardHeader && pills && !tabs,\n 'flex-column': vertical,\n 'nav-fill': !vertical && props.fill,\n 'nav-justified': !vertical && props.justified,\n [computeJustifyContent(align)]: !vertical && align,\n small: props.small\n }\n }),\n children\n )\n }\n})\n","import { Vue, mergeData } from '../../vue'\nimport { NAME_NAV_ITEM } from '../../constants/components'\nimport { PROP_TYPE_ARRAY_OBJECT_STRING, PROP_TYPE_OBJECT } from '../../constants/props'\nimport { omit, sortKeys } from '../../utils/object'\nimport { makeProp, makePropsConfigurable, pluckProps } from '../../utils/props'\nimport { BLink, props as BLinkProps } from '../link/link'\n\n// --- Props ---\n\nconst linkProps = omit(BLinkProps, ['event', 'routerTag'])\n\nexport const props = makePropsConfigurable(\n sortKeys({\n ...linkProps,\n linkAttrs: makeProp(PROP_TYPE_OBJECT, {}),\n linkClasses: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING)\n }),\n NAME_NAV_ITEM\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BNavItem = /*#__PURE__*/ Vue.extend({\n name: NAME_NAV_ITEM,\n functional: true,\n props,\n render(h, { props, data, listeners, children }) {\n return h(\n 'li',\n mergeData(omit(data, ['on']), {\n staticClass: 'nav-item'\n }),\n [\n h(\n BLink,\n {\n staticClass: 'nav-link',\n class: props.linkClasses,\n attrs: props.linkAttrs,\n props: pluckProps(linkProps, props),\n on: listeners\n },\n children\n )\n ]\n )\n }\n})\n","import { Vue, mergeData } from '../../vue'\nimport { NAME_NAV_TEXT } from '../../constants/components'\n\n// --- Props ---\n\nexport const props = {}\n\n// --- Main component ---\n\n// @vue/component\nexport const BNavText = /*#__PURE__*/ Vue.extend({\n name: NAME_NAV_TEXT,\n functional: true,\n props,\n render(h, { data, children }) {\n return h('li', mergeData(data, { staticClass: 'navbar-text' }), children)\n }\n})\n","import { Vue, mergeData } from '../../vue'\nimport { NAME_NAV_FORM } from '../../constants/components'\nimport { PROP_TYPE_ARRAY_OBJECT_STRING } from '../../constants/props'\nimport { omit, sortKeys } from '../../utils/object'\nimport { makeProp, makePropsConfigurable, pluckProps } from '../../utils/props'\nimport { BForm, props as BFormProps } from '../form/form'\n\n// --- Props ---\n\nconst formProps = omit(BFormProps, ['inline'])\n\nexport const props = makePropsConfigurable(\n sortKeys({\n ...formProps,\n formClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING)\n }),\n NAME_NAV_FORM\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BNavForm = /*#__PURE__*/ Vue.extend({\n name: NAME_NAV_FORM,\n functional: true,\n props,\n render(h, { props, data, children, listeners }) {\n const $form = h(\n BForm,\n {\n class: props.formClass,\n props: {\n ...pluckProps(formProps, props),\n inline: true\n },\n attrs: data.attrs,\n on: listeners\n },\n children\n )\n\n return h(\n 'li',\n mergeData(omit(data, ['attrs', 'on']), {\n staticClass: 'form-inline'\n }),\n [$form]\n )\n }\n})\n","import { Vue } from '../../vue'\nimport { NAME_NAV_ITEM_DROPDOWN } from '../../constants/components'\nimport { SLOT_NAME_BUTTON_CONTENT, SLOT_NAME_DEFAULT, SLOT_NAME_TEXT } from '../../constants/slots'\nimport { htmlOrText } from '../../utils/html'\nimport { keys, pick, sortKeys } from '../../utils/object'\nimport { makePropsConfigurable } from '../../utils/props'\nimport { dropdownMixin, props as dropdownProps } from '../../mixins/dropdown'\nimport { idMixin, props as idProps } from '../../mixins/id'\nimport { normalizeSlotMixin } from '../../mixins/normalize-slot'\nimport { props as BDropdownProps } from '../dropdown/dropdown'\nimport { BLink } from '../link/link'\n\n// --- Props ---\n\nexport const props = makePropsConfigurable(\n sortKeys({\n ...idProps,\n ...pick(BDropdownProps, [\n ...keys(dropdownProps),\n 'html',\n 'lazy',\n 'menuClass',\n 'noCaret',\n 'role',\n 'text',\n 'toggleClass'\n ])\n }),\n NAME_NAV_ITEM_DROPDOWN\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BNavItemDropdown = /*#__PURE__*/ Vue.extend({\n name: NAME_NAV_ITEM_DROPDOWN,\n mixins: [idMixin, dropdownMixin, normalizeSlotMixin],\n props,\n computed: {\n toggleId() {\n return this.safeId('_BV_toggle_')\n },\n menuId() {\n return this.safeId('_BV_toggle_menu_')\n },\n dropdownClasses() {\n return [this.directionClass, this.boundaryClass, { show: this.visible }]\n },\n menuClasses() {\n return [\n this.menuClass,\n {\n 'dropdown-menu-right': this.right,\n show: this.visible\n }\n ]\n },\n toggleClasses() {\n return [this.toggleClass, { 'dropdown-toggle-no-caret': this.noCaret }]\n }\n },\n render(h) {\n const { toggleId, menuId, visible, hide } = this\n\n const $toggle = h(\n BLink,\n {\n staticClass: 'nav-link dropdown-toggle',\n class: this.toggleClasses,\n props: {\n href: `#${this.id || ''}`,\n disabled: this.disabled\n },\n attrs: {\n id: toggleId,\n role: 'button',\n 'aria-haspopup': 'true',\n 'aria-expanded': visible ? 'true' : 'false',\n 'aria-controls': menuId\n },\n on: {\n mousedown: this.onMousedown,\n click: this.toggle,\n keydown: this.toggle // Handle ENTER, SPACE and DOWN\n },\n ref: 'toggle'\n },\n [\n // TODO: The `text` slot is deprecated in favor of the `button-content` slot\n this.normalizeSlot([SLOT_NAME_BUTTON_CONTENT, SLOT_NAME_TEXT]) ||\n h('span', { domProps: htmlOrText(this.html, this.text) })\n ]\n )\n\n const $menu = h(\n 'ul',\n {\n staticClass: 'dropdown-menu',\n class: this.menuClasses,\n attrs: {\n tabindex: '-1',\n 'aria-labelledby': toggleId,\n id: menuId\n },\n on: {\n keydown: this.onKeydown // Handle UP, DOWN and ESC\n },\n ref: 'menu'\n },\n !this.lazy || visible ? this.normalizeSlot(SLOT_NAME_DEFAULT, { hide }) : [h()]\n )\n\n return h(\n 'li',\n {\n staticClass: 'nav-item b-nav-dropdown dropdown',\n class: this.dropdownClasses,\n attrs: { id: this.safeId() }\n },\n [$toggle, $menu]\n )\n }\n})\n","import { BNav } from './nav'\nimport { BNavItem } from './nav-item'\nimport { BNavText } from './nav-text'\nimport { BNavForm } from './nav-form'\nimport { BNavItemDropdown } from './nav-item-dropdown'\nimport { DropdownPlugin } from '../dropdown'\nimport { pluginFactory } from '../../utils/plugins'\n\nconst NavPlugin = /*#__PURE__*/ pluginFactory({\n components: {\n BNav,\n BNavItem,\n BNavText,\n BNavForm,\n BNavItemDropdown,\n BNavItemDd: BNavItemDropdown,\n BNavDropdown: BNavItemDropdown,\n BNavDd: BNavItemDropdown\n },\n plugins: {\n DropdownPlugin\n }\n})\n\nexport { NavPlugin, BNav, BNavItem, BNavText, BNavForm, BNavItemDropdown }\n","import { Vue } from '../../vue'\nimport { NAME_NAVBAR } from '../../constants/components'\nimport {\n PROP_TYPE_BOOLEAN,\n PROP_TYPE_BOOLEAN_STRING,\n PROP_TYPE_STRING\n} from '../../constants/props'\nimport { getBreakpoints } from '../../utils/config'\nimport { isTag } from '../../utils/dom'\nimport { isString } from '../../utils/inspect'\nimport { makeProp, makePropsConfigurable } from '../../utils/props'\nimport { normalizeSlotMixin } from '../../mixins/normalize-slot'\n\n// --- Props ---\n\nexport const props = makePropsConfigurable(\n {\n fixed: makeProp(PROP_TYPE_STRING),\n print: makeProp(PROP_TYPE_BOOLEAN, false),\n sticky: makeProp(PROP_TYPE_BOOLEAN, false),\n tag: makeProp(PROP_TYPE_STRING, 'nav'),\n toggleable: makeProp(PROP_TYPE_BOOLEAN_STRING, false),\n type: makeProp(PROP_TYPE_STRING, 'light'),\n variant: makeProp(PROP_TYPE_STRING)\n },\n NAME_NAVBAR\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BNavbar = /*#__PURE__*/ Vue.extend({\n name: NAME_NAVBAR,\n mixins: [normalizeSlotMixin],\n provide() {\n return { bvNavbar: this }\n },\n props,\n computed: {\n breakpointClass() {\n const { toggleable } = this\n const xs = getBreakpoints()[0]\n\n let breakpoint = null\n if (toggleable && isString(toggleable) && toggleable !== xs) {\n breakpoint = `navbar-expand-${toggleable}`\n } else if (toggleable === false) {\n breakpoint = 'navbar-expand'\n }\n\n return breakpoint\n }\n },\n render(h) {\n const { tag, type, variant, fixed } = this\n\n return h(\n tag,\n {\n staticClass: 'navbar',\n class: [\n {\n 'd-print': this.print,\n 'sticky-top': this.sticky,\n [`navbar-${type}`]: type,\n [`bg-${variant}`]: variant,\n [`fixed-${fixed}`]: fixed\n },\n this.breakpointClass\n ],\n attrs: {\n role: isTag(tag, 'nav') ? null : 'navigation'\n }\n },\n [this.normalizeSlot()]\n )\n }\n})\n","import { Vue, mergeData } from '../../vue'\nimport { NAME_NAVBAR_NAV } from '../../constants/components'\nimport { pick } from '../../utils/object'\nimport { makePropsConfigurable } from '../../utils/props'\nimport { props as BNavProps } from '../nav/nav'\n\n// --- Helper methods ---\n\nconst computeJustifyContent = value => {\n value = value === 'left' ? 'start' : value === 'right' ? 'end' : value\n return `justify-content-${value}`\n}\n\n// --- Props ---\n\nexport const props = makePropsConfigurable(\n pick(BNavProps, ['tag', 'fill', 'justified', 'align', 'small']),\n NAME_NAVBAR_NAV\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BNavbarNav = /*#__PURE__*/ Vue.extend({\n name: NAME_NAVBAR_NAV,\n functional: true,\n props,\n render(h, { props, data, children }) {\n const { align } = props\n\n return h(\n props.tag,\n mergeData(data, {\n staticClass: 'navbar-nav',\n class: {\n 'nav-fill': props.fill,\n 'nav-justified': props.justified,\n [computeJustifyContent(align)]: align,\n small: props.small\n }\n }),\n children\n )\n }\n})\n","import { Vue, mergeData } from '../../vue'\nimport { NAME_NAVBAR_BRAND } from '../../constants/components'\nimport { PROP_TYPE_STRING } from '../../constants/props'\nimport { omit, sortKeys } from '../../utils/object'\nimport { makeProp, makePropsConfigurable, pluckProps } from '../../utils/props'\nimport { BLink, props as BLinkProps } from '../link/link'\n\n// --- Props ---\n\nconst linkProps = omit(BLinkProps, ['event', 'routerTag'])\nlinkProps.href.default = undefined\nlinkProps.to.default = undefined\n\nexport const props = makePropsConfigurable(\n sortKeys({\n ...linkProps,\n tag: makeProp(PROP_TYPE_STRING, 'div')\n }),\n NAME_NAVBAR_BRAND\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BNavbarBrand = /*#__PURE__*/ Vue.extend({\n name: NAME_NAVBAR_BRAND,\n functional: true,\n props,\n render(h, { props, data, children }) {\n const isLink = props.to || props.href\n const tag = isLink ? BLink : props.tag\n\n return h(\n tag,\n mergeData(data, {\n staticClass: 'navbar-brand',\n props: isLink ? pluckProps(linkProps, props) : {}\n }),\n children\n )\n }\n})\n","import { Vue } from '../../vue'\nimport { NAME_COLLAPSE, NAME_NAVBAR_TOGGLE } from '../../constants/components'\nimport { EVENT_NAME_CLICK } from '../../constants/events'\nimport { PROP_TYPE_ARRAY_STRING, PROP_TYPE_BOOLEAN, PROP_TYPE_STRING } from '../../constants/props'\nimport { SLOT_NAME_DEFAULT } from '../../constants/slots'\nimport { getRootEventName } from '../../utils/events'\nimport { makeProp, makePropsConfigurable } from '../../utils/props'\nimport { listenOnRootMixin } from '../../mixins/listen-on-root'\nimport { normalizeSlotMixin } from '../../mixins/normalize-slot'\nimport { VBToggle } from '../../directives/toggle/toggle'\n\n// --- Constants ---\n\nconst CLASS_NAME = 'navbar-toggler'\n\nconst ROOT_EVENT_NAME_STATE = getRootEventName(NAME_COLLAPSE, 'state')\nconst ROOT_EVENT_NAME_SYNC_STATE = getRootEventName(NAME_COLLAPSE, 'sync-state')\n\n// --- Props ---\n\nexport const props = makePropsConfigurable(\n {\n disabled: makeProp(PROP_TYPE_BOOLEAN, false),\n label: makeProp(PROP_TYPE_STRING, 'Toggle navigation'),\n target: makeProp(PROP_TYPE_ARRAY_STRING, undefined, true) // Required\n },\n NAME_NAVBAR_TOGGLE\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BNavbarToggle = /*#__PURE__*/ Vue.extend({\n name: NAME_NAVBAR_TOGGLE,\n directives: { VBToggle },\n mixins: [listenOnRootMixin, normalizeSlotMixin],\n props,\n data() {\n return {\n toggleState: false\n }\n },\n created() {\n this.listenOnRoot(ROOT_EVENT_NAME_STATE, this.handleStateEvent)\n this.listenOnRoot(ROOT_EVENT_NAME_SYNC_STATE, this.handleStateEvent)\n },\n methods: {\n onClick(event) {\n if (!this.disabled) {\n // Emit courtesy `click` event\n this.$emit(EVENT_NAME_CLICK, event)\n }\n },\n handleStateEvent(id, state) {\n // We listen for state events so that we can pass the\n // boolean expanded state to the default scoped slot\n if (id === this.target) {\n this.toggleState = state\n }\n }\n },\n render(h) {\n const { disabled } = this\n\n return h(\n 'button',\n {\n staticClass: CLASS_NAME,\n class: { disabled },\n directives: [{ name: 'VBToggle', value: this.target }],\n attrs: {\n type: 'button',\n disabled,\n 'aria-label': this.label\n },\n on: { click: this.onClick }\n },\n [\n this.normalizeSlot(SLOT_NAME_DEFAULT, { expanded: this.toggleState }) ||\n h('span', { staticClass: `${CLASS_NAME}-icon` })\n ]\n )\n }\n})\n","import { BNavbar } from './navbar'\nimport { BNavbarNav } from './navbar-nav'\nimport { BNavbarBrand } from './navbar-brand'\nimport { BNavbarToggle } from './navbar-toggle'\nimport { NavPlugin } from '../nav'\nimport { CollapsePlugin } from '../collapse'\nimport { DropdownPlugin } from '../dropdown'\nimport { pluginFactory } from '../../utils/plugins'\n\nconst NavbarPlugin = /*#__PURE__*/ pluginFactory({\n components: {\n BNavbar,\n BNavbarNav,\n BNavbarBrand,\n BNavbarToggle,\n BNavToggle: BNavbarToggle\n },\n plugins: {\n NavPlugin,\n CollapsePlugin,\n DropdownPlugin\n }\n})\n\nexport { NavbarPlugin, BNavbar, BNavbarNav, BNavbarBrand, BNavbarToggle }\n","import { Vue, mergeData } from '../../vue'\nimport { NAME_SPINNER } from '../../constants/components'\nimport { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING } from '../../constants/props'\nimport { SLOT_NAME_LABEL } from '../../constants/slots'\nimport { normalizeSlot } from '../../utils/normalize-slot'\nimport { makeProp, makePropsConfigurable } from '../../utils/props'\n\n// --- Props ---\n\nexport const props = makePropsConfigurable(\n {\n label: makeProp(PROP_TYPE_STRING),\n role: makeProp(PROP_TYPE_STRING, 'status'),\n small: makeProp(PROP_TYPE_BOOLEAN, false),\n tag: makeProp(PROP_TYPE_STRING, 'span'),\n type: makeProp(PROP_TYPE_STRING, 'border'),\n variant: makeProp(PROP_TYPE_STRING)\n },\n NAME_SPINNER\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BSpinner = /*#__PURE__*/ Vue.extend({\n name: NAME_SPINNER,\n functional: true,\n props,\n render(h, { props, data, slots, scopedSlots }) {\n const $slots = slots()\n const $scopedSlots = scopedSlots || {}\n\n let $label = normalizeSlot(SLOT_NAME_LABEL, {}, $scopedSlots, $slots) || props.label\n if ($label) {\n $label = h('span', { staticClass: 'sr-only' }, $label)\n }\n\n return h(\n props.tag,\n mergeData(data, {\n attrs: {\n role: $label ? props.role || 'status' : null,\n 'aria-hidden': $label ? null : 'true'\n },\n class: {\n [`spinner-${props.type}`]: props.type,\n [`spinner-${props.type}-sm`]: props.small,\n [`text-${props.variant}`]: props.variant\n }\n }),\n [$label || h()]\n )\n }\n})\n","import { Vue } from '../../vue'\nimport { NAME_OVERLAY } from '../../constants/components'\nimport { EVENT_NAME_CLICK, EVENT_NAME_HIDDEN, EVENT_NAME_SHOWN } from '../../constants/events'\nimport {\n PROP_TYPE_BOOLEAN,\n PROP_TYPE_BOOLEAN_STRING,\n PROP_TYPE_NUMBER_STRING,\n PROP_TYPE_STRING\n} from '../../constants/props'\nimport { SLOT_NAME_OVERLAY } from '../../constants/slots'\nimport { toFloat } from '../../utils/number'\nimport { normalizeSlotMixin } from '../../mixins/normalize-slot'\nimport { makeProp, makePropsConfigurable } from '../../utils/props'\nimport { BSpinner } from '../spinner/spinner'\nimport { BVTransition } from '../transition/bv-transition'\n\n// --- Constants ---\n\nconst POSITION_COVER = { top: 0, left: 0, bottom: 0, right: 0 }\n\n// --- Props ---\n\nexport const props = makePropsConfigurable(\n {\n // Alternative to variant, allowing a specific\n // CSS color to be applied to the overlay\n bgColor: makeProp(PROP_TYPE_STRING),\n blur: makeProp(PROP_TYPE_STRING, '2px'),\n fixed: makeProp(PROP_TYPE_BOOLEAN, false),\n noCenter: makeProp(PROP_TYPE_BOOLEAN, false),\n noFade: makeProp(PROP_TYPE_BOOLEAN, false),\n // If `true, does not render the default slot\n // and switches to absolute positioning\n noWrap: makeProp(PROP_TYPE_BOOLEAN, false),\n opacity: makeProp(PROP_TYPE_NUMBER_STRING, 0.85, value => {\n const number = toFloat(value, 0)\n return number >= 0 && number <= 1\n }),\n overlayTag: makeProp(PROP_TYPE_STRING, 'div'),\n rounded: makeProp(PROP_TYPE_BOOLEAN_STRING, false),\n show: makeProp(PROP_TYPE_BOOLEAN, false),\n spinnerSmall: makeProp(PROP_TYPE_BOOLEAN, false),\n spinnerType: makeProp(PROP_TYPE_STRING, 'border'),\n spinnerVariant: makeProp(PROP_TYPE_STRING),\n variant: makeProp(PROP_TYPE_STRING, 'light'),\n wrapTag: makeProp(PROP_TYPE_STRING, 'div'),\n zIndex: makeProp(PROP_TYPE_NUMBER_STRING, 10)\n },\n NAME_OVERLAY\n)\n\n// --- Main component ---\n\n// @vue/component\nexport const BOverlay = /*#__PURE__*/ Vue.extend({\n name: NAME_OVERLAY,\n mixins: [normalizeSlotMixin],\n props,\n computed: {\n computedRounded() {\n const { rounded } = this\n return rounded === true || rounded === '' ? 'rounded' : !rounded ? '' : `rounded-${rounded}`\n },\n computedVariant() {\n const { variant } = this\n return variant && !this.bgColor ? `bg-${variant}` : ''\n },\n slotScope() {\n return {\n spinnerType: this.spinnerType || null,\n spinnerVariant: this.spinnerVariant || null,\n spinnerSmall: this.spinnerSmall\n }\n }\n },\n methods: {\n defaultOverlayFn({ spinnerType, spinnerVariant, spinnerSmall }) {\n return this.$createElement(BSpinner, {\n props: {\n type: spinnerType,\n variant: spinnerVariant,\n small: spinnerSmall\n }\n })\n }\n },\n render(h) {\n const { show, fixed, noFade, noWrap, slotScope } = this\n\n let $overlay = h()\n if (show) {\n const $background = h('div', {\n staticClass: 'position-absolute',\n class: [this.computedVariant, this.computedRounded],\n style: {\n ...POSITION_COVER,\n opacity: this.opacity,\n backgroundColor: this.bgColor || null,\n backdropFilter: this.blur ? `blur(${this.blur})` : null\n }\n })\n\n const $content = h(\n 'div',\n {\n staticClass: 'position-absolute',\n style: this.noCenter\n ? /* istanbul ignore next */ { ...POSITION_COVER }\n : { top: '50%', left: '50%', transform: 'translateX(-50%) translateY(-50%)' }\n },\n [this.normalizeSlot(SLOT_NAME_OVERLAY, slotScope) || this.defaultOverlayFn(slotScope)]\n )\n\n $overlay = h(\n this.overlayTag,\n {\n staticClass: 'b-overlay',\n class: {\n 'position-absolute': !noWrap || (noWrap && !fixed),\n 'position-fixed': noWrap && fixed\n },\n style: {\n ...POSITION_COVER,\n zIndex: this.zIndex || 10\n },\n on: { click: event => this.$emit(EVENT_NAME_CLICK, event) },\n key: 'overlay'\n },\n [$background, $content]\n )\n }\n\n // Wrap in a fade transition\n $overlay = h(\n BVTransition,\n {\n props: {\n noFade,\n appear: true\n },\n on: {\n 'after-enter': () => this.$emit(EVENT_NAME_SHOWN),\n 'after-leave': () => this.$emit(EVENT_NAME_HIDDEN)\n }\n },\n [$overlay]\n )\n\n if (noWrap) {\n return $overlay\n }\n\n return h(\n this.wrapTag,\n {\n staticClass: 'b-overlay-wrap position-relative',\n attrs: { 'aria-busy': show ? 'true' : null }\n },\n noWrap ? [$overlay] : [this.normalizeSlot(), $overlay]\n )\n }\n})\n","import { BOverlay } from './overlay'\nimport { pluginFactory } from '../../utils/plugins'\n\nconst OverlayPlugin = /*#__PURE__*/ pluginFactory({\n components: { BOverlay }\n})\n\nexport { OverlayPlugin, BOverlay }\n","import { Vue } from '../vue'\nimport { NAME_PAGINATION } from '../constants/components'\nimport { CODE_DOWN, CODE_LEFT, CODE_RIGHT, CODE_SPACE, CODE_UP } from '../constants/key-codes'\nimport {\n PROP_TYPE_ARRAY_OBJECT_STRING,\n PROP_TYPE_BOOLEAN,\n PROP_TYPE_BOOLEAN_NUMBER_STRING,\n PROP_TYPE_FUNCTION_STRING,\n PROP_TYPE_NUMBER_STRING,\n PROP_TYPE_STRING\n} from '../constants/props'\nimport {\n SLOT_NAME_ELLIPSIS_TEXT,\n SLOT_NAME_FIRST_TEXT,\n SLOT_NAME_LAST_TEXT,\n SLOT_NAME_NEXT_TEXT,\n SLOT_NAME_PAGE,\n SLOT_NAME_PREV_TEXT\n} from '../constants/slots'\nimport { createArray } from '../utils/array'\nimport {\n attemptFocus,\n getActiveElement,\n getAttr,\n isDisabled,\n isVisible,\n selectAll\n} from '../utils/dom'\nimport { stopEvent } from '../utils/events'\nimport { isFunction, isNull } from '../utils/inspect'\nimport { mathFloor, mathMax, mathMin } from '../utils/math'\nimport { makeModelMixin } from '../utils/model'\nimport { toInteger } from '../utils/number'\nimport { sortKeys } from '../utils/object'\nimport { hasPropFunction, makeProp, makePropsConfigurable } from '../utils/props'\nimport { toString } from '../utils/string'\nimport { warn } from '../utils/warn'\nimport { normalizeSlotMixin } from '../mixins/normalize-slot'\nimport { BLink } from '../components/link/link'\n\n// Common props, computed, data, render function, and methods\n// for `
` and ``\n\n// --- Constants ---\n\nconst {\n mixin: modelMixin,\n props: modelProps,\n prop: MODEL_PROP_NAME,\n event: MODEL_EVENT_NAME\n} = makeModelMixin('value', {\n type: PROP_TYPE_BOOLEAN_NUMBER_STRING,\n defaultValue: null,\n /* istanbul ignore next */\n validator(value) {\n if (!isNull(value) && toInteger(value, 0) < 1) {\n warn('\"v-model\" value must be a number greater than \"0\"', NAME_PAGINATION)\n return false\n }\n return true\n }\n})\n\nexport { MODEL_PROP_NAME, MODEL_EVENT_NAME }\n\n// Threshold of limit size when we start/stop showing ellipsis\nconst ELLIPSIS_THRESHOLD = 3\n\n// Default # of buttons limit\nconst DEFAULT_LIMIT = 5\n\n// --- Helper methods ---\n\n// Make an array of N to N+X\nconst makePageArray = (startNumber, numberOfPages) =>\n createArray(numberOfPages, (_, i) => ({ number: startNumber + i, classes: null }))\n\n// Sanitize the provided limit value (converting to a number)\nconst sanitizeLimit = value => {\n const limit = toInteger(value) || 1\n return limit < 1 ? DEFAULT_LIMIT : limit\n}\n\n// Sanitize the provided current page number (converting to a number)\nconst sanitizeCurrentPage = (val, numberOfPages) => {\n const page = toInteger(val) || 1\n return page > numberOfPages ? numberOfPages : page < 1 ? 1 : page\n}\n\n// Links don't normally respond to SPACE, so we add that\n// functionality via this handler\nconst onSpaceKey = event => {\n if (event.keyCode === CODE_SPACE) {\n // Stop page from scrolling\n stopEvent(event, { immediatePropagation: true })\n // Trigger the click event on the link\n event.currentTarget.click()\n return false\n }\n}\n\n// --- Props ---\n\nexport const props = makePropsConfigurable(\n sortKeys({\n ...modelProps,\n align: makeProp(PROP_TYPE_STRING, 'left'),\n ariaLabel: makeProp(PROP_TYPE_STRING, 'Pagination'),\n disabled: makeProp(PROP_TYPE_BOOLEAN, false),\n ellipsisClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING),\n ellipsisText: makeProp(PROP_TYPE_STRING, '\\u2026'), // '…'\n firstClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING),\n firstNumber: makeProp(PROP_TYPE_BOOLEAN, false),\n firstText: makeProp(PROP_TYPE_STRING, '\\u00AB'), // '«'\n hideEllipsis: makeProp(PROP_TYPE_BOOLEAN, false),\n hideGotoEndButtons: makeProp(PROP_TYPE_BOOLEAN, false),\n labelFirstPage: makeProp(PROP_TYPE_STRING, 'Go to first page'),\n labelLastPage: makeProp(PROP_TYPE_STRING, 'Go to last page'),\n labelNextPage: makeProp(PROP_TYPE_STRING, 'Go to next page'),\n labelPage: makeProp(PROP_TYPE_FUNCTION_STRING, 'Go to page'),\n labelPrevPage: makeProp(PROP_TYPE_STRING, 'Go to previous page'),\n lastClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING),\n lastNumber: makeProp(PROP_TYPE_BOOLEAN, false),\n lastText: makeProp(PROP_TYPE_STRING, '\\u00BB'), // '»'\n limit: makeProp(\n PROP_TYPE_NUMBER_STRING,\n DEFAULT_LIMIT,\n /* istanbul ignore next */ value => {\n if (toInteger(value, 0) < 1) {\n warn('Prop \"limit\" must be a number greater than \"0\"', NAME_PAGINATION)\n return false\n }\n return true\n }\n ),\n nextClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING),\n nextText: makeProp(PROP_TYPE_STRING, '\\u203A'), // '›'\n pageClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING),\n pills: makeProp(PROP_TYPE_BOOLEAN, false),\n prevClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING),\n prevText: makeProp(PROP_TYPE_STRING, '\\u2039'), // '‹'\n size: makeProp(PROP_TYPE_STRING)\n }),\n 'pagination'\n)\n\n// --- Mixin ---\n\n// @vue/component\nexport const paginationMixin = Vue.extend({\n mixins: [modelMixin, normalizeSlotMixin],\n props,\n data() {\n // `-1` signifies no page initially selected\n let currentPage = toInteger(this[MODEL_PROP_NAME], 0)\n currentPage = currentPage > 0 ? currentPage : -1\n\n return {\n currentPage,\n localNumberOfPages: 1,\n localLimit: DEFAULT_LIMIT\n }\n },\n computed: {\n btnSize() {\n const { size } = this\n return size ? `pagination-${size}` : ''\n },\n alignment() {\n const { align } = this\n if (align === 'center') {\n return 'justify-content-center'\n } else if (align === 'end' || align === 'right') {\n return 'justify-content-end'\n } else if (align === 'fill') {\n // The page-items will also have 'flex-fill' added\n // We add text centering to make the button appearance better in fill mode\n return 'text-center'\n }\n return ''\n },\n styleClass() {\n return this.pills ? 'b-pagination-pills' : ''\n },\n computedCurrentPage() {\n return sanitizeCurrentPage(this.currentPage, this.localNumberOfPages)\n },\n paginationParams() {\n // Determine if we should show the the ellipsis\n const {\n localLimit: limit,\n localNumberOfPages: numberOfPages,\n computedCurrentPage: currentPage,\n hideEllipsis,\n firstNumber,\n lastNumber\n } = this\n let showFirstDots = false\n let showLastDots = false\n let numberOfLinks = limit\n let startNumber = 1\n\n if (numberOfPages <= limit) {\n // Special case: Less pages available than the limit of displayed pages\n numberOfLinks = numberOfPages\n } else if (currentPage < limit - 1 && limit > ELLIPSIS_THRESHOLD) {\n if (!hideEllipsis || lastNumber) {\n showLastDots = true\n numberOfLinks = limit - (firstNumber ? 0 : 1)\n }\n numberOfLinks = mathMin(numberOfLinks, limit)\n } else if (numberOfPages - currentPage + 2 < limit && limit > ELLIPSIS_THRESHOLD) {\n if (!hideEllipsis || firstNumber) {\n showFirstDots = true\n numberOfLinks = limit - (lastNumber ? 0 : 1)\n }\n startNumber = numberOfPages - numberOfLinks + 1\n } else {\n // We are somewhere in the middle of the page list\n if (limit > ELLIPSIS_THRESHOLD) {\n numberOfLinks = limit - (hideEllipsis ? 0 : 2)\n showFirstDots = !!(!hideEllipsis || firstNumber)\n showLastDots = !!(!hideEllipsis || lastNumber)\n }\n startNumber = currentPage - mathFloor(numberOfLinks / 2)\n }\n // Sanity checks\n /* istanbul ignore if */\n if (startNumber < 1) {\n startNumber = 1\n showFirstDots = false\n } else if (startNumber > numberOfPages - numberOfLinks) {\n startNumber = numberOfPages - numberOfLinks + 1\n showLastDots = false\n }\n if (showFirstDots && firstNumber && startNumber < 4) {\n numberOfLinks = numberOfLinks + 2\n startNumber = 1\n showFirstDots = false\n }\n const lastPageNumber = startNumber + numberOfLinks - 1\n if (showLastDots && lastNumber && lastPageNumber > numberOfPages - 3) {\n numberOfLinks = numberOfLinks + (lastPageNumber === numberOfPages - 2 ? 2 : 3)\n showLastDots = false\n }\n // Special handling for lower limits (where ellipsis are never shown)\n if (limit <= ELLIPSIS_THRESHOLD) {\n if (firstNumber && startNumber === 1) {\n numberOfLinks = mathMin(numberOfLinks + 1, numberOfPages, limit + 1)\n } else if (lastNumber && numberOfPages === startNumber + numberOfLinks - 1) {\n startNumber = mathMax(startNumber - 1, 1)\n numberOfLinks = mathMin(numberOfPages - startNumber + 1, numberOfPages, limit + 1)\n }\n }\n numberOfLinks = mathMin(numberOfLinks, numberOfPages - startNumber + 1)\n return { showFirstDots, showLastDots, numberOfLinks, startNumber }\n },\n pageList() {\n // Generates the pageList array\n const { numberOfLinks, startNumber } = this.paginationParams\n const currentPage = this.computedCurrentPage\n // Generate list of page numbers\n const pages = makePageArray(startNumber, numberOfLinks)\n // We limit to a total of 3 page buttons on XS screens\n // So add classes to page links to hide them for XS breakpoint\n // Note: Ellipsis will also be hidden on XS screens\n // TODO: Make this visual limit configurable based on breakpoint(s)\n if (pages.length > 3) {\n const idx = currentPage - startNumber\n // THe following is a bootstrap-vue custom utility class\n const classes = 'bv-d-xs-down-none'\n if (idx === 0) {\n // Keep leftmost 3 buttons visible when current page is first page\n for (let i = 3; i < pages.length; i++) {\n pages[i].classes = classes\n }\n } else if (idx === pages.length - 1) {\n // Keep rightmost 3 buttons visible when current page is last page\n for (let i = 0; i < pages.length - 3; i++) {\n pages[i].classes = classes\n }\n } else {\n // Hide all except current page, current page - 1 and current page + 1\n for (let i = 0; i < idx - 1; i++) {\n // hide some left button(s)\n pages[i].classes = classes\n }\n for (let i = pages.length - 1; i > idx + 1; i--) {\n // hide some right button(s)\n pages[i].classes = classes\n }\n }\n }\n return pages\n }\n },\n watch: {\n [MODEL_PROP_NAME](newValue, oldValue) {\n if (newValue !== oldValue) {\n this.currentPage = sanitizeCurrentPage(newValue, this.localNumberOfPages)\n }\n },\n currentPage(newValue, oldValue) {\n if (newValue !== oldValue) {\n // Emit `null` if no page selected\n this.$emit(MODEL_EVENT_NAME, newValue > 0 ? newValue : null)\n }\n },\n limit(newValue, oldValue) {\n if (newValue !== oldValue) {\n this.localLimit = sanitizeLimit(newValue)\n }\n }\n },\n created() {\n // Set our default values in data\n this.localLimit = sanitizeLimit(this.limit)\n this.$nextTick(() => {\n // Sanity check\n this.currentPage =\n this.currentPage > this.localNumberOfPages ? this.localNumberOfPages : this.currentPage\n })\n },\n methods: {\n handleKeyNav(event) {\n const { keyCode, shiftKey } = event\n /* istanbul ignore if */\n if (this.isNav) {\n // We disable left/right keyboard navigation in ``\n return\n }\n if (keyCode === CODE_LEFT || keyCode === CODE_UP) {\n stopEvent(event, { propagation: false })\n shiftKey ? this.focusFirst() : this.focusPrev()\n } else if (keyCode === CODE_RIGHT || keyCode === CODE_DOWN) {\n stopEvent(event, { propagation: false })\n shiftKey ? this.focusLast() : this.focusNext()\n }\n },\n getButtons() {\n // Return only buttons that are visible\n return selectAll('button.page-link, a.page-link', this.$el).filter(btn => isVisible(btn))\n },\n focusCurrent() {\n // We do this in `$nextTick()` to ensure buttons have finished rendering\n this.$nextTick(() => {\n const btn = this.getButtons().find(\n el => toInteger(getAttr(el, 'aria-posinset'), 0) === this.computedCurrentPage\n )\n if (!attemptFocus(btn)) {\n // Fallback if current page is not in button list\n this.focusFirst()\n }\n })\n },\n focusFirst() {\n // We do this in `$nextTick()` to ensure buttons have finished rendering\n this.$nextTick(() => {\n const btn = this.getButtons().find(el => !isDisabled(el))\n attemptFocus(btn)\n })\n },\n focusLast() {\n // We do this in `$nextTick()` to ensure buttons have finished rendering\n this.$nextTick(() => {\n const btn = this.getButtons()\n .reverse()\n .find(el => !isDisabled(el))\n attemptFocus(btn)\n })\n },\n focusPrev() {\n // We do this in `$nextTick()` to ensure buttons have finished rendering\n this.$nextTick(() => {\n const buttons = this.getButtons()\n const index = buttons.indexOf(getActiveElement())\n if (index > 0 && !isDisabled(buttons[index - 1])) {\n attemptFocus(buttons[index - 1])\n }\n })\n },\n focusNext() {\n // We do this in `$nextTick()` to ensure buttons have finished rendering\n this.$nextTick(() => {\n const buttons = this.getButtons()\n const index = buttons.indexOf(getActiveElement())\n if (index < buttons.length - 1 && !isDisabled(buttons[index + 1])) {\n attemptFocus(buttons[index + 1])\n }\n })\n }\n },\n render(h) {\n const {\n disabled,\n labelPage,\n ariaLabel,\n isNav,\n localNumberOfPages: numberOfPages,\n computedCurrentPage: currentPage\n } = this\n const pageNumbers = this.pageList.map(p => p.number)\n const { showFirstDots, showLastDots } = this.paginationParams\n const fill = this.align === 'fill'\n const $buttons = []\n\n // Helper function and flag\n const isActivePage = pageNumber => pageNumber === currentPage\n const noCurrentPage = this.currentPage < 1\n\n // Factory function for prev/next/first/last buttons\n const makeEndBtn = (linkTo, ariaLabel, btnSlot, btnText, btnClass, pageTest, key) => {\n const isDisabled =\n disabled || isActivePage(pageTest) || noCurrentPage || linkTo < 1 || linkTo > numberOfPages\n const pageNumber = linkTo < 1 ? 1 : linkTo > numberOfPages ? numberOfPages : linkTo\n const scope = { disabled: isDisabled, page: pageNumber, index: pageNumber - 1 }\n const $btnContent = this.normalizeSlot(btnSlot, scope) || toString(btnText) || h()\n const $inner = h(\n isDisabled ? 'span' : isNav ? BLink : 'button',\n {\n staticClass: 'page-link',\n class: { 'flex-grow-1': !isNav && !isDisabled && fill },\n props: isDisabled || !isNav ? {} : this.linkProps(linkTo),\n attrs: {\n role: isNav ? null : 'menuitem',\n type: isNav || isDisabled ? null : 'button',\n tabindex: isDisabled || isNav ? null : '-1',\n 'aria-label': ariaLabel,\n 'aria-controls': this.ariaControls || null,\n 'aria-disabled': isDisabled ? 'true' : null\n },\n on: isDisabled\n ? {}\n : {\n '!click': event => {\n this.onClick(event, linkTo)\n },\n keydown: onSpaceKey\n }\n },\n [$btnContent]\n )\n return h(\n 'li',\n {\n key,\n staticClass: 'page-item',\n class: [\n {\n disabled: isDisabled,\n 'flex-fill': fill,\n 'd-flex': fill && !isNav && !isDisabled\n },\n btnClass\n ],\n attrs: {\n role: isNav ? null : 'presentation',\n 'aria-hidden': isDisabled ? 'true' : null\n }\n },\n [$inner]\n )\n }\n\n // Ellipsis factory\n const makeEllipsis = isLast => {\n return h(\n 'li',\n {\n staticClass: 'page-item',\n class: ['disabled', 'bv-d-xs-down-none', fill ? 'flex-fill' : '', this.ellipsisClass],\n attrs: { role: 'separator' },\n key: `ellipsis-${isLast ? 'last' : 'first'}`\n },\n [\n h('span', { staticClass: 'page-link' }, [\n this.normalizeSlot(SLOT_NAME_ELLIPSIS_TEXT) || toString(this.ellipsisText) || h()\n ])\n ]\n )\n }\n\n // Page button factory\n const makePageButton = (page, idx) => {\n const { number: pageNumber } = page\n const active = isActivePage(pageNumber) && !noCurrentPage\n // Active page will have tabindex of 0, or if no current page and first page button\n const tabIndex = disabled ? null : active || (noCurrentPage && idx === 0) ? '0' : '-1'\n\n const attrs = {\n role: isNav ? null : 'menuitemradio',\n type: isNav || disabled ? null : 'button',\n 'aria-disabled': disabled ? 'true' : null,\n 'aria-controls': this.ariaControls || null,\n 'aria-label': hasPropFunction(labelPage)\n ? /* istanbul ignore next */ labelPage(pageNumber)\n : `${isFunction(labelPage) ? labelPage() : labelPage} ${pageNumber}`,\n 'aria-checked': isNav ? null : active ? 'true' : 'false',\n 'aria-current': isNav && active ? 'page' : null,\n 'aria-posinset': isNav ? null : pageNumber,\n 'aria-setsize': isNav ? null : numberOfPages,\n // ARIA \"roving tabindex\" method (except in `isNav` mode)\n tabindex: isNav ? null : tabIndex\n }\n const btnContent = toString(this.makePage(pageNumber))\n const scope = {\n page: pageNumber,\n index: pageNumber - 1,\n content: btnContent,\n active,\n disabled\n }\n\n const $inner = h(\n disabled ? 'span' : isNav ? BLink : 'button',\n {\n props: disabled || !isNav ? {} : this.linkProps(pageNumber),\n staticClass: 'page-link',\n class: { 'flex-grow-1': !isNav && !disabled && fill },\n attrs,\n on: disabled\n ? {}\n : {\n '!click': event => {\n this.onClick(event, pageNumber)\n },\n keydown: onSpaceKey\n }\n },\n [this.normalizeSlot(SLOT_NAME_PAGE, scope) || btnContent]\n )\n\n return h(\n 'li',\n {\n staticClass: 'page-item',\n class: [\n {\n disabled,\n active,\n 'flex-fill': fill,\n 'd-flex': fill && !isNav && !disabled\n },\n page.classes,\n this.pageClass\n ],\n attrs: { role: isNav ? null : 'presentation' },\n key: `page-${pageNumber}`\n },\n [$inner]\n )\n }\n\n // Goto first page button\n // Don't render button when `hideGotoEndButtons` or `firstNumber` is set\n let $firstPageBtn = h()\n if (!this.firstNumber && !this.hideGotoEndButtons) {\n $firstPageBtn = makeEndBtn(\n 1,\n this.labelFirstPage,\n SLOT_NAME_FIRST_TEXT,\n this.firstText,\n this.firstClass,\n 1,\n 'pagination-goto-first'\n )\n }\n $buttons.push($firstPageBtn)\n\n // Goto previous page button\n $buttons.push(\n makeEndBtn(\n currentPage - 1,\n this.labelPrevPage,\n SLOT_NAME_PREV_TEXT,\n this.prevText,\n this.prevClass,\n 1,\n 'pagination-goto-prev'\n )\n )\n\n // Show first (1) button?\n $buttons.push(this.firstNumber && pageNumbers[0] !== 1 ? makePageButton({ number: 1 }, 0) : h())\n\n // First ellipsis\n $buttons.push(showFirstDots ? makeEllipsis(false) : h())\n\n // Individual page links\n this.pageList.forEach((page, idx) => {\n const offset = showFirstDots && this.firstNumber && pageNumbers[0] !== 1 ? 1 : 0\n $buttons.push(makePageButton(page, idx + offset))\n })\n\n // Last ellipsis\n $buttons.push(showLastDots ? makeEllipsis(true) : h())\n\n // Show last page button?\n $buttons.push(\n this.lastNumber && pageNumbers[pageNumbers.length - 1] !== numberOfPages\n ? makePageButton({ number: numberOfPages }, -1)\n : h()\n )\n\n // Goto next page button\n $buttons.push(\n makeEndBtn(\n currentPage + 1,\n this.labelNextPage,\n SLOT_NAME_NEXT_TEXT,\n this.nextText,\n this.nextClass,\n numberOfPages,\n 'pagination-goto-next'\n )\n )\n\n // Goto last page button\n // Don't render button when `hideGotoEndButtons` or `lastNumber` is set\n let $lastPageBtn = h()\n if (!this.lastNumber && !this.hideGotoEndButtons) {\n $lastPageBtn = makeEndBtn(\n numberOfPages,\n this.labelLastPage,\n SLOT_NAME_LAST_TEXT,\n this.lastText,\n this.lastClass,\n numberOfPages,\n 'pagination-goto-last'\n )\n }\n $buttons.push($lastPageBtn)\n\n // Assemble the pagination buttons\n const $pagination = h(\n 'ul',\n {\n staticClass: 'pagination',\n class: ['b-pagination', this.btnSize, this.alignment, this.styleClass],\n attrs: {\n role: isNav ? null : 'menubar',\n 'aria-disabled': disabled ? 'true' : 'false',\n 'aria-label': isNav ? null : ariaLabel || null\n },\n // We disable keyboard left/right nav when ``\n on: isNav ? {} : { keydown: this.handleKeyNav },\n ref: 'ul'\n },\n $buttons\n )\n\n // If we are ``, wrap in `