@gitlab/duo-ui 3.0.0 → 4.0.0

package/src/vendor/bootstrap-vue/src/components/table/helpers/mixin-sorting.js

@@ -1,299 +0,0 @@
-import { extend } from '../../../vue'
-import {
-  EVENT_NAME_HEAD_CLICKED,
-  EVENT_NAME_SORT_CHANGED,
-  MODEL_EVENT_NAME_PREFIX
-} from '../../../constants/events'
-import {
-  PROP_TYPE_ARRAY_STRING,
-  PROP_TYPE_BOOLEAN,
-  PROP_TYPE_FUNCTION,
-  PROP_TYPE_OBJECT,
-  PROP_TYPE_STRING
-} from '../../../constants/props'
-import { arrayIncludes } from '../../../utils/array'
-import { isFunction, isUndefinedOrNull } from '../../../utils/inspect'
-import { makeProp } from '../../../utils/props'
-import { safeVueInstance } from '../../../utils/safe-vue-instance'
-import { stableSort } from '../../../utils/stable-sort'
-import { trim } from '../../../utils/string'
-import { defaultSortCompare } from './default-sort-compare'
-
-// --- Constants ---
-
-const MODEL_PROP_NAME_SORT_BY = 'sortBy'
-const MODEL_EVENT_NAME_SORT_BY = MODEL_EVENT_NAME_PREFIX + MODEL_PROP_NAME_SORT_BY
-
-const MODEL_PROP_NAME_SORT_DESC = 'sortDesc'
-const MODEL_EVENT_NAME_SORT_DESC = MODEL_EVENT_NAME_PREFIX + MODEL_PROP_NAME_SORT_DESC
-
-const SORT_DIRECTION_ASC = 'asc'
-const SORT_DIRECTION_DESC = 'desc'
-const SORT_DIRECTION_LAST = 'last'
-const SORT_DIRECTIONS = [SORT_DIRECTION_ASC, SORT_DIRECTION_DESC, SORT_DIRECTION_LAST]
-
-// --- Props ---
-
-export const props = {
-  labelSortAsc: makeProp(PROP_TYPE_STRING, 'Click to sort ascending'),
-  labelSortClear: makeProp(PROP_TYPE_STRING, 'Click to clear sorting'),
-  labelSortDesc: makeProp(PROP_TYPE_STRING, 'Click to sort descending'),
-  noFooterSorting: makeProp(PROP_TYPE_BOOLEAN, false),
-  noLocalSorting: makeProp(PROP_TYPE_BOOLEAN, false),
-  // Another prop that should have had a better name
-  // It should be `noSortClear` (on non-sortable headers)
-  // We will need to make sure the documentation is clear on what
-  // this prop does (as well as in the code for future reference)
-  noSortReset: makeProp(PROP_TYPE_BOOLEAN, false),
-  [MODEL_PROP_NAME_SORT_BY]: makeProp(PROP_TYPE_STRING),
-  sortCompare: makeProp(PROP_TYPE_FUNCTION),
-  // String: locale code
-  // Array: array of Locale strings
-  sortCompareLocale: makeProp(PROP_TYPE_ARRAY_STRING),
-  // Supported localCompare options, see `options` section of:
-  // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare
-  sortCompareOptions: makeProp(PROP_TYPE_OBJECT, { numeric: true }),
-  // TODO: Make this tri-state: `true`, `false`, `null`
-  [MODEL_PROP_NAME_SORT_DESC]: makeProp(PROP_TYPE_BOOLEAN, false),
-  // This prop is named incorrectly
-  // It should be `initialSortDirection` as it is a bit misleading
-  // (not to mention it screws up the ARIA label on the headers)
-  sortDirection: makeProp(PROP_TYPE_STRING, SORT_DIRECTION_ASC, value => {
-    return arrayIncludes(SORT_DIRECTIONS, value)
-  }),
-  // Place the sorting icon on the left of the header cells
-  sortIconLeft: makeProp(PROP_TYPE_BOOLEAN, false),
-  // Sort null and undefined to appear last
-  sortNullLast: makeProp(PROP_TYPE_BOOLEAN, false)
-}
-
-// --- Mixin ---
-
-// @vue/component
-export const sortingMixin = extend({
-  props,
-  data() {
-    return {
-      localSortBy: this[MODEL_PROP_NAME_SORT_BY] || '',
-      localSortDesc: this[MODEL_PROP_NAME_SORT_DESC] || false
-    }
-  },
-  computed: {
-    localSorting() {
-      return this.hasProvider ? !!this.noProviderSorting : !this.noLocalSorting
-    },
-    isSortable() {
-      return this.computedFields.some(f => f.sortable)
-    },
-    // Sorts the filtered items and returns a new array of the sorted items
-    // When not sorted, the original items array will be returned
-    sortedItems() {
-      const {
-        localSortBy: sortBy,
-        localSortDesc: sortDesc,
-        sortCompareLocale: locale,
-        sortNullLast: nullLast,
-        sortCompare,
-        localSorting,
-        filteredItems,
-        localItems
-      } = safeVueInstance(this)
-      const items = (filteredItems || localItems || []).slice()
-      const localeOptions = { ...this.sortCompareOptions, usage: 'sort' }
-
-      if (sortBy && localSorting) {
-        const field = this.computedFieldsObj[sortBy] || {}
-        const sortByFormatted = field.sortByFormatted
-        const formatter = isFunction(sortByFormatted)
-          ? /* istanbul ignore next */ sortByFormatted
-          : sortByFormatted
-            ? this.getFieldFormatter(sortBy)
-            : undefined
-
-        // `stableSort` returns a new array, and leaves the original array intact
-        return stableSort(items, (a, b) => {
-          let result = null
-          // Call user provided `sortCompare` routine first
-          if (isFunction(sortCompare)) {
-            // TODO:
-            //   Change the `sortCompare` signature to the one of `defaultSortCompare`
-            //   with the next major version bump
-            result = sortCompare(a, b, sortBy, sortDesc, formatter, localeOptions, locale)
-          }
-          // Fallback to built-in `defaultSortCompare` if `sortCompare`
-          // is not defined or returns `null`/`false`
-          if (isUndefinedOrNull(result) || result === false) {
-            result = defaultSortCompare(a, b, {
-              sortBy,
-              formatter,
-              locale,
-              localeOptions,
-              nullLast
-            })
-          }
-          // Negate result if sorting in descending order
-          return (result || 0) * (sortDesc ? -1 : 1)
-        })
-      }
-
-      return items
-    }
-  },
-  watch: {
-    /* istanbul ignore next: pain in the butt to test */
-    isSortable(newValue) {
-      if (newValue) {
-        if (this.isSortable) {
-          this.$on(EVENT_NAME_HEAD_CLICKED, this.handleSort)
-        }
-      } else {
-        this.$off(EVENT_NAME_HEAD_CLICKED, this.handleSort)
-      }
-    },
-    [MODEL_PROP_NAME_SORT_DESC](newValue) {
-      /* istanbul ignore next */
-      if (newValue === this.localSortDesc) {
-        return
-      }
-      this.localSortDesc = newValue || false
-    },
-    [MODEL_PROP_NAME_SORT_BY](newValue) {
-      /* istanbul ignore next */
-      if (newValue === this.localSortBy) {
-        return
-      }
-      this.localSortBy = newValue || ''
-    },
-    // Update .sync props
-    localSortDesc(newValue, oldValue) {
-      // Emit update to sort-desc.sync
-      if (newValue !== oldValue) {
-        this.$emit(MODEL_EVENT_NAME_SORT_DESC, newValue)
-      }
-    },
-    localSortBy(newValue, oldValue) {
-      if (newValue !== oldValue) {
-        this.$emit(MODEL_EVENT_NAME_SORT_BY, newValue)
-      }
-    }
-  },
-  created() {
-    if (this.isSortable) {
-      this.$on(EVENT_NAME_HEAD_CLICKED, this.handleSort)
-    }
-  },
-  methods: {
-    // Handlers
-    // Need to move from thead-mixin
-    handleSort(key, field, event, isFoot) {
-      if (!this.isSortable) {
-        /* istanbul ignore next */
-        return
-      }
-      if (isFoot && this.noFooterSorting) {
-        return
-      }
-      // TODO: make this tri-state sorting
-      // cycle desc => asc => none => desc => ...
-      let sortChanged = false
-      const toggleLocalSortDesc = () => {
-        const sortDirection = field.sortDirection || this.sortDirection
-        if (sortDirection === SORT_DIRECTION_ASC) {
-          this.localSortDesc = false
-        } else if (sortDirection === SORT_DIRECTION_DESC) {
-          this.localSortDesc = true
-        } else {
-          // sortDirection === 'last'
-          // Leave at last sort direction from previous column
-        }
-      }
-      if (field.sortable) {
-        const sortKey = !this.localSorting && field.sortKey ? field.sortKey : key
-        if (this.localSortBy === sortKey) {
-          // Change sorting direction on current column
-          this.localSortDesc = !this.localSortDesc
-        } else {
-          // Start sorting this column ascending
-          this.localSortBy = sortKey
-          // this.localSortDesc = false
-          toggleLocalSortDesc()
-        }
-        sortChanged = true
-      } else if (this.localSortBy && !this.noSortReset) {
-        this.localSortBy = ''
-        toggleLocalSortDesc()
-        sortChanged = true
-      }
-      if (sortChanged) {
-        // Sorting parameters changed
-        this.$emit(EVENT_NAME_SORT_CHANGED, this.context)
-      }
-    },
-    // methods to compute classes and attrs for thead>th cells
-    sortTheadThClasses(key, field, isFoot) {
-      return {
-        // If sortable and sortIconLeft are true, then place sort icon on the left
-        'b-table-sort-icon-left':
-          field.sortable && this.sortIconLeft && !(isFoot && this.noFooterSorting)
-      }
-    },
-    sortTheadThAttrs(key, field, isFoot) {
-      const { isSortable, noFooterSorting, localSortDesc, localSortBy, localSorting } = this
-      if (!isSortable || (isFoot && noFooterSorting)) {
-        // No attributes if not a sortable table
-        return {}
-      }
-
-      const sortable = field.sortable
-      const sortKey = !localSorting ? field.sortKey ?? key : key
-
-      // Assemble the aria-sort attribute value
-      const ariaSort =
-        sortable && localSortBy === sortKey
-          ? localSortDesc
-            ? 'descending'
-            : 'ascending'
-          : sortable
-            ? 'none'
-            : null
-      // Return the attribute
-      return {
-        'aria-sort': ariaSort
-      }
-    },
-    // A label to be placed in an `.sr-only` element in the header cell
-    sortTheadThLabel(key, field, isFoot) {
-      // No label if not a sortable table
-      if (!this.isSortable || (isFoot && this.noFooterSorting)) {
-        return null
-      }
-      const { localSortBy, localSortDesc, labelSortAsc, labelSortDesc } = this
-      const { sortable } = field
-      // The correctness of these labels is very important for screen reader users
-      let labelSorting = ''
-      if (sortable) {
-        if (localSortBy === key) {
-          // Currently sorted sortable column
-          labelSorting = localSortDesc ? labelSortAsc : labelSortDesc
-        } else {
-          // Not currently sorted sortable column
-          // Not using nested ternary's here for clarity/readability
-          // Default for `aria-label`
-          labelSorting = localSortDesc ? labelSortDesc : labelSortAsc
-          // Handle `sortDirection` setting
-          const sortDirection = this.sortDirection || field.sortDirection
-          if (sortDirection === SORT_DIRECTION_ASC) {
-            labelSorting = labelSortAsc
-          } else if (sortDirection === SORT_DIRECTION_DESC) {
-            labelSorting = labelSortDesc
-          }
-        }
-      } else if (!this.noSortReset) {
-        // Non sortable column
-        labelSorting = localSortBy ? this.labelSortClear : ''
-      }
-      // Return the `.sr-only` sort label or `null` if no label
-      return trim(labelSorting) || null
-    }
-  }
-})

package/src/vendor/bootstrap-vue/src/components/table/helpers/mixin-stacked.js

@@ -1,33 +0,0 @@
-import { extend } from '../../../vue'
-import { PROP_TYPE_BOOLEAN_STRING } from '../../../constants/props'
-import { makeProp } from '../../../utils/props'
-
-// --- Props ---
-
-export const props = {
-  stacked: makeProp(PROP_TYPE_BOOLEAN_STRING, false)
-}
-
-// --- Mixin ---
-
-// @vue/component
-export const stackedMixin = extend({
-  props,
-  computed: {
-    isStacked() {
-      const { stacked } = this
-      // `true` when always stacked, or returns breakpoint specified
-      return stacked === '' ? true : stacked
-    },
-    isStackedAlways() {
-      return this.isStacked === true
-    },
-    stackedTableClasses() {
-      const { isStackedAlways } = this
-      return {
-        'b-table-stacked': isStackedAlways,
-        [`b-table-stacked-${this.stacked}`]: !isStackedAlways && this.isStacked
-      }
-    }
-  }
-})

package/src/vendor/bootstrap-vue/src/components/table/helpers/mixin-table-renderer.js

@@ -1,209 +0,0 @@
-import { extend } from '../../../vue'
-import {
-  PROP_TYPE_ARRAY_OBJECT_STRING,
-  PROP_TYPE_BOOLEAN,
-  PROP_TYPE_BOOLEAN_STRING,
-  PROP_TYPE_STRING
-} from '../../../constants/props'
-import { identity } from '../../../utils/identity'
-import { isBoolean } from '../../../utils/inspect'
-import { makeProp } from '../../../utils/props'
-import { safeVueInstance } from '../../../utils/safe-vue-instance'
-import { toString } from '../../../utils/string'
-import { attrsMixin } from '../../../mixins/attrs'
-
-// Main `<table>` render mixin
-// Includes all main table styling options
-
-// --- Props ---
-
-export const props = {
-  bordered: makeProp(PROP_TYPE_BOOLEAN, false),
-  borderless: makeProp(PROP_TYPE_BOOLEAN, false),
-  captionTop: makeProp(PROP_TYPE_BOOLEAN, false),
-  dark: makeProp(PROP_TYPE_BOOLEAN, false),
-  fixed: makeProp(PROP_TYPE_BOOLEAN, false),
-  hover: makeProp(PROP_TYPE_BOOLEAN, false),
-  noBorderCollapse: makeProp(PROP_TYPE_BOOLEAN, false),
-  outlined: makeProp(PROP_TYPE_BOOLEAN, false),
-  responsive: makeProp(PROP_TYPE_BOOLEAN_STRING, false),
-  small: makeProp(PROP_TYPE_BOOLEAN, false),
-  // If a string, it is assumed to be the table `max-height` value
-  stickyHeader: makeProp(PROP_TYPE_BOOLEAN_STRING, false),
-  striped: makeProp(PROP_TYPE_BOOLEAN, false),
-  tableClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING),
-  tableVariant: makeProp(PROP_TYPE_STRING)
-}
-
-// --- Mixin ---
-
-// @vue/component
-export const tableRendererMixin = extend({
-  mixins: [attrsMixin],
-  provide() {
-    return {
-      getBvTable: () => this
-    }
-  },
-  // Don't place attributes on root element automatically,
-  // as table could be wrapped in responsive `<div>`
-  inheritAttrs: false,
-  props,
-  computed: {
-    isTableSimple() {
-      return false
-    },
-    // Layout related computed props
-    isResponsive() {
-      const { responsive } = this
-      return responsive === '' ? true : responsive
-    },
-    isStickyHeader() {
-      let { stickyHeader } = this
-      stickyHeader = stickyHeader === '' ? true : stickyHeader
-      return this.isStacked ? false : stickyHeader
-    },
-    wrapperClasses() {
-      const { isResponsive } = this
-      return [
-        this.isStickyHeader ? 'b-table-sticky-header' : '',
-        isResponsive === true
-          ? 'table-responsive'
-          : isResponsive
-            ? `table-responsive-${this.responsive}`
-            : ''
-      ].filter(identity)
-    },
-    wrapperStyles() {
-      const { isStickyHeader } = this
-      return isStickyHeader && !isBoolean(isStickyHeader) ? { maxHeight: isStickyHeader } : {}
-    },
-    tableClasses() {
-      let {
-        hover,
-        tableVariant,
-        selectableTableClasses,
-        stackedTableClasses,
-        tableClass,
-        computedBusy
-      } = safeVueInstance(this)
-      hover = this.isTableSimple ? hover : hover && this.computedItems.length > 0 && !computedBusy
-
-      return [
-        // User supplied classes
-        tableClass,
-        // Styling classes
-        {
-          'table-striped': this.striped,
-          'table-hover': hover,
-          'table-dark': this.dark,
-          'table-bordered': this.bordered,
-          'table-borderless': this.borderless,
-          'table-sm': this.small,
-          // The following are b-table custom styles
-          border: this.outlined,
-          'b-table-fixed': this.fixed,
-          'b-table-caption-top': this.captionTop,
-          'b-table-no-border-collapse': this.noBorderCollapse
-        },
-        tableVariant ? `${this.dark ? 'bg' : 'table'}-${tableVariant}` : '',
-        // Stacked table classes
-        stackedTableClasses,
-        // Selectable classes
-        selectableTableClasses
-      ]
-    },
-    tableAttrs() {
-      const {
-        computedItems: items,
-        filteredItems,
-        computedFields: fields,
-        selectableTableAttrs,
-        computedBusy
-      } = safeVueInstance(this)
-
-      const ariaAttrs = this.isTableSimple
-        ? {}
-        : {
-            'aria-busy': toString(computedBusy),
-            'aria-colcount': toString(fields.length),
-            // Preserve user supplied `aria-describedby`, if provided
-            'aria-describedby':
-              this.bvAttrs['aria-describedby'] || this.$refs.caption ? this.captionId : null
-          }
-
-      const rowCount =
-        items && filteredItems && filteredItems.length > items.length
-          ? toString(filteredItems.length)
-          : null
-
-      return {
-        // We set `aria-rowcount` before merging in `$attrs`,
-        // in case user has supplied their own
-        'aria-rowcount': rowCount,
-        // Merge in user supplied `$attrs` if any
-        ...this.bvAttrs,
-        // Now we can override any `$attrs` here
-        id: this.safeId(),
-        role: this.bvAttrs.role || 'table',
-        ...ariaAttrs,
-        ...selectableTableAttrs
-      }
-    }
-  },
-  render(h) {
-    const {
-      wrapperClasses,
-      renderCaption,
-      renderColgroup,
-      renderThead,
-      renderTbody,
-      renderTfoot
-    } = safeVueInstance(this)
-
-    const $content = []
-    if (this.isTableSimple) {
-      $content.push(this.normalizeSlot())
-    } else {
-      // Build the `<caption>` (from caption mixin)
-      $content.push(renderCaption ? renderCaption() : null)
-
-      // Build the `<colgroup>`
-      $content.push(renderColgroup ? renderColgroup() : null)
-
-      // Build the `<thead>`
-      $content.push(renderThead ? renderThead() : null)
-
-      // Build the `<tbody>`
-      $content.push(renderTbody ? renderTbody() : null)
-
-      // Build the `<tfoot>`
-      $content.push(renderTfoot ? renderTfoot() : null)
-    }
-
-    // Assemble `<table>`
-    const $table = h(
-      'table',
-      {
-        staticClass: 'table b-table',
-        class: this.tableClasses,
-        attrs: this.tableAttrs,
-        key: 'b-table'
-      },
-      $content.filter(identity)
-    )
-
-    // Add responsive/sticky wrapper if needed and return table
-    return wrapperClasses.length > 0
-      ? h(
-          'div',
-          {
-            class: wrapperClasses,
-            style: this.wrapperStyles,
-            key: 'wrap'
-          },
-          [$table]
-        )
-      : $table
-  }
-})