@gitlab/ui 94.2.0 → 94.3.0

package/src/vendor/bootstrap-vue/src/components/modal/helpers/bv-modal.js

@@ -1,279 +0,0 @@
-// Plugin for adding `$bvModal` property to all Vue instances
-import { NAME_MODAL, NAME_MSG_BOX } from '../../../constants/components'
-import {
-  EVENT_NAME_HIDDEN,
-  EVENT_NAME_HIDE,
-  HOOK_EVENT_NAME_BEFORE_DESTROY,
-  HOOK_EVENT_NAME_DESTROYED
-} from '../../../constants/events'
-import { useParentMixin } from '../../../mixins/use-parent'
-import { concat } from '../../../utils/array'
-import { getComponentConfig } from '../../../utils/config'
-import { requestAF } from '../../../utils/dom'
-import { getRootActionEventName } from '../../../utils/events'
-import { isUndefined, isFunction } from '../../../utils/inspect'
-import {
-  assign,
-  defineProperties,
-  defineProperty,
-  hasOwnProperty,
-  keys,
-  omit,
-  readonlyDescriptor
-} from '../../../utils/object'
-import { pluginFactory } from '../../../utils/plugins'
-import { warn, warnNotClient, warnNoPromiseSupport } from '../../../utils/warn'
-import { createNewChildComponent } from '../../../utils/create-new-child-component'
-import { getEventRoot } from '../../../utils/get-event-root'
-import { BModal, props as modalProps } from '../modal'
-
-// --- Constants ---
-
-const PROP_NAME = '$bvModal'
-const PROP_NAME_PRIV = '_bv__modal'
-
-// Base modal props that are allowed
-// Some may be ignored or overridden on some message boxes
-// Prop ID is allowed, but really only should be used for testing
-// We need to add it in explicitly as it comes from the `idMixin`
-const BASE_PROPS = [
-  'id',
-  ...keys(omit(modalProps, ['busy', 'lazy', 'noStacking', 'static', 'visible']))
-]
-
-// Fallback event resolver (returns undefined)
-const defaultResolver = () => {}
-
-// Map prop names to modal slot names
-const propsToSlots = {
-  msgBoxContent: 'default',
-  title: 'modal-title',
-  okTitle: 'modal-ok',
-  cancelTitle: 'modal-cancel'
-}
-
-// --- Helper methods ---
-
-// Method to filter only recognized props that are not undefined
-const filterOptions = options => {
-  return BASE_PROPS.reduce((memo, key) => {
-    if (!isUndefined(options[key])) {
-      memo[key] = options[key]
-    }
-    return memo
-  }, {})
-}
-
-// Method to install `$bvModal` VM injection
-const plugin = Vue => {
-  // Create a private sub-component that extends BModal
-  // which self-destructs after hidden
-  // @vue/component
-  const BMsgBox = Vue.extend({
-    name: NAME_MSG_BOX,
-    extends: BModal,
-    mixins: [useParentMixin],
-    destroyed() {
-      // Make sure we not in document any more
-      if (this.$el && this.$el.parentNode) {
-        this.$el.parentNode.removeChild(this.$el)
-      }
-    },
-    mounted() {
-      // Self destruct handler
-      const handleDestroy = () => {
-        this.$nextTick(() => {
-          // In a `requestAF()` to release control back to application
-          requestAF(() => {
-            this.$destroy()
-          })
-        })
-      }
-      // Self destruct if parent destroyed
-      this.bvParent.$once(HOOK_EVENT_NAME_DESTROYED, handleDestroy)
-      // Self destruct after hidden
-      this.$once(EVENT_NAME_HIDDEN, handleDestroy)
-      // Self destruct on route change
-      /* istanbul ignore if */
-      if (this.$router && this.$route) {
-        // Destroy ourselves if route changes
-        /* istanbul ignore next */
-        this.$once(HOOK_EVENT_NAME_BEFORE_DESTROY, this.$watch('$router', handleDestroy))
-      }
-      // Show the `BMsgBox`
-      this.show()
-    }
-  })
-
-  // Method to generate the on-demand modal message box
-  // Returns a promise that resolves to a value returned by the resolve
-  const asyncMsgBox = (parent, props, resolver = defaultResolver) => {
-    if (warnNotClient(PROP_NAME) || warnNoPromiseSupport(PROP_NAME)) {
-      /* istanbul ignore next */
-      return
-    }
-    // Create an instance of `BMsgBox` component
-    // We set parent as the local VM so these modals can emit events on
-    // the app `$root`, as needed by things like tooltips and popovers
-    // And it helps to ensure `BMsgBox` is destroyed when parent is destroyed
-    const msgBox = createNewChildComponent(parent, BMsgBox, {
-      // Preset the prop values
-      propsData: {
-        ...filterOptions(getComponentConfig(NAME_MODAL)),
-        // Defaults that user can override
-        hideHeaderClose: true,
-        hideHeader: !(props.title || props.titleHtml),
-        // Add in (filtered) user supplied props
-        ...omit(props, keys(propsToSlots)),
-        // Props that can't be overridden
-        lazy: false,
-        busy: false,
-        visible: false,
-        noStacking: false,
-        noEnforceFocus: false
-      }
-    })
-    // Convert certain props to scoped slots
-    keys(propsToSlots).forEach(prop => {
-      if (!isUndefined(props[prop])) {
-        // Can be a string, or array of VNodes.
-        // Alternatively, user can use HTML version of prop to pass an HTML string.
-        msgBox.$slots[propsToSlots[prop]] = concat(props[prop])
-      }
-    })
-    // Return a promise that resolves when hidden, or rejects on destroyed
-    return new Promise((resolve, reject) => {
-      let resolved = false
-      msgBox.$once(HOOK_EVENT_NAME_DESTROYED, () => {
-        if (!resolved) {
-          /* istanbul ignore next */
-          reject(new Error('BootstrapVue MsgBox destroyed before resolve'))
-        }
-      })
-      msgBox.$on(EVENT_NAME_HIDE, bvModalEvent => {
-        if (!bvModalEvent.defaultPrevented) {
-          const result = resolver(bvModalEvent)
-          // If resolver didn't cancel hide, we resolve
-          if (!bvModalEvent.defaultPrevented) {
-            resolved = true
-            resolve(result)
-          }
-        }
-      })
-      // Create a mount point (a DIV) and mount the msgBo which will trigger it to show
-      const div = document.createElement('div')
-      document.body.appendChild(div)
-      msgBox.$mount(div)
-    })
-  }
-
-  // Private utility method to open a user defined message box and returns a promise.
-  // Not to be used directly by consumers, as this method may change calling syntax
-  const makeMsgBox = (parent, content, options = {}, resolver = null) => {
-    if (
-      !content ||
-      warnNoPromiseSupport(PROP_NAME) ||
-      warnNotClient(PROP_NAME) ||
-      !isFunction(resolver)
-    ) {
-      /* istanbul ignore next */
-      return
-    }
-    return asyncMsgBox(parent, { ...filterOptions(options), msgBoxContent: content }, resolver)
-  }
-
-  // BvModal instance class
-  class BvModal {
-    constructor(vm) {
-      // Assign the new properties to this instance
-      assign(this, { _vm: vm, _root: getEventRoot(vm) })
-      // Set these properties as read-only and non-enumerable
-      defineProperties(this, {
-        _vm: readonlyDescriptor(),
-        _root: readonlyDescriptor()
-      })
-    }
-
-    // --- Instance methods ---
-
-    // Show modal with the specified ID args are for future use
-    show(id, ...args) {
-      if (id && this._root) {
-        this._root.$emit(getRootActionEventName(NAME_MODAL, 'show'), id, ...args)
-      }
-    }
-
-    // Hide modal with the specified ID args are for future use
-    hide(id, ...args) {
-      if (id && this._root) {
-        this._root.$emit(getRootActionEventName(NAME_MODAL, 'hide'), id, ...args)
-      }
-    }
-
-    // The following methods require Promise support!
-    // IE 11 and others do not support Promise natively, so users
-    // should have a Polyfill loaded (which they need anyways for IE 11 support)
-
-    // Open a message box with OK button only and returns a promise
-    msgBoxOk(message, options = {}) {
-      // Pick the modal props we support from options
-      const props = {
-        ...options,
-        // Add in overrides and our content prop
-        okOnly: true,
-        okDisabled: false,
-        hideFooter: false,
-        msgBoxContent: message
-      }
-      return makeMsgBox(this._vm, message, props, () => {
-        // Always resolve to true for OK
-        return true
-      })
-    }
-
-    // Open a message box modal with OK and CANCEL buttons
-    // and returns a promise
-    msgBoxConfirm(message, options = {}) {
-      // Set the modal props we support from options
-      const props = {
-        ...options,
-        // Add in overrides and our content prop
-        okOnly: false,
-        okDisabled: false,
-        cancelDisabled: false,
-        hideFooter: false
-      }
-      return makeMsgBox(this._vm, message, props, bvModalEvent => {
-        const trigger = bvModalEvent.trigger
-        return trigger === 'ok' ? true : trigger === 'cancel' ? false : null
-      })
-    }
-  }
-
-  // Add our instance mixin
-  Vue.mixin({
-    beforeCreate() {
-      // Because we need access to `$root` for `$emits`, and VM for parenting,
-      // we have to create a fresh instance of `BvModal` for each VM
-      this[PROP_NAME_PRIV] = new BvModal(this)
-    }
-  })
-
-  // Define our read-only `$bvModal` instance property
-  // Placed in an if just in case in HMR mode
-  if (!hasOwnProperty(Vue.prototype, PROP_NAME)) {
-    defineProperty(Vue.prototype, PROP_NAME, {
-      get() {
-        /* istanbul ignore next */
-        if (!this || !this[PROP_NAME_PRIV]) {
-          warn(`"${PROP_NAME}" must be accessed from a Vue instance "this" context.`, NAME_MODAL)
-        }
-        return this[PROP_NAME_PRIV]
-      }
-    })
-  }
-}
-
-export const BVModalPlugin = /*#__PURE__*/ pluginFactory({
-  plugins: { plugin }
-})

package/src/vendor/bootstrap-vue/src/components/modal/helpers/bv-modal.spec.js

@@ -1,178 +0,0 @@
-import { Vue } from '../../../vue'
-import { createWrapper, mount } from '@vue/test-utils'
-import { waitNT, waitRAF } from '../../../../tests/utils'
-import { ModalPlugin } from '../index'
-
-Vue.use(ModalPlugin)
-
-describe('$bvModal', () => {
-  it('$bvModal.show() and $bvModal.hide() works', async () => {
-    const App = {
-      render(h) {
-        return h('b-modal', { props: { static: true, id: 'test1' } }, 'content')
-      }
-    }
-    const wrapper = mount(App, {
-      attachTo: document.body
-    })
-
-    expect(wrapper.vm).toBeDefined()
-
-    await waitNT(wrapper.vm)
-    await waitRAF()
-
-    expect(wrapper.vm.$bvModal).toBeDefined()
-    expect(wrapper.vm.$bvModal.show).toBeDefined()
-    expect(typeof wrapper.vm.$bvModal.show).toEqual('function')
-    expect(wrapper.vm.$bvModal.hide).toBeDefined()
-    expect(typeof wrapper.vm.$bvModal.hide).toEqual('function')
-
-    const $modal = wrapper.find('.modal')
-    expect($modal.exists()).toBe(true)
-
-    expect($modal.element.style.display).toEqual('none')
-
-    wrapper.vm.$bvModal.show('test1')
-
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-
-    expect($modal.element.style.display).not.toEqual('none')
-
-    wrapper.vm.$bvModal.hide('test1')
-
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-
-    expect($modal.element.style.display).toEqual('none')
-
-    wrapper.destroy()
-  })
-
-  it('$bvModal.msgBoxOk() works', async () => {
-    const App = {
-      render(h) {
-        return h('div', 'app')
-      }
-    }
-    const wrapper = mount(App, {
-      attachTo: document.body
-    })
-
-    expect(wrapper.vm).toBeDefined()
-
-    // `$bvModal.msgBoxOk`
-    expect(wrapper.vm.$bvModal).toBeDefined()
-    const bvModal = wrapper.vm.$bvModal
-    expect(bvModal.msgBoxOk).toBeDefined()
-
-    // Should get a promise as result
-    const p = bvModal.msgBoxOk('message', {
-      static: true,
-      id: 'test2',
-      title: 'title'
-    })
-    expect(p).toBeDefined()
-    expect(p).toBeInstanceOf(Promise)
-
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-
-    // Find the modal
-    const modal = document.querySelector('#test2')
-    expect(modal).toBeDefined()
-    expect(modal).not.toEqual(null)
-    const $modal = createWrapper(modal)
-    expect($modal.element.tagName).toBe('DIV')
-
-    // Find the OK button and click it
-    expect($modal.findAll('button').length).toBe(1)
-    const $button = $modal.find('button')
-    expect($button.text()).toEqual('OK')
-    await $button.trigger('click')
-
-    // Promise should now resolve
-    const result = await p
-    expect(result).toEqual(true)
-
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-
-    // Modal should be gone from DOM
-    expect(document.querySelector('#test2')).toBe(null)
-  })
-
-  it('$bvModal.msgBoxConfirm() works', async () => {
-    const App = {
-      render(h) {
-        return h('div', 'app')
-      }
-    }
-    const wrapper = mount(App, {
-      attachTo: document.body
-    })
-
-    expect(wrapper.vm).toBeDefined()
-
-    // `$bvModal.msgBoxConfirm`
-    expect(wrapper.vm.$bvModal).toBeDefined()
-    const bvModal = wrapper.vm.$bvModal
-    expect(bvModal.msgBoxConfirm).toBeDefined()
-
-    // Should get a promise as result
-    const p = bvModal.msgBoxConfirm('message', {
-      static: true,
-      id: 'test3',
-      title: 'title'
-    })
-    expect(p).toBeDefined()
-    expect(p).toBeInstanceOf(Promise)
-
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-
-    // Find the modal
-    const modal = document.querySelector('#test3')
-    expect(modal).toBeDefined()
-    expect(modal).not.toEqual(null)
-    const $modal = createWrapper(modal)
-    expect($modal.element.tagName).toBe('DIV')
-
-    // Find the CANCEL button and click it
-    expect($modal.findAll('button').length).toBe(2)
-    const $buttons = $modal.findAll('button')
-    expect($buttons.at(0).text()).toEqual('Cancel')
-    expect($buttons.at(1).text()).toEqual('OK')
-    await $buttons.at(0).trigger('click')
-
-    // Promise should now resolve
-    const result = await p
-    expect(result).toEqual(false) // Cancel button
-
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-    await waitNT(wrapper.vm)
-    await waitRAF()
-
-    // Modal should be gone from DOM
-    expect(document.querySelector('#test3')).toBe(null)
-  })
-})

package/src/vendor/bootstrap-vue/src/directives/hover/README.md

@@ -1,87 +0,0 @@
-# Hover
-
-> `v-b-hover` is a lightweight directive that allows you to react when an element either becomes
-> hovered or unhovered.
-
-## Overview
-
-The `v-b-hover` directive can be used as an alternative to using custom CSS to handle hover states.
-
-- `v-b-hover` will call your callback method with a boolean value indicating if the element is
-  hovered or not.
-- The directive can be placed on almost any element or component.
-- Internally, BootstrapVue uses this directive in several components.
-
-## Directive syntax and usage
-
-```html
-<div v-b-hover="callback">content</div>
-```
-
-Where callback is required:
-
-- A function reference that will be called whenever hover state changes. The callback is passed a
-  single boolean argument. `true` indicates that the element (or component) is hovered by the users
-  pointing device, or `false` if the element is not hovered.
-
-The directive has no modifiers.
-
-### Usage example
-
-```html
-<template>
-  <div v-b-hover="hoverHandler"> ... </div>
-</template>
-
-<script>
-  export default {
-    methods: {
-      hoverHandler(isHovered) {
-        if (isHovered) {
-          // Do something
-        } else {
-          // Do something else
-        }
-      }
-    }
-  }
-</script>
-```
-
-## Live example
-
-In the following, we are swapping icons and text color depending on the hover state of the element:
-
-```html
-<template>
-  <div>
-    <div v-b-hover="handleHover" class="border rounded py-3 px-4">
-      <b-icon v-if="isHovered" icon="battery-full" scale="2"></b-icon>
-      <b-icon v-else icon="battery" scale="2"></b-icon>
-      <span class="ml-2" :class="isHovered ? 'text-danger' : ''">Hover this area</span>
-    </div>
-  </div>
-</template>
-
-<script>
-  export default {
-    data() {
-      return {
-        isHovered: false
-      }
-    },
-    methods: {
-      handleHover(hovered) {
-        this.isHovered = hovered
-      }
-    }
-  }
-</script>
-
-<!-- b-v-hover-example.vue -->
-```
-
-## Accessibility concerns
-
-Hover state should not be used to convey special meaning, as screen reader users and keyboard only
-users typically can not trigger hover state on elements.

package/src/vendor/bootstrap-vue/src/directives/hover/hover.js

@@ -1,54 +0,0 @@
-// v-b-hover directive
-import { IS_BROWSER } from '../../constants/env'
-import { EVENT_OPTIONS_NO_CAPTURE } from '../../constants/events'
-import { eventOnOff } from '../../utils/events'
-import { isFunction } from '../../utils/inspect'
-
-// --- Constants ---
-
-const PROP = '__BV_hover_handler__'
-const MOUSEENTER = 'mouseenter'
-const MOUSELEAVE = 'mouseleave'
-
-// --- Helper methods ---
-
-const createListener = handler => {
-  const listener = event => {
-    handler(event.type === MOUSEENTER, event)
-  }
-  listener.fn = handler
-  return listener
-}
-
-const updateListeners = (on, el, listener) => {
-  eventOnOff(on, el, MOUSEENTER, listener, EVENT_OPTIONS_NO_CAPTURE)
-  eventOnOff(on, el, MOUSELEAVE, listener, EVENT_OPTIONS_NO_CAPTURE)
-}
-
-// --- Directive bind/unbind/update handler ---
-
-const directive = (el, { value: handler = null }) => {
-  if (IS_BROWSER) {
-    const listener = el[PROP]
-    const hasListener = isFunction(listener)
-    const handlerChanged = !(hasListener && listener.fn === handler)
-    if (hasListener && handlerChanged) {
-      updateListeners(false, el, listener)
-      delete el[PROP]
-    }
-    if (isFunction(handler) && handlerChanged) {
-      el[PROP] = createListener(handler)
-      updateListeners(true, el, el[PROP])
-    }
-  }
-}
-
-// VBHover directive
-
-export const VBHover = {
-  bind: directive,
-  componentUpdated: directive,
-  unbind(el) {
-    directive(el, { value: null })
-  }
-}

package/src/vendor/bootstrap-vue/src/directives/hover/hover.spec.js

@@ -1,49 +0,0 @@
-import { mount } from '@vue/test-utils'
-import { VBHover } from './hover'
-
-describe('v-b-hover directive', () => {
-  it('works', async () => {
-    let hovered1 = false
-    let hovered2 = false
-    const App = {
-      data() {
-        return {
-          text: 'FOO',
-          changeHandler: false
-        }
-      },
-      directives: {
-        BHover: VBHover
-      },
-      methods: {
-        handleHover1(isHovered) {
-          hovered1 = isHovered
-        },
-        handleHover2(isHovered) {
-          hovered2 = isHovered
-        }
-      },
-      template: `<div v-b-hover="changeHandler ? handleHover2 : handleHover1"><span>{{ text }}</span></div>`
-    }
-    const wrapper = mount(App)
-
-    expect(wrapper.vm).toBeDefined()
-    expect(hovered1).toBe(false)
-
-    await wrapper.trigger('mouseenter')
-    expect(hovered1).toBe(true)
-
-    await wrapper.trigger('mouseleave')
-    expect(hovered1).toBe(false)
-
-    await wrapper.setData({ text: 'BAR' })
-    await wrapper.trigger('mouseenter')
-    expect(hovered1).toBe(true)
-
-    await wrapper.setData({ changeHandler: true })
-    await wrapper.trigger('mouseenter')
-    expect(hovered2).toBe(true)
-
-    wrapper.destroy()
-  })
-})

package/src/vendor/bootstrap-vue/src/directives/hover/index.d.ts

@@ -1,11 +0,0 @@
-//
-// VBHover
-//
-import Vue, { DirectiveOptions } from 'vue'
-import { BvPlugin } from '../../'
-
-// Plugin
-export declare const VBHoverPlugin: BvPlugin
-
-// directive: v-b-hover
-export declare const VBHover: DirectiveOptions

package/src/vendor/bootstrap-vue/src/directives/hover/index.js

@@ -1,8 +0,0 @@
-import { VBHover } from './hover'
-import { pluginFactory } from '../../utils/plugins'
-
-const VBHoverPlugin = /*#__PURE__*/ pluginFactory({
-  directives: { VBHover }
-})
-
-export { VBHoverPlugin, VBHover }

package/src/vendor/bootstrap-vue/src/directives/hover/package.json

@@ -1,13 +0,0 @@
-{
-  "name": "@bootstrap-vue/v-b-hover",
-  "version": "1.0.0",
-  "meta": {
-    "title": "Hover",
-    "description": "A lightweight directive that allows you to react when an element either becomes hovered or unhovered",
-    "directive": "VBHover",
-    "version": "2.5.0",
-    "expression": [
-      "Function"
-    ]
-  }
-}

package/src/vendor/bootstrap-vue/src/directives/index.d.ts

@@ -1,13 +0,0 @@
-import { BvPlugin } from '../'
-
-// Plugin that installs all plugins
-export declare const directivesPlugin: BvPlugin
-
-// Named exports of all directives
-export * from './hover'
-export * from './modal'
-export * from './popover'
-export * from './scrollspy'
-export * from './toggle'
-export * from './tooltip'
-export * from './visible'