@gitlab/ui 42.20.0 → 42.22.1

package/CHANGELOG.md

@@ -1,3 +1,24 @@
+## [42.22.1](https://gitlab.com/gitlab-org/gitlab-ui/compare/v42.22.0...v42.22.1) (2022-07-19)
+
+
+### Bug Fixes
+
+* **GlTable:** adjust table caption padding ([f74c132](https://gitlab.com/gitlab-org/gitlab-ui/commit/f74c13229724070ec76534eb3f8ff37ef1f20d41))
+
+# [42.22.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v42.21.0...v42.22.0) (2022-07-15)
+
+
+### Features
+
+* **css:** add gl-flex-basis-third ([e457c39](https://gitlab.com/gitlab-org/gitlab-ui/commit/e457c39a51bb0b87035bbbff52785565e0f7478e))
+
+# [42.21.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v42.20.0...v42.21.0) (2022-07-14)
+
+
+### Features
+
+* **css:** Added background no repeat to select dropdown ([5a3fdf9](https://gitlab.com/gitlab-org/gitlab-ui/commit/5a3fdf90edf5329822afb04503e5c7bc7847c695))
+
 # [42.20.0](https://gitlab.com/gitlab-org/gitlab-ui/compare/v42.19.0...v42.20.0) (2022-07-13)
 
 

package/dist/components/base/alert/alert.js

@@ -98,6 +98,7 @@ var script = {
     },
 
     shouldRenderActions() {
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return Boolean(this.$slots.actions || this.actionButtons.length);
     },
 

package/dist/components/base/badge/badge.js

@@ -50,6 +50,7 @@ var script = {
   },
   computed: {
     hasIconOnly() {
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return Boolean(this.icon && Object.keys(this.$slots).length === 0);
     },
 

package/dist/components/base/button/button.js

@@ -70,6 +70,7 @@ var script = {
     },
 
     hasIconOnly() {
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return Object.keys(this.$slots).length === 0 && this.hasIcon;
     },
 
@@ -105,6 +106,7 @@ var script = {
   },
 
   mounted() {
+    // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
     if (!this.$slots.default && !this.$attrs['aria-label'] && !this.$props.label) {
       logWarning('[gl-button]: Accessible name missing. Please add inner text or aria-label.');
     }

package/dist/components/base/drawer/drawer.js

@@ -60,6 +60,7 @@ var script = {
     },
 
     shouldRenderFooter() {
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return Boolean(this.$slots.footer);
     },
 

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

@@ -193,6 +193,7 @@ var script = {
   },
   methods: {
     hasSlotContents(slotName) {
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return Boolean(this.$slots[slotName]);
     },
 

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

@@ -126,6 +126,7 @@ var script = {
     hasOptionsOrSuggestions() {
       var _this$options2;
 
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return ((_this$options2 = this.options) === null || _this$options2 === void 0 ? void 0 : _this$options2.length) || this.$slots.suggestions;
     },
 

package/dist/components/base/form/form_combobox/form_combobox.js

@@ -53,6 +53,15 @@ var script = {
       type: Boolean,
       required: false,
       default: false
+    },
+
+    /**
+     * Placeholder text for input field
+     */
+    placeholder: {
+      type: String,
+      required: false,
+      default: undefined
     }
   },
 
@@ -94,17 +103,8 @@ var script = {
   },
   watch: {
     tokenList(newList) {
-      const filteredTokens = newList.filter(token => {
-        if (this.matchValueToAttr) {
-          // For API driven tokens, we don't need extra filtering
-          return token;
-        }
-
-        return token.toLowerCase().includes(this.value.toLowerCase());
-      });
-
-      if (filteredTokens.length) {
-        this.openSuggestions(filteredTokens);
+      if (newList.length) {
+        this.openSuggestions(newList);
       } else {
         this.results = [];
         this.arrowCounter = -1;
@@ -134,42 +134,34 @@ var script = {
       }
     },
 
-    onArrowDown() {
-      var _this$$refs$results$n;
+    focusItem(index) {
+      var _this$$refs$suggestio;
 
-      const newCount = this.arrowCounter + 1;
+      (_this$$refs$suggestio = this.$refs.suggestionsMenu.querySelectorAll('.gl-new-dropdown-item')[index]) === null || _this$$refs$suggestio === void 0 ? void 0 : _this$$refs$suggestio.querySelector('button').focus();
+    },
+
+    onArrowDown(e) {
+      e.preventDefault();
+      let newCount = this.arrowCounter + 1;
 
       if (newCount >= this.allItems.length) {
-        this.arrowCounter = 0;
-        return;
+        newCount = 0;
       }
 
       this.arrowCounter = newCount;
-      (_this$$refs$results$n = this.$refs.results[newCount]) === null || _this$$refs$results$n === void 0 ? void 0 : _this$$refs$results$n.$el.scrollIntoView(false);
+      this.focusItem(newCount);
     },
 
-    onArrowUp() {
-      var _this$$refs$results$n2;
-
-      const newCount = this.arrowCounter - 1;
+    onArrowUp(e) {
+      e.preventDefault();
+      let newCount = this.arrowCounter - 1;
 
       if (newCount < 0) {
-        this.arrowCounter = this.allItems.length - 1;
-        return;
+        newCount = this.allItems.length - 1;
       }
 
       this.arrowCounter = newCount;
-      (_this$$refs$results$n2 = this.$refs.results[newCount]) === null || _this$$refs$results$n2 === void 0 ? void 0 : _this$$refs$results$n2.$el.scrollIntoView(true);
-    },
-
-    onEnter() {
-      const focusedItem = this.allItems[this.arrowCounter] || this.value;
-
-      if (focusedItem.fn) {
-        this.selectAction(focusedItem);
-      } else {
-        this.selectToken(focusedItem);
-      }
+      this.focusItem(newCount);
     },
 
     onEsc() {
@@ -224,6 +216,10 @@ var script = {
       value.fn();
       this.$emit('input', this.value);
       this.closeSuggestions();
+    },
+
+    resetCounter() {
+      this.arrowCounter = -1;
     }
 
   }
@@ -233,7 +229,7 @@ var script = {
 const __vue_script__ = script;
 
 /* template */
-var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-form-combobox dropdown",attrs:{"role":"combobox","aria-owns":_vm.suggestionsId,"aria-expanded":_vm.ariaExpanded}},[_c('gl-form-group',{attrs:{"label":_vm.labelText,"label-for":_vm.inputId,"label-sr-only":_vm.labelSrOnly}},[_c('gl-form-input',{attrs:{"id":_vm.inputId,"value":_vm.displayedValue,"type":"text","role":"searchbox","autocomplete":_vm.showAutocomplete,"aria-autocomplete":"list","aria-controls":_vm.suggestionsId,"aria-haspopup":"listbox","autofocus":_vm.autofocus},on:{"input":_vm.onEntry,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }return _vm.onArrowDown($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }return _vm.onArrowUp($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }$event.preventDefault();return _vm.onEnter($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"esc",27,$event.key,["Esc","Escape"])){ return null; }$event.stopPropagation();return _vm.onEsc($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"tab",9,$event.key,"Tab")){ return null; }return _vm.closeSuggestions($event)}]}})],1),_vm._v(" "),_c('ul',{directives:[{name:"show",rawName:"v-show",value:(_vm.showSuggestions && !_vm.userDismissedResults),expression:"showSuggestions && !userDismissedResults"}],staticClass:"dropdown-menu dropdown-full-width show-dropdown gl-list-style-none gl-pl-0 gl-mb-0 gl-display-flex gl-flex-direction-column",attrs:{"id":_vm.suggestionsId,"data-testid":"combobox-dropdown"}},[_c('li',{staticClass:"gl-overflow-y-auto show-dropdown"},[_c('ul',{staticClass:"gl-list-style-none gl-pl-0 gl-mb-0"},_vm._l((_vm.results),function(result,i){return _c('gl-dropdown-item',{key:i,ref:"results",refInFor:true,class:{ 'gl-bg-gray-50': i === _vm.arrowCounter },attrs:{"role":"option","aria-selected":i === _vm.arrowCounter,"tabindex":"-1"},on:{"click":function($event){return _vm.selectToken(result)}}},[_vm._t("result",[_vm._v(_vm._s(result))],{"item":result})],2)}),1)]),_vm._v(" "),(_vm.resultsLength > 0 && _vm.actionList.length > 0)?_c('gl-dropdown-divider'):_vm._e(),_vm._v(" "),_c('li',[_c('ul',{staticClass:"gl-list-style-none gl-pl-0 gl-mb-0"},_vm._l((_vm.actionList),function(action,i){return _c('gl-dropdown-item',{key:i + _vm.resultsLength,class:{ 'gl-bg-gray-50': i + _vm.resultsLength === _vm.arrowCounter },attrs:{"role":"option","aria-selected":i + _vm.resultsLength === _vm.arrowCounter,"tabindex":"-1","data-testid":"combobox-action"},on:{"click":function($event){return _vm.selectAction(action)}}},[_vm._t("action",[_vm._v(_vm._s(action.label))],{"item":action})],2)}),1)])],1)],1)};
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticClass:"gl-form-combobox dropdown",attrs:{"role":"combobox","aria-owns":_vm.suggestionsId,"aria-expanded":_vm.ariaExpanded}},[_c('gl-form-group',{attrs:{"label":_vm.labelText,"label-for":_vm.inputId,"label-sr-only":_vm.labelSrOnly}},[_c('gl-form-input',{attrs:{"id":_vm.inputId,"value":_vm.displayedValue,"type":"text","role":"searchbox","autocomplete":_vm.showAutocomplete,"aria-autocomplete":"list","aria-controls":_vm.suggestionsId,"aria-haspopup":"listbox","autofocus":_vm.autofocus,"placeholder":_vm.placeholder},on:{"input":_vm.onEntry,"focus":_vm.resetCounter,"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }return _vm.onArrowDown($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }return _vm.onArrowUp($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"esc",27,$event.key,["Esc","Escape"])){ return null; }$event.stopPropagation();return _vm.onEsc($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"tab",9,$event.key,"Tab")){ return null; }return _vm.closeSuggestions($event)}]}})],1),_vm._v(" "),_c('ul',{directives:[{name:"show",rawName:"v-show",value:(_vm.showSuggestions && !_vm.userDismissedResults),expression:"showSuggestions && !userDismissedResults"}],ref:"suggestionsMenu",staticClass:"dropdown-menu gl-w-full gl-form-combobox-inner gl-list-style-none gl-pl-0 gl-mb-0 gl-display-flex gl-flex-direction-column",attrs:{"id":_vm.suggestionsId,"data-testid":"combobox-dropdown"},on:{"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"down",40,$event.key,["Down","ArrowDown"])){ return null; }return _vm.onArrowDown($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"up",38,$event.key,["Up","ArrowUp"])){ return null; }return _vm.onArrowUp($event)},function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"esc",27,$event.key,["Esc","Escape"])){ return null; }$event.stopPropagation();return _vm.onEsc($event)}]}},[_c('li',{staticClass:"gl-overflow-y-auto show-dropdown"},[_c('ul',{staticClass:"gl-list-style-none gl-pl-0 gl-mb-0"},_vm._l((_vm.results),function(result,i){return _c('gl-dropdown-item',{key:i,ref:"results",refInFor:true,attrs:{"role":"option","aria-selected":i === _vm.arrowCounter,"tabindex":"-1"},on:{"click":function($event){return _vm.selectToken(result)}},nativeOn:{"keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }return _vm.selectToken(result)}}},[_vm._t("result",[_vm._v(_vm._s(result))],{"item":result})],2)}),1)]),_vm._v(" "),(_vm.resultsLength > 0 && _vm.actionList.length > 0)?_c('gl-dropdown-divider'):_vm._e(),_vm._v(" "),_c('li',[_c('ul',{staticClass:"gl-list-style-none gl-pl-0 gl-mb-0"},_vm._l((_vm.actionList),function(action,i){return _c('gl-dropdown-item',{key:i + _vm.resultsLength,attrs:{"role":"option","aria-selected":i + _vm.resultsLength === _vm.arrowCounter,"tabindex":"-1","data-testid":"combobox-action"},on:{"click":function($event){return _vm.selectAction(action)}},nativeOn:{"keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }return _vm.selectAction(action)}}},[_vm._t("action",[_vm._v(_vm._s(action.label))],{"item":action})],2)}),1)])],1)],1)};
 var __vue_staticRenderFns__ = [];
 
   /* style */

package/dist/components/base/form/form_group/form_group.js

@@ -58,6 +58,7 @@ var script = {
     },
 
     hasLabelDescription() {
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return Boolean(this.labelDescription || this.$slots['label-description']);
     }
 

package/dist/components/base/modal/modal.js

@@ -84,15 +84,18 @@ var script = {
   },
   computed: {
     shouldRenderModalOk() {
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return Boolean(this.$slots['modal-ok']);
     },
 
     shouldRenderModalCancel() {
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return Boolean(this.$slots['modal-cancel']);
     },
 
     shouldRenderModalFooter() {
-      return Boolean(this.actionCancel || this.actionSecondary || this.actionPrimary || this.$slots['modal-footer']);
+      return Boolean(this.actionCancel || this.actionSecondary || this.actionPrimary || // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
+      this.$slots['modal-footer']);
     }
 
   },

package/dist/components/base/toggle/toggle.js

@@ -89,6 +89,7 @@ var script = {
 
   computed: {
     shouldRenderHelp() {
+      // eslint-disable-next-line @gitlab/vue-prefer-dollar-scopedslots
       return Boolean(this.$slots.help || this.help);
     },