@gitlab/duo-ui 3.0.0 → 4.0.0

package/src/vendor/bootstrap-vue/src/mixins/dropdown.js

@@ -1,460 +0,0 @@
-import Popper from 'popper.js'
-import { extend } from '../vue'
-import { NAME_DROPDOWN } from '../constants/components'
-import { HAS_TOUCH_SUPPORT } from '../constants/env'
-import {
-  EVENT_NAME_CLICK,
-  EVENT_NAME_HIDDEN,
-  EVENT_NAME_HIDE,
-  EVENT_NAME_SHOW,
-  EVENT_NAME_SHOWN,
-  EVENT_NAME_TOGGLE
-} from '../constants/events'
-import { CODE_DOWN, CODE_ENTER, CODE_ESC, CODE_SPACE, CODE_UP } from '../constants/key-codes'
-import {
-  PLACEMENT_TOP_START,
-  PLACEMENT_TOP_END,
-  PLACEMENT_BOTTOM_START,
-  PLACEMENT_BOTTOM_END,
-  PLACEMENT_RIGHT_START,
-  PLACEMENT_LEFT_START
-} from '../constants/popper'
-import {
-  PROP_TYPE_BOOLEAN,
-  PROP_TYPE_NUMBER_STRING,
-  PROP_TYPE_OBJECT,
-  PROP_TYPE_STRING
-} from '../constants/props'
-import { HTMLElement } from '../constants/safe-types'
-import { BvEvent } from '../utils/bv-event.class'
-import { attemptFocus, closest, contains, isVisible, requestAF, selectAll } from '../utils/dom'
-import { getRootEventName, stopEvent } from '../utils/events'
-import { isNull } from '../utils/inspect'
-import { mergeDeep, sortKeys } from '../utils/object'
-import { makeProp, makePropsConfigurable } from '../utils/props'
-import { warn } from '../utils/warn'
-import { clickOutMixin } from './click-out'
-import { focusInMixin } from './focus-in'
-import { idMixin, props as idProps } from './id'
-import { listenOnRootMixin } from './listen-on-root'
-import {
-  registerElementToInstance,
-  removeElementToInstance
-} from '../utils/element-to-vue-instance-registry'
-
-// --- Constants ---
-
-const ROOT_EVENT_NAME_SHOWN = getRootEventName(NAME_DROPDOWN, EVENT_NAME_SHOWN)
-const ROOT_EVENT_NAME_HIDDEN = getRootEventName(NAME_DROPDOWN, EVENT_NAME_HIDDEN)
-
-// CSS selectors
-const SELECTOR_FORM_CHILD = '.dropdown form'
-const SELECTOR_ITEM = ['.dropdown-item', '.b-dropdown-form']
-  .map(selector => `${selector}:not(.disabled):not([disabled])`)
-  .join(', ')
-
-// --- Helper methods ---
-
-// Return an array of visible items
-const filterVisibles = els => (els || []).filter(isVisible)
-
-// --- Props ---
-
-export const props = makePropsConfigurable(
-  sortKeys({
-    ...idProps,
-    // String: `scrollParent`, `window` or `viewport`
-    // HTMLElement: HTML Element reference
-    boundary: makeProp([HTMLElement, PROP_TYPE_STRING], 'scrollParent'),
-    disabled: makeProp(PROP_TYPE_BOOLEAN, false),
-    // Place left if possible
-    dropleft: makeProp(PROP_TYPE_BOOLEAN, false),
-    // Place right if possible
-    dropright: makeProp(PROP_TYPE_BOOLEAN, false),
-    // Place on top if possible
-    dropup: makeProp(PROP_TYPE_BOOLEAN, false),
-    // Disable auto-flipping of menu from bottom <=> top
-    noFlip: makeProp(PROP_TYPE_BOOLEAN, false),
-    // Number of pixels or a CSS unit value to offset menu
-    // (i.e. `1px`, `1rem`, etc.)
-    offset: makeProp(PROP_TYPE_NUMBER_STRING, 0),
-    popperOpts: makeProp(PROP_TYPE_OBJECT, {}),
-    // Right align menu (default is left align)
-    right: makeProp(PROP_TYPE_BOOLEAN, false)
-  }),
-  NAME_DROPDOWN
-)
-
-// --- Mixin ---
-
-// @vue/component
-export const dropdownMixin = extend({
-  mixins: [idMixin, listenOnRootMixin, clickOutMixin, focusInMixin],
-  provide() {
-    return { getBvDropdown: () => this }
-  },
-  inject: {
-    getBvNavbar: { default: () => () => null }
-  },
-  props,
-  data() {
-    return {
-      visible: false,
-      visibleChangePrevented: false
-    }
-  },
-  computed: {
-    bvNavbar() {
-      return this.getBvNavbar()
-    },
-    inNavbar() {
-      return !isNull(this.bvNavbar)
-    },
-    toggler() {
-      const { toggle } = this.$refs
-      return toggle ? toggle.$el || toggle : null
-    },
-    directionClass() {
-      if (this.dropup) {
-        return 'dropup'
-      } else if (this.dropright) {
-        return 'dropright'
-      } else if (this.dropleft) {
-        return 'dropleft'
-      }
-      return ''
-    },
-    boundaryClass() {
-      // Position `static` is needed to allow menu to "breakout" of the `scrollParent`
-      // boundaries when boundary is anything other than `scrollParent`
-      // See: https://github.com/twbs/bootstrap/issues/24251#issuecomment-341413786
-      return this.boundary !== 'scrollParent' && !this.inNavbar ? 'position-static' : ''
-    },
-    hideDelay() {
-      return this.inNavbar ? (HAS_TOUCH_SUPPORT ? 300 : 50) : 0
-    }
-  },
-  watch: {
-    visible(newValue, oldValue) {
-      if (this.visibleChangePrevented) {
-        this.visibleChangePrevented = false
-        return
-      }
-
-      if (newValue !== oldValue) {
-        const eventName = newValue ? EVENT_NAME_SHOW : EVENT_NAME_HIDE
-        const bvEvent = new BvEvent(eventName, {
-          cancelable: true,
-          vueTarget: this,
-          target: this.$refs.menu,
-          relatedTarget: null,
-          componentId: this.safeId ? this.safeId() : this.id || null
-        })
-        this.emitEvent(bvEvent)
-        if (bvEvent.defaultPrevented) {
-          // Reset value and exit if canceled
-          this.visibleChangePrevented = true
-          this.visible = oldValue
-          // Just in case a child element triggered `this.hide(true)`
-          this.$off(EVENT_NAME_HIDDEN, this.focusToggler)
-          return
-        }
-        if (newValue) {
-          this.showMenu()
-        } else {
-          this.hideMenu()
-        }
-      }
-    },
-    disabled(newValue, oldValue) {
-      if (newValue !== oldValue && newValue && this.visible) {
-        // Hide dropdown if disabled changes to true
-        this.visible = false
-      }
-    }
-  },
-  created() {
-    // Create private non-reactive props
-    this.$_popper = null
-    this.$_hideTimeout = null
-  },
-  /* istanbul ignore next */
-  deactivated() {
-    // In case we are inside a `<keep-alive>`
-    this.visible = false
-    this.whileOpenListen(false)
-    this.destroyPopper()
-  },
-  mounted() {
-    registerElementToInstance(this.$el, this)
-  },
-  beforeDestroy() {
-    this.visible = false
-    this.whileOpenListen(false)
-    this.destroyPopper()
-    this.clearHideTimeout()
-    removeElementToInstance(this.$el)
-  },
-  methods: {
-    // Event emitter
-    emitEvent(bvEvent) {
-      const { type } = bvEvent
-      this.emitOnRoot(getRootEventName(NAME_DROPDOWN, type), bvEvent)
-      this.$emit(type, bvEvent)
-    },
-    showMenu() {
-      if (this.disabled) {
-        /* istanbul ignore next */
-        return
-      }
-
-      // Only instantiate Popper.js when dropdown is not in `<b-navbar>`
-      if (!this.inNavbar) {
-        if (typeof Popper === 'undefined') {
-          /* istanbul ignore next */
-          warn('Popper.js not found. Falling back to CSS positioning', NAME_DROPDOWN)
-        } else {
-          // For dropup with alignment we use the parent element as popper container
-          let el = (this.dropup && this.right) || this.split ? this.$el : this.$refs.toggle
-          // Make sure we have a reference to an element, not a component!
-          el = el.$el || el
-          // Instantiate Popper.js
-          this.createPopper(el)
-        }
-      }
-
-      // Ensure other menus are closed
-      this.emitOnRoot(ROOT_EVENT_NAME_SHOWN, this)
-
-      // Enable listeners
-      this.whileOpenListen(true)
-
-      // Wrap in `$nextTick()` to ensure menu is fully rendered/shown
-      this.$nextTick(() => {
-        // Focus on the menu container on show
-        this.focusMenu()
-        // Emit the shown event
-        this.$emit(EVENT_NAME_SHOWN)
-      })
-    },
-    hideMenu() {
-      this.whileOpenListen(false)
-      this.emitOnRoot(ROOT_EVENT_NAME_HIDDEN, this)
-      this.$emit(EVENT_NAME_HIDDEN)
-      this.destroyPopper()
-    },
-    createPopper(element) {
-      this.destroyPopper()
-      this.$_popper = new Popper(element, this.$refs.menu, this.getPopperConfig())
-    },
-    // Ensure popper event listeners are removed cleanly
-    destroyPopper() {
-      this.$_popper && this.$_popper.destroy()
-      this.$_popper = null
-    },
-    // Instructs popper to re-computes the dropdown position
-    // useful if the content changes size
-    updatePopper() {
-      try {
-        this.$_popper.scheduleUpdate()
-      } catch {}
-    },
-    clearHideTimeout() {
-      clearTimeout(this.$_hideTimeout)
-      this.$_hideTimeout = null
-    },
-    getPopperConfig() {
-      let placement = PLACEMENT_BOTTOM_START
-      if (this.dropup) {
-        placement = this.right ? PLACEMENT_TOP_END : PLACEMENT_TOP_START
-      } else if (this.dropright) {
-        placement = PLACEMENT_RIGHT_START
-      } else if (this.dropleft) {
-        placement = PLACEMENT_LEFT_START
-      } else if (this.right) {
-        placement = PLACEMENT_BOTTOM_END
-      }
-      const popperConfig = {
-        placement,
-        modifiers: {
-          offset: { offset: this.offset || 0 },
-          flip: { enabled: !this.noFlip }
-        }
-      }
-      const boundariesElement = this.boundary
-      if (boundariesElement) {
-        popperConfig.modifiers.preventOverflow = { boundariesElement }
-      }
-      return mergeDeep(popperConfig, this.popperOpts || {})
-    },
-    // Turn listeners on/off while open
-    whileOpenListen(isOpen) {
-      // Hide the dropdown when clicked outside
-      this.listenForClickOut = isOpen
-      // Hide the dropdown when it loses focus
-      this.listenForFocusIn = isOpen
-      // Hide the dropdown when another dropdown is opened
-      const method = isOpen ? 'listenOnRoot' : 'listenOffRoot'
-      this[method](ROOT_EVENT_NAME_SHOWN, this.rootCloseListener)
-    },
-    rootCloseListener(vm) {
-      if (vm !== this) {
-        this.visible = false
-      }
-    },
-    // Public method to show dropdown
-    show() {
-      if (this.disabled) {
-        return
-      }
-      // Wrap in a `requestAF()` to allow any previous
-      // click handling to occur first
-      requestAF(() => {
-        this.visible = true
-      })
-    },
-    // Public method to hide dropdown
-    hide(refocus = false) {
-      /* istanbul ignore next */
-      if (this.disabled) {
-        return
-      }
-      this.visible = false
-      if (refocus) {
-        // Child element is closing the dropdown on click
-        this.$once(EVENT_NAME_HIDDEN, this.focusToggler)
-      }
-    },
-    // Called only by a button that toggles the menu
-    toggle(event) {
-      event = event || {}
-      // Early exit when not a click event or ENTER, SPACE or DOWN were pressed
-      const { type, keyCode } = event
-      if (
-        type !== 'click' &&
-        !(type === 'keydown' && [CODE_ENTER, CODE_SPACE, CODE_DOWN].indexOf(keyCode) !== -1)
-      ) {
-        /* istanbul ignore next */
-        return
-      }
-      /* istanbul ignore next */
-      if (this.disabled) {
-        this.visible = false
-        return
-      }
-      this.$emit(EVENT_NAME_TOGGLE, event)
-      stopEvent(event)
-      // Toggle visibility
-      if (this.visible) {
-        this.hide(true)
-      } else {
-        this.show()
-      }
-    },
-    // Mousedown handler for the toggle
-    /* istanbul ignore next */
-    onMousedown(event) {
-      // We prevent the 'mousedown' event for the toggle to stop the
-      // 'focusin' event from being fired
-      // The event would otherwise be picked up by the global 'focusin'
-      // listener and there is no cross-browser solution to detect it
-      // relates to the toggle click
-      // The 'click' event will still be fired and we handle closing
-      // other dropdowns there too
-      // See https://github.com/bootstrap-vue/bootstrap-vue/issues/4328
-      stopEvent(event, { propagation: false })
-    },
-    // Called from dropdown menu context
-    onKeydown(event) {
-      const { keyCode } = event
-      if (keyCode === CODE_ESC) {
-        // Close on ESC
-        this.onEsc(event)
-      } else if (keyCode === CODE_DOWN) {
-        // Down Arrow
-        this.focusNext(event, false)
-      } else if (keyCode === CODE_UP) {
-        // Up Arrow
-        this.focusNext(event, true)
-      }
-    },
-    // If user presses ESC, close the menu
-    onEsc(event) {
-      if (this.visible) {
-        this.visible = false
-        stopEvent(event)
-        // Return focus to original trigger button
-        this.$once(EVENT_NAME_HIDDEN, this.focusToggler)
-      }
-    },
-    // Called only in split button mode, for the split button
-    onSplitClick(event) {
-      /* istanbul ignore next */
-      if (this.disabled) {
-        this.visible = false
-        return
-      }
-      this.$emit(EVENT_NAME_CLICK, event)
-    },
-    // Shared hide handler between click-out and focus-in events
-    hideHandler(event) {
-      const { target } = event
-      if (this.visible && !contains(this.$refs.menu, target) && !contains(this.toggler, target)) {
-        this.clearHideTimeout()
-        this.$_hideTimeout = setTimeout(() => this.hide(), this.hideDelay)
-      }
-    },
-    // Document click-out listener
-    clickOutHandler(event) {
-      this.hideHandler(event)
-    },
-    // Document focus-in listener
-    focusInHandler(event) {
-      this.hideHandler(event)
-    },
-    // Keyboard nav
-    focusNext(event, up) {
-      // Ignore key up/down on form elements
-      const { target } = event
-      if (!this.visible || (event && closest(SELECTOR_FORM_CHILD, target))) {
-        /* istanbul ignore next: should never happen */
-        return
-      }
-      stopEvent(event)
-      this.$nextTick(() => {
-        const items = this.getItems()
-        if (items.length < 1) {
-          /* istanbul ignore next: should never happen */
-          return
-        }
-        let index = items.indexOf(target)
-        if (up && index > 0) {
-          index--
-        } else if (!up && index < items.length - 1) {
-          index++
-        }
-        if (index < 0) {
-          /* istanbul ignore next: should never happen */
-          index = 0
-        }
-        this.focusItem(index, items)
-      })
-    },
-    focusItem(index, items) {
-      const el = items.find((el, i) => i === index)
-      attemptFocus(el)
-    },
-    getItems() {
-      // Get all items
-      return filterVisibles(selectAll(SELECTOR_ITEM, this.$refs.menu))
-    },
-    focusMenu() {
-      attemptFocus(this.$refs.menu)
-    },
-    focusToggler() {
-      this.$nextTick(() => {
-        attemptFocus(this.toggler)
-      })
-    }
-  }
-})

package/src/vendor/bootstrap-vue/src/mixins/focus-in.js

@@ -1,44 +0,0 @@
-import { extend } from '../vue'
-import { EVENT_OPTIONS_NO_CAPTURE } from '../constants/events'
-import { eventOn, eventOff } from '../utils/events'
-
-// @vue/component
-export const focusInMixin = extend({
-  data() {
-    return {
-      listenForFocusIn: false
-    }
-  },
-  watch: {
-    listenForFocusIn(newValue, oldValue) {
-      if (newValue !== oldValue) {
-        eventOff(this.focusInElement, 'focusin', this._focusInHandler, EVENT_OPTIONS_NO_CAPTURE)
-        if (newValue) {
-          eventOn(this.focusInElement, 'focusin', this._focusInHandler, EVENT_OPTIONS_NO_CAPTURE)
-        }
-      }
-    }
-  },
-  beforeCreate() {
-    // Declare non-reactive properties
-    this.focusInElement = null
-  },
-  mounted() {
-    if (!this.focusInElement) {
-      this.focusInElement = document
-    }
-    if (this.listenForFocusIn) {
-      eventOn(this.focusInElement, 'focusin', this._focusInHandler, EVENT_OPTIONS_NO_CAPTURE)
-    }
-  },
-  beforeDestroy() {
-    eventOff(this.focusInElement, 'focusin', this._focusInHandler, EVENT_OPTIONS_NO_CAPTURE)
-  },
-  methods: {
-    _focusInHandler(event) {
-      if (this.focusInHandler) {
-        this.focusInHandler(event)
-      }
-    }
-  }
-})

package/src/vendor/bootstrap-vue/src/mixins/focus-in.spec.js

@@ -1,53 +0,0 @@
-import { mount } from '@vue/test-utils'
-import { waitNT } from '../../tests/utils'
-import { focusInMixin } from './focus-in'
-
-describe('mixins/focus-in', () => {
-  it('works', async () => {
-    let count = 0
-    const App = {
-      mixins: [focusInMixin],
-      // listenForFocusIn comes from the mixin
-      created() {
-        this.listenForFocusIn = true
-      },
-      methods: {
-        focusInHandler() {
-          count++
-        }
-      },
-      render(h) {
-        return h('div', [h('button', 'button')])
-      }
-    }
-
-    const wrapper = mount(App, {
-      attachTo: document.body
-    })
-
-    const focusinEvent = new FocusEvent('focusin')
-
-    expect(wrapper).toBeDefined()
-    expect(count).toBe(0)
-    expect(wrapper.vm.listenForFocusIn).toBe(true)
-
-    // When this.listenForFocusIn is true
-    expect(count).toBe(0)
-    await wrapper.find('button').trigger('focusin')
-    expect(count).toBe(1)
-    document.dispatchEvent(focusinEvent)
-    await waitNT(wrapper.vm)
-    expect(count).toBe(2)
-
-    // When this.listenForFocusIn is false
-    await wrapper.setData({ listenForFocusIn: false })
-    expect(count).toBe(2)
-    await wrapper.find('button').trigger('focusin')
-    expect(count).toBe(2)
-    document.dispatchEvent(focusinEvent)
-    await waitNT(wrapper.vm)
-    expect(count).toBe(2)
-
-    wrapper.destroy()
-  })
-})

package/src/vendor/bootstrap-vue/src/mixins/form-control.js

@@ -1,51 +0,0 @@
-import { extend } from '../vue'
-import { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING } from '../constants/props'
-import { attemptFocus, isVisible, matches, requestAF, select } from '../utils/dom'
-import { makeProp, makePropsConfigurable } from '../utils/props'
-
-// --- Constants ---
-
-const SELECTOR = 'input, textarea, select'
-
-// --- Props ---
-
-export const props = makePropsConfigurable(
-  {
-    autofocus: makeProp(PROP_TYPE_BOOLEAN, false),
-    disabled: makeProp(PROP_TYPE_BOOLEAN, false),
-    form: makeProp(PROP_TYPE_STRING),
-    id: makeProp(PROP_TYPE_STRING),
-    name: makeProp(PROP_TYPE_STRING),
-    required: makeProp(PROP_TYPE_BOOLEAN, false)
-  },
-  'formControls'
-)
-
-// --- Mixin ---
-
-// @vue/component
-export const formControlMixin = extend({
-  props,
-  mounted() {
-    this.handleAutofocus()
-  },
-  /* istanbul ignore next */
-  activated() {
-    this.handleAutofocus()
-  },
-  methods: {
-    handleAutofocus() {
-      this.$nextTick(() => {
-        requestAF(() => {
-          let el = this.$el
-          if (this.autofocus && isVisible(el)) {
-            if (!matches(el, SELECTOR)) {
-              el = select(SELECTOR, el)
-            }
-            attemptFocus(el)
-          }
-        })
-      })
-    }
-  }
-})

package/src/vendor/bootstrap-vue/src/mixins/form-custom.js

@@ -1,24 +0,0 @@
-import { extend } from '../vue'
-import { PROP_TYPE_BOOLEAN } from '../constants/props'
-import { makeProp, makePropsConfigurable } from '../utils/props'
-
-// --- Props ---
-
-export const props = makePropsConfigurable(
-  {
-    plain: makeProp(PROP_TYPE_BOOLEAN, false)
-  },
-  'formControls'
-)
-
-// --- Mixin ---
-
-// @vue/component
-export const formCustomMixin = extend({
-  props,
-  computed: {
-    custom() {
-      return !this.plain
-    }
-  }
-})

package/src/vendor/bootstrap-vue/src/mixins/form-options.js

@@ -1,73 +0,0 @@
-import { extend } from '../vue'
-import { PROP_TYPE_ARRAY_OBJECT, PROP_TYPE_STRING } from '../constants/props'
-import { get } from '../utils/get'
-import { stripTags } from '../utils/html'
-import { isArray, isPlainObject, isUndefined } from '../utils/inspect'
-import { keys } from '../utils/object'
-import { makeProp, makePropsConfigurable } from '../utils/props'
-import { warn } from '../utils/warn'
-
-// --- Constants ---
-
-const OPTIONS_OBJECT_DEPRECATED_MSG =
-  'Setting prop "options" to an object is deprecated. Use the array format instead.'
-
-// --- Props ---
-
-export const props = makePropsConfigurable(
-  {
-    disabledField: makeProp(PROP_TYPE_STRING, 'disabled'),
-    htmlField: makeProp(PROP_TYPE_STRING, 'html'),
-    options: makeProp(PROP_TYPE_ARRAY_OBJECT, []),
-    textField: makeProp(PROP_TYPE_STRING, 'text'),
-    valueField: makeProp(PROP_TYPE_STRING, 'value')
-  },
-  'formOptionControls'
-)
-
-// --- Mixin ---
-
-// @vue/component
-export const formOptionsMixin = extend({
-  props,
-  computed: {
-    formOptions() {
-      return this.normalizeOptions(this.options)
-    }
-  },
-  methods: {
-    normalizeOption(option, key = null) {
-      // When the option is an object, normalize it
-      if (isPlainObject(option)) {
-        const value = get(option, this.valueField)
-        const text = get(option, this.textField)
-        return {
-          value: isUndefined(value) ? key || text : value,
-          text: stripTags(String(isUndefined(text) ? key : text)),
-          html: get(option, this.htmlField),
-          disabled: Boolean(get(option, this.disabledField))
-        }
-      }
-      // Otherwise create an `<option>` object from the given value
-      return {
-        value: key || option,
-        text: stripTags(String(option)),
-        disabled: false
-      }
-    },
-    normalizeOptions(options) {
-      // Normalize the given options array
-      if (isArray(options)) {
-        return options.map(option => this.normalizeOption(option))
-      } else if (isPlainObject(options)) {
-        // Deprecate the object options format
-        warn(OPTIONS_OBJECT_DEPRECATED_MSG, this.$options.name)
-        // Normalize a `options` object to an array of options
-        return keys(options).map(key => this.normalizeOption(options[key] || {}, key))
-      }
-      // If not an array or object, return an empty array
-      /* istanbul ignore next */
-      return []
-    }
-  }
-})