@gitlab/ui 129.5.0 → 130.0.0

package/dist/vendor/bootstrap-vue/src/mixins/form-radio-check.js

@@ -1,224 +0,0 @@
-import { extend } from '../vue';
-import { PROP_TYPE_STRING, PROP_TYPE_BOOLEAN, PROP_TYPE_ANY } from '../constants/props';
-import { EVENT_NAME_CHANGE } from '../constants/events';
-import { attemptFocus, attemptBlur } from '../utils/dom';
-import { isBoolean } from '../utils/inspect';
-import { looseEqual } from '../utils/loose-equal';
-import { makeModelMixin } from '../utils/model';
-import { sortKeys } from '../utils/object';
-import { makeProp } from '../utils/props';
-import { attrsMixin } from './attrs';
-import { props as props$2, formControlMixin } from './form-control';
-import { props as props$5, formCustomMixin } from './form-custom';
-import { props as props$3, formSizeMixin } from './form-size';
-import { props as props$4, formStateMixin } from './form-state';
-import { props as props$1, idMixin } from './id';
-import { normalizeSlotMixin } from './normalize-slot';
-
-// --- Constants ---
-
-const {
-  mixin: modelMixin,
-  props: modelProps,
-  prop: MODEL_PROP_NAME,
-  event: MODEL_EVENT_NAME
-} = makeModelMixin('checked', {
-  defaultValue: null
-});
-
-// --- Props ---
-
-const props = sortKeys({
-  ...props$1,
-  ...modelProps,
-  ...props$2,
-  ...props$3,
-  ...props$4,
-  ...props$5,
-  ariaLabel: makeProp(PROP_TYPE_STRING),
-  ariaLabelledby: makeProp(PROP_TYPE_STRING),
-  inline: makeProp(PROP_TYPE_BOOLEAN, false),
-  value: makeProp(PROP_TYPE_ANY)
-});
-
-// --- Mixin ---
-
-// @vue/component
-const formRadioCheckMixin = extend({
-  mixins: [attrsMixin, idMixin, modelMixin, normalizeSlotMixin, formControlMixin, formSizeMixin, formStateMixin, formCustomMixin],
-  inheritAttrs: false,
-  props,
-  data() {
-    return {
-      localChecked: this.isGroup ? this.bvGroup[MODEL_PROP_NAME] : this[MODEL_PROP_NAME]
-    };
-  },
-  computed: {
-    computedLocalChecked: {
-      get() {
-        return this.isGroup ? this.bvGroup.localChecked : this.localChecked;
-      },
-      set(value) {
-        if (this.isGroup) {
-          this.bvGroup.localChecked = value;
-        } else {
-          this.localChecked = value;
-        }
-      }
-    },
-    isChecked() {
-      return looseEqual(this.value, this.computedLocalChecked);
-    },
-    isRadio() {
-      return true;
-    },
-    isGroup() {
-      // Is this check/radio a child of check-group or radio-group?
-      return !!this.bvGroup;
-    },
-    isSwitch() {
-      // Custom switch styling (checkboxes only)
-      return this.isRadio ? false : this.isGroup ? this.bvGroup.switches : this.switch;
-    },
-    isInline() {
-      return this.isGroup ? this.bvGroup.inline : this.inline;
-    },
-    isDisabled() {
-      // Child can be disabled while parent isn't, but is always disabled if group is
-      return this.isGroup ? this.bvGroup.disabled || this.disabled : this.disabled;
-    },
-    isRequired() {
-      // Required only works when a name is provided for the input(s)
-      // Child can only be required when parent is
-      // Groups will always have a name (either user supplied or auto generated)
-      return this.computedName && (this.isGroup ? this.bvGroup.required : this.required);
-    },
-    computedName() {
-      // Group name preferred over local name
-      return (this.isGroup ? this.bvGroup.groupName : this.name) || null;
-    },
-    computedForm() {
-      return (this.isGroup ? this.bvGroup.form : this.form) || null;
-    },
-    computedSize() {
-      return (this.isGroup ? this.bvGroup.size : this.size) || '';
-    },
-    computedState() {
-      return this.isGroup ? this.bvGroup.computedState : isBoolean(this.state) ? this.state : null;
-    },
-    computedAttrs() {
-      const {
-        isDisabled: disabled,
-        isRequired: required
-      } = this;
-      return {
-        ...this.bvAttrs,
-        id: this.safeId(),
-        type: this.isRadio ? 'radio' : 'checkbox',
-        name: this.computedName,
-        form: this.computedForm,
-        disabled,
-        required,
-        'aria-required': required || null,
-        'aria-label': this.ariaLabel || null,
-        'aria-labelledby': this.ariaLabelledby || null
-      };
-    }
-  },
-  watch: {
-    [MODEL_PROP_NAME]() {
-      this[`${MODEL_PROP_NAME}Watcher`](...arguments);
-    },
-    computedLocalChecked() {
-      this.computedLocalCheckedWatcher(...arguments);
-    }
-  },
-  methods: {
-    [`${MODEL_PROP_NAME}Watcher`](newValue) {
-      if (!looseEqual(newValue, this.computedLocalChecked)) {
-        this.computedLocalChecked = newValue;
-      }
-    },
-    computedLocalCheckedWatcher(newValue, oldValue) {
-      if (!looseEqual(newValue, oldValue)) {
-        this.$emit(MODEL_EVENT_NAME, newValue);
-      }
-    },
-    handleChange(_ref) {
-      let {
-        target: {
-          checked
-        }
-      } = _ref;
-      const {
-        value
-      } = this;
-      const localChecked = checked ? value : null;
-      this.computedLocalChecked = value;
-
-      // Fire events in a `$nextTick()` to ensure the `v-model` is updated
-      this.$nextTick(() => {
-        // Change is only emitted on user interaction
-        this.$emit(EVENT_NAME_CHANGE, localChecked);
-
-        // If this is a child of a group, we emit a change event on it as well
-        if (this.isGroup) {
-          this.bvGroup.$emit(EVENT_NAME_CHANGE, localChecked);
-        }
-      });
-    },
-    // Convenience methods for focusing the input
-    focus() {
-      if (!this.isDisabled) {
-        attemptFocus(this.$refs.input);
-      }
-    },
-    blur() {
-      if (!this.isDisabled) {
-        attemptBlur(this.$refs.input);
-      }
-    }
-  },
-  render(h) {
-    const {
-      isRadio,
-      isInline,
-      isSwitch,
-      computedSize,
-      bvAttrs
-    } = this;
-    const $content = this.normalizeSlot();
-    const $input = h('input', {
-      class: ['custom-control-input', this.stateClass],
-      attrs: this.computedAttrs,
-      domProps: {
-        value: this.value,
-        checked: this.isChecked
-      },
-      on: {
-        change: this.handleChange
-      },
-      key: 'input',
-      ref: 'input'
-    });
-    const $label = h('label', {
-      class: 'custom-control-label',
-      attrs: {
-        for: this.safeId()
-      }
-    }, $content);
-    return h('div', {
-      class: [{
-        'custom-control-inline': isInline,
-        'custom-checkbox': !isRadio && !isSwitch,
-        'custom-switch': isSwitch,
-        'custom-radio': isRadio,
-        // Temporary until Bootstrap v4 supports sizing (most likely in V5)
-        [`b-custom-control-${computedSize}`]: computedSize
-      }, 'custom-control', bvAttrs.class],
-      style: bvAttrs.style
-    }, [$input, $label]);
-  }
-});
-
-export { MODEL_EVENT_NAME, MODEL_PROP_NAME, formRadioCheckMixin, props };

package/src/vendor/bootstrap-vue/src/components/form-radio/_form-radio-group.scss

@@ -1 +0,0 @@
-@import "../../utilities";

package/src/vendor/bootstrap-vue/src/components/form-radio/_form-radio.scss

@@ -1,47 +0,0 @@
-// Adds control sizing to Bootstrap custom radio inputs
-
-.custom-radio.b-custom-control-lg,
-.input-group-lg .custom-radio {
-  font-size: $font-size-lg;
-  line-height: $line-height-lg;
-  padding-left: $b-custom-control-gutter-lg + $b-custom-control-indicator-size-lg;
-
-  .custom-control-label::before {
-    top: ($font-size-lg * $line-height-lg - $b-custom-control-indicator-size-lg) * 0.5;
-    left: -($b-custom-control-gutter-lg + $b-custom-control-indicator-size-lg);
-    width: $b-custom-control-indicator-size-lg;
-    height: $b-custom-control-indicator-size-lg;
-    border-radius: $b-custom-radio-indicator-border-radius-lg;
-  }
-
-  .custom-control-label::after {
-    top: ($font-size-lg * $line-height-lg - $b-custom-control-indicator-size-lg) * 0.5;
-    left: -($b-custom-control-gutter-lg + $b-custom-control-indicator-size-lg);
-    width: $b-custom-control-indicator-size-lg;
-    height: $b-custom-control-indicator-size-lg;
-    background: no-repeat 50% / #{$b-custom-control-indicator-bg-size-lg};
-  }
-}
-
-.custom-radio.b-custom-control-sm,
-.input-group-sm .custom-radio {
-  font-size: $font-size-sm;
-  line-height: $line-height-sm;
-  padding-left: $b-custom-control-gutter-sm + $b-custom-control-indicator-size-sm;
-
-  .custom-control-label::before {
-    top: ($font-size-sm * $line-height-sm - $b-custom-control-indicator-size-sm) * 0.5;
-    left: -($b-custom-control-gutter-sm + $b-custom-control-indicator-size-sm);
-    width: $b-custom-control-indicator-size-sm;
-    height: $b-custom-control-indicator-size-sm;
-    border-radius: $b-custom-radio-indicator-border-radius-sm;
-  }
-
-  .custom-control-label::after {
-    top: ($font-size-sm * $line-height-sm - $b-custom-control-indicator-size-sm) * 0.5;
-    left: -($b-custom-control-gutter-sm + $b-custom-control-indicator-size-sm);
-    width: $b-custom-control-indicator-size-sm;
-    height: $b-custom-control-indicator-size-sm;
-    background: no-repeat 50% / #{$b-custom-control-indicator-bg-size-sm};
-  }
-}

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

@@ -1,29 +0,0 @@
-import { extend } from '../../vue'
-import { NAME_FORM_RADIO_GROUP } from '../../constants/components'
-import {
-  formRadioCheckGroupMixin,
-  props as formRadioCheckGroupProps
-} from '../../mixins/form-radio-check-group'
-
-// --- Props ---
-
-export const props = formRadioCheckGroupProps
-
-// --- Main component ---
-
-// @vue/component
-export const BFormRadioGroup = /*#__PURE__*/ extend({
-  name: NAME_FORM_RADIO_GROUP,
-  mixins: [formRadioCheckGroupMixin],
-  provide() {
-    return {
-      getBvRadioGroup: () => this
-    }
-  },
-  props,
-  computed: {
-    isRadioGroup() {
-      return true
-    }
-  }
-})

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

@@ -1,27 +0,0 @@
-import { extend } from '../../vue'
-import { NAME_FORM_RADIO } from '../../constants/components'
-import { formRadioCheckMixin, props as formRadioCheckProps } from '../../mixins/form-radio-check'
-
-// --- Props ---
-
-export const props = formRadioCheckProps
-
-// --- Main component ---
-
-// @vue/component
-export const BFormRadio = /*#__PURE__*/ extend({
-  name: NAME_FORM_RADIO,
-  mixins: [formRadioCheckMixin],
-  inject: {
-    getBvGroup: {
-      from: 'getBvRadioGroup',
-      default: () => () => null
-    }
-  },
-  props,
-  computed: {
-    bvGroup() {
-      return this.getBvGroup()
-    }
-  }
-})

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

@@ -1,4 +0,0 @@
-import { BFormRadio } from './form-radio'
-import { BFormRadioGroup } from './form-radio-group'
-
-export { BFormRadio, BFormRadioGroup }

package/src/vendor/bootstrap-vue/src/components/form-radio/index.scss

@@ -1,2 +0,0 @@
-@import "form-radio";
-@import "form-radio-group";

package/src/vendor/bootstrap-vue/src/mixins/form-radio-check-group.js

@@ -1,141 +0,0 @@
-import { extend } from '../vue'
-import { PROP_TYPE_BOOLEAN, PROP_TYPE_BOOLEAN_STRING } from '../constants/props'
-import { SLOT_NAME_FIRST } from '../constants/slots'
-import { htmlOrText } from '../utils/html'
-import { looseEqual } from '../utils/loose-equal'
-import { makeModelMixin } from '../utils/model'
-import { omit, pick, sortKeys } from '../utils/object'
-import { makeProp } from '../utils/props'
-import { BFormRadio } from '../components/form-radio/form-radio'
-import { formControlMixin, props as formControlProps } from './form-control'
-import { formCustomMixin, props as formCustomProps } from './form-custom'
-import { formOptionsMixin, props as formOptionsProps } from './form-options'
-import { formSizeMixin, props as formSizeProps } from './form-size'
-import { formStateMixin, props as formStateProps } from './form-state'
-import { idMixin, props as idProps } from './id'
-import { normalizeSlotMixin } from './normalize-slot'
-
-// --- Constants ---
-
-// Attributes to pass down to checks/radios instead of applying them to the group
-const PASS_DOWN_ATTRS = ['aria-describedby', 'aria-labelledby']
-
-const {
-  mixin: modelMixin,
-  props: modelProps,
-  prop: MODEL_PROP_NAME,
-  event: MODEL_EVENT_NAME
-} = makeModelMixin('checked')
-
-export { MODEL_PROP_NAME, MODEL_EVENT_NAME }
-
-// --- Props ---
-
-export const props = sortKeys({
-  ...idProps,
-  ...modelProps,
-  ...formControlProps,
-  ...formOptionsProps,
-  ...formSizeProps,
-  ...formStateProps,
-  ...formCustomProps,
-  ariaInvalid: makeProp(PROP_TYPE_BOOLEAN_STRING, false),
-  stacked: makeProp(PROP_TYPE_BOOLEAN, false),
-  validated: makeProp(PROP_TYPE_BOOLEAN, false)
-})
-
-// --- Mixin ---
-
-// @vue/component
-export const formRadioCheckGroupMixin = extend({
-  mixins: [
-    idMixin,
-    modelMixin,
-    normalizeSlotMixin,
-    formControlMixin,
-    formOptionsMixin,
-    formSizeMixin,
-    formStateMixin,
-    formCustomMixin
-  ],
-  inheritAttrs: false,
-  props,
-  data() {
-    return {
-      localChecked: this[MODEL_PROP_NAME]
-    }
-  },
-  computed: {
-    inline() {
-      return !this.stacked
-    },
-    groupName() {
-      // Checks/Radios tied to the same model must have the same name,
-      // especially for ARIA accessibility
-      return this.name || this.safeId()
-    },
-    groupClasses() {
-      const { validated } = this
-
-      return { 'was-validated': validated }
-    }
-  },
-  watch: {
-    [MODEL_PROP_NAME](newValue) {
-      if (!looseEqual(newValue, this.localChecked)) {
-        this.localChecked = newValue
-      }
-    },
-    localChecked(newValue, oldValue) {
-      if (!looseEqual(newValue, oldValue)) {
-        this.$emit(MODEL_EVENT_NAME, newValue)
-      }
-    }
-  },
-  render(h) {
-    const { isRadioGroup } = this
-    const attrs = pick(this.$attrs, PASS_DOWN_ATTRS)
-    const optionComponent = BFormRadio
-
-    const $inputs = this.formOptions.map((option, index) => {
-      const key = `BV_option_${index}`
-
-      return h(
-        optionComponent,
-        {
-          props: {
-            // Individual radios or checks can be disabled in a group
-            disabled: option.disabled || false,
-            id: this.safeId(key),
-            value: option.value
-            // We don't need to include these, since the input's will know they are inside here
-            // form: this.form || null,
-            // name: this.groupName,
-            // required: Boolean(this.name && this.required),
-            // state: this.state
-          },
-          attrs,
-          key
-        },
-        [h('span', { domProps: htmlOrText(option.html, option.text) })]
-      )
-    })
-
-    return h(
-      'div',
-      {
-        class: [this.groupClasses, 'bv-no-focus-ring'],
-        attrs: {
-          ...omit(this.$attrs, PASS_DOWN_ATTRS),
-          'aria-invalid': this.computedAriaInvalid,
-          'aria-required': this.required ? 'true' : null,
-          id: this.safeId(),
-          role: isRadioGroup ? 'radiogroup' : 'group',
-          // Add `tabindex="-1"` to allow group to be focused if needed by screen readers
-          tabindex: '-1'
-        }
-      },
-      [this.normalizeSlot(SLOT_NAME_FIRST), $inputs, this.normalizeSlot()]
-    )
-  }
-})