@gitlab/ui 137.2.4 → 137.2.5

package/dist/components/base/new_dropdowns/disclosure/disclosure_dropdown.js

@@ -338,14 +338,10 @@ var script = {
     },
     handleAutoClose(e) {
       var _this$$refs$baseDropd, _this$$refs$baseDropd2;
-      if (this.autoClose && e.target.closest(ITEM_SELECTOR) && // The optional chaining here is to accommodate specs that use shallow mounting.
-      // Ideally, those specs would either:
-      //  - stub out the `BaseDropdown` component to include a stub `containsElement` method, or
-      //  - use a full mount.
-      //
-      // Unfortunately, GitLab has many specs which do neither of these. So the simpler thing to do
-      // is to optionally chain the method call here.
-      (_this$$refs$baseDropd = (_this$$refs$baseDropd2 = this.$refs.baseDropdown).containsElement) !== null && _this$$refs$baseDropd !== void 0 && _this$$refs$baseDropd.call(_this$$refs$baseDropd2, e.target)) {
+      if (this.autoClose && e.target.closest(ITEM_SELECTOR) && // The ref is null when an item action destroys this component before the click bubbles here.
+      // The method is optionally chained to accommodate specs that shallow mount without stubbing
+      // `BaseDropdown`'s `containsElement`; GitLab has many such specs.
+      (_this$$refs$baseDropd = this.$refs.baseDropdown) !== null && _this$$refs$baseDropd !== void 0 && (_this$$refs$baseDropd2 = _this$$refs$baseDropd.containsElement) !== null && _this$$refs$baseDropd2 !== void 0 && _this$$refs$baseDropd2.call(_this$$refs$baseDropd, e.target)) {
         this.closeAndFocus();
       }
     },

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

@@ -1,4 +1,4 @@
-import { extend, isVue3 } from '../../vue';
+import { extend, isVue3, getVue3Constructor } from '../../vue';
 import { NAME_TRANSPORTER, NAME_TRANSPORTER_TARGET } from '../../constants/components';
 import { IS_BROWSER } from '../../constants/env';
 import { HTMLElement } from '../../constants/safe-types';
@@ -193,7 +193,8 @@ const BVTransporter = /*#__PURE__*/extend({
           return $nodes[0];
         }
       }
-      const Teleport = this.$.appContext.config.globalProperties.constructor.Teleport;
+      const _getVue3Constructor = getVue3Constructor(this),
+        Teleport = _getVue3Constructor.Teleport;
       return h(Teleport, {
         to: this.container
       }, this.normalizeSlot());

package/dist/vendor/bootstrap-vue/src/utils/create-new-child-component.js

@@ -1,4 +1,4 @@
-import { isVue3 } from '../vue';
+import { isVue3, getVue3Constructor } from '../vue';
 
 function _arrayLikeToArray(r, a) {
   (null == a || a > r.length) && (a = r.length);
@@ -119,9 +119,6 @@ const extractEventHandlers = config => {
     cleanConfig
   };
 };
-const getVue3Constructor = parent => {
-  return parent.$.appContext.config.globalProperties.constructor;
-};
 const BUILTIN_DIRECTIVES = ['show', 'model', 'bind', 'cloak', 'else', 'else-if', 'for', 'html', 'if', 'memo', 'on', 'once', 'pre', 'slot', 'text'];
 const resolveComponentOptions = Component => {
   const opts = typeof Component === 'function' && Component.options ? {

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

@@ -41,6 +41,16 @@ if (isGlobalVue3) {
   };
 }
 const isVue3 = instance => Boolean(instance.$);
+
+// Roots created with `new (Vue.extend(Comp))()` expose `Comp`, not `Vue`, as the
+// constructor. Walk up to the base so its options are never merged into helpers.
+const getVue3Constructor = instance => {
+  let Ctor = instance.$.appContext.config.globalProperties.constructor;
+  while (Ctor.super) {
+    Ctor = Ctor.super;
+  }
+  return Ctor;
+};
 const extend = Vue.extend.bind(Vue);
 function mergeData() {
   var _result$attrs, _result$props;
@@ -52,4 +62,4 @@ function mergeData() {
   };
 }
 
-export { COMPONENT_UID_KEY, REF_FOR_KEY, extend, isGlobalVue3, isVue3, mergeData };
+export { COMPONENT_UID_KEY, REF_FOR_KEY, extend, getVue3Constructor, isGlobalVue3, isVue3, mergeData };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gitlab/ui",
-  "version": "137.2.4",
+  "version": "137.2.5",
   "description": "GitLab UI Components",
   "license": "MIT",
   "main": "dist/index.js",
@@ -137,7 +137,7 @@
     "@yarnpkg/lockfile": "^1.1.0",
     "acorn": "^8.18.0",
     "acorn-walk": "^8.3.5",
-    "autoprefixer": "10.6.0",
+    "autoprefixer": "10.6.1",
     "axe-playwright": "^2.2.2",
     "babel-loader": "^9.2.1",
     "cypress": "15.21.1",

package/src/components/base/new_dropdowns/disclosure/disclosure_dropdown.vue

@@ -370,14 +370,10 @@ export default {
       if (
         this.autoClose &&
         e.target.closest(ITEM_SELECTOR) &&
-        // The optional chaining here is to accommodate specs that use shallow mounting.
-        // Ideally, those specs would either:
-        //  - stub out the `BaseDropdown` component to include a stub `containsElement` method, or
-        //  - use a full mount.
-        //
-        // Unfortunately, GitLab has many specs which do neither of these. So the simpler thing to do
-        // is to optionally chain the method call here.
-        this.$refs.baseDropdown.containsElement?.(e.target)
+        // The ref is null when an item action destroys this component before the click bubbles here.
+        // The method is optionally chained to accommodate specs that shallow mount without stubbing
+        // `BaseDropdown`'s `containsElement`; GitLab has many such specs.
+        this.$refs.baseDropdown?.containsElement?.(e.target)
       ) {
         this.closeAndFocus();
       }

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

@@ -1,4 +1,4 @@
-import { isVue3, extend } from '../../vue'
+import { isVue3, extend, getVue3Constructor } from '../../vue'
 import { NAME_TRANSPORTER, NAME_TRANSPORTER_TARGET } from '../../constants/components'
 import { IS_BROWSER } from '../../constants/env'
 import { HTMLElement } from '../../constants/safe-types'
@@ -199,7 +199,7 @@ export const BVTransporter = /*#__PURE__*/ extend({
         }
       }
 
-      const { Teleport } = this.$.appContext.config.globalProperties.constructor
+      const { Teleport } = getVue3Constructor(this)
 
       return h(
         Teleport,

package/src/vendor/bootstrap-vue/src/utils/create-new-child-component.js

@@ -1,4 +1,4 @@
-import { isVue3 } from '../vue'
+import { isVue3, getVue3Constructor } from '../vue'
 
 // Regex to detect event handler props: onSomething or onSomethingOnce
 const EVENT_HANDLER_RE = /^on([A-Z][a-zA-Z]*)$/
@@ -61,10 +61,6 @@ const extractEventHandlers = config => {
   return { handlers, cleanConfig }
 }
 
-const getVue3Constructor = parent => {
-  return parent.$.appContext.config.globalProperties.constructor
-}
-
 const BUILTIN_DIRECTIVES = [
   'show',
   'model',

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

@@ -47,6 +47,16 @@ if (isGlobalVue3) {
 
 const isVue3 = instance => Boolean(instance.$)
 
+// Roots created with `new (Vue.extend(Comp))()` expose `Comp`, not `Vue`, as the
+// constructor. Walk up to the base so its options are never merged into helpers.
+const getVue3Constructor = instance => {
+  let Ctor = instance.$.appContext.config.globalProperties.constructor
+  while (Ctor.super) {
+    Ctor = Ctor.super
+  }
+  return Ctor
+}
+
 const extend = Vue.extend.bind(Vue)
 
 function mergeData(...data) {
@@ -54,4 +64,4 @@ function mergeData(...data) {
   return { ...result, ...(result.attrs ?? {}), ...(result.props ?? {}) }
 }
 
-export { COMPONENT_UID_KEY, mergeData, isGlobalVue3, isVue3, extend }
+export { COMPONENT_UID_KEY, mergeData, isGlobalVue3, isVue3, getVue3Constructor, extend }