@gitlab/ui 72.6.0 → 72.8.0

package/CHANGELOG.md

@@ -1,3 +1,22 @@
+# [72.8.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v72.7.0...v72.8.0) (2024-01-16)
+
+
+### Features
+
+* **GlColumnChart:** allow customising chart tooltip ([ed6ee9e](https://gitlab.com/gitlab-org/gitlab-ui/commit/ed6ee9e3139cba2793d90d955c39c41f6ab2b5af))
+
+# [72.7.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v72.6.0...v72.7.0) (2024-01-14)
+
+
+### Bug Fixes
+
+* **GlEmptyState:** remove incorrect role from img ([9e5d86f](https://gitlab.com/gitlab-org/gitlab-ui/commit/9e5d86f9c9cbeaae2f7c179f56dbbbab633890e1))
+
+
+### Features
+
+* **css:** adds gl-max-w-12 utility class ([58254e6](https://gitlab.com/gitlab-org/gitlab-ui/commit/58254e6458e2efc8e0f9c74a80bc9d90396b5404))
+
 # [72.6.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v72.5.2...v72.6.0) (2024-01-11)
 
 

package/README.md

@@ -98,20 +98,8 @@ jest run them.
 
 ### Visual regression tests
 
-GitLab UI uses visual snapshot tests to prevent introducing unexpected regressions with CSS and
-layout changes on components. The tool we use is
-[storyshots](https://github.com/storybookjs/storybook/tree/master/addons/storyshots/storyshots-core),
-a storybook addon. Read the project documentation to understand how visual snapshots work.
-
-There is a visual snapshot of every component’s storybook story. To run the tests, use the
-`yarn test:visual` command. This command runs on the CI environment and will fail if the component
-visual appearance changes.
-
-#### Updating visual snapshot baseline images
-
-In some occasions, the changes in a component’s appearance are justified. In those cases, we have to
-update the baseline images to match the new look. See our
-[visual testing documentation](doc/contributing/visual_testing.md) for how to do that.
+GitLab UI uses visual snapshot tests to prevent introducing regressions with CSS and
+layout changes on components. Read more on this in the [visual testing documentation](doc/contributing/visual_testing.md).
 
 #### GitLab visual regression tests
 

package/dist/components/base/dropdown/dropdown.js

@@ -1,8 +1,9 @@
 import Vue from 'vue';
 import { BDropdown } from 'bootstrap-vue/esm/index.js';
-import { selectAll, isVisible } from 'bootstrap-vue/esm/utils/dom';
+import { selectAll } from 'bootstrap-vue/esm/utils/dom';
 import merge from 'lodash/merge';
 import { buttonCategoryOptions, dropdownVariantOptions, buttonSizeOptions } from '../../../utils/constants';
+import { filterVisible } from '../../../utils/utils';
 import { ButtonMixin } from '../../mixins/button_mixin';
 import GlButton from '../button/button';
 import GlIcon from '../icon/icon';
@@ -11,11 +12,6 @@ import GlDropdownDivider from './dropdown_divider';
 import __vue_normalize__ from 'vue-runtime-helpers/dist/normalize-component.js';
 
 //
-
-// Return an Array of visible items
-function filterVisible(els) {
-  return (els || []).filter(isVisible);
-}
 const Selector = {
   ITEM_SELECTOR: '.dropdown-item:not(.disabled):not([disabled]),.form-control:not(.disabled):not([disabled])'
 };

package/dist/components/base/filtered_search/filtered_search_term.js

@@ -102,6 +102,8 @@ var script = {
           title: this.searchTextOptionLabel
         });
       }
+
+      // eslint-disable-next-line unicorn/no-array-callback-reference
       return tokens.map(tokenToOption);
     },
     internalValue: {

package/dist/components/base/filtered_search/filtered_search_token.js

@@ -109,7 +109,9 @@ var script = {
       return hasData || this.isSegmentActive(SEGMENT_DATA);
     },
     availableTokensWithSelf() {
-      return [this.config, ...this.availableTokens.filter(token => token !== this.config)].map(tokenToOption);
+      return [this.config, ...this.availableTokens.filter(token => token !== this.config)].map(
+      // eslint-disable-next-line unicorn/no-array-callback-reference
+      tokenToOption);
     },
     operatorDescription() {
       const operator = this.operators.find(op => op.value === this.tokenValue.operator);

package/dist/components/base/filtered_search/filtered_search_token_segment.js

@@ -28,7 +28,9 @@ const isVue3Fragment = vnode => {
 const isVNodeEmpty = vnode => {
   if (isVue3Fragment(vnode)) {
     // vnode.children might be an array or single node in edge cases
-    return Array.isArray(vnode.children) ? vnode.children.every(isVNodeEmpty) : isVNodeEmpty(vnode.children);
+    return Array.isArray(vnode.children) ?
+    // eslint-disable-next-line unicorn/no-array-callback-reference
+    vnode.children.every(isVNodeEmpty) : isVNodeEmpty(vnode.children);
   }
   if (isVue3Comment(vnode)) {
     return true;
@@ -40,6 +42,7 @@ const isSlotNotEmpty = slot => {
     return false;
   }
   const vnodes = typeof slot === 'function' ? slot() : slot;
+  // eslint-disable-next-line unicorn/no-array-callback-reference
   return !(Array.isArray(vnodes) ? vnodes.every(isVNodeEmpty) : isVNodeEmpty(vnodes));
 };
 var script = {

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

@@ -6,7 +6,11 @@ const itemValidator = item => {
   return (item === null || item === void 0 ? void 0 : (_item$text = item.text) === null || _item$text === void 0 ? void 0 : _item$text.length) > 0 && !Array.isArray(item === null || item === void 0 ? void 0 : item.items);
 };
 const isItem = item => Boolean(item) && itemValidator(item);
-const isGroup = group => Boolean(group) && Array.isArray(group.items) && Boolean(group.items.length) && group.items.every(isItem);
+const isGroup = group => Boolean(group) && Array.isArray(group.items) && Boolean(group.items.length) &&
+// eslint-disable-next-line unicorn/no-array-callback-reference
+group.items.every(isItem);
+
+// eslint-disable-next-line unicorn/no-array-callback-reference
 const itemsValidator = items => items.every(isItem) || items.every(isGroup);
 const isListItem = tag => ['gl-disclosure-dropdown-group', 'gl-disclosure-dropdown-item', 'li'].includes(tag);
 const isValidSlotTagVue2 = vNode => {

package/dist/components/base/new_dropdowns/listbox/utils.js

@@ -2,6 +2,8 @@ import isNumber from 'lodash/isNumber';
 import isString from 'lodash/isString';
 
 const isOption = item => Boolean(item) && (isString(item.value) || isNumber(item.value));
+
+// eslint-disable-next-line unicorn/no-array-callback-reference
 const isGroup = function () {
   let {
     options
@@ -10,6 +12,8 @@ const isGroup = function () {
 };
 const hasNoDuplicates = array => array.length === new Set(array).size;
 const flattenedOptions = items => items.flatMap(item => isOption(item) ? item : item.options);
+
+// eslint-disable-next-line unicorn/no-array-callback-reference
 const isAllOptionsOrAllGroups = items => items.every(isOption) || items.every(isGroup);
 const hasUniqueValues = items => hasNoDuplicates(flattenedOptions(items).map(_ref => {
   let {
@@ -17,6 +21,8 @@ const hasUniqueValues = items => hasNoDuplicates(flattenedOptions(items).map(_re
   } = _ref;
   return value;
 }));
+
+// eslint-disable-next-line unicorn/no-array-callback-reference
 const hasUniqueGroups = items => hasNoDuplicates(items.filter(isGroup).map(_ref2 => {
   let {
     text

package/dist/components/base/sorting/sorting.js

@@ -34,6 +34,7 @@ var script = {
       type: Array,
       required: false,
       default: null,
+      // eslint-disable-next-line unicorn/no-array-callback-reference
       validator: sortOptions => sortOptions.every(isOption)
     },
     /**

package/dist/components/charts/column/column.js

@@ -191,7 +191,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:"position-relative",class:( _obj = {}, _obj[_vm.$options.HEIGHT_AUTO_CLASSES] = _vm.autoHeight, _obj )},[_c('chart',_vm._g(_vm._b({class:{ 'gl-flex-grow-1': _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":true}}):_vm._e()],1)};
+var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"position-relative",class:( _obj = {}, _obj[_vm.$options.HEIGHT_AUTO_CLASSES] = _vm.autoHeight, _obj )},[_c('chart',_vm._g(_vm._b({class:{ 'gl-flex-grow-1': _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',{ref:"dataTooltip",attrs:{"chart":_vm.chart,"use-default-tooltip-formatter":true},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()],1)};
 var __vue_staticRenderFns__ = [];
 
   /* style */

package/dist/components/experimental/duo/chat/components/duo_chat_conversation/duo_chat_conversation.js

@@ -5,6 +5,8 @@ const i18n = {
   CONVERSATION_NEW_CHAT: 'New chat'
 };
 const isMessage = item => Boolean(item) && (item === null || item === void 0 ? void 0 : item.role);
+
+// eslint-disable-next-line unicorn/no-array-callback-reference
 const itemsValidator = items => items.every(isMessage);
 var script = {
   name: 'GlDuoChatConversation',

package/dist/components/experimental/duo/chat/duo_chat.js

@@ -48,6 +48,8 @@ const slashCommands = [{
   description: 'Explain the selected snippet.'
 }];
 const isMessage = item => Boolean(item) && (item === null || item === void 0 ? void 0 : item.role);
+
+// eslint-disable-next-line unicorn/no-array-callback-reference
 const itemsValidator = items => items.every(isMessage);
 var script = {
   name: 'GlDuoChat',

package/dist/components/regions/empty_state/empty_state.js

@@ -119,7 +119,7 @@ const __vue_script__ = script;
 var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('section',{staticClass:"gl-display-flex",class:{
     'gl-empty-state gl-text-center gl-flex-direction-column': !_vm.compact,
     'gl-flex-direction-row': _vm.compact,
-  }},[_c('div',{class:{ 'gl-display-none gl-sm-display-block gl-px-4': _vm.compact, 'gl-max-w-full': !_vm.compact }},[(_vm.svgPath)?_c('img',{staticClass:"gl-max-w-full",class:{ 'gl-dark-invert-keep-hue': _vm.invertInDarkMode },attrs:{"src":_vm.svgPath,"alt":"","role":"img","height":_vm.height}}):_vm._e()]),_vm._v(" "),_c('div',{staticClass:"gl-empty-state-content gl-mx-auto gl-my-0",class:_vm.contentClasses,attrs:{"data-testid":"gl-empty-state-content"}},[_vm._t("title",function(){return [_c('h1',{staticClass:"gl-font-size-h-display gl-line-height-36 gl-mt-0 gl-mb-0",class:_vm.compact ? 'h5' : 'h4'},[_vm._v("\n        "+_vm._s(_vm.title)+"\n      ")])]}),_vm._v(" "),(_vm.description || _vm.$scopedSlots.description)?_c('p',{ref:"description",staticClass:"gl-mt-4 gl-mb-0"},[_vm._t("description",function(){return [_vm._v("\n        "+_vm._s(_vm.description)+"\n      ")]})],2):_vm._e(),_vm._v(" "),_c('div',{staticClass:"gl-display-flex gl-flex-wrap gl-mt-5",class:{ 'gl-justify-content-center': !_vm.compact }},[_vm._t("actions",function(){return [(_vm.shouldRenderPrimaryButton)?_c('gl-button',{staticClass:"gl-mb-3",class:_vm.compact ? 'gl-mr-3' : 'gl-mx-2',attrs:{"variant":"confirm","href":_vm.primaryButtonLink}},[_vm._v(_vm._s(_vm.primaryButtonText))]):_vm._e(),_vm._v(" "),(_vm.shouldRenderSecondaryButton)?_c('gl-button',{staticClass:"gl-mb-3 gl-mr-3",class:{ 'gl-mx-2!': !_vm.compact },attrs:{"href":_vm.secondaryButtonLink}},[_vm._v(_vm._s(_vm.secondaryButtonText)+"\n        ")]):_vm._e()]})],2)],2)])};
+  }},[_c('div',{class:{ 'gl-display-none gl-sm-display-block gl-px-4': _vm.compact, 'gl-max-w-full': !_vm.compact }},[(_vm.svgPath)?_c('img',{staticClass:"gl-max-w-full",class:{ 'gl-dark-invert-keep-hue': _vm.invertInDarkMode },attrs:{"src":_vm.svgPath,"alt":"","height":_vm.height}}):_vm._e()]),_vm._v(" "),_c('div',{staticClass:"gl-empty-state-content gl-mx-auto gl-my-0",class:_vm.contentClasses,attrs:{"data-testid":"gl-empty-state-content"}},[_vm._t("title",function(){return [_c('h1',{staticClass:"gl-font-size-h-display gl-line-height-36 gl-mt-0 gl-mb-0",class:_vm.compact ? 'h5' : 'h4'},[_vm._v("\n        "+_vm._s(_vm.title)+"\n      ")])]}),_vm._v(" "),(_vm.description || _vm.$scopedSlots.description)?_c('p',{ref:"description",staticClass:"gl-mt-4 gl-mb-0"},[_vm._t("description",function(){return [_vm._v("\n        "+_vm._s(_vm.description)+"\n      ")]})],2):_vm._e(),_vm._v(" "),_c('div',{staticClass:"gl-display-flex gl-flex-wrap gl-mt-5",class:{ 'gl-justify-content-center': !_vm.compact }},[_vm._t("actions",function(){return [(_vm.shouldRenderPrimaryButton)?_c('gl-button',{staticClass:"gl-mb-3",class:_vm.compact ? 'gl-mr-3' : 'gl-mx-2',attrs:{"variant":"confirm","href":_vm.primaryButtonLink}},[_vm._v(_vm._s(_vm.primaryButtonText))]):_vm._e(),_vm._v(" "),(_vm.shouldRenderSecondaryButton)?_c('gl-button',{staticClass:"gl-mb-3 gl-mr-3",class:{ 'gl-mx-2!': !_vm.compact },attrs:{"href":_vm.secondaryButtonLink}},[_vm._v(_vm._s(_vm.secondaryButtonText)+"\n        ")]):_vm._e()]})],2)],2)])};
 var __vue_staticRenderFns__ = [];
 
   /* style */

package/dist/components/utilities/sprintf/sprintf.js

@@ -63,7 +63,9 @@ var script = {
       type: Object,
       required: false,
       default: undefined,
-      validator: value => Object.values(value).every(tagPair => Array.isArray(tagPair) && tagPair.length === 2 && tagPair.every(isString))
+      validator: value => Object.values(value).every(
+      // eslint-disable-next-line unicorn/no-array-callback-reference
+      tagPair => Array.isArray(tagPair) && tagPair.length === 2 && tagPair.every(isString))
     }
   },
   /**

package/dist/tokens/css/tokens.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 11 Jan 2024 13:05:25 GMT
+ * Generated on Mon, 15 Jan 2024 23:51:36 GMT
  */
 
 :root {

package/dist/tokens/css/tokens.dark.css

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 11 Jan 2024 13:05:25 GMT
+ * Generated on Mon, 15 Jan 2024 23:51:36 GMT
  */
 
 :root.gl-dark {

package/dist/tokens/js/tokens.dark.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 11 Jan 2024 13:05:25 GMT
+ * Generated on Mon, 15 Jan 2024 23:51:36 GMT
  */
 
 export const DATA_VIZ_GREEN_50 = "#133a03";

package/dist/tokens/js/tokens.js

@@ -1,6 +1,6 @@
 /**
  * Do not edit directly
- * Generated on Thu, 11 Jan 2024 13:05:25 GMT
+ * Generated on Mon, 15 Jan 2024 23:51:36 GMT
  */
 
 export const DATA_VIZ_GREEN_50 = "#ddfab7";

package/dist/tokens/scss/_tokens.dark.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Thu, 11 Jan 2024 13:05:25 GMT
+// Generated on Mon, 15 Jan 2024 23:51:36 GMT
 
 $red-950: #fff4f3;
 $red-900: #fcf1ef;

package/dist/tokens/scss/_tokens.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Thu, 11 Jan 2024 13:05:25 GMT
+// Generated on Mon, 15 Jan 2024 23:51:36 GMT
 
 $gl-line-height-52: 3.25rem;
 $gl-line-height-44: 2.75rem;