@gitlab/ui 132.0.3 → 132.2.0

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

@@ -1,6 +1,5 @@
 import { extend } from '../../vue';
 import { NAME_DROPDOWN } from '../../constants/components';
-import { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING, PROP_TYPE_ARRAY, PROP_TYPE_OBJECT } from '../../constants/props';
 import { SLOT_NAME_BUTTON_CONTENT, SLOT_NAME_DEFAULT } from '../../constants/slots';
 import { htmlOrText } from '../../utils/html';
 import { toString } from '../../utils/string';
@@ -16,48 +15,48 @@ const props = sortKeys({
   ...props$1,
   ...props$2,
   block: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   },
   html: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: undefined
   },
   // If `true`, only render menu contents when open
   lazy: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   },
   menuClass: {
-    type: [PROP_TYPE_ARRAY, PROP_TYPE_OBJECT, PROP_TYPE_STRING],
+    type: [Array, Object, String],
     required: false,
     default: undefined
   },
   noCaret: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   },
   role: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: 'menu'
   },
   size: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: undefined
   },
   split: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   },
   splitButtonType: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: 'button',
     validator: value => {
@@ -65,53 +64,53 @@ const props = sortKeys({
     }
   },
   splitClass: {
-    type: [PROP_TYPE_ARRAY, PROP_TYPE_OBJECT, PROP_TYPE_STRING],
+    type: [Array, Object, String],
     required: false,
     default: undefined
   },
   splitHref: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: undefined
   },
   splitTo: {
-    type: [PROP_TYPE_OBJECT, PROP_TYPE_STRING],
+    type: [Object, String],
     required: false,
     default: undefined
   },
   splitVariant: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: undefined
   },
   text: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: undefined
   },
   toggleAttrs: {
-    type: PROP_TYPE_OBJECT,
+    type: Object,
     required: false,
     default: () => ({})
   },
   toggleClass: {
-    type: [PROP_TYPE_ARRAY, PROP_TYPE_OBJECT, PROP_TYPE_STRING],
+    type: [Array, Object, String],
     required: false,
     default: undefined
   },
   toggleTag: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: 'button'
   },
   // TODO: This really should be `toggleLabel`
   toggleText: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: 'Toggle dropdown'
   },
   variant: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: 'secondary'
   }
@@ -126,10 +125,8 @@ const BDropdown = /*#__PURE__*/extend({
   props,
   computed: {
     dropdownClasses() {
-      const {
-        block,
-        split
-      } = this;
+      const block = this.block,
+        split = this.split;
       return [this.directionClass, this.boundaryClass, {
         show: this.visible,
         // The 'btn-group' class is required in `split` mode for button alignment
@@ -148,9 +145,7 @@ const BDropdown = /*#__PURE__*/extend({
       }];
     },
     toggleClasses() {
-      const {
-        split
-      } = this;
+      const split = this.split;
       return [this.toggleClass, {
         'dropdown-toggle-split': split,
         'dropdown-toggle-no-caret': this.noCaret && !split
@@ -158,17 +153,15 @@ const BDropdown = /*#__PURE__*/extend({
     }
   },
   render(h) {
-    const {
-      visible,
-      variant,
-      size,
-      block,
-      disabled,
-      split,
-      role,
-      hide,
-      toggle
-    } = this;
+    const visible = this.visible,
+      variant = this.variant,
+      size = this.size,
+      block = this.block,
+      disabled = this.disabled,
+      split = this.split,
+      role = this.role,
+      hide = this.hide,
+      toggle = this.toggle;
     const commonProps = {
       variant,
       size,
@@ -179,11 +172,9 @@ const BDropdown = /*#__PURE__*/extend({
     let buttonContentDomProps = this.hasNormalizedSlot(SLOT_NAME_BUTTON_CONTENT) ? {} : htmlOrText(this.html, this.text);
     let $split = h();
     if (split) {
-      const {
-        splitTo,
-        splitHref,
-        splitButtonType
-      } = this;
+      const splitTo = this.splitTo,
+        splitHref = this.splitHref,
+        splitButtonType = this.splitButtonType;
       const btnProps = {
         ...commonProps,
         variant: this.splitVariant || variant

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

@@ -51,15 +51,11 @@ const BFormInvalidFeedback = /*#__PURE__*/extend({
   functional: true,
   props,
   render(h, _ref) {
-    let {
-      props,
-      data,
-      children
-    } = _ref;
-    const {
-      tooltip,
-      ariaLive
-    } = props;
+    let props = _ref.props,
+      data = _ref.data,
+      children = _ref.children;
+    const tooltip = props.tooltip,
+      ariaLive = props.ariaLive;
     const show = props.forceShow === true || props.state === false;
     return h(props.tag, mergeData(data, {
       class: {

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

@@ -1,27 +1,26 @@
 import { extend, mergeData } from '../../vue';
 import { NAME_FORM_TEXT } from '../../constants/components';
-import { PROP_TYPE_STRING, PROP_TYPE_BOOLEAN } from '../../constants/props';
 
 // --- Props ---
 
 const props = {
   id: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: undefined
   },
   inline: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   },
   tag: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: 'small'
   },
   textVariant: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: 'muted'
   }
@@ -35,11 +34,9 @@ const BFormText = /*#__PURE__*/extend({
   functional: true,
   props,
   render(h, _ref) {
-    let {
-      props,
-      data,
-      children
-    } = _ref;
+    let props = _ref.props,
+      data = _ref.data,
+      children = _ref.children;
     return h(props.tag, mergeData(data, {
       class: {
         'form-text': !props.inline,

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

@@ -51,15 +51,11 @@ const BFormValidFeedback = /*#__PURE__*/extend({
   functional: true,
   props,
   render(h, _ref) {
-    let {
-      props,
-      data,
-      children
-    } = _ref;
-    const {
-      tooltip,
-      ariaLive
-    } = props;
+    let props = _ref.props,
+      data = _ref.data,
+      children = _ref.children;
+    const tooltip = props.tooltip,
+      ariaLive = props.ariaLive;
     const show = props.forceShow === true || props.state === true;
     return h(props.tag, mergeData(data, {
       class: {

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

@@ -1,27 +1,26 @@
 import { extend, mergeData } from '../../vue';
 import { NAME_FORM } from '../../constants/components';
-import { PROP_TYPE_STRING, PROP_TYPE_BOOLEAN } from '../../constants/props';
 
 // --- Props ---
 
 const props = {
   id: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: false,
     default: undefined
   },
   inline: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   },
   novalidate: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   },
   validated: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   }
@@ -35,11 +34,9 @@ const BForm = /*#__PURE__*/extend({
   functional: true,
   props,
   render(h, _ref) {
-    let {
-      props,
-      data,
-      children
-    } = _ref;
+    let props = _ref.props,
+      data = _ref.data,
+      children = _ref.children;
     return h('form', mergeData(data, {
       class: {
         'form-inline': props.inline,

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

@@ -1,6 +1,6 @@
 import { NAME_FORM_GROUP } from '../../constants/components';
 import { IS_BROWSER } from '../../constants/env';
-import { PROP_TYPE_BOOLEAN_NUMBER_STRING, PROP_TYPE_STRING, PROP_TYPE_BOOLEAN, PROP_TYPE_ARRAY_OBJECT_STRING } from '../../constants/props';
+import { PROP_TYPE_BOOLEAN_NUMBER_STRING, PROP_TYPE_STRING } from '../../constants/props';
 import { RX_SPACE_SPLIT } from '../../constants/regex';
 import { SLOT_NAME_LABEL, SLOT_NAME_INVALID_FEEDBACK, SLOT_NAME_VALID_FEEDBACK, SLOT_NAME_DESCRIPTION, SLOT_NAME_DEFAULT } from '../../constants/slots';
 import { getBreakpointsUpCached } from '../../utils/config';
@@ -45,19 +45,71 @@ const generateProps = () => sortKeys({
     props[suffixPropName(breakpoint, 'labelCols')] = makeProp(PROP_TYPE_BOOLEAN_NUMBER_STRING);
     return props;
   }, create(null)),
-  description: makeProp(PROP_TYPE_STRING),
-  disabled: makeProp(PROP_TYPE_BOOLEAN, false),
-  feedbackAriaLive: makeProp(PROP_TYPE_STRING, 'assertive'),
-  invalidFeedback: makeProp(PROP_TYPE_STRING),
-  label: makeProp(PROP_TYPE_STRING),
-  labelClass: makeProp(PROP_TYPE_ARRAY_OBJECT_STRING),
-  labelFor: makeProp(PROP_TYPE_STRING),
-  labelId: makeProp(PROP_TYPE_STRING),
-  labelSize: makeProp(PROP_TYPE_STRING),
-  labelSrOnly: makeProp(PROP_TYPE_BOOLEAN, false),
-  tooltip: makeProp(PROP_TYPE_BOOLEAN, false),
-  validFeedback: makeProp(PROP_TYPE_STRING),
-  validated: makeProp(PROP_TYPE_BOOLEAN, false)
+  description: {
+    type: String,
+    required: false,
+    default: undefined
+  },
+  disabled: {
+    type: Boolean,
+    required: false,
+    default: false
+  },
+  feedbackAriaLive: {
+    type: String,
+    required: false,
+    default: 'assertive'
+  },
+  invalidFeedback: {
+    type: String,
+    required: false,
+    default: undefined
+  },
+  label: {
+    type: String,
+    required: false,
+    default: undefined
+  },
+  labelClass: {
+    type: [Array, Object, String],
+    required: false,
+    default: undefined
+  },
+  labelFor: {
+    type: String,
+    required: false,
+    default: undefined
+  },
+  labelId: {
+    type: String,
+    required: false,
+    default: undefined
+  },
+  labelSize: {
+    type: String,
+    required: false,
+    default: undefined
+  },
+  labelSrOnly: {
+    type: Boolean,
+    required: false,
+    default: false
+  },
+  tooltip: {
+    type: Boolean,
+    required: false,
+    default: false
+  },
+  validFeedback: {
+    type: String,
+    required: false,
+    default: undefined
+  },
+  validated: {
+    type: Boolean,
+    required: false,
+    default: false
+  }
 });
 
 // --- Main component ---
@@ -148,9 +200,7 @@ const BFormGroup = {
     // Optionally accepts a string of IDs to remove as the second parameter
     // Preserves any `aria-describedby` value(s) user may have on input
     updateAriaDescribedby(newValue, oldValue) {
-      const {
-        labelFor
-      } = this;
+      const labelFor = this.labelFor;
       if (IS_BROWSER && labelFor) {
         // We need to escape `labelFor` since it can be user-provided
         const $input = select(`#${cssEscape(labelFor)}`, this.$refs.content);
@@ -176,9 +226,7 @@ const BFormGroup = {
       if (this.labelFor) {
         return;
       }
-      const {
-        target
-      } = event;
+      const target = event.target;
       const tagName = target ? target.tagName : '';
 
       // If clicked an interactive element inside legend,
@@ -196,25 +244,21 @@ const BFormGroup = {
     }
   },
   render(h) {
-    const {
-      computedState: state,
-      feedbackAriaLive,
-      isHorizontal,
-      labelFor,
-      normalizeSlot,
-      safeId,
-      tooltip
-    } = this;
+    const state = this.computedState,
+      feedbackAriaLive = this.feedbackAriaLive,
+      isHorizontal = this.isHorizontal,
+      labelFor = this.labelFor,
+      normalizeSlot = this.normalizeSlot,
+      safeId = this.safeId,
+      tooltip = this.tooltip;
     const id = safeId();
     const isFieldset = !labelFor;
     let $label = h();
     const labelContent = normalizeSlot(SLOT_NAME_LABEL) || this.label;
     const labelId = labelContent ? this.labelId || safeId('_BV_label_') : null;
     if (labelContent || isHorizontal) {
-      const {
-        labelSize,
-        labelColProps
-      } = this;
+      const labelSize = this.labelSize,
+        labelColProps = this.labelColProps;
       const labelTag = isFieldset ? 'legend' : 'label';
       if (this.labelSrOnly) {
         if (labelContent) {

package/dist/vendor/bootstrap-vue/src/components/form-select/form-select-option-group.js

@@ -1,6 +1,5 @@
 import { extend } from '../../vue';
 import { NAME_FORM_SELECT_OPTION_GROUP } from '../../constants/components';
-import { PROP_TYPE_STRING } from '../../constants/props';
 import { SLOT_NAME_FIRST } from '../../constants/slots';
 import { htmlOrText } from '../../utils/html';
 import { sortKeys } from '../../utils/object';
@@ -13,7 +12,7 @@ import { BFormSelectOption } from './form-select-option';
 const props = sortKeys({
   ...props$1,
   label: {
-    type: PROP_TYPE_STRING,
+    type: String,
     required: true
   }
 });
@@ -26,16 +25,12 @@ const BFormSelectOptionGroup = /*#__PURE__*/extend({
   mixins: [normalizeSlotMixin, formOptionsMixin],
   props,
   render(h) {
-    const {
-      label
-    } = this;
+    const label = this.label;
     const $options = this.formOptions.map((option, index) => {
-      const {
-        value,
-        text,
-        html,
-        disabled
-      } = option;
+      const value = option.value,
+        text = option.text,
+        html = option.html,
+        disabled = option.disabled;
       return h(BFormSelectOption, {
         attrs: {
           value,

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

@@ -1,17 +1,15 @@
 import { extend, mergeData } from '../../vue';
 import { NAME_FORM_SELECT_OPTION } from '../../constants/components';
-import { PROP_TYPE_BOOLEAN, PROP_TYPE_ANY } from '../../constants/props';
 
 // --- Props ---
 
 const props = {
   disabled: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   },
   value: {
-    type: PROP_TYPE_ANY,
     required: true
   }
 };
@@ -24,15 +22,11 @@ const BFormSelectOption = /*#__PURE__*/extend({
   functional: true,
   props,
   render(h, _ref) {
-    let {
-      props,
-      data,
-      children
-    } = _ref;
-    const {
-      value,
-      disabled
-    } = props;
+    let props = _ref.props,
+      data = _ref.data,
+      children = _ref.children;
+    const value = props.value,
+      disabled = props.disabled;
     return h('option', mergeData(data, {
       attrs: {
         disabled

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

@@ -1,47 +1,48 @@
 import { extend } from '../../vue';
 import { NAME_FORM_SELECT } from '../../constants/components';
-import { EVENT_NAME_CHANGE } from '../../constants/events';
-import { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING, PROP_TYPE_NUMBER } from '../../constants/props';
+import { EVENT_NAME_CHANGE, EVENT_NAME_INPUT } from '../../constants/events';
 import { SLOT_NAME_FIRST } from '../../constants/slots';
 import { from } from '../../utils/array';
 import { attemptFocus, attemptBlur } from '../../utils/dom';
 import { htmlOrText } from '../../utils/html';
 import { isArray } from '../../utils/inspect';
 import { sortKeys } from '../../utils/object';
-import { props as props$3, formControlMixin } from '../../mixins/form-control';
-import { props as props$4, formCustomMixin } from '../../mixins/form-custom';
-import { props as props$5, formSizeMixin } from '../../mixins/form-size';
-import { props as props$6, formStateMixin } from '../../mixins/form-state';
-import { props as props$1, idMixin } from '../../mixins/id';
-import { props as props$2, modelMixin, MODEL_PROP_NAME, MODEL_EVENT_NAME } from '../../mixins/model';
+import { props as props$2, formControlMixin } from '../../mixins/form-control';
+import { props as props$3, formCustomMixin } from '../../mixins/form-custom';
+import { props as props$4, formSizeMixin } from '../../mixins/form-size';
+import { props as props$5, formStateMixin } from '../../mixins/form-state';
 import { normalizeSlotMixin } from '../../mixins/normalize-slot';
+import { props as props$1, idMixin } from '../../mixins/id';
 import { optionsMixin } from './helpers/mixin-options';
 import { BFormSelectOption } from './form-select-option';
 import { BFormSelectOptionGroup } from './form-select-option-group';
 
+const MODEL_PROP_NAME = 'value';
+const MODEL_EVENT_NAME = EVENT_NAME_INPUT;
+
 // --- Props ---
 
 const props = sortKeys({
   ...props$1,
+  [MODEL_PROP_NAME]: {},
   ...props$2,
   ...props$3,
   ...props$4,
   ...props$5,
-  ...props$6,
   ariaInvalid: {
-    type: [PROP_TYPE_BOOLEAN, PROP_TYPE_STRING],
+    type: [Boolean, String],
     required: false,
     default: false
   },
   multiple: {
-    type: PROP_TYPE_BOOLEAN,
+    type: Boolean,
     required: false,
     default: false
   },
   // Browsers default size to `0`, which shows 4 rows in most browsers in multiple mode
   // Size of `1` can bork out Firefox
   selectSize: {
-    type: PROP_TYPE_NUMBER,
+    type: Number,
     required: false,
     default: 0
   }
@@ -52,7 +53,11 @@ const props = sortKeys({
 // @vue/component
 const BFormSelect = /*#__PURE__*/extend({
   name: NAME_FORM_SELECT,
-  mixins: [idMixin, modelMixin, formControlMixin, formSizeMixin, formStateMixin, formCustomMixin, optionsMixin, normalizeSlotMixin],
+  mixins: [idMixin, formControlMixin, formSizeMixin, formStateMixin, formCustomMixin, optionsMixin, normalizeSlotMixin],
+  model: {
+    prop: MODEL_PROP_NAME,
+    event: MODEL_EVENT_NAME
+  },
   props,
   data() {
     return {
@@ -85,9 +90,7 @@ const BFormSelect = /*#__PURE__*/extend({
       attemptBlur(this.$refs.input);
     },
     onChange(event) {
-      const {
-        target
-      } = event;
+      const target = event.target;
       const selectedValue = from(target.options).filter(o => o.selected).map(o => '_value' in o ? o._value : o.value);
       this.localValue = target.multiple ? selectedValue : selectedValue[0];
       this.$nextTick(() => {
@@ -96,20 +99,16 @@ const BFormSelect = /*#__PURE__*/extend({
     }
   },
   render(h) {
-    const {
-      name,
-      disabled,
-      required,
-      computedSelectSize: size,
-      localValue: value
-    } = this;
+    const name = this.name,
+      disabled = this.disabled,
+      required = this.required,
+      size = this.computedSelectSize,
+      value = this.localValue;
     const $options = this.formOptions.map((option, index) => {
-      const {
-        value,
-        label,
-        options,
-        disabled
-      } = option;
+      const value = option.value,
+        label = option.label,
+        options = option.options,
+        disabled = option.disabled;
       const key = `option_${index}`;
       return isArray(options) ? h(BFormSelectOptionGroup, {
         props: {