@gitlab/ui 111.6.0 → 111.7.1

package/dist/utils/charts/config.js

@@ -40,10 +40,7 @@ const grid = {
 const defaultChartOptions = {
   grid,
   xAxis,
-  yAxis,
-  aria: {
-    enabled: true
-  }
+  yAxis
 };
 const gridWithSecondaryYAxis = {
   ...grid,

package/dist/vendor/bootstrap-vue/src/constants/components.js

@@ -15,7 +15,6 @@ const NAME_FORM = 'BForm';
 const NAME_FORM_CHECKBOX = 'BFormCheckbox';
 const NAME_FORM_CHECKBOX_GROUP = 'BFormCheckboxGroup';
 const NAME_FORM_GROUP = 'BFormGroup';
-const NAME_FORM_INPUT = 'BFormInput';
 const NAME_FORM_INVALID_FEEDBACK = 'BFormInvalidFeedback';
 const NAME_FORM_RADIO = 'BFormRadio';
 const NAME_FORM_RADIO_GROUP = 'BFormRadioGroup';
@@ -26,11 +25,6 @@ const NAME_FORM_SELECT_OPTION_GROUP = 'BFormSelectOptionGroup';
 const NAME_FORM_TEXT = 'BFormText';
 const NAME_FORM_TEXTAREA = 'BFormTextarea';
 const NAME_FORM_VALID_FEEDBACK = 'BFormValidFeedback';
-const NAME_INPUT_GROUP = 'BInputGroup';
-const NAME_INPUT_GROUP_ADDON = 'BInputGroupAddon';
-const NAME_INPUT_GROUP_APPEND = 'BInputGroupAppend';
-const NAME_INPUT_GROUP_PREPEND = 'BInputGroupPrepend';
-const NAME_INPUT_GROUP_TEXT = 'BInputGroupText';
 const NAME_LINK = 'BLink';
 const NAME_MODAL = 'BModal';
 const NAME_NAV = 'BNav';
@@ -67,4 +61,4 @@ const NAME_TRANSITION = 'BVTransition';
 const NAME_TRANSPORTER = 'BVTransporter';
 const NAME_TRANSPORTER_TARGET = 'BVTransporterTarget';
 
-export { NAME_BUTTON, NAME_BUTTON_CLOSE, NAME_COL, NAME_COLLAPSE, NAME_COLLAPSE_HELPER, NAME_DROPDOWN, NAME_DROPDOWN_DIVIDER, NAME_DROPDOWN_FORM, NAME_DROPDOWN_GROUP, NAME_DROPDOWN_HEADER, NAME_DROPDOWN_ITEM, NAME_DROPDOWN_ITEM_BUTTON, NAME_DROPDOWN_TEXT, NAME_FORM, NAME_FORM_BUTTON_LABEL_CONTROL, NAME_FORM_CHECKBOX, NAME_FORM_CHECKBOX_GROUP, NAME_FORM_GROUP, NAME_FORM_INPUT, NAME_FORM_INVALID_FEEDBACK, NAME_FORM_RADIO, NAME_FORM_RADIO_GROUP, NAME_FORM_RATING_STAR, NAME_FORM_ROW, NAME_FORM_SELECT, NAME_FORM_SELECT_OPTION, NAME_FORM_SELECT_OPTION_GROUP, NAME_FORM_TEXT, NAME_FORM_TEXTAREA, NAME_FORM_VALID_FEEDBACK, NAME_INPUT_GROUP, NAME_INPUT_GROUP_ADDON, NAME_INPUT_GROUP_APPEND, NAME_INPUT_GROUP_PREPEND, NAME_INPUT_GROUP_TEXT, NAME_LINK, NAME_MODAL, NAME_NAV, NAME_NAV_ITEM, NAME_NAV_ITEM_DROPDOWN, NAME_POPOVER, NAME_POPOVER_HELPER, NAME_POPOVER_TEMPLATE, NAME_POPPER, NAME_TAB, NAME_TABLE, NAME_TABLE_CELL, NAME_TABLE_LITE, NAME_TABLE_SIMPLE, NAME_TABS, NAME_TAB_BUTTON_HELPER, NAME_TBODY, NAME_TFOOT, NAME_TH, NAME_THEAD, NAME_TOAST, NAME_TOASTER, NAME_TOAST_POP, NAME_TOOLTIP, NAME_TOOLTIP_HELPER, NAME_TOOLTIP_TEMPLATE, NAME_TR, NAME_TRANSITION, NAME_TRANSPORTER, NAME_TRANSPORTER_TARGET };
+export { NAME_BUTTON, NAME_BUTTON_CLOSE, NAME_COL, NAME_COLLAPSE, NAME_COLLAPSE_HELPER, NAME_DROPDOWN, NAME_DROPDOWN_DIVIDER, NAME_DROPDOWN_FORM, NAME_DROPDOWN_GROUP, NAME_DROPDOWN_HEADER, NAME_DROPDOWN_ITEM, NAME_DROPDOWN_ITEM_BUTTON, NAME_DROPDOWN_TEXT, NAME_FORM, NAME_FORM_BUTTON_LABEL_CONTROL, NAME_FORM_CHECKBOX, NAME_FORM_CHECKBOX_GROUP, NAME_FORM_GROUP, NAME_FORM_INVALID_FEEDBACK, NAME_FORM_RADIO, NAME_FORM_RADIO_GROUP, NAME_FORM_RATING_STAR, NAME_FORM_ROW, NAME_FORM_SELECT, NAME_FORM_SELECT_OPTION, NAME_FORM_SELECT_OPTION_GROUP, NAME_FORM_TEXT, NAME_FORM_TEXTAREA, NAME_FORM_VALID_FEEDBACK, NAME_LINK, NAME_MODAL, NAME_NAV, NAME_NAV_ITEM, NAME_NAV_ITEM_DROPDOWN, NAME_POPOVER, NAME_POPOVER_HELPER, NAME_POPOVER_TEMPLATE, NAME_POPPER, NAME_TAB, NAME_TABLE, NAME_TABLE_CELL, NAME_TABLE_LITE, NAME_TABLE_SIMPLE, NAME_TABS, NAME_TAB_BUTTON_HELPER, NAME_TBODY, NAME_TFOOT, NAME_TH, NAME_THEAD, NAME_TOAST, NAME_TOASTER, NAME_TOAST_POP, NAME_TOOLTIP, NAME_TOOLTIP_HELPER, NAME_TOOLTIP_TEMPLATE, NAME_TR, NAME_TRANSITION, NAME_TRANSPORTER, NAME_TRANSPORTER_TARGET };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gitlab/ui",
-  "version": "111.6.0",
+  "version": "111.7.1",
   "description": "GitLab UI Components",
   "license": "MIT",
   "main": "dist/index.js",

package/src/components/base/button_group/button_group.scss

@@ -23,7 +23,7 @@ $gl-button-group-border-z-index: $gl-button-group-focus-z-index + 1;
   > .gl-button:not(:first-child),
   > .btn-group:not(:first-child) > .gl-button,
   > .gl-new-dropdown:not(:first-child) > .gl-button {
-    @apply gl-relative gl-ml-[1px];
+    @apply gl-relative gl-ml-[1px] gl-isolate;
 
     &::before {
       content: '';

package/src/components/charts/chart/chart.vue

@@ -1,6 +1,7 @@
 <!-- eslint-disable vue/multi-word-component-names -->
 <script>
 import * as echarts from 'echarts';
+import merge from 'lodash/merge';
 import {
   defaultHeight,
   defaultWidth,
@@ -17,16 +18,6 @@ import { debounceByAnimationFrame } from '../../../utils/utils';
  */
 const sizeValidator = (size) => Number.isFinite(size) || size === 'auto' || size == null;
 
-const isChartWithToolbox = (options) => Boolean(options?.toolbox?.show);
-
-const increaseChartGridTop = (options, increaseBy) => ({
-  ...options,
-  grid: {
-    ...options.grid,
-    top: (options?.grid?.top || 0) + increaseBy,
-  },
-});
-
 export default {
   name: 'GlChart',
   directives: {
@@ -90,10 +81,21 @@ export default {
     };
   },
   computed: {
-    normalizedOptions() {
-      return isChartWithToolbox(this.options)
-        ? increaseChartGridTop(this.options, toolboxHeight)
-        : this.options;
+    modifiedOptions() {
+      let options = { ...this.options };
+
+      // Enable aria by default
+      if (options.aria?.enabled === undefined) {
+        options = merge({}, options, { aria: { enabled: true } });
+      }
+
+      // Add space at the top to fit the toolbox
+      if (options.toolbox?.show === true) {
+        const top = (options.grid?.top || 0) + toolboxHeight;
+        options = merge({}, options, { grid: { top } });
+      }
+
+      return options;
     },
   },
   watch: {
@@ -143,12 +145,7 @@ export default {
   },
   methods: {
     draw() {
-      this.chart.setOption({
-        ...this.normalizedOptions,
-        aria: {
-          enabled: true,
-        },
-      });
+      this.chart.setOption(this.modifiedOptions);
       /**
        * Emitted after calling `echarts.setOption`
        */

package/src/utils/charts/config.js

@@ -46,9 +46,6 @@ export const defaultChartOptions = {
   grid,
   xAxis,
   yAxis,
-  aria: {
-    enabled: true,
-  },
 };
 
 export const gridWithSecondaryYAxis = {

package/src/vendor/bootstrap-vue/src/constants/components.js

@@ -15,7 +15,6 @@ export const NAME_FORM = 'BForm'
 export const NAME_FORM_CHECKBOX = 'BFormCheckbox'
 export const NAME_FORM_CHECKBOX_GROUP = 'BFormCheckboxGroup'
 export const NAME_FORM_GROUP = 'BFormGroup'
-export const NAME_FORM_INPUT = 'BFormInput'
 export const NAME_FORM_INVALID_FEEDBACK = 'BFormInvalidFeedback'
 export const NAME_FORM_RADIO = 'BFormRadio'
 export const NAME_FORM_RADIO_GROUP = 'BFormRadioGroup'
@@ -26,11 +25,6 @@ export const NAME_FORM_SELECT_OPTION_GROUP = 'BFormSelectOptionGroup'
 export const NAME_FORM_TEXT = 'BFormText'
 export const NAME_FORM_TEXTAREA = 'BFormTextarea'
 export const NAME_FORM_VALID_FEEDBACK = 'BFormValidFeedback'
-export const NAME_INPUT_GROUP = 'BInputGroup'
-export const NAME_INPUT_GROUP_ADDON = 'BInputGroupAddon'
-export const NAME_INPUT_GROUP_APPEND = 'BInputGroupAppend'
-export const NAME_INPUT_GROUP_PREPEND = 'BInputGroupPrepend'
-export const NAME_INPUT_GROUP_TEXT = 'BInputGroupText'
 export const NAME_LINK = 'BLink'
 export const NAME_MODAL = 'BModal'
 export const NAME_NAV = 'BNav'

package/dist/vendor/bootstrap-vue/src/components/form-input/form-input.js

@@ -1,157 +0,0 @@
-import { extend } from '../../vue';
-import { NAME_FORM_INPUT } from '../../constants/components';
-import { PROP_TYPE_STRING, PROP_TYPE_NUMBER_STRING, PROP_TYPE_BOOLEAN } from '../../constants/props';
-import { arrayIncludes } from '../../utils/array';
-import { attemptBlur } from '../../utils/dom';
-import { eventOnOff, eventOff, eventOn, stopEvent } from '../../utils/events';
-import { sortKeys } from '../../utils/object';
-import { makePropsConfigurable, makeProp } from '../../utils/props';
-import { props as props$2, formControlMixin } from '../../mixins/form-control';
-import { formSelectionMixin } from '../../mixins/form-selection';
-import { props as props$3, formSizeMixin } from '../../mixins/form-size';
-import { props as props$4, formStateMixin } from '../../mixins/form-state';
-import { props as props$5, formTextMixin } from '../../mixins/form-text';
-import { formValidityMixin } from '../../mixins/form-validity';
-import { props as props$1, idMixin } from '../../mixins/id';
-import { listenersMixin } from '../../mixins/listeners';
-
-// --- Constants ---
-
-// Valid supported input types
-const TYPES = ['text', 'password', 'email', 'number', 'url', 'tel', 'search', 'range', 'color', 'date', 'time', 'datetime', 'datetime-local', 'month', 'week'];
-
-// --- Props ---
-
-const props = makePropsConfigurable(sortKeys({
-  ...props$1,
-  ...props$2,
-  ...props$3,
-  ...props$4,
-  ...props$5,
-  list: makeProp(PROP_TYPE_STRING),
-  max: makeProp(PROP_TYPE_NUMBER_STRING),
-  min: makeProp(PROP_TYPE_NUMBER_STRING),
-  // Disable mousewheel to prevent wheel from changing values (i.e. number/date)
-  noWheel: makeProp(PROP_TYPE_BOOLEAN, false),
-  step: makeProp(PROP_TYPE_NUMBER_STRING),
-  type: makeProp(PROP_TYPE_STRING, 'text', type => {
-    return arrayIncludes(TYPES, type);
-  })
-}), NAME_FORM_INPUT);
-
-// --- Main component ---
-
-// @vue/component
-const BFormInput = /*#__PURE__*/extend({
-  name: NAME_FORM_INPUT,
-  // Mixin order is important!
-  mixins: [listenersMixin, idMixin, formControlMixin, formSizeMixin, formStateMixin, formTextMixin, formSelectionMixin, formValidityMixin],
-  props,
-  computed: {
-    localType() {
-      // We only allow certain types
-      const {
-        type
-      } = this;
-      return arrayIncludes(TYPES, type) ? type : 'text';
-    },
-    computedAttrs() {
-      const {
-        localType: type,
-        name,
-        form,
-        disabled,
-        placeholder,
-        required,
-        min,
-        max,
-        step
-      } = this;
-      return {
-        id: this.safeId(),
-        name,
-        form,
-        type,
-        disabled,
-        placeholder,
-        required,
-        autocomplete: this.autocomplete || null,
-        readonly: this.readonly || this.plaintext,
-        min,
-        max,
-        step,
-        list: type !== 'password' ? this.list : null,
-        'aria-required': required ? 'true' : null,
-        'aria-invalid': this.computedAriaInvalid
-      };
-    },
-    computedListeners() {
-      return {
-        ...this.bvListeners,
-        input: this.onInput,
-        change: this.onChange,
-        blur: this.onBlur
-      };
-    }
-  },
-  watch: {
-    noWheel(newValue) {
-      this.setWheelStopper(newValue);
-    }
-  },
-  mounted() {
-    this.setWheelStopper(this.noWheel);
-  },
-  /* istanbul ignore next */
-  deactivated() {
-    // Turn off listeners when keep-alive component deactivated
-    /* istanbul ignore next */
-    this.setWheelStopper(false);
-  },
-  /* istanbul ignore next */
-  activated() {
-    // Turn on listeners (if no-wheel) when keep-alive component activated
-    /* istanbul ignore next */
-    this.setWheelStopper(this.noWheel);
-  },
-  beforeDestroy() {
-    /* istanbul ignore next */
-    this.setWheelStopper(false);
-  },
-  methods: {
-    setWheelStopper(on) {
-      const input = this.$el;
-      // We use native events, so that we don't interfere with propagation
-      eventOnOff(on, input, 'focus', this.onWheelFocus);
-      eventOnOff(on, input, 'blur', this.onWheelBlur);
-      if (!on) {
-        eventOff(document, 'wheel', this.stopWheel);
-      }
-    },
-    onWheelFocus() {
-      eventOn(document, 'wheel', this.stopWheel);
-    },
-    onWheelBlur() {
-      eventOff(document, 'wheel', this.stopWheel);
-    },
-    stopWheel(event) {
-      stopEvent(event, {
-        propagation: false
-      });
-      attemptBlur(this.$el);
-    }
-  },
-  render(h) {
-    return h('input', {
-      class: this.computedClass,
-      attrs: this.computedAttrs,
-      domProps: {
-        value: this.localValue
-      },
-      on: this.computedListeners,
-      ref: 'input'
-    });
-  }
-});
-
-export { BFormInput, props };

package/dist/vendor/bootstrap-vue/src/components/form-input/index.js

@@ -1 +0,0 @@
-export { BFormInput } from './form-input';

package/dist/vendor/bootstrap-vue/src/components/input-group/index.js

@@ -1,5 +0,0 @@
-export { BInputGroup } from './input-group';
-export { BInputGroupAddon } from './input-group-addon';
-export { BInputGroupPrepend } from './input-group-prepend';
-export { BInputGroupAppend } from './input-group-append';
-export { BInputGroupText } from './input-group-text';

package/dist/vendor/bootstrap-vue/src/components/input-group/input-group-addon.js

@@ -1,44 +0,0 @@
-import { extend, mergeData } from '../../vue';
-import { NAME_INPUT_GROUP_ADDON } from '../../constants/components';
-import { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING } from '../../constants/props';
-import { makePropsConfigurable, makeProp } from '../../utils/props';
-import { BInputGroupText } from './input-group-text';
-
-// --- Props ---
-
-const props = makePropsConfigurable({
-  append: makeProp(PROP_TYPE_BOOLEAN, false),
-  id: makeProp(PROP_TYPE_STRING),
-  isText: makeProp(PROP_TYPE_BOOLEAN, false),
-  tag: makeProp(PROP_TYPE_STRING, 'div')
-}, NAME_INPUT_GROUP_ADDON);
-
-// --- Main component ---
-
-// @vue/component
-const BInputGroupAddon = /*#__PURE__*/extend({
-  name: NAME_INPUT_GROUP_ADDON,
-  functional: true,
-  props,
-  render(h, _ref) {
-    let {
-      props,
-      data,
-      children
-    } = _ref;
-    const {
-      append
-    } = props;
-    return h(props.tag, mergeData(data, {
-      class: {
-        'input-group-append': append,
-        'input-group-prepend': !append
-      },
-      attrs: {
-        id: props.id
-      }
-    }), props.isText ? [h(BInputGroupText, children)] : children);
-  }
-});
-
-export { BInputGroupAddon, props };

package/dist/vendor/bootstrap-vue/src/components/input-group/input-group-append.js

@@ -1,34 +0,0 @@
-import { extend, mergeData } from '../../vue';
-import { NAME_INPUT_GROUP_APPEND } from '../../constants/components';
-import { omit } from '../../utils/object';
-import { makePropsConfigurable } from '../../utils/props';
-import { props as props$1, BInputGroupAddon } from './input-group-addon';
-
-// --- Props ---
-
-const props = makePropsConfigurable(omit(props$1, ['append']), NAME_INPUT_GROUP_APPEND);
-
-// --- Main component ---
-
-// @vue/component
-const BInputGroupAppend = /*#__PURE__*/extend({
-  name: NAME_INPUT_GROUP_APPEND,
-  functional: true,
-  props,
-  render(h, _ref) {
-    let {
-      props,
-      data,
-      children
-    } = _ref;
-    // Pass all our data down to child, and set `append` to `true`
-    return h(BInputGroupAddon, mergeData(data, {
-      props: {
-        ...props,
-        append: true
-      }
-    }), children);
-  }
-});
-
-export { BInputGroupAppend, props };

package/dist/vendor/bootstrap-vue/src/components/input-group/input-group-prepend.js

@@ -1,34 +0,0 @@
-import { extend, mergeData } from '../../vue';
-import { NAME_INPUT_GROUP_PREPEND } from '../../constants/components';
-import { omit } from '../../utils/object';
-import { makePropsConfigurable } from '../../utils/props';
-import { props as props$1, BInputGroupAddon } from './input-group-addon';
-
-// --- Props ---
-
-const props = makePropsConfigurable(omit(props$1, ['append']), NAME_INPUT_GROUP_PREPEND);
-
-// --- Main component ---
-
-// @vue/component
-const BInputGroupPrepend = /*#__PURE__*/extend({
-  name: NAME_INPUT_GROUP_PREPEND,
-  functional: true,
-  props,
-  render(h, _ref) {
-    let {
-      props,
-      data,
-      children
-    } = _ref;
-    // Pass all our data down to child, and set `append` to `true`
-    return h(BInputGroupAddon, mergeData(data, {
-      props: {
-        ...props,
-        append: false
-      }
-    }), children);
-  }
-});
-
-export { BInputGroupPrepend, props };

package/dist/vendor/bootstrap-vue/src/components/input-group/input-group-text.js

@@ -1,31 +0,0 @@
-import { extend, mergeData } from '../../vue';
-import { NAME_INPUT_GROUP_TEXT } from '../../constants/components';
-import { PROP_TYPE_STRING } from '../../constants/props';
-import { makePropsConfigurable, makeProp } from '../../utils/props';
-
-// --- Props ---
-
-const props = makePropsConfigurable({
-  tag: makeProp(PROP_TYPE_STRING, 'div')
-}, NAME_INPUT_GROUP_TEXT);
-
-// --- Main component ---
-
-// @vue/component
-const BInputGroupText = /*#__PURE__*/extend({
-  name: NAME_INPUT_GROUP_TEXT,
-  functional: true,
-  props,
-  render(h, _ref) {
-    let {
-      props,
-      data,
-      children
-    } = _ref;
-    return h(props.tag, mergeData(data, {
-      staticClass: 'input-group-text'
-    }), children);
-  }
-});
-
-export { BInputGroupText, props };

package/dist/vendor/bootstrap-vue/src/components/input-group/input-group.js

@@ -1,75 +0,0 @@
-import { extend, mergeData } from '../../vue';
-import { NAME_INPUT_GROUP } from '../../constants/components';
-import { PROP_TYPE_STRING } from '../../constants/props';
-import { SLOT_NAME_PREPEND, SLOT_NAME_APPEND, SLOT_NAME_DEFAULT } from '../../constants/slots';
-import { htmlOrText } from '../../utils/html';
-import { hasNormalizedSlot, normalizeSlot } from '../../utils/normalize-slot';
-import { makePropsConfigurable, makeProp } from '../../utils/props';
-import { BInputGroupAppend } from './input-group-append';
-import { BInputGroupPrepend } from './input-group-prepend';
-import { BInputGroupText } from './input-group-text';
-
-// --- Props ---
-
-const props = makePropsConfigurable({
-  append: makeProp(PROP_TYPE_STRING),
-  appendHtml: makeProp(PROP_TYPE_STRING),
-  id: makeProp(PROP_TYPE_STRING),
-  prepend: makeProp(PROP_TYPE_STRING),
-  prependHtml: makeProp(PROP_TYPE_STRING),
-  size: makeProp(PROP_TYPE_STRING),
-  tag: makeProp(PROP_TYPE_STRING, 'div')
-}, NAME_INPUT_GROUP);
-
-// --- Main component ---
-
-// @vue/component
-const BInputGroup = /*#__PURE__*/extend({
-  name: NAME_INPUT_GROUP,
-  functional: true,
-  props,
-  render(h, _ref) {
-    let {
-      props,
-      data,
-      slots,
-      scopedSlots
-    } = _ref;
-    const {
-      prepend,
-      prependHtml,
-      append,
-      appendHtml,
-      size
-    } = props;
-    const $scopedSlots = scopedSlots || {};
-    const $slots = slots();
-    const slotScope = {};
-    let $prepend = h();
-    const hasPrependSlot = hasNormalizedSlot(SLOT_NAME_PREPEND, $scopedSlots, $slots);
-    if (hasPrependSlot || prepend || prependHtml) {
-      $prepend = h(BInputGroupPrepend, [hasPrependSlot ? normalizeSlot(SLOT_NAME_PREPEND, slotScope, $scopedSlots, $slots) : h(BInputGroupText, {
-        domProps: htmlOrText(prependHtml, prepend)
-      })]);
-    }
-    let $append = h();
-    const hasAppendSlot = hasNormalizedSlot(SLOT_NAME_APPEND, $scopedSlots, $slots);
-    if (hasAppendSlot || append || appendHtml) {
-      $append = h(BInputGroupAppend, [hasAppendSlot ? normalizeSlot(SLOT_NAME_APPEND, slotScope, $scopedSlots, $slots) : h(BInputGroupText, {
-        domProps: htmlOrText(appendHtml, append)
-      })]);
-    }
-    return h(props.tag, mergeData(data, {
-      staticClass: 'input-group',
-      class: {
-        [`input-group-${size}`]: size
-      },
-      attrs: {
-        id: props.id || null,
-        role: 'group'
-      }
-    }), [$prepend, normalizeSlot(SLOT_NAME_DEFAULT, slotScope, $scopedSlots, $slots), $append]);
-  }
-});
-
-export { BInputGroup, props };