@gitlab/ui 112.1.0 → 112.1.1

package/CHANGELOG.md

@@ -1,3 +1,10 @@
+## [112.1.1](https://gitlab.com/gitlab-org/gitlab-ui/compare/v112.1.0...v112.1.1) (2025-04-03)
+
+
+### Bug Fixes
+
+* **GlLineChart, GlStackedColumn:** Legend is updated on changes ([dabba78](https://gitlab.com/gitlab-org/gitlab-ui/commit/dabba7878e8cd7702bab88312983c4f03db20d04))
+
 # [112.1.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v112.0.1...v112.1.0) (2025-04-02)
 
 

package/dist/components/charts/line/line.js

@@ -102,6 +102,7 @@ var script = {
     // https://gitlab.com/gitlab-org/gitlab-ui/-/issues/618
     return {
       chart: null,
+      compiledOptions: null,
       showAnnotationsTooltip: false,
       annotationsTooltipTitle: '',
       annotationsTooltipContent: '',
@@ -182,25 +183,25 @@ var script = {
     shouldShowAnnotationsTooltip() {
       return this.chart && this.hasAnnotations;
     },
-    compiledOptions() {
-      return this.chart ? this.chart.getOption() : null;
-    },
     legendStyle() {
       return {
         paddingLeft: `${grid.left}px`
       };
     },
     hasLegend() {
-      return this.compiledOptions && this.showLegend;
+      return this.showLegend && this.compiledOptions;
     },
     seriesInfo() {
-      return this.compiledOptions.series.reduce((acc, series, index) => {
+      var _this$compiledOptions;
+      const compiledSeries = ((_this$compiledOptions = this.compiledOptions) === null || _this$compiledOptions === void 0 ? void 0 : _this$compiledOptions.series) || [];
+      return compiledSeries.reduce((acc, series, index) => {
         if (series.type === 'line') {
+          var _series$data;
           acc.push({
             name: series.name,
             type: series.lineStyle.type,
             color: series.lineStyle.color || colorFromDefaultPalette(index),
-            data: this.includeLegendAvgMax ? series.data.map(data => data[1]) : undefined
+            data: this.includeLegendAvgMax ? (_series$data = series.data) === null || _series$data === void 0 ? void 0 : _series$data.map(data => data[1]) : undefined
           });
         }
         return acc;
@@ -240,6 +241,9 @@ var script = {
       this.chart = chart;
       this.$emit('created', chart);
     },
+    onUpdated() {
+      this.compiledOptions = this.chart.getOption();
+    },
     onChartDataPointMouseOut() {
       this.showAnnotationsTooltip = false;
     },
@@ -276,7 +280,7 @@ const __vue_script__ = script;
 /* template */
 var __vue_render__ = function () {
 var _obj;
-var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-relative",class:( _obj = {}, _obj[_vm.$options.HEIGHT_AUTO_CLASSES] = _vm.autoHeight, _obj )},[_c('chart',_vm._g(_vm._b({class:{ 'gl-grow': _vm.autoHeight },attrs:{"height":_vm.height,"options":_vm.options},on:{"created":_vm.onCreated}},'chart',_vm.$attrs,false),_vm.$listeners)),_vm._v(" "),(_vm.shouldShowAnnotationsTooltip)?_c('chart-tooltip',{ref:"annotationsTooltip",attrs:{"id":"annotationsTooltip","show":_vm.showAnnotationsTooltip,"chart":_vm.chart,"top":_vm.annotationsTooltipPosition.top,"left":_vm.annotationsTooltipPosition.left,"placement":"bottom"},scopedSlots:_vm._u([{key:"title",fn:function(){return [_c('div',[_vm._v(_vm._s(_vm.annotationsTooltipTitle))])]},proxy:true}],null,false,1889294429)},[_vm._v(" "),_c('div',[_vm._v(_vm._s(_vm.annotationsTooltipContent))])]):_vm._e(),_vm._v(" "),(_vm.chart)?_c('chart-tooltip',{ref:"dataTooltip",attrs:{"chart":_vm.chart,"use-default-tooltip-formatter":!_vm.formatTooltipText},scopedSlots:_vm._u([(_vm.$scopedSlots['tooltip-title'])?{key:"title",fn:function(scope){return [_vm._t("tooltip-title",null,null,scope)]}}:null,(_vm.$scopedSlots['tooltip-content'])?{key:"default",fn:function(scope){return [_vm._t("tooltip-content",null,null,scope)]}}:null,(_vm.$scopedSlots['tooltip-value'])?{key:"tooltip-value",fn:function(scope){return [_vm._t("tooltip-value",null,null,scope)]}}:null],null,true)}):_vm._e(),_vm._v(" "),(_vm.hasLegend)?_c('chart-legend',{style:(_vm.legendStyle),attrs:{"chart":_vm.chart,"series-info":_vm.seriesInfo,"text-style":_vm.compiledOptions.textStyle,"min-text":_vm.legendMinText,"max-text":_vm.legendMaxText,"average-text":_vm.legendAverageText,"current-text":_vm.legendCurrentText,"layout":_vm.legendLayout}}):_vm._e()],1)};
+var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-relative",class:( _obj = {}, _obj[_vm.$options.HEIGHT_AUTO_CLASSES] = _vm.autoHeight, _obj )},[_c('chart',_vm._g(_vm._b({class:{ 'gl-grow': _vm.autoHeight },attrs:{"height":_vm.height,"options":_vm.options},on:{"created":_vm.onCreated,"updated":_vm.onUpdated}},'chart',_vm.$attrs,false),_vm.$listeners)),_vm._v(" "),(_vm.shouldShowAnnotationsTooltip)?_c('chart-tooltip',{ref:"annotationsTooltip",attrs:{"id":"annotationsTooltip","show":_vm.showAnnotationsTooltip,"chart":_vm.chart,"top":_vm.annotationsTooltipPosition.top,"left":_vm.annotationsTooltipPosition.left,"placement":"bottom"},scopedSlots:_vm._u([{key:"title",fn:function(){return [_c('div',[_vm._v(_vm._s(_vm.annotationsTooltipTitle))])]},proxy:true}],null,false,1889294429)},[_vm._v(" "),_c('div',[_vm._v(_vm._s(_vm.annotationsTooltipContent))])]):_vm._e(),_vm._v(" "),(_vm.chart)?_c('chart-tooltip',{ref:"dataTooltip",attrs:{"chart":_vm.chart,"use-default-tooltip-formatter":!_vm.formatTooltipText},scopedSlots:_vm._u([(_vm.$scopedSlots['tooltip-title'])?{key:"title",fn:function(scope){return [_vm._t("tooltip-title",null,null,scope)]}}:null,(_vm.$scopedSlots['tooltip-content'])?{key:"default",fn:function(scope){return [_vm._t("tooltip-content",null,null,scope)]}}:null,(_vm.$scopedSlots['tooltip-value'])?{key:"tooltip-value",fn:function(scope){return [_vm._t("tooltip-value",null,null,scope)]}}:null],null,true)}):_vm._e(),_vm._v(" "),(_vm.hasLegend)?_c('chart-legend',{style:(_vm.legendStyle),attrs:{"chart":_vm.chart,"series-info":_vm.seriesInfo,"text-style":_vm.compiledOptions.textStyle,"min-text":_vm.legendMinText,"max-text":_vm.legendMaxText,"average-text":_vm.legendAverageText,"current-text":_vm.legendCurrentText,"layout":_vm.legendLayout}}):_vm._e()],1)};
 var __vue_staticRenderFns__ = [];
 
   /* style */

package/dist/components/charts/stacked_column/stacked_column.js

@@ -139,7 +139,8 @@ var script = {
   },
   data() {
     return {
-      chart: null
+      chart: null,
+      compiledOptions: null
     };
   },
   computed: {
@@ -255,11 +256,10 @@ var script = {
         paddingLeft: `${grid.left}px`
       };
     },
-    compiledOptions() {
-      return this.chart ? this.chart.getOption() : null;
-    },
     seriesInfo() {
-      return this.compiledOptions.series.reduce((acc, series, index) => {
+      var _this$compiledOptions;
+      const compiledSeries = ((_this$compiledOptions = this.compiledOptions) === null || _this$compiledOptions === void 0 ? void 0 : _this$compiledOptions.series) || [];
+      return compiledSeries.reduce((acc, series, index) => {
         acc.push({
           name: series.name,
           type: series.type,
@@ -283,6 +283,9 @@ var script = {
       this.chart = chart;
       this.$emit('created', chart);
     },
+    onUpdated() {
+      this.compiledOptions = this.chart.getOption();
+    },
     getTooltipTitle(_ref4) {
       var _options$xAxis, _options$xAxis$;
       let {
@@ -322,7 +325,7 @@ const __vue_script__ = script;
 /* template */
 var __vue_render__ = function () {
 var _obj;
-var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-relative",class:( _obj = {}, _obj[_vm.$options.HEIGHT_AUTO_CLASSES] = _vm.autoHeight, _obj )},[_c('chart',_vm._g(_vm._b({class:{ 'gl-grow': _vm.autoHeight },attrs:{"height":_vm.height,"options":_vm.options},on:{"created":_vm.onCreated}},'chart',_vm.$attrs,false),_vm.$listeners)),_vm._v(" "),(_vm.chart)?_c('chart-tooltip',{attrs:{"chart":_vm.chart,"use-default-tooltip-formatter":!_vm.formatTooltipText},scopedSlots:_vm._u([{key:"title",fn:function(scope){return [_vm._t("tooltip-title",function(){return [_vm._v(_vm._s(_vm.getTooltipTitle(scope)))]},null,scope)]}},{key:"default",fn:function(scope){return [_vm._t("tooltip-content",function(){return [_c('tooltip-default-format',{attrs:{"tooltip-content":_vm.getTooltipContent(scope)},scopedSlots:_vm._u([(_vm.$scopedSlots['tooltip-value'])?{key:"tooltip-value",fn:function(valueScope){return [_vm._t("tooltip-value",null,null,valueScope)]}}:null],null,true)})]},null,scope)]}}],null,true)}):_vm._e(),_vm._v(" "),(_vm.compiledOptions)?_c('chart-legend',{style:(_vm.legendStyle),attrs:{"chart":_vm.chart,"series-info":_vm.seriesInfo,"text-style":_vm.compiledOptions.textStyle,"min-text":_vm.legendMinText,"max-text":_vm.legendMaxText,"average-text":_vm.legendAverageText,"current-text":_vm.legendCurrentText,"layout":_vm.legendLayout}}):_vm._e()],1)};
+var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-relative",class:( _obj = {}, _obj[_vm.$options.HEIGHT_AUTO_CLASSES] = _vm.autoHeight, _obj )},[_c('chart',_vm._g(_vm._b({class:{ 'gl-grow': _vm.autoHeight },attrs:{"height":_vm.height,"options":_vm.options},on:{"created":_vm.onCreated,"updated":_vm.onUpdated}},'chart',_vm.$attrs,false),_vm.$listeners)),_vm._v(" "),(_vm.chart)?_c('chart-tooltip',{attrs:{"chart":_vm.chart,"use-default-tooltip-formatter":!_vm.formatTooltipText},scopedSlots:_vm._u([{key:"title",fn:function(scope){return [_vm._t("tooltip-title",function(){return [_vm._v(_vm._s(_vm.getTooltipTitle(scope)))]},null,scope)]}},{key:"default",fn:function(scope){return [_vm._t("tooltip-content",function(){return [_c('tooltip-default-format',{attrs:{"tooltip-content":_vm.getTooltipContent(scope)},scopedSlots:_vm._u([(_vm.$scopedSlots['tooltip-value'])?{key:"tooltip-value",fn:function(valueScope){return [_vm._t("tooltip-value",null,null,valueScope)]}}:null],null,true)})]},null,scope)]}}],null,true)}):_vm._e(),_vm._v(" "),(_vm.compiledOptions)?_c('chart-legend',{style:(_vm.legendStyle),attrs:{"chart":_vm.chart,"series-info":_vm.seriesInfo,"text-style":_vm.compiledOptions.textStyle,"min-text":_vm.legendMinText,"max-text":_vm.legendMaxText,"average-text":_vm.legendAverageText,"current-text":_vm.legendCurrentText,"layout":_vm.legendLayout}}):_vm._e()],1)};
 var __vue_staticRenderFns__ = [];
 
   /* style */

package/dist/index.js

@@ -106,7 +106,6 @@ export { GlModalDirective } from './directives/modal';
 export { GlTooltipDirective } from './directives/tooltip/tooltip';
 export { setGlTooltipDefaultContainer } from './directives/tooltip/container';
 export { GlResizeObserverDirective } from './directives/resize_observer/resize_observer';
-export { GlCollapseToggleDirective } from './directives/collapse_toggle';
 export { SafeLinkDirective as GlSafeLinkDirective } from './directives/safe_link/safe_link';
 export { SafeHtmlDirective as GlSafeHtmlDirective } from './directives/safe_html/safe_html';
 export { OutsideDirective as GlOutsideDirective } from './directives/outside/outside';

package/package.json

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

package/src/components/charts/line/line.vue

@@ -138,6 +138,7 @@ export default {
     // https://gitlab.com/gitlab-org/gitlab-ui/-/issues/618
     return {
       chart: null,
+      compiledOptions: null,
       showAnnotationsTooltip: false,
       annotationsTooltipTitle: '',
       annotationsTooltipContent: '',
@@ -233,23 +234,21 @@ export default {
     shouldShowAnnotationsTooltip() {
       return this.chart && this.hasAnnotations;
     },
-    compiledOptions() {
-      return this.chart ? this.chart.getOption() : null;
-    },
     legendStyle() {
       return { paddingLeft: `${grid.left}px` };
     },
     hasLegend() {
-      return this.compiledOptions && this.showLegend;
+      return this.showLegend && this.compiledOptions;
     },
     seriesInfo() {
-      return this.compiledOptions.series.reduce((acc, series, index) => {
+      const compiledSeries = this.compiledOptions?.series || [];
+      return compiledSeries.reduce((acc, series, index) => {
         if (series.type === 'line') {
           acc.push({
             name: series.name,
             type: series.lineStyle.type,
             color: series.lineStyle.color || colorFromDefaultPalette(index),
-            data: this.includeLegendAvgMax ? series.data.map((data) => data[1]) : undefined,
+            data: this.includeLegendAvgMax ? series.data?.map((data) => data[1]) : undefined,
           });
         }
         return acc;
@@ -289,6 +288,9 @@ export default {
       this.chart = chart;
       this.$emit('created', chart);
     },
+    onUpdated() {
+      this.compiledOptions = this.chart.getOption();
+    },
     onChartDataPointMouseOut() {
       this.showAnnotationsTooltip = false;
     },
@@ -325,6 +327,7 @@ export default {
       :options="options"
       v-on="$listeners"
       @created="onCreated"
+      @updated="onUpdated"
     />
     <chart-tooltip
       v-if="shouldShowAnnotationsTooltip"

package/src/components/charts/stacked_column/stacked_column.vue

@@ -159,6 +159,7 @@ export default {
   data() {
     return {
       chart: null,
+      compiledOptions: null,
     };
   },
   computed: {
@@ -251,11 +252,9 @@ export default {
     legendStyle() {
       return { paddingLeft: `${grid.left}px` };
     },
-    compiledOptions() {
-      return this.chart ? this.chart.getOption() : null;
-    },
     seriesInfo() {
-      return this.compiledOptions.series.reduce((acc, series, index) => {
+      const compiledSeries = this.compiledOptions?.series || [];
+      return compiledSeries.reduce((acc, series, index) => {
         acc.push({
           name: series.name,
           type: series.type,
@@ -278,6 +277,9 @@ export default {
       this.chart = chart;
       this.$emit('created', chart);
     },
+    onUpdated() {
+      this.compiledOptions = this.chart.getOption();
+    },
     getTooltipTitle({ params }) {
       if (!params) return '';
 
@@ -310,6 +312,7 @@ export default {
       :options="options"
       v-on="$listeners"
       @created="onCreated"
+      @updated="onUpdated"
     />
     <chart-tooltip v-if="chart" :chart="chart" :use-default-tooltip-formatter="!formatTooltipText">
       <template #title="scope">

package/src/index.js

@@ -122,7 +122,6 @@ export { GlModalDirective } from './directives/modal';
 export { GlTooltipDirective } from './directives/tooltip/tooltip';
 export { setGlTooltipDefaultContainer } from './directives/tooltip/container';
 export { GlResizeObserverDirective } from './directives/resize_observer/resize_observer';
-export { GlCollapseToggleDirective } from './directives/collapse_toggle';
 export { SafeLinkDirective as GlSafeLinkDirective } from './directives/safe_link/safe_link';
 export { SafeHtmlDirective as GlSafeHtmlDirective } from './directives/safe_html/safe_html';
 export { OutsideDirective as GlOutsideDirective } from './directives/outside/outside';

package/src/vendor/bootstrap-vue/src/components/collapse/package.json

@@ -4,9 +4,6 @@
   "meta": {
     "title": "Collapse",
     "description": "Easily toggle content visibility on your pages. Includes support for making accordions.",
-    "plugins": [
-      "VBTogglePlugin"
-    ],
     "components": [
       {
         "component": "BCollapse",

package/dist/directives/collapse_toggle.js

@@ -1 +0,0 @@
-export { VBToggle as GlCollapseToggleDirective } from '../vendor/bootstrap-vue/src/directives/toggle/toggle';

package/dist/vendor/bootstrap-vue/src/directives/toggle/index.js

@@ -1 +0,0 @@
-export { VBToggle } from './toggle';

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

@@ -1,253 +0,0 @@
-import { NAME_COLLAPSE } from '../../constants/components';
-import { IS_BROWSER } from '../../constants/env';
-import { EVENT_OPTIONS_PASSIVE } from '../../constants/events';
-import { CODE_ENTER, CODE_SPACE } from '../../constants/key-codes';
-import { RX_SPACE_SPLIT, RX_HASH_ID, RX_HASH } from '../../constants/regex';
-import { arrayIncludes, concat } from '../../utils/array';
-import { getInstanceFromDirective } from '../../utils/get-instance-from-directive';
-import { removeClass, removeAttr, removeStyle, hasAttr, setAttr, setStyle, requestAF, isTag, getAttr, addClass, isDisabled } from '../../utils/dom';
-import { getRootActionEventName, getRootEventName, eventOff, eventOn } from '../../utils/events';
-import { isString } from '../../utils/inspect';
-import { looseEqual } from '../../utils/loose-equal';
-import { keys } from '../../utils/object';
-import { getEventRoot } from '../../utils/get-event-root';
-
-// --- Constants ---
-
-// Classes to apply to trigger element
-const CLASS_BV_TOGGLE_COLLAPSED = 'collapsed';
-const CLASS_BV_TOGGLE_NOT_COLLAPSED = 'not-collapsed';
-
-// Property key for handler storage
-const BV_BASE = '__BV_toggle';
-// Root event listener property (Function)
-const BV_TOGGLE_ROOT_HANDLER = `${BV_BASE}_HANDLER__`;
-// Trigger element click handler property (Function)
-const BV_TOGGLE_CLICK_HANDLER = `${BV_BASE}_CLICK__`;
-// Target visibility state property (Boolean)
-const BV_TOGGLE_STATE = `${BV_BASE}_STATE__`;
-// Target ID list property (Array)
-const BV_TOGGLE_TARGETS = `${BV_BASE}_TARGETS__`;
-
-// Commonly used strings
-const STRING_FALSE = 'false';
-const STRING_TRUE = 'true';
-
-// Commonly used attribute names
-const ATTR_ARIA_CONTROLS = 'aria-controls';
-const ATTR_ARIA_EXPANDED = 'aria-expanded';
-const ATTR_ROLE = 'role';
-const ATTR_TABINDEX = 'tabindex';
-
-// Commonly used style properties
-const STYLE_OVERFLOW_ANCHOR = 'overflow-anchor';
-
-// Emitted control event for collapse (emitted to collapse)
-const ROOT_ACTION_EVENT_NAME_TOGGLE = getRootActionEventName(NAME_COLLAPSE, 'toggle');
-
-// Listen to event for toggle state update (emitted by collapse)
-const ROOT_EVENT_NAME_STATE = getRootEventName(NAME_COLLAPSE, 'state');
-
-// Private event emitted on `$root` to ensure the toggle state is always synced
-// Gets emitted even if the state of b-collapse has not changed
-// This event is NOT to be documented as people should not be using it
-const ROOT_EVENT_NAME_SYNC_STATE = getRootEventName(NAME_COLLAPSE, 'sync-state');
-
-// Private event we send to collapse to request state update sync event
-const ROOT_ACTION_EVENT_NAME_REQUEST_STATE = getRootActionEventName(NAME_COLLAPSE, 'request-state');
-const KEYDOWN_KEY_CODES = [CODE_ENTER, CODE_SPACE];
-
-// --- Helper methods ---
-
-const isNonStandardTag = el => !arrayIncludes(['button', 'a'], el.tagName.toLowerCase());
-const getTargets = (_ref, el) => {
-  let {
-    modifiers,
-    arg,
-    value
-  } = _ref;
-  // Any modifiers are considered target IDs
-  const targets = keys(modifiers || {});
-
-  // If value is a string, split out individual targets (if space delimited)
-  value = isString(value) ? value.split(RX_SPACE_SPLIT) : value;
-
-  // Support target ID as link href (`href="#id"`)
-  if (isTag(el.tagName, 'a')) {
-    const href = getAttr(el, 'href') || '';
-    if (RX_HASH_ID.test(href)) {
-      targets.push(href.replace(RX_HASH, ''));
-    }
-  }
-
-  // Add ID from `arg` (if provided), and support value
-  // as a single string ID or an array of string IDs
-  // If `value` is not an array or string, then it gets filtered out
-  concat(arg, value).forEach(t => isString(t) && targets.push(t));
-
-  // Return only unique and truthy target IDs
-  return targets.filter((t, index, arr) => t && arr.indexOf(t) === index);
-};
-const removeClickListener = el => {
-  const handler = el[BV_TOGGLE_CLICK_HANDLER];
-  if (handler) {
-    eventOff(el, 'click', handler, EVENT_OPTIONS_PASSIVE);
-    eventOff(el, 'keydown', handler, EVENT_OPTIONS_PASSIVE);
-  }
-  el[BV_TOGGLE_CLICK_HANDLER] = null;
-};
-const addClickListener = (el, instance) => {
-  removeClickListener(el);
-  if (instance) {
-    const handler = event => {
-      if (!(event.type === 'keydown' && !arrayIncludes(KEYDOWN_KEY_CODES, event.keyCode)) && !isDisabled(el)) {
-        const targets = el[BV_TOGGLE_TARGETS] || [];
-        targets.forEach(target => {
-          getEventRoot(instance).$emit(ROOT_ACTION_EVENT_NAME_TOGGLE, target);
-        });
-      }
-    };
-    el[BV_TOGGLE_CLICK_HANDLER] = handler;
-    eventOn(el, 'click', handler, EVENT_OPTIONS_PASSIVE);
-    if (isNonStandardTag(el)) {
-      eventOn(el, 'keydown', handler, EVENT_OPTIONS_PASSIVE);
-    }
-  }
-};
-const removeRootListeners = (el, instance) => {
-  if (el[BV_TOGGLE_ROOT_HANDLER] && instance) {
-    getEventRoot(instance).$off([ROOT_EVENT_NAME_STATE, ROOT_EVENT_NAME_SYNC_STATE], el[BV_TOGGLE_ROOT_HANDLER]);
-  }
-  el[BV_TOGGLE_ROOT_HANDLER] = null;
-};
-const addRootListeners = (el, instance) => {
-  removeRootListeners(el, instance);
-  if (instance) {
-    const handler = (id, state) => {
-      // `state` will be `true` if target is expanded
-      if (arrayIncludes(el[BV_TOGGLE_TARGETS] || [], id)) {
-        // Set/Clear 'collapsed' visibility class state
-        el[BV_TOGGLE_STATE] = state;
-        // Set `aria-expanded` and class state on trigger element
-        setToggleState(el, state);
-      }
-    };
-    el[BV_TOGGLE_ROOT_HANDLER] = handler;
-    // Listen for toggle state changes (public) and sync (private)
-    getEventRoot(instance).$on([ROOT_EVENT_NAME_STATE, ROOT_EVENT_NAME_SYNC_STATE], handler);
-  }
-};
-const setToggleState = (el, state) => {
-  // State refers to the visibility of the collapse
-  if (state) {
-    removeClass(el, CLASS_BV_TOGGLE_COLLAPSED);
-    addClass(el, CLASS_BV_TOGGLE_NOT_COLLAPSED);
-    setAttr(el, ATTR_ARIA_EXPANDED, STRING_TRUE);
-  } else {
-    removeClass(el, CLASS_BV_TOGGLE_NOT_COLLAPSED);
-    addClass(el, CLASS_BV_TOGGLE_COLLAPSED);
-    setAttr(el, ATTR_ARIA_EXPANDED, STRING_FALSE);
-  }
-};
-
-// Reset and remove a property from the provided element
-const resetProp = (el, prop) => {
-  el[prop] = null;
-  delete el[prop];
-};
-
-// Handle directive updates
-const handleUpdate = (el, binding, vnode) => {
-  /* istanbul ignore next: should never happen */
-  if (!IS_BROWSER || !getInstanceFromDirective(vnode, binding)) {
-    return;
-  }
-
-  // If element is not a button or link, we add `role="button"`
-  // and `tabindex="0"` for accessibility reasons
-  if (isNonStandardTag(el)) {
-    if (!hasAttr(el, ATTR_ROLE)) {
-      setAttr(el, ATTR_ROLE, 'button');
-    }
-    if (!hasAttr(el, ATTR_TABINDEX)) {
-      setAttr(el, ATTR_TABINDEX, '0');
-    }
-  }
-
-  // Ensure the collapse class and `aria-*` attributes persist
-  // after element is updated (either by parent re-rendering
-  // or changes to this element or its contents)
-  setToggleState(el, el[BV_TOGGLE_STATE]);
-
-  // Parse list of target IDs
-  const targets = getTargets(binding, el);
-
-  // Ensure the `aria-controls` hasn't been overwritten
-  // or removed when vnode updates
-  // Also ensure to set `overflow-anchor` to `none` to prevent
-  // the browser's scroll anchoring behavior
-  /* istanbul ignore else */
-  if (targets.length > 0) {
-    setAttr(el, ATTR_ARIA_CONTROLS, targets.join(' '));
-    setStyle(el, STYLE_OVERFLOW_ANCHOR, 'none');
-  } else {
-    removeAttr(el, ATTR_ARIA_CONTROLS);
-    removeStyle(el, STYLE_OVERFLOW_ANCHOR);
-  }
-
-  // Add/Update our click listener(s)
-  // Wrap in a `requestAF()` to allow any previous
-  // click handling to occur first
-  requestAF(() => {
-    addClickListener(el, getInstanceFromDirective(vnode, binding));
-  });
-
-  // If targets array has changed, update
-  if (!looseEqual(targets, el[BV_TOGGLE_TARGETS])) {
-    // Update targets array to element storage
-    el[BV_TOGGLE_TARGETS] = targets;
-    // Ensure `aria-controls` is up to date
-    // Request a state update from targets so that we can
-    // ensure expanded state is correct (in most cases)
-    targets.forEach(target => {
-      getEventRoot(getInstanceFromDirective(vnode, binding)).$emit(ROOT_ACTION_EVENT_NAME_REQUEST_STATE, target);
-    });
-  }
-};
-
-/*
- * Export our directive
- */
-const VBToggle = {
-  bind(el, binding, vnode) {
-    // State is initially collapsed until we receive a state event
-    el[BV_TOGGLE_STATE] = false;
-    // Assume no targets initially
-    el[BV_TOGGLE_TARGETS] = [];
-    // Add our root listeners
-    addRootListeners(el, getInstanceFromDirective(vnode, binding));
-    // Initial update of trigger
-    handleUpdate(el, binding, vnode);
-  },
-  componentUpdated: handleUpdate,
-  updated: handleUpdate,
-  unbind(el, binding, vnode) {
-    removeClickListener(el);
-    // Remove our $root listener
-    removeRootListeners(el, getInstanceFromDirective(vnode, binding));
-    // Reset custom props
-    resetProp(el, BV_TOGGLE_ROOT_HANDLER);
-    resetProp(el, BV_TOGGLE_CLICK_HANDLER);
-    resetProp(el, BV_TOGGLE_STATE);
-    resetProp(el, BV_TOGGLE_TARGETS);
-    // Reset classes/attrs/styles
-    removeClass(el, CLASS_BV_TOGGLE_COLLAPSED);
-    removeClass(el, CLASS_BV_TOGGLE_NOT_COLLAPSED);
-    removeAttr(el, ATTR_ARIA_EXPANDED);
-    removeAttr(el, ATTR_ARIA_CONTROLS);
-    removeAttr(el, ATTR_ROLE);
-    removeStyle(el, STYLE_OVERFLOW_ANCHOR);
-  }
-};
-
-export { VBToggle };

package/src/directives/collapse_toggle.js

@@ -1 +0,0 @@
-export { VBToggle as GlCollapseToggleDirective } from '../vendor/bootstrap-vue/src/directives/toggle/toggle';

package/src/vendor/bootstrap-vue/src/directives/toggle/README.md

@@ -1,145 +0,0 @@
-# Toggle
-
-> `v-b-toggle` is a light-weight directive for toggling the visibility of collapses, and includes
-> automated [WAI-ARIA accessibility](?path=/docs/base-tooltip--docs#accessibility) attribute
-> handling.
-
-## Overview
-
-The `v-b-toggle` directive can be used on interactive elements, such as buttons and to toggle the
-visibility state of the [`<gl-collapse>`](?path=/docs/base-collapse--docs) component.
-
-Besides toggling the visibility of the target component, the directive automatically updates ARIA
-accessibility attributes on the element it is applied to so that they reflect the visibility state
-of the target component. Refer to the [Accessibility section](#accessibility) below for additional
-details and caveats.
-
-## Directive syntax and usage
-
-The directive is applied to the element or component that triggers the visibility of the target. The
-target component can be specified (via its ID) as either a directive modifier(s), the directive
-argument, or as a string/array passed to as the directive value:
-
-- `v-b-toggle.my-collapse` - the directive modifier (multiple targets allowed, each modifier is a
-  target ID)
-- `v-b-toggle:my-collapse` - the directive argument
-  ([Vue dynamic argument](https://vuejs.org/v2/guide/syntax.html#Dynamic-Arguments) is supported)
-  <span class="badge badge-info small" aria-label="Available in BootstrapVue v2.14.0+">v2.14.0+</span>
-- `v-b-toggle="'my-collapse'"` - the directive value as a string ID
-- `v-b-toggle="'my-collapse1 my-collapse2'"` - the directive value as a space separated string of
-  IDs
-  <span class="badge badge-info small" aria-label="Available in BootstrapVue v2.14.0+">v2.14.0+</span>
-- `v-b-toggle="['my-collapse1', 'my-collapse2']"` - the directive value as an array of string IDs
-  <span class="badge badge-info small" aria-label="Available in BootstrapVue v2.14.0+">v2.14.0+</span>
-
-Modifiers, argument, and the value can be used at the same time when targeting multiple components.
-
-**Example usage:**
-
-```html
-<template>
-  <div>
-    <div class="mb-3">
-      <b-button v-b-toggle.my-collapse>Toggle Collapse</b-button>
-    </div>
-
-    <b-collapse id="my-collapse">
-      <b-card title="Collapsible card">
-        Hello world!
-      </b-card>
-    </b-collapse>
-  </div>
-</template>
-
-<!-- v-b-toggle-directive.vue -->
-```
-
-## Usage on links
-
-<span class="badge badge-info small">2.15.0+</span>
-
-If placing the directive on a link (or a component that renders a link), the target ID can
-alternatively be specified via the `href` attribute.
-
-Note that the browser URL will change and the page may scroll the target into view. To prevent the
-URL from changing and the page from scrolling, add `@click.prevent` to the link.
-
-**Example usage:**
-
-```html
-<template>
-  <div>
-    <div class="mb-3">
-      <a v-b-toggle href="#example-collapse" @click.prevent>Toggle Collapse</a>
-    </div>
-
-    <b-collapse id="example-collapse">
-      <b-card title="Collapsible card">
-        Hello world!
-      </b-card>
-    </b-collapse>
-  </div>
-</template>
-
-<!-- v-b-toggle-links.vue -->
-```
-
-## Hiding and showing content in the toggle trigger element
-
-When using the `v-b-toggle` directive, the class `collapsed` will automatically be placed on the
-trigger element when the target component is closed, and removed when open. As of BootstrapVue
-`2.14.0`, the class `not-collapsed` will be applied when the target is _not_ closed.
-
-**Example HTML markup:**
-
-```html
-<div>
-  <b-button v-b-toggle:my-collapse>
-    <span class="when-open">Close</span><span class="when-closed">Open</span> My Collapse
-  </b-button>
-  <b-collapse id="my-collapse">
-    <!-- Content here -->
-  </b-collapse>
-</div>
-```
-
-**Example Custom CSS:**
-
-```css
-.collapsed > .when-open,
-.not-collapsed > .when-closed {
-  display: none;
-}
-```
-
-## Preventing the target from opening or closing
-
-To prevent the trigger element from toggling the target, set the `disabled` prop on `<button>`,
-`<b-button>`, or `<b-link>` (or components based on from `<b-link>`) and the toggle event will _not_
-dispatched to the target(s).
-
-## Accessibility
-
-The directive, for accessibility reasons, should be placed on an clickable interactive element such
-as a `<button>` or `<b-button>`, which can easily be accessed by keyboard-only users and screen
-reader users. Elements that do not natively have an accessibility role of `button` (or `link`) will
-have the attributes `role="button"` and `tabindex="0"` applied, and will have the appropriate click
-handler instantiated. Therefore it is _highly recommended_ to _not_ place the directive on form
-controls other than buttons.
-
-The directive applies, and dynamically updates, the following ARIA attributes on the trigger
-element:
-
-- `aria-controls` - the ID(s) of the collapse component(s) being toggled
-- `aria-expanded` - the visibility state of the collapse (see the
-  [caveats section](#caveats-with-multiple-targets) below)
-
-### Caveats with multiple targets
-
-When multiple targets are specified, the value of the `aria-expanded` attribute may not be correct
-if the individual target components can have their collapsed state controlled independently (either
-via `v-model`, other controls with `v-b-toggle` directive, or CSS visibility).
-
-## See also
-
-- [collapse](?path=/docs/base-collapse--docs) Collapsible content with accordion support

package/src/vendor/bootstrap-vue/src/directives/toggle/index.js

@@ -1,3 +0,0 @@
-import { VBToggle } from './toggle'
-
-export { VBToggle }