@gitlab/ui 131.2.0 → 131.3.1

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

@@ -1,213 +0,0 @@
-import { extend } from '../../../vue';
-import { EVENT_NAME_ROW_SELECTED } from '../../../constants/events';
-import { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING } from '../../../constants/props';
-import { arrayIncludes, createArray } from '../../../utils/array';
-import { identity } from '../../../utils/identity';
-import { isArray, isNumber } from '../../../utils/inspect';
-import { looseEqual } from '../../../utils/loose-equal';
-import { mathMin, mathMax } from '../../../utils/math';
-import { makeProp } from '../../../utils/props';
-import { toString } from '../../../utils/string';
-import { sanitizeRow } from './sanitize-row';
-
-// --- Constants ---
-
-const SELECT_MODES = ['range', 'multi', 'single'];
-const ROLE_GRID = 'grid';
-
-// --- Props ---
-
-const props = {
-  // Disable use of click handlers for row selection
-  noSelectOnClick: makeProp(PROP_TYPE_BOOLEAN, false),
-  selectMode: makeProp(PROP_TYPE_STRING, 'multi', value => {
-    return arrayIncludes(SELECT_MODES, value);
-  }),
-  selectable: makeProp(PROP_TYPE_BOOLEAN, false),
-  selectedVariant: makeProp(PROP_TYPE_STRING, 'active')
-};
-
-// --- Mixin ---
-
-// @vue/component
-const selectableMixin = extend({
-  props,
-  data() {
-    return {
-      selectedRows: [],
-      selectedLastRow: -1
-    };
-  },
-  computed: {
-    isSelectable() {
-      return this.selectable && this.selectMode;
-    },
-    hasSelectableRowClick() {
-      return this.isSelectable && !this.noSelectOnClick;
-    },
-    supportsSelectableRows() {
-      return true;
-    },
-    selectableHasSelection() {
-      const {
-        selectedRows
-      } = this;
-      return this.isSelectable && selectedRows && selectedRows.length > 0 && selectedRows.some(identity);
-    },
-    selectableIsMultiSelect() {
-      return this.isSelectable && arrayIncludes(['range', 'multi'], this.selectMode);
-    },
-    selectableTableClasses() {
-      const {
-        isSelectable
-      } = this;
-      return {
-        'b-table-selectable': isSelectable,
-        [`b-table-select-${this.selectMode}`]: isSelectable,
-        'b-table-selecting': this.selectableHasSelection,
-        'b-table-selectable-no-click': isSelectable && !this.hasSelectableRowClick
-      };
-    },
-    selectableTableAttrs() {
-      if (!this.isSelectable) {
-        return {};
-      }
-      const role = this.bvAttrs.role || ROLE_GRID;
-      return {
-        role,
-        // TODO:
-        //   Should this attribute not be included when `no-select-on-click` is set
-        //   since this attribute implies keyboard navigation?
-        'aria-multiselectable': role === ROLE_GRID ? toString(this.selectableIsMultiSelect) : null
-      };
-    }
-  },
-  watch: {
-    computedItems(newValue, oldValue) {
-      // Reset for selectable
-      let equal = false;
-      if (this.isSelectable && this.selectedRows.length > 0) {
-        // Quick check against array length
-        equal = isArray(newValue) && isArray(oldValue) && newValue.length === oldValue.length;
-        for (let i = 0; equal && i < newValue.length; i++) {
-          // Look for the first non-loosely equal row, after ignoring reserved fields
-          equal = looseEqual(sanitizeRow(newValue[i]), sanitizeRow(oldValue[i]));
-        }
-      }
-      if (!equal) {
-        this.clearSelected();
-      }
-    },
-    selectable() {
-      this.clearSelected();
-    },
-    selectMode() {
-      this.clearSelected();
-    },
-    hasSelectableRowClick() {
-      this.clearSelected();
-    },
-    selectedRows(selectedRows, oldValue) {
-      if (this.isSelectable && !looseEqual(selectedRows, oldValue)) {
-        const items = [];
-        // `.forEach()` skips over non-existent indices (on sparse arrays)
-        selectedRows.forEach((v, idx) => {
-          if (v) {
-            items.push(this.computedItems[idx]);
-          }
-        });
-        this.$emit(EVENT_NAME_ROW_SELECTED, items);
-      }
-    }
-  },
-  methods: {
-    // Public methods
-    selectRow(index) {
-      // Select a particular row (indexed based on computedItems)
-      if (this.isSelectable && isNumber(index) && index >= 0 && index < this.computedItems.length && !this.isRowSelected(index)) {
-        const selectedRows = this.selectableIsMultiSelect ? this.selectedRows.slice() : [];
-        selectedRows[index] = true;
-        this.selectedLastClicked = -1;
-        this.selectedRows = selectedRows;
-      }
-    },
-    unselectRow(index) {
-      // Un-select a particular row (indexed based on `computedItems`)
-      if (this.isSelectable && isNumber(index) && this.isRowSelected(index)) {
-        const selectedRows = this.selectedRows.slice();
-        selectedRows[index] = false;
-        this.selectedLastClicked = -1;
-        this.selectedRows = selectedRows;
-      }
-    },
-    selectAllRows() {
-      const length = this.computedItems.length;
-      if (this.isSelectable && length > 0) {
-        this.selectedLastClicked = -1;
-        this.selectedRows = this.selectableIsMultiSelect ? createArray(length, true) : [true];
-      }
-    },
-    isRowSelected(index) {
-      // Determine if a row is selected (indexed based on `computedItems`)
-      return !!(isNumber(index) && this.selectedRows[index]);
-    },
-    clearSelected() {
-      // Clear any active selected row(s)
-      this.selectedLastClicked = -1;
-      this.selectedRows = [];
-    },
-    // Internal private methods
-    selectableRowClasses(index) {
-      if (this.isSelectable && this.isRowSelected(index)) {
-        const variant = this.selectedVariant;
-        return {
-          'b-table-row-selected': true,
-          [`${this.dark ? 'bg' : 'table'}-${variant}`]: variant
-        };
-      }
-      return {};
-    },
-    selectableRowAttrs(index) {
-      return {
-        'aria-selected': !this.isSelectable ? null : this.isRowSelected(index) ? 'true' : 'false'
-      };
-    },
-    selectionHandler(item, index, event) {
-      /* istanbul ignore if: should never happen */
-      if (!this.isSelectable || this.noSelectOnClick) {
-        // Don't do anything if table is not in selectable mode
-        this.clearSelected();
-        return;
-      }
-      const {
-        selectMode,
-        selectedLastRow
-      } = this;
-      let selectedRows = this.selectedRows.slice();
-      let selected = !selectedRows[index];
-      // Note 'multi' mode needs no special event handling
-      if (selectMode === 'single') {
-        selectedRows = [];
-      } else if (selectMode === 'range') {
-        if (selectedLastRow > -1 && event.shiftKey) {
-          // range
-          for (let idx = mathMin(selectedLastRow, index); idx <= mathMax(selectedLastRow, index); idx++) {
-            selectedRows[idx] = true;
-          }
-          selected = true;
-        } else {
-          if (!(event.ctrlKey || event.metaKey)) {
-            // Clear range selection if any
-            selectedRows = [];
-            selected = true;
-          }
-          if (selected) this.selectedLastRow = index;
-        }
-      }
-      selectedRows[index] = selected;
-      this.selectedRows = selectedRows;
-    }
-  }
-});
-
-export { props, selectableMixin };

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

@@ -1,275 +0,0 @@
-import { extend } from '../../../vue';
-import { EVENT_NAME_SORT_CHANGED, MODEL_EVENT_NAME_PREFIX } from '../../../constants/events';
-import { PROP_TYPE_STRING, PROP_TYPE_BOOLEAN, PROP_TYPE_FUNCTION, PROP_TYPE_ARRAY_STRING, PROP_TYPE_OBJECT } 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 ---
-
-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
-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: {
-    [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);
-      }
-    }
-  },
-  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 ;
-      };
-      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) {
-      var _field$sortKey;
-      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 = field.sortKey) !== null && _field$sortKey !== void 0 ? _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 `.gl-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 `.gl-sr-only` sort label or `null` if no label
-      return trim(labelSorting) || null;
-    }
-  }
-});
-
-export { props, sortingMixin };

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

@@ -1,39 +0,0 @@
-import { extend } from '../../../vue';
-import { PROP_TYPE_BOOLEAN_STRING } from '../../../constants/props';
-import { makeProp } from '../../../utils/props';
-
-// --- Props ---
-
-const props = {
-  stacked: makeProp(PROP_TYPE_BOOLEAN_STRING, false)
-};
-
-// --- Mixin ---
-
-// @vue/component
-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
-      };
-    }
-  }
-});
-
-export { props, stackedMixin };