@gitlab/ui 131.0.0 → 131.1.0

package/dist/components/base/datepicker/datepicker.js

@@ -426,6 +426,12 @@ var script = {
         this.calendar.setDate(resetDate);
         this.selected(resetDate);
       }
+    },
+    handleKeydown(event) {
+      /**
+       * Emitted when native a `keydown` event fires on the input.
+       */
+      this.$emit('keydown', event);
     }
   }
 };
@@ -434,7 +440,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',{class:_vm.datepickerClasses},[(_vm.showDefaultField)?_c('div',{staticClass:"gl-flex gl-items-start gl-gap-3"},[_c('div',{staticClass:"gl-relative gl-flex gl-grow"},[_vm._t("default",function(){return [_c('gl-form-input',{class:_vm.renderClearButton ? '!gl-pr-9' : '!gl-pr-7',attrs:{"id":_vm.inputId,"name":_vm.inputName,"data-testid":"gl-datepicker-input","value":_vm.formattedDate,"placeholder":_vm.placeholder,"autocomplete":_vm.inputAutocomplete,"disabled":_vm.disabled,"aria-label":_vm.inputLabel,"state":_vm.state},on:{"keydown":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }return _vm.onKeydown.apply(null, arguments)}},model:{value:(_vm.textInput),callback:function ($$v) {_vm.textInput=$$v;},expression:"textInput"}})]},{"formattedDate":_vm.formattedDate}),_vm._v(" "),_c('div',{staticClass:"gl-datepicker-actions"},[(_vm.renderClearButton)?_c('gl-button',{staticClass:"gl-pointer-events-auto",attrs:{"data-testid":"clear-button","aria-label":"Clear date","category":"tertiary","size":"small","icon":"clear"},on:{"click":_vm.cleared}}):_vm._e(),_vm._v(" "),(_vm.triggerOnFocus || _vm.disabled)?_c('span',{staticClass:"gl-px-2"},[_c('gl-icon',{staticClass:"gl-block",attrs:{"data-testid":"datepicker-calendar-icon","name":"calendar","size":16,"variant":_vm.disabled ? 'disabled' : 'default'}})],1):_c('gl-button',{ref:"calendarTriggerBtn",staticClass:"gl-pointer-events-auto",attrs:{"aria-label":"Open datepicker","category":"tertiary","size":"small","icon":"calendar"}})],1)],2),_vm._v(" "),_vm._t("after")],2):_vm._t("default",null,{"formattedDate":_vm.formattedDate})],2)};
+var __vue_render__ = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{class:_vm.datepickerClasses},[(_vm.showDefaultField)?_c('div',{staticClass:"gl-flex gl-items-start gl-gap-3"},[_c('div',{staticClass:"gl-relative gl-flex gl-grow"},[_vm._t("default",function(){return [_c('gl-form-input',{class:_vm.renderClearButton ? '!gl-pr-9' : '!gl-pr-7',attrs:{"id":_vm.inputId,"name":_vm.inputName,"data-testid":"gl-datepicker-input","value":_vm.formattedDate,"placeholder":_vm.placeholder,"autocomplete":_vm.inputAutocomplete,"disabled":_vm.disabled,"aria-label":_vm.inputLabel,"state":_vm.state},on:{"keydown":[function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,"enter",13,$event.key,"Enter")){ return null; }return _vm.onKeydown.apply(null, arguments)},_vm.handleKeydown]},model:{value:(_vm.textInput),callback:function ($$v) {_vm.textInput=$$v;},expression:"textInput"}})]},{"formattedDate":_vm.formattedDate}),_vm._v(" "),_c('div',{staticClass:"gl-datepicker-actions"},[(_vm.renderClearButton)?_c('gl-button',{staticClass:"gl-pointer-events-auto",attrs:{"data-testid":"clear-button","aria-label":"Clear date","category":"tertiary","size":"small","icon":"clear"},on:{"click":_vm.cleared}}):_vm._e(),_vm._v(" "),(_vm.triggerOnFocus || _vm.disabled)?_c('span',{staticClass:"gl-px-2"},[_c('gl-icon',{staticClass:"gl-block",attrs:{"data-testid":"datepicker-calendar-icon","name":"calendar","size":16,"variant":_vm.disabled ? 'disabled' : 'default'}})],1):_c('gl-button',{ref:"calendarTriggerBtn",staticClass:"gl-pointer-events-auto",attrs:{"aria-label":"Open datepicker","category":"tertiary","size":"small","icon":"calendar"}})],1)],2),_vm._v(" "),_vm._t("after")],2):_vm._t("default",null,{"formattedDate":_vm.formattedDate})],2)};
 var __vue_staticRenderFns__ = [];
 
   /* style */

package/package.json

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

package/src/components/base/datepicker/datepicker.vue

@@ -443,6 +443,12 @@ export default {
         this.selected(resetDate);
       }
     },
+    handleKeydown(event) {
+      /**
+       * Emitted when native a `keydown` event fires on the input.
+       */
+      this.$emit('keydown', event);
+    },
   },
 };
 </script>
@@ -469,6 +475,7 @@ export default {
             :aria-label="inputLabel"
             :state="state"
             @keydown.enter="onKeydown"
+            @keydown="handleKeydown"
           />
         </slot>
         <div class="gl-datepicker-actions">