added enter key functionality

CHANGELOG.md

@@ -1,5 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Added `Enter` key press functionality to `EuiSuperDatePicker` ([#3048](https://github.com/elastic/eui/pull/3048))
 - Added props descriptions for `EuiComboBox` ([#3007](https://github.com/elastic/eui/pull/3007))
 - Exported `dateFormatAliases` as a part of the public API ([#3043](https://github.com/elastic/eui/pull/3043))
 - Exported `EuiTextProps` type definition ([#3039](https://github.com/elastic/eui/pull/3039))

src/components/date_picker/super_date_picker/__snapshots__/super_date_picker.test.js.snap

@@ -4,6 +4,7 @@ exports[`EuiSuperDatePicker is rendered 1`] = `
 <EuiFlexGroup
   className="euiSuperDatePicker__flexWrapper"
   gutterSize="s"
+  onKeyPress={[Function]}
   responsive={false}
 >
   <EuiFlexItem>

src/components/date_picker/super_date_picker/quick_select_popover/quick_select.js

@@ -57,6 +57,10 @@ export class EuiQuickSelect extends Component {
     });
   };
 
+  handelKeyDown = ({ key }) => {
+    if (key === 'Enter') this.applyQuickSelect();
+  };
+
   applyQuickSelect = () => {
     const { timeTense, timeValue, timeUnits } = this.state;
 
@@ -122,7 +126,7 @@ export class EuiQuickSelect extends Component {
     const legendId = this.generateId();
 
     return (
-      <fieldset>
+      <div onKeyDown={this.handelKeyDown}>
         <EuiI18n
           token="euiQuickSelect.legendText"
           default="Quick select a time range">
@@ -257,7 +261,7 @@ export class EuiQuickSelect extends Component {
             />
           </p>
         </EuiScreenReaderOnly>
-      </fieldset>
+      </div>
     );
   }
 }

src/components/date_picker/super_date_picker/quick_select_popover/refresh_interval.js

@@ -90,6 +90,10 @@ export class EuiRefreshInterval extends Component {
     );
   };
 
+  handelKeyDown = ({ key }) => {
+    if (key === 'Enter') this.toogleRefresh();
+  };
+
   applyRefreshInterval = () => {
     if (this.state.value === '') {
       return;
@@ -123,7 +127,7 @@ export class EuiRefreshInterval extends Component {
     }
 
     return (
-      <fieldset>
+      <div onKeyDown={this.handelKeyDown}>
         <EuiTitle size="xxxs">
           <legend id={legendId}>
             <EuiI18n
@@ -186,7 +190,7 @@ export class EuiRefreshInterval extends Component {
             />
           </p>
         </EuiScreenReaderOnly>
-      </fieldset>
+      </div>
     );
   }
 }

src/components/date_picker/super_date_picker/super_date_picker.js

@@ -470,7 +470,6 @@ export class EuiSuperDatePicker extends Component {
             {this.renderDatePickerRange()}
           </EuiFormControlLayout>
         </EuiFlexItem>
-
         {this.renderUpdateButton()}
       </EuiFlexGroup>
     );