@splunk/react-ui 4.16.0 → 4.16.2

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 Change Log
 ============
+
+4.16.2 - January 26, 2023
+----------
+Bug Fixes:
+* Revert usage of pre-release `@splunk/react-icons` features.
+
+4.16.1 - January 25, 2023
+----------
+Bug Fixes:
+* `Select` and `Multiselect` now can be opened with the up and down arrow keys (SUI-3527).
+* Updated `ControlGroup` to fix `labelPosition="top"` misalignment in Prisma themes (SUI-5278).
+  * Note: this may cause slight layout changes for existing usages of `ControlGroup`.
+* `axe-html-reporter` no longer incorrectly listed as a dependency.
+
 4.16.0 - January 10, 2023
 ----------
 New Features:
@@ -911,7 +925,7 @@ Bug Fixes:
 * Changed primary and error `Button` font weight to semibold (SUI-1350).
 * Corrected hover color on `Button` (SUI-1364).
 
-1.1.0 - January 24, 2018
+1.1.0 - January 25, 2018
 ----------
 New Features:
 * DOM hook added to `RenderToLayer` to facilitate interactions with Backbone components (SUI-1327).

package/ControlGroup.js

@@ -156,18 +156,19 @@ var Box_default = /*#__PURE__*/__webpack_require__.n(Box_);
 var ScreenReaderContent_ = __webpack_require__(16);
 var ScreenReaderContent_default = /*#__PURE__*/__webpack_require__.n(ScreenReaderContent_);
 
-// EXTERNAL MODULE: external "@splunk/react-ui/Tooltip"
-var Tooltip_ = __webpack_require__(67);
-var Tooltip_default = /*#__PURE__*/__webpack_require__.n(Tooltip_);
-
 // EXTERNAL MODULE: external "styled-components"
 var external_styled_components_ = __webpack_require__(3);
 var external_styled_components_default = /*#__PURE__*/__webpack_require__.n(external_styled_components_);
 
+// EXTERNAL MODULE: external "@splunk/react-ui/Tooltip"
+var Tooltip_ = __webpack_require__(67);
+var Tooltip_default = /*#__PURE__*/__webpack_require__.n(Tooltip_);
+
 // CONCATENATED MODULE: ./src/ControlGroup/ControlGroupStyles.ts
 
 
 
+
 var StyledBox = external_styled_components_default()(Box_default.a).withConfig({
   displayName: "ControlGroupStyles__StyledBox",
   componentId: "wjnyif-0"
@@ -207,7 +208,7 @@ var StyledLabelWrapper = external_styled_components_default.a.div.withConfig({
 }), function (_ref2) {
   var $labelPosition = _ref2.$labelPosition;
   return $labelPosition === 'top' ? Object(external_styled_components_["css"])(["", ""], Object(themes_["pick"])({
-    prisma: Object(external_styled_components_["css"])(["padding-bottom:", ";"], themes_["variables"].spacingXSmall)
+    prisma: Object(external_styled_components_["css"])(["height:24px;padding-bottom:", ";"], themes_["variables"].spacingXSmall)
   })) : Object(external_styled_components_["css"])(["", ""], Object(themes_["pick"])({
     prisma: Object(external_styled_components_["css"])(["min-height:", ";"], themes_["variables"].inputHeight)
   }));
@@ -228,21 +229,30 @@ var StyledLabel = external_styled_components_default.a.label.withConfig({
   enterprise: 'right',
   prisma: 'left'
 }));
+var StyledTooltip = external_styled_components_default()(Tooltip_default.a).withConfig({
+  displayName: "ControlGroupStyles__StyledTooltip",
+  componentId: "wjnyif-5"
+})(["", ""], function (_ref3) {
+  var $labelPosition = _ref3.$labelPosition;
+  return $labelPosition === 'top' && Object(external_styled_components_["css"])(["button{", "}"], Object(themes_["pick"])({
+    prisma: Object(external_styled_components_["css"])(["svg{width:20px;height:20px;}padding:4px;"])
+  }));
+});
 var StyledHelp = external_styled_components_default.a.div.withConfig({
   displayName: "ControlGroupStyles__StyledHelp",
-  componentId: "wjnyif-5"
+  componentId: "wjnyif-6"
 })(["", ";font-size:", ";color:", ";margin-top:", ";", ""], themes_["mixins"].reset('block'), themes_["variables"].fontSizeSmall, themes_["variables"].contentColorMuted, Object(themes_["pick"])({
   enterprise: '2px',
   prisma: '4px'
-}), function (_ref3) {
-  var $error = _ref3.$error;
+}), function (_ref4) {
+  var $error = _ref4.$error;
   return $error && Object(external_styled_components_["css"])(["color:inherit;"]);
 });
 var StyledErrorText = external_styled_components_default.a.div.withConfig({
   displayName: "ControlGroupStyles__StyledErrorText",
-  componentId: "wjnyif-6"
-})(["", ";font-size:", ";[aria-invalid] > &{color:inherit;}", ""], themes_["mixins"].reset('block'), themes_["variables"].fontSizeSmall, function (_ref4) {
-  var $help = _ref4.$help;
+  componentId: "wjnyif-7"
+})(["", ";font-size:", ";[aria-invalid] > &{color:inherit;}", ""], themes_["mixins"].reset('block'), themes_["variables"].fontSizeSmall, function (_ref5) {
+  var $help = _ref5.$help;
   return !$help && Object(external_styled_components_["css"])(["margin-top:", ";"], Object(themes_["pick"])({
     enterprise: '2px',
     prisma: '4px'
@@ -250,7 +260,7 @@ var StyledErrorText = external_styled_components_default.a.div.withConfig({
 });
 var StyledAsterisk = external_styled_components_default.a.span.withConfig({
   displayName: "ControlGroupStyles__StyledAsterisk",
-  componentId: "wjnyif-7"
+  componentId: "wjnyif-8"
 })(["color:inherit;margin-right:2px;"]);
 
 // CONCATENATED MODULE: ./src/ControlGroup/ControlGroupContext.tsx
@@ -320,7 +330,6 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 
 
-
  // props ControlGroup may access and/or override on children
 
 var propTypes = {
@@ -637,7 +646,8 @@ var ControlGroup_ControlGroup = /*#__PURE__*/function (_Component) {
         $tooltip: !!tooltip
       }, required && /*#__PURE__*/external_react_default.a.createElement(StyledAsterisk, {
         "aria-hidden": "true"
-      }, "*"), label, !isPrisma && !hideLabel && tooltip && /*#__PURE__*/external_react_default.a.createElement("span", null, "\xA0"), !hideLabel && tooltip && /*#__PURE__*/external_react_default.a.createElement(ScreenReaderContent_default.a, null, tooltip)), !hideLabel && tooltip && /*#__PURE__*/external_react_default.a.createElement(Tooltip_default.a, {
+      }, "*"), label, !isPrisma && !hideLabel && tooltip && /*#__PURE__*/external_react_default.a.createElement("span", null, "\xA0"), !hideLabel && tooltip && /*#__PURE__*/external_react_default.a.createElement(ScreenReaderContent_default.a, null, tooltip)), !hideLabel && tooltip && /*#__PURE__*/external_react_default.a.createElement(StyledTooltip, {
+        $labelPosition: labelPosition,
         closeWhen: "notOnClick",
         content: tooltip,
         defaultPlacement: tooltipDefaultPlacement,

package/Dropdown.js

@@ -208,6 +208,9 @@ var omit_default = /*#__PURE__*/__webpack_require__.n(omit_);
 // EXTERNAL MODULE: external "@splunk/ui-utils/id"
 var id_ = __webpack_require__(13);
 
+// EXTERNAL MODULE: external "@splunk/ui-utils/keyboard"
+var keyboard_ = __webpack_require__(9);
+
 // EXTERNAL MODULE: external "@splunk/react-ui/Popover"
 var Popover_ = __webpack_require__(23);
 var Popover_default = /*#__PURE__*/__webpack_require__.n(Popover_);
@@ -255,6 +258,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 
 
 
+
 /** @public */
 
 var possibleCloseReasons = ['clickAway', 'contentClick', 'escapeKey', 'offScreen', 'tabKey', 'toggleClick'];
@@ -270,6 +274,7 @@ var propTypes = {
   onRequestClose: external_prop_types_default.a.func,
   onRequestOpen: external_prop_types_default.a.func,
   open: external_prop_types_default.a.bool,
+  openWithArrowKeys: external_prop_types_default.a.bool,
   repositionMode: external_prop_types_default.a.oneOf(['none', 'flip', 'any']),
   retainFocus: external_prop_types_default.a.bool,
   takeFocus: external_prop_types_default.a.bool,
@@ -283,6 +288,7 @@ var defaultProps = {
   focusToggleReasons: ['contentClick', 'escapeKey', 'tabKey', 'toggleClick'],
   repositionMode: 'flip',
   retainFocus: false,
+  openWithArrowKeys: false,
   takeFocus: true
 };
 var legacyRefMode = Symbol('Dropdown legacy ref mode marker');
@@ -355,13 +361,40 @@ var Dropdown_Dropdown = /*#__PURE__*/function (_Component) {
       }
     });
 
+    _defineProperty(_assertThisInitialized(_this), "handleToggleKeyDownOpen", function (e) {
+      var _this$props$toggle$pr3, _this$props$toggle$pr4;
+
+      (_this$props$toggle$pr3 = (_this$props$toggle$pr4 = _this.props.toggle.props).onKeyDown) === null || _this$props$toggle$pr3 === void 0 ? void 0 : _this$props$toggle$pr3.call(_this$props$toggle$pr4, e);
+
+      if (!_this.props.openWithArrowKeys) {
+        return;
+      }
+
+      var eventKeyCode = Object(keyboard_["keycode"])(e.nativeEvent);
+
+      if (eventKeyCode === 'up' || eventKeyCode === 'down') {
+        var _this$props$onRequest2, _this$props2;
+
+        e.preventDefault();
+        (_this$props$onRequest2 = (_this$props2 = _this.props).onRequestOpen) === null || _this$props$onRequest2 === void 0 ? void 0 : _this$props$onRequest2.call(_this$props2, e, {
+          reason: 'toggleKeydown'
+        });
+
+        if (!_this.isControlled()) {
+          _this.setState({
+            open: true
+          });
+        }
+      }
+    });
+
     _defineProperty(_assertThisInitialized(_this), "handleRequestClose", function (info) {
       var event = info.event,
           reason = info.reason;
-      var _this$props2 = _this.props,
-          closeReasons = _this$props2.closeReasons,
-          focusToggleReasons = _this$props2.focusToggleReasons,
-          onRequestClose = _this$props2.onRequestClose;
+      var _this$props3 = _this.props,
+          closeReasons = _this$props3.closeReasons,
+          focusToggleReasons = _this$props3.focusToggleReasons,
+          onRequestClose = _this$props3.onRequestClose;
 
       if (event && reason === 'clickAway') {
         var el = event.target;
@@ -445,22 +478,23 @@ var Dropdown_Dropdown = /*#__PURE__*/function (_Component) {
       var _cloneElement;
 
       return /*#__PURE__*/Object(external_react_["cloneElement"])(this.props.toggle, (_cloneElement = {
-        onClick: this.handleToggleClick
+        onClick: this.handleToggleClick,
+        onKeyDown: this.handleToggleKeyDownOpen
       }, _defineProperty(_cloneElement, this.props.toggle.type[legacyRefMode] ? 'elementRef' : 'ref', this.handleToggleMount), _defineProperty(_cloneElement, 'aria-controls', this.isOpen() ? this.popoverId : undefined), _defineProperty(_cloneElement, 'aria-haspopup', true), _defineProperty(_cloneElement, 'aria-expanded', this.isOpen()), _defineProperty(_cloneElement, 'data-test', this.props.toggle.props['data-test'] || 'dropdown'), _defineProperty(_cloneElement, 'data-test-popover-id', this.popoverId), _defineProperty(_cloneElement, "id", this.props.inputId || this.props.toggle.props.id || this.toggleId), _cloneElement));
     }
   }, {
     key: "render",
     value: function render() {
-      var _this$props3 = this.props,
-          align = _this$props3.align,
-          canCoverAnchor = _this$props3.canCoverAnchor,
-          children = _this$props3.children,
-          closeReasons = _this$props3.closeReasons,
-          defaultPlacement = _this$props3.defaultPlacement,
-          elementRef = _this$props3.elementRef,
-          repositionMode = _this$props3.repositionMode,
-          retainFocus = _this$props3.retainFocus,
-          takeFocus = _this$props3.takeFocus;
+      var _this$props4 = this.props,
+          align = _this$props4.align,
+          canCoverAnchor = _this$props4.canCoverAnchor,
+          children = _this$props4.children,
+          closeReasons = _this$props4.closeReasons,
+          defaultPlacement = _this$props4.defaultPlacement,
+          elementRef = _this$props4.elementRef,
+          repositionMode = _this$props4.repositionMode,
+          retainFocus = _this$props4.retainFocus,
+          takeFocus = _this$props4.takeFocus;
       var anchor = this.state.anchor;
       var handleRequestClose = this.handleRequestClose,
           handleContentClick = this.handleContentClick;
@@ -524,6 +558,13 @@ module.exports = require("lodash/isFunction");
 
 /***/ }),
 
+/***/ 9:
+/***/ (function(module, exports) {
+
+module.exports = require("@splunk/ui-utils/keyboard");
+
+/***/ }),
+
 /***/ 91:
 /***/ (function(module, exports) {
 

package/Heading.js

@@ -140,54 +140,29 @@ var StyledH1 = external_styled_components_default.a.h1.withConfig({
   displayName: "HeadingStyles__StyledH1",
   componentId: "sc-15s3yx3-0"
 })(["", ";", " margin:1.414em 0 0.4em;text-rendering:optimizelegibility;", " ", ""], themes_["mixins"].reset('block'), Object(themes_["pickVariant"])('as', {
-  h1: {
-    enterprise: themes_["mixins"].typography('title1', {
-      lineHeight: 20,
-      size: 24,
-      weight: 500
-    }),
-    prisma: Object(external_styled_components_["css"])(["", " line-height:48px;"], themes_["mixins"].typography('title1'))
+  h1: function h1() {
+    return themes_["mixins"].typography('title1');
   },
-  h2: {
-    enterprise: themes_["mixins"].typography('title2', {
-      lineHeight: 20,
-      size: 18,
-      weight: 500
-    }),
-    prisma: themes_["mixins"].typography('title2', {
-      lineHeight: 24,
-      size: 24
-    })
+  h2: function h2() {
+    return themes_["mixins"].typography('title2');
   },
-  h3: {
-    enterprise: themes_["mixins"].typography('title3', {
-      lineHeight: 20,
-      size: 16,
-      weight: 500
-    }),
-    prisma: themes_["mixins"].typography('title3')
+  h3: function h3() {
+    return themes_["mixins"].typography('title3');
   },
   h4: {
     enterprise: {
       compact: function compact(_ref) {
         var $isSection = _ref.$isSection;
         return $isSection ? themes_["mixins"].typography('title4', {
-          lineHeight: 20,
-          size: 12,
           weight: 500
-        }) : themes_["mixins"].typography('title4', {
-          lineHeight: 20,
-          size: 12
-        });
+        }) : themes_["mixins"].typography('title4');
       },
       comfortable: function comfortable(_ref2) {
         var $isSection = _ref2.$isSection;
         return $isSection ? themes_["mixins"].typography('title4', {
-          lineHeight: 20,
           size: 14,
           weight: 500
         }) : themes_["mixins"].typography('title4', {
-          lineHeight: 20,
           size: 14
         });
       }
@@ -196,23 +171,12 @@ var StyledH1 = external_styled_components_default.a.h1.withConfig({
       var $isSection = _ref3.$isSection;
       return $isSection ? themes_["mixins"].typography('title4', {
         color: 'default',
-        lineHeight: 24,
         size: 14
-      }) : themes_["mixins"].typography('title4', {
-        lineHeight: 24,
-        size: 16
-      });
+      }) : themes_["mixins"].typography('title4');
     }
   },
-  h5: {
-    enterprise: themes_["mixins"].typography('title5', {
-      size: 12,
-      weight: 500
-    }),
-    prisma: Object(external_styled_components_["css"])(["", " font-size:13px;"], themes_["mixins"].typography('title5', {
-      color: 'default',
-      lineHeight: 16
-    }))
+  h5: function h5() {
+    return themes_["mixins"].typography('title5');
   }
 }), Object(themes_["pickVariant"])('$isSection', {
   "true": {

package/Multiselect.js

@@ -2193,6 +2193,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
         onRequestOpen: this.handleRequestOpen,
         onRequestClose: this.handleRequestClose,
         open: this.state.open,
+        openWithArrowKeys: true,
         repositionMode: repositionMode,
         defaultPlacement: filterEnabled ? defaultPlacement : undefined,
         canCoverAnchor: Object(ssrWindow["a" /* getWindow */])().innerHeight < 500,

package/Select.js

@@ -2352,6 +2352,7 @@ var SelectBase_SelectBase = /*#__PURE__*/function (_Component) {
         onRequestOpen: this.handleRequestOpen,
         onRequestClose: this.handleRequestClose,
         open: this.state.open,
+        openWithArrowKeys: true,
         repositionMode: repositionMode,
         defaultPlacement: filterEnabled ? defaultPlacement : undefined,
         canCoverAnchor: Object(ssrWindow["a" /* getWindow */])().innerHeight < 500,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@splunk/react-ui",
-  "version": "4.16.0",
+  "version": "4.16.2",
   "description": "Library of React components that implement the Splunk design language",
   "license": "Apache-2.0",
   "author": "Splunk Inc.",
@@ -38,8 +38,8 @@
     "styled-components": "5.1.1"
   },
   "dependencies": {
-    "@splunk/react-icons": "^3.3.1",
-    "@splunk/themes": "^0.14.0",
+    "@splunk/react-icons": "3.3.1",
+    "@splunk/themes": "^0.15.0",
     "@splunk/ui-utils": "^1.5.2",
     "@types/commonmark": "^0.27.0",
     "@types/lodash": "^4.14.156",
@@ -48,7 +48,6 @@
     "@types/react-resize-detector": "^3.1.1",
     "@types/styled-components": "^5.1.0",
     "@types/tinycolor2": "^1.4.2",
-    "axe-html-reporter": "^2.2.3",
     "commonmark": "^0.27.0",
     "commonmark-react-renderer": "^4.3.2",
     "decimal.js-light": "^2.2.3",
@@ -97,6 +96,7 @@
     "@types/webpack-env": "^1.15.2",
     "@typescript-eslint/eslint-plugin": "^4.8.2",
     "@typescript-eslint/parser": "^4.8.2",
+    "axe-html-reporter": "^2.2.3",
     "axe-playwright": "^1.1.11",
     "babel-loader": "^8.0.4",
     "babel-plugin-istanbul": "^5.1.0",

package/types/src/Dropdown/Dropdown.d.ts

@@ -21,8 +21,8 @@ declare type DropdownRequestCloseHandler = (data: {
     reason: DropdownPossibleCloseReason;
 }) => void;
 /** @public */
-declare type DropdownRequestOpenHandler = (event: React.MouseEvent<HTMLElement>, data: {
-    reason: 'toggleClick';
+declare type DropdownRequestOpenHandler = (event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, data: {
+    reason: 'toggleClick' | 'toggleKeydown';
 }) => void;
 /** @public */
 declare type DropdownToggleElement = React.ReactElement<React.HTMLAttributes<HTMLElement> & {
@@ -80,8 +80,7 @@ interface DropdownPropsBase {
      */
     onRequestClose?: DropdownRequestCloseHandler;
     /**
-     * A callback function invoked with a data object containing the event. The reason is
-     * always toggleClick.
+     * A callback function invoked with a data object containing the event.
      */
     onRequestOpen?: DropdownRequestOpenHandler;
     /**
@@ -91,6 +90,11 @@ interface DropdownPropsBase {
      * open prop is provided, the component handles the open/close state internally.
      */
     open?: boolean;
+    /**
+     * A private prop to support up and down arrow key navigation for `Select` and `Multiselect`.
+     * @private
+     */
+    openWithArrowKeys?: boolean;
     /**
      * See `repositionMode` on `Popover` for details.
      */
@@ -114,7 +118,7 @@ interface DropdownPropsBase {
      */
     toggle: DropdownToggleElement;
 }
-declare const defaultProps: Required<Pick<DropdownPropsBase, 'align' | 'canCoverAnchor' | 'closeReasons' | 'defaultPlacement' | 'focusToggleReasons' | 'repositionMode' | 'retainFocus' | 'takeFocus'>>;
+declare const defaultProps: Required<Pick<DropdownPropsBase, 'align' | 'canCoverAnchor' | 'closeReasons' | 'defaultPlacement' | 'focusToggleReasons' | 'repositionMode' | 'retainFocus' | 'openWithArrowKeys' | 'takeFocus'>>;
 interface DropdownPropsBaseControlled extends DropdownPropsBase {
     onRequestClose: DropdownRequestCloseHandler;
     onRequestOpen: DropdownRequestOpenHandler;
@@ -140,12 +144,13 @@ declare class Dropdown extends Component<DropdownProps, DropdownState> {
      * docs extraction.
      */
     static possibleCloseReasons: DropdownPossibleCloseReason[];
-    static propTypes: React.WeakValidationMap<DropdownPropsBaseControlled & Required<Pick<DropdownPropsBase, "align" | "retainFocus" | "takeFocus" | "closeReasons" | "canCoverAnchor" | "defaultPlacement" | "repositionMode" | "focusToggleReasons">>> | React.WeakValidationMap<DropdownPropsBaseUncontrolled & Required<Pick<DropdownPropsBase, "align" | "retainFocus" | "takeFocus" | "closeReasons" | "canCoverAnchor" | "defaultPlacement" | "repositionMode" | "focusToggleReasons">>>;
-    static defaultProps: Required<Pick<DropdownPropsBase, "align" | "retainFocus" | "takeFocus" | "closeReasons" | "canCoverAnchor" | "defaultPlacement" | "repositionMode" | "focusToggleReasons">>;
+    static propTypes: React.WeakValidationMap<DropdownPropsBaseControlled & Required<Pick<DropdownPropsBase, "align" | "retainFocus" | "takeFocus" | "closeReasons" | "canCoverAnchor" | "defaultPlacement" | "repositionMode" | "focusToggleReasons" | "openWithArrowKeys">>> | React.WeakValidationMap<DropdownPropsBaseUncontrolled & Required<Pick<DropdownPropsBase, "align" | "retainFocus" | "takeFocus" | "closeReasons" | "canCoverAnchor" | "defaultPlacement" | "repositionMode" | "focusToggleReasons" | "openWithArrowKeys">>>;
+    static defaultProps: Required<Pick<DropdownPropsBase, "align" | "retainFocus" | "takeFocus" | "closeReasons" | "canCoverAnchor" | "defaultPlacement" | "repositionMode" | "focusToggleReasons" | "openWithArrowKeys">>;
     constructor(props: Readonly<DropdownProps>);
     componentDidUpdate(): void;
     private handleToggleMount;
     private handleToggleClick;
+    private handleToggleKeyDownOpen;
     private handleRequestClose;
     private handleContentClick;
     private isOpen;

package/types/src/Multiselect/Multiselect.d.ts

@@ -4,7 +4,7 @@ import { CompactPropsBase } from './Compact';
 import Option from './Option';
 import { ClassComponentProps } from '../utils/types';
 /** @public */
-declare type MultiselectFilterChangeHandler = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | React.FocusEvent<HTMLInputElement> | React.MouseEvent<HTMLSpanElement>, data: {
+declare type MultiselectFilterChangeHandler = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | React.FocusEvent<HTMLInputElement> | React.MouseEvent<HTMLSpanElement> | React.KeyboardEvent, data: {
     keyword: string;
 }) => void;
 /** @public */

package/types/src/Select/Select.d.ts

@@ -8,7 +8,7 @@ declare type SelectChangeHandler = (event: React.MouseEvent<HTMLButtonElement> |
     value: string | number | boolean;
 }) => void;
 /** @public */
-declare type SelectFilterChangeHandler = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | React.MouseEvent<HTMLSpanElement>, data: {
+declare type SelectFilterChangeHandler = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | React.MouseEvent<HTMLSpanElement> | React.KeyboardEvent, data: {
     keyword: string;
 }) => void;
 /** @public */

package/types/src/Select/SelectBase.d.ts

@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import { Divider, Heading } from '@splunk/react-ui/Menu';
 import Option from './OptionBase';
 import { ClassComponentProps } from '../utils/types';
-declare type SelectBaseFilterChangeHandler = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | React.FocusEvent<HTMLInputElement> | React.MouseEvent<HTMLSpanElement>, data: {
+declare type SelectBaseFilterChangeHandler = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | React.FocusEvent<HTMLInputElement> | React.MouseEvent<HTMLSpanElement> | React.KeyboardEvent, data: {
     keyword: string;
 }) => void;
 declare type SelectBaseChangeHandler = (event: React.MouseEvent<HTMLButtonElement> | React.KeyboardEvent<HTMLInputElement>, data: {