@gitlab/ui 132.0.1 → 132.0.3

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

@@ -0,0 +1 @@
+export { BTooltip } from './tooltip';

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

@@ -0,0 +1,337 @@
+import { extend } from '../../vue';
+import { NAME_TOOLTIP } from '../../constants/components';
+import { EVENT_NAME_DISABLE, EVENT_NAME_ENABLE, EVENT_NAME_SHOW, EVENT_NAME_SHOWN, EVENT_NAME_HIDE, EVENT_NAME_HIDDEN, EVENT_NAME_DISABLED, EVENT_NAME_ENABLED, EVENT_NAME_OPEN, EVENT_NAME_CLOSE, MODEL_EVENT_NAME_PREFIX } from '../../constants/events';
+import { PROP_TYPE_OBJECT, PROP_TYPE_STRING, PROP_TYPE_NUMBER, PROP_TYPE_BOOLEAN, PROP_TYPE_ARRAY, PROP_TYPE_FUNCTION } from '../../constants/props';
+import { HTMLElement, SVGElement } from '../../constants/safe-types';
+import { useParentMixin } from '../../mixins/use-parent';
+import { getScopeId } from '../../utils/get-scope-id';
+import { isUndefinedOrNull } from '../../utils/inspect';
+import { pick } from '../../utils/object';
+import { TOOLTIP_DELAY } from '../../constants/config';
+import { createNewChildComponent, eventProp } from '../../utils/create-new-child-component';
+import { normalizeSlotMixin } from '../../mixins/normalize-slot';
+import { BVTooltip } from './helpers/bv-tooltip';
+
+// --- Constants ---
+
+const MODEL_PROP_NAME_ENABLED = 'disabled';
+const MODEL_EVENT_NAME_ENABLED = MODEL_EVENT_NAME_PREFIX + MODEL_PROP_NAME_ENABLED;
+const MODEL_PROP_NAME_SHOW = 'show';
+const MODEL_EVENT_NAME_SHOW = MODEL_EVENT_NAME_PREFIX + MODEL_PROP_NAME_SHOW;
+
+// --- Props ---
+
+const props = {
+  // String: scrollParent, window, or viewport
+  // Element: element reference
+  // Object: Vue component
+  boundary: {
+    type: [HTMLElement, PROP_TYPE_OBJECT, PROP_TYPE_STRING],
+    required: false,
+    default: 'scrollParent'
+  },
+  boundaryPadding: {
+    type: [PROP_TYPE_NUMBER, PROP_TYPE_STRING],
+    required: false,
+    default: 5
+  },
+  // String: HTML ID of container, if null body is used (default)
+  // HTMLElement: element reference reference
+  // Object: Vue Component
+  container: {
+    type: [HTMLElement, PROP_TYPE_OBJECT, PROP_TYPE_STRING],
+    required: false,
+    default: undefined
+  },
+  customClass: {
+    type: PROP_TYPE_STRING,
+    required: false,
+    default: 'gl-tooltip'
+  },
+  delay: {
+    type: [PROP_TYPE_NUMBER, PROP_TYPE_OBJECT, PROP_TYPE_STRING],
+    required: false,
+    default: () => ({
+      ...TOOLTIP_DELAY
+    })
+  },
+  [MODEL_PROP_NAME_ENABLED]: {
+    type: PROP_TYPE_BOOLEAN,
+    required: false,
+    default: false
+  },
+  fallbackPlacement: {
+    type: [PROP_TYPE_ARRAY, PROP_TYPE_STRING],
+    required: false,
+    default: 'flip'
+  },
+  // ID to use for tooltip element
+  // If not provided on will automatically be generated
+  id: {
+    type: PROP_TYPE_STRING,
+    required: false,
+    default: undefined
+  },
+  noFade: {
+    type: PROP_TYPE_BOOLEAN,
+    required: false,
+    default: false
+  },
+  noninteractive: {
+    type: PROP_TYPE_BOOLEAN,
+    required: false,
+    default: false
+  },
+  offset: {
+    type: [PROP_TYPE_NUMBER, PROP_TYPE_STRING],
+    required: false,
+    default: 0
+  },
+  placement: {
+    type: PROP_TYPE_STRING,
+    required: false,
+    default: 'top'
+  },
+  [MODEL_PROP_NAME_SHOW]: {
+    type: PROP_TYPE_BOOLEAN,
+    required: false,
+    default: false
+  },
+  // String ID of element, or element/component reference
+  // Or function that returns one of the above
+  // Required
+  target: {
+    type: [HTMLElement, SVGElement, PROP_TYPE_FUNCTION, PROP_TYPE_OBJECT, PROP_TYPE_STRING],
+    required: true
+  },
+  title: {
+    type: PROP_TYPE_STRING,
+    required: false,
+    default: undefined
+  },
+  triggers: {
+    type: [PROP_TYPE_ARRAY, PROP_TYPE_STRING],
+    required: false,
+    default: 'hover focus'
+  },
+  variant: {
+    type: PROP_TYPE_STRING,
+    required: false,
+    default: undefined
+  }
+};
+
+// --- Main component ---
+
+// @vue/component
+const BTooltip = /*#__PURE__*/extend({
+  name: NAME_TOOLTIP,
+  mixins: [normalizeSlotMixin, useParentMixin],
+  inheritAttrs: false,
+  props,
+  data() {
+    return {
+      localShow: this[MODEL_PROP_NAME_SHOW],
+      localTitle: '',
+      localContent: ''
+    };
+  },
+  computed: {
+    // Data that will be passed to the template and popper
+    templateData() {
+      return {
+        title: this.localTitle,
+        content: this.localContent,
+        interactive: !this.noninteractive,
+        // Pass these props as is
+        ...pick(this.$props, ['boundary', 'boundaryPadding', 'container', 'customClass', 'delay', 'fallbackPlacement', 'id', 'noFade', 'offset', 'placement', 'target', 'target', 'triggers', 'variant', MODEL_PROP_NAME_ENABLED])
+      };
+    },
+    // Used to watch for changes to the title and content props
+    templateTitleContent() {
+      const {
+        title,
+        content
+      } = this;
+      return {
+        title,
+        content
+      };
+    }
+  },
+  watch: {
+    [MODEL_PROP_NAME_SHOW](newValue, oldValue) {
+      if (newValue !== oldValue && newValue !== this.localShow && this.$_toolpop) {
+        if (newValue) {
+          this.$_toolpop.show();
+        } else {
+          // We use `forceHide()` to override any active triggers
+          this.$_toolpop.forceHide();
+        }
+      }
+    },
+    [MODEL_PROP_NAME_ENABLED](newValue) {
+      if (newValue) {
+        this[EVENT_NAME_DISABLE]();
+      } else {
+        this[EVENT_NAME_ENABLE]();
+      }
+    },
+    localShow(newValue) {
+      // TODO: May need to be done in a `$nextTick()`
+      this.$emit(MODEL_EVENT_NAME_SHOW, newValue);
+    },
+    templateData() {
+      this.$nextTick(() => {
+        if (this.$_toolpop) {
+          this.$_toolpop.updateData(this.templateData);
+        }
+      });
+    },
+    // Watchers for title/content props (prop changes do not trigger the `updated()` hook)
+    templateTitleContent() {
+      this.$nextTick(this.updateContent);
+    }
+  },
+  created() {
+    // Create private non-reactive props
+    this.$_toolpop = null;
+  },
+  updated() {
+    // Update the `propData` object
+    // Done in a `$nextTick()` to ensure slot(s) have updated
+    this.$nextTick(this.updateContent);
+  },
+  beforeDestroy() {
+    // Destroy the tip instance
+    if (this.$_toolpop) {
+      this.$_toolpop.$destroy();
+      this.$_toolpop = null;
+    }
+  },
+  mounted() {
+    // Instantiate a new BVTooltip instance
+    // Done in a `$nextTick()` to ensure DOM has completed rendering
+    // so that target can be found
+    this.$nextTick(() => {
+      // Load the on demand child instance
+      const Component = this.getComponent();
+      // Ensure we have initial content
+      this.updateContent();
+      // Pass down the scoped style attribute if available
+      const scopeId = getScopeId(this) || getScopeId(this.bvParent);
+      // Create the instance
+      const $toolpop = this.$_toolpop = createNewChildComponent(this, Component, {
+        // Pass down the scoped style ID
+        _scopeId: scopeId || undefined,
+        propsData: {
+          [eventProp(EVENT_NAME_SHOW)]: this.onShow,
+          [eventProp(EVENT_NAME_SHOWN)]: this.onShown,
+          [eventProp(EVENT_NAME_HIDE)]: this.onHide,
+          [eventProp(EVENT_NAME_HIDDEN)]: this.onHidden,
+          [eventProp(EVENT_NAME_DISABLED)]: this.onDisabled,
+          [eventProp(EVENT_NAME_ENABLED)]: this.onEnabled
+        }
+      });
+      // Set the initial data
+      $toolpop.updateData(this.templateData);
+      // Initially disabled?
+      if (this[MODEL_PROP_NAME_ENABLED]) {
+        // Initially disabled
+        this[EVENT_NAME_DISABLE]();
+      }
+      // Initially show tooltip?
+      if (this.localShow) {
+        $toolpop.show();
+      }
+    });
+  },
+  methods: {
+    getComponent() {
+      // Overridden by BPopover
+      return BVTooltip;
+    },
+    updateContent() {
+      // Overridden by BPopover
+      // Tooltip: Default slot is `title`
+      // Popover: Default slot is `content`, `title` slot is title
+      // We pass a scoped slot function reference by default (Vue v2.6x)
+      // And pass the title prop as a fallback
+      this.setTitle(this.normalizeSlot() || this.title);
+    },
+    // Helper methods for `updateContent()`
+    setTitle(value) {
+      value = isUndefinedOrNull(value) ? '' : value;
+      // We only update the value if it has changed
+      if (this.localTitle !== value) {
+        this.localTitle = value;
+      }
+    },
+    setContent(value) {
+      value = isUndefinedOrNull(value) ? '' : value;
+      // We only update the value if it has changed
+      if (this.localContent !== value) {
+        this.localContent = value;
+      }
+    },
+    // --- Template event handlers ---
+    onShow(bvEvent) {
+      // Placeholder
+      this.$emit(EVENT_NAME_SHOW, bvEvent);
+      if (bvEvent) {
+        this.localShow = !bvEvent.defaultPrevented;
+      }
+    },
+    onShown(bvEvent) {
+      // Tip is now showing
+      this.localShow = true;
+      this.$emit(EVENT_NAME_SHOWN, bvEvent);
+    },
+    onHide(bvEvent) {
+      this.$emit(EVENT_NAME_HIDE, bvEvent);
+    },
+    onHidden(bvEvent) {
+      // Tip is no longer showing
+      this.$emit(EVENT_NAME_HIDDEN, bvEvent);
+      this.localShow = false;
+    },
+    onDisabled(bvEvent) {
+      // Prevent possible endless loop if user mistakenly
+      // fires `disabled` instead of `disable`
+      if (bvEvent && bvEvent.type === EVENT_NAME_DISABLED) {
+        this.$emit(MODEL_EVENT_NAME_ENABLED, true);
+        this.$emit(EVENT_NAME_DISABLED, bvEvent);
+      }
+    },
+    onEnabled(bvEvent) {
+      // Prevent possible endless loop if user mistakenly
+      // fires `enabled` instead of `enable`
+      if (bvEvent && bvEvent.type === EVENT_NAME_ENABLED) {
+        this.$emit(MODEL_EVENT_NAME_ENABLED, false);
+        this.$emit(EVENT_NAME_ENABLED, bvEvent);
+      }
+    },
+    // --- Public methods for programmatic control ---
+    [EVENT_NAME_OPEN]() {
+      !this.localShow && this.$_toolpop && this.$_toolpop.show();
+    },
+    [EVENT_NAME_CLOSE]() {
+      this.localShow && this.$_toolpop && this.$_toolpop.hide();
+    },
+    [EVENT_NAME_DISABLE]() {
+      this.$_toolpop && this.$_toolpop.disable();
+    },
+    [EVENT_NAME_ENABLE]() {
+      this.$_toolpop && this.$_toolpop.enable();
+    }
+  },
+  render(h) {
+    // Always renders a comment node
+    // TODO:
+    //   Future: Possibly render a target slot (single root element)
+    //   which we can apply the listeners to (pass `this.$el` to BVTooltip)
+    return h();
+  }
+});
+
+export { BTooltip, props };

package/dist/vendor/bootstrap-vue/src/components/transition/bv-transition.js

@@ -0,0 +1,118 @@
+import { extend, mergeData } from '../../vue';
+import { NAME_TRANSITION } from '../../constants/components';
+import { PROP_TYPE_BOOLEAN, PROP_TYPE_STRING, PROP_TYPE_OBJECT } from '../../constants/props';
+import { isPlainObject } from '../../utils/inspect';
+
+// Generic Bootstrap v4 fade (no-fade) transition component
+//
+// Assumes that `show` class is not required when
+// the transition has finished the enter transition
+// (show and fade classes are only applied during transition)
+
+
+// --- Constants ---
+
+const NO_FADE_PROPS = {
+  name: '',
+  enterClass: '',
+  enterActiveClass: '',
+  enterToClass: 'show',
+  leaveClass: 'show',
+  leaveActiveClass: '',
+  leaveToClass: ''
+};
+const FADE_PROPS = {
+  ...NO_FADE_PROPS,
+  enterActiveClass: 'fade',
+  leaveActiveClass: 'fade'
+};
+
+// --- Props ---
+
+const props = {
+  // Has no effect if `trans-props` provided
+  appear: {
+    type: PROP_TYPE_BOOLEAN,
+    required: false,
+    default: false
+  },
+  // Can be overridden by user supplied `trans-props`
+  mode: {
+    type: PROP_TYPE_STRING,
+    required: false,
+    default: undefined
+  },
+  // Only applicable to the built in transition
+  // Has no effect if `trans-props` provided
+  noFade: {
+    type: PROP_TYPE_BOOLEAN,
+    required: false,
+    default: false
+  },
+  // For user supplied transitions (if needed)
+  transProps: {
+    type: PROP_TYPE_OBJECT,
+    required: false,
+    default: undefined
+  }
+};
+const hasAnimateSupport = typeof Element !== 'undefined' && Boolean(Element.prototype.animate);
+
+// --- Main component ---
+
+// @vue/component
+const BVTransition = /*#__PURE__*/extend({
+  name: NAME_TRANSITION,
+  functional: true,
+  props,
+  render(h, _ref) {
+    let {
+      children,
+      data,
+      props
+    } = _ref;
+    let transProps = props.transProps;
+    if (!isPlainObject(transProps)) {
+      transProps = props.noFade ? NO_FADE_PROPS : FADE_PROPS;
+      if (props.appear) {
+        // Default the appear classes to equal the enter classes
+        transProps = {
+          ...transProps,
+          appear: true,
+          appearClass: transProps.enterClass,
+          appearActiveClass: transProps.enterActiveClass,
+          appearToClass: transProps.enterToClass
+        };
+      }
+    }
+    transProps = {
+      mode: props.mode,
+      ...transProps,
+      /*
+       bootstrap-vue says: We always need `css` true
+        @gitlab/ui says: OMG. THE FREAKING TRANSITIONS.
+       So apparently jsdom doesn't implement animations (who can blame them)
+       but a Vue Transition relies on the native animationend/transitionend
+       events in order to fire onAfterLeave. jsdom will never fire the `onAfterLeave`
+       which is relied on by e.g. the tooltip component to do it's `hidden` logic.
+        So if in specs, we set `css: false`, everything will work as expected.
+       The best way we have found is to do a feature detection on `Element.prototype.animate`
+       */
+      css: hasAnimateSupport
+    };
+    const dataCopy = {
+      ...data
+    };
+    delete dataCopy.props;
+    Object.keys(props).forEach(key => {
+      delete dataCopy[key];
+    });
+    return h('transition',
+    // Any transition event listeners will get merged here
+    mergeData(dataCopy, {
+      props: transProps
+    }), children);
+  }
+});
+
+export { BVTransition, props };

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

@@ -0,0 +1,220 @@
+import { extend, isVue3 } from '../../vue';
+import { NAME_TRANSPORTER, NAME_TRANSPORTER_TARGET } from '../../constants/components';
+import { IS_BROWSER } from '../../constants/env';
+import { PROP_TYPE_STRING, PROP_TYPE_BOOLEAN, PROP_TYPE_ARRAY, PROP_TYPE_FUNCTION } from '../../constants/props';
+import { HTMLElement } from '../../constants/safe-types';
+import { concat } from '../../utils/array';
+import { select, removeNode } from '../../utils/dom';
+import { identity } from '../../utils/identity';
+import { isString, isFunction } from '../../utils/inspect';
+import { normalizeSlotMixin } from '../../mixins/normalize-slot';
+import { createNewChildComponent } from '../../utils/create-new-child-component';
+
+// --- Helper components ---
+
+// BVTransporter/BVTransporterTarget:
+//
+// Single root node portaling of content, which retains parent/child hierarchy
+// Unlike Portal-Vue where portaled content is no longer a descendent of its
+// intended parent components
+//
+// Private components for use by Tooltips, Popovers and Modals
+//
+// Based on vue-simple-portal
+// https://github.com/LinusBorg/vue-simple-portal
+
+// Transporter target used by BVTransporter
+// Supports only a single root element
+// @vue/component
+const BVTransporterTarget = /*#__PURE__*/extend({
+  // As an abstract component, it doesn't appear in the $parent chain of
+  // components, which means the next parent of any component rendered inside
+  // of this one will be the parent from which is was portal'd
+  abstract: true,
+  name: NAME_TRANSPORTER_TARGET,
+  props: {
+    // Even though we only support a single root element,
+    // VNodes are always passed as an array
+    nodes: {
+      type: [PROP_TYPE_ARRAY, PROP_TYPE_FUNCTION],
+      required: false,
+      default: undefined
+    }
+  },
+  data: vm => {
+    return {
+      updatedNodes: vm.nodes
+    };
+  },
+  destroyed() {
+    removeNode(this.$el);
+  },
+  render(h) {
+    const {
+      updatedNodes
+    } = this;
+    let $nodes = isFunction(updatedNodes) ? updatedNodes({}) : updatedNodes;
+    $nodes = concat($nodes).filter(identity);
+    if ($nodes && $nodes.length > 0 && !$nodes[0].text) {
+      return $nodes[0];
+    }
+
+    /* istanbul ignore next */
+    return h();
+  }
+});
+
+// --- Props ---
+
+const props = {
+  // String: CSS selector,
+  // HTMLElement: Element reference
+  // Mainly needed for tooltips/popovers inside modals
+  container: {
+    type: [HTMLElement, PROP_TYPE_STRING],
+    required: false,
+    default: 'body'
+  },
+  disabled: {
+    type: PROP_TYPE_BOOLEAN,
+    required: false,
+    default: false
+  },
+  // This should be set to match the root element type
+  tag: {
+    type: PROP_TYPE_STRING,
+    required: false,
+    default: 'div'
+  }
+};
+
+// --- Main component ---
+
+// @vue/component
+const BVTransporter = /*#__PURE__*/extend({
+  name: NAME_TRANSPORTER,
+  mixins: [normalizeSlotMixin],
+  props,
+  watch: {
+    disabled: {
+      immediate: true,
+      handler(disabled) {
+        // Vue 2 only: manage manual portaling
+        if (isVue3(this)) return;
+        disabled ? this.unmountTarget() : this.$nextTick(this.mountTarget);
+      }
+    }
+  },
+  created() {
+    // Vue 2 only: create private non-reactive props
+    if (isVue3(this)) return;
+    this.$_defaultFn = null;
+    this.$_target = null;
+  },
+  beforeMount() {
+    // Vue 2 only
+    if (isVue3(this)) return;
+    this.mountTarget();
+  },
+  updated() {
+    // Vue 2 only
+    // We need to make sure that all children have completed updating
+    // before rendering in the target
+    // `vue-simple-portal` has the this in a `$nextTick()`,
+    // while `portal-vue` doesn't
+    // Just trying to see if the `$nextTick()` delay is required or not
+    // Since all slots in Vue 2.6.x are always functions
+    if (isVue3(this)) return;
+    this.updateTarget();
+  },
+  beforeDestroy() {
+    // Vue 2 only
+    if (isVue3(this)) return;
+    this.unmountTarget();
+    this.$_defaultFn = null;
+  },
+  methods: {
+    // Get the element which the target should be appended to
+    getContainer() {
+      /* istanbul ignore else */
+      if (IS_BROWSER) {
+        const {
+          container
+        } = this;
+        return isString(container) ? select(container) : container;
+      } else {
+        return null;
+      }
+    },
+    // Mount the target
+    mountTarget() {
+      if (!this.$_target) {
+        const $container = this.getContainer();
+        if ($container) {
+          const $el = document.createElement('div');
+          $container.appendChild($el);
+          this.$_target = createNewChildComponent(this, BVTransporterTarget, {
+            el: $el,
+            propsData: {
+              // Initial nodes to be rendered
+              nodes: concat(this.normalizeSlot())
+            }
+          });
+        }
+      }
+    },
+    // Update the content of the target
+    updateTarget() {
+      if (IS_BROWSER && this.$_target) {
+        const defaultFn = this.$scopedSlots.default;
+        if (!this.disabled) {
+          /* istanbul ignore else: only applicable in Vue 2.5.x */
+          if (defaultFn && this.$_defaultFn !== defaultFn) {
+            // We only update the target component if the scoped slot
+            // function is a fresh one. The new slot syntax (since Vue 2.6)
+            // can cache unchanged slot functions and we want to respect that here
+            this.$_target.updatedNodes = defaultFn;
+          } else if (!defaultFn) {
+            // We also need to be back compatible with non-scoped default slot (i.e. 2.5.x)
+            this.$_target.updatedNodes = this.$slots.default;
+          }
+        }
+        // Update the scoped slot function cache
+        this.$_defaultFn = defaultFn;
+      }
+    },
+    // Unmount the target
+    unmountTarget() {
+      this.$_target && this.$_target.$destroy();
+      this.$_target = null;
+    }
+  },
+  render(h) {
+    if (isVue3(this)) {
+      // Vue 3: use native Teleport
+      if (this.disabled) {
+        const $nodes = concat(this.normalizeSlot()).filter(identity);
+        if ($nodes.length > 0) {
+          return $nodes[0];
+        }
+      }
+      const {
+        Teleport
+      } = this.$.appContext.config.globalProperties.constructor;
+      return h(Teleport, {
+        to: this.container
+      }, this.normalizeSlot());
+    }
+
+    // Vue 2: this component has no root element, so only a single VNode is allowed
+    if (this.disabled) {
+      const $nodes = concat(this.normalizeSlot()).filter(identity);
+      if ($nodes.length > 0 && !$nodes[0].text) {
+        return $nodes[0];
+      }
+    }
+    return h();
+  }
+});
+
+export { BVTransporter, props };