baseui 0.0.0-alpha-8ab2335 → 0.0.0-alpha-e79754d

package/card/styled-components.js

@@ -19,7 +19,6 @@ var Action = (0, _styles.styled)('div', function (_ref) {
 });
 exports.Action = Action;
 Action.displayName = "Action";
-Action.displayName = 'Action';
 var Body = (0, _styles.styled)('div', function (_ref2) {
   var $theme = _ref2.$theme;
   return _objectSpread({
@@ -29,7 +28,6 @@ var Body = (0, _styles.styled)('div', function (_ref2) {
 });
 exports.Body = Body;
 Body.displayName = "Body";
-Body.displayName = 'Body';
 var Contents = (0, _styles.styled)('div', function (_ref3) {
   var $theme = _ref3.$theme;
   return {
@@ -41,7 +39,6 @@ var Contents = (0, _styles.styled)('div', function (_ref3) {
 });
 exports.Contents = Contents;
 Contents.displayName = "Contents";
-Contents.displayName = 'Contents';
 var HeaderImage = (0, _styles.styled)('img', function (_ref4) {
   var $theme = _ref4.$theme;
   return {
@@ -50,12 +47,11 @@ var HeaderImage = (0, _styles.styled)('img', function (_ref4) {
     objectFit: 'contain',
     maxWidth: '100%'
   };
-});
-exports.HeaderImage = HeaderImage;
-HeaderImage.displayName = "HeaderImage";
-HeaderImage.displayName = 'HeaderImage'; // by using the section tag, we can keep the h1 for the title
+}); // by using the section tag, we can keep the h1 for the title
 // https://html.spec.whatwg.org/multipage/sections.html#headings-and-sections
 
+exports.HeaderImage = HeaderImage;
+HeaderImage.displayName = "HeaderImage";
 var Root = (0, _styles.styled)('section', function (_ref5) {
   var $theme = _ref5.$theme;
   return {
@@ -81,7 +77,6 @@ var Root = (0, _styles.styled)('section', function (_ref5) {
 });
 exports.Root = Root;
 Root.displayName = "Root";
-Root.displayName = 'Root';
 var Thumbnail = (0, _styles.styled)('img', function (_ref6) {
   var $theme = _ref6.$theme;
   return _objectSpread(_objectSpread({
@@ -99,7 +94,6 @@ var Thumbnail = (0, _styles.styled)('img', function (_ref6) {
 });
 exports.Thumbnail = Thumbnail;
 Thumbnail.displayName = "Thumbnail";
-Thumbnail.displayName = 'Thumbnail';
 var Title = (0, _styles.styled)('h1', function (_ref7) {
   var $theme = _ref7.$theme;
   return _objectSpread(_objectSpread({}, $theme.typography.HeadingSmall), {}, {
@@ -115,5 +109,4 @@ var Title = (0, _styles.styled)('h1', function (_ref7) {
   });
 });
 exports.Title = Title;
-Title.displayName = "Title";
-Title.displayName = 'Title';
+Title.displayName = "Title";

package/checkbox/styled-components.js

@@ -142,7 +142,6 @@ var Root = (0, _styles.styled)('label', function (props) {
 });
 exports.Root = Root;
 Root.displayName = "Root";
-Root.displayName = 'Root';
 var Checkmark = (0, _styles.styled)('span', function (props) {
   var $checked = props.$checked,
       $disabled = props.$disabled,
@@ -155,7 +154,7 @@ var Checkmark = (0, _styles.styled)('span', function (props) {
   var tickColor = $disabled ? $theme.colors.tickMarkFillDisabled : $error ? $theme.colors.tickMarkFillError : $theme.colors.tickMarkFill;
   var indeterminate = encodeURIComponent("\n    <svg width=\"14\" height=\"4\" viewBox=\"0 0 14 4\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M14 0.5H0V3.5H14V0.5Z\" fill=\"".concat(tickColor, "\"/>\n    </svg>\n  "));
   var check = encodeURIComponent("\n    <svg width=\"17\" height=\"13\" viewBox=\"0 0 17 13\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n      <path d=\"M6.50002 12.6L0.400024 6.60002L2.60002 4.40002L6.50002 8.40002L13.9 0.900024L16.1 3.10002L6.50002 12.6Z\" fill=\"".concat(tickColor, "\"/>\n    </svg>\n  "));
-  var borderRadius = $theme.borders.checkboxBorderRadius;
+  var borderRadius = $theme.borders.inputBorderRadius;
   var borderColor = getBorderColor(props);
   return {
     flex: '0 0 auto',
@@ -199,7 +198,6 @@ var Checkmark = (0, _styles.styled)('span', function (props) {
 });
 exports.Checkmark = Checkmark;
 Checkmark.displayName = "Checkmark";
-Checkmark.displayName = 'Checkmark';
 var Label = (0, _styles.styled)('div', function (props) {
   var $theme = props.$theme;
   var typography = $theme.typography;
@@ -210,11 +208,10 @@ var Label = (0, _styles.styled)('div', function (props) {
   }, typography.LabelMedium), {}, {
     lineHeight: '24px'
   });
-});
+}); // tricky style for focus event cause display: none doesn't work
+
 exports.Label = Label;
 Label.displayName = "Label";
-Label.displayName = 'Label'; // tricky style for focus event cause display: none doesn't work
-
 var Input = (0, _styles.styled)('input', {
   opacity: 0,
   width: 0,
@@ -226,7 +223,6 @@ var Input = (0, _styles.styled)('input', {
 });
 exports.Input = Input;
 Input.displayName = "Input";
-Input.displayName = 'Input';
 var Toggle = (0, _styles.styled)('div', function (props) {
   var backgroundColor = props.$theme.colors.toggleFill;
 
@@ -254,7 +250,6 @@ var Toggle = (0, _styles.styled)('div', function (props) {
 });
 exports.Toggle = Toggle;
 Toggle.displayName = "Toggle";
-Toggle.displayName = 'Toggle';
 var ToggleTrack = (0, _styles.styled)('div', function (props) {
   var backgroundColor = props.$theme.colors.toggleTrackFill;
 
@@ -281,5 +276,4 @@ var ToggleTrack = (0, _styles.styled)('div', function (props) {
   };
 });
 exports.ToggleTrack = ToggleTrack;
-ToggleTrack.displayName = "ToggleTrack";
-ToggleTrack.displayName = 'ToggleTrack';
+ToggleTrack.displayName = "ToggleTrack";

package/checkbox/styled-components.js.flow

@@ -142,7 +142,7 @@ export const Checkmark = styled<SharedStylePropsT>('span', (props) => {
     </svg>
   `);
 
-  const borderRadius = $theme.borders.checkboxBorderRadius;
+  const borderRadius = $theme.borders.inputBorderRadius;
   const borderColor = getBorderColor(props);
 
   return ({

package/checkbox/types.d.ts

@@ -1,6 +1,7 @@
-import type * as React from 'react';
+import * as React from 'react';
 import type { Override } from '../helpers/overrides';
-import type { STYLE_TYPE } from './constants';
+import { STYLE_TYPE } from './constants';
+import type { ReactNode, ChangeEvent } from 'react';
 export declare type LabelPlacement = 'top' | 'right' | 'bottom' | 'left';
 export declare type StyleType = keyof typeof STYLE_TYPE;
 export declare type CheckboxOverrides = {
@@ -14,7 +15,7 @@ export declare type CheckboxOverrides = {
 };
 export declare type DefaultProps = {
     overrides?: any;
-    children?: React.ReactNode;
+    children?: ReactNode;
     checked: boolean;
     disabled: boolean;
     error: boolean;
@@ -23,13 +24,13 @@ export declare type DefaultProps = {
     isIndeterminate: boolean;
     inputRef: React.RefObject<HTMLInputElement>;
     checkmarkType: StyleType;
-    onChange: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onMouseEnter: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onMouseLeave: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onMouseDown: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onMouseUp: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onFocus: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onBlur: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onChange: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseEnter: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseLeave: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseDown: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseUp: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onFocus: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onBlur: (e: ChangeEvent<HTMLInputElement>) => unknown;
     containsInteractiveElement?: boolean;
 };
 export declare type CheckboxProps = {
@@ -41,7 +42,7 @@ export declare type CheckboxProps = {
     ariaLabel?: string;
     'aria-label'?: string;
     /** Component or String value for label of checkbox. */
-    children?: React.ReactNode;
+    children?: ReactNode;
     /** Indicates if this checkbox children contain an interactive element (prevents the label from moving focus from the child element to the radio button) */
     containsInteractiveElement?: boolean;
     overrides?: CheckboxOverrides;
@@ -72,19 +73,19 @@ export declare type CheckboxProps = {
     /** Text to display in native OS tooltip on long hover. */
     title?: string | null;
     /** Handler for change events on trigger element. */
-    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for mouseenter events on trigger element. */
-    onMouseEnter?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseEnter?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for mouseleave events on trigger element. */
-    onMouseLeave?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseLeave?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for mousedown events on trigger element. */
-    onMouseDown?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseDown?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for mouseup events on trigger element. */
-    onMouseUp?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseUp?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** handler for focus events on trigger element. */
-    onFocus?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onFocus?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** handler for blur events on trigger element. */
-    onBlur?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onBlur?: (e: ChangeEvent<HTMLInputElement>) => unknown;
 };
 export declare type CheckboxState = {
     isFocused: boolean;
@@ -96,50 +97,50 @@ export declare type CheckboxReducerState = {
     checked?: boolean;
     isIndeterminate?: boolean;
 };
-export declare type StateReducer = (stateType: string, nextState: CheckboxReducerState, currentState: CheckboxReducerState, event: React.ChangeEvent<HTMLInputElement>) => CheckboxReducerState;
+export declare type StateReducer = (stateType: string, nextState: CheckboxReducerState, currentState: CheckboxReducerState, event: ChangeEvent<HTMLInputElement>) => CheckboxReducerState;
 export declare type StatefulContainerChildProps = {
     overrides?: CheckboxOverrides;
     /** Handler for change events on trigger element. */
-    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for mouseenter events on trigger element. */
-    onMouseEnter?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseEnter?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for mouseleave events on trigger element. */
-    onMouseLeave?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseLeave?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for focus events on trigger element. */
-    onFocus?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onFocus?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for blur events on trigger element. */
-    onBlur?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onBlur?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Focus the checkbox on initial render. */
     autoFocus?: boolean;
 } & CheckboxReducerState;
 export declare type DefaultStatefulProps = {
     initialState: CheckboxReducerState;
-    children?: (a: StatefulContainerChildProps) => React.ReactNode;
+    children?: (a: StatefulContainerChildProps) => ReactNode;
     stateReducer: StateReducer;
-    onChange: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onMouseEnter: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onMouseLeave: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onFocus: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
-    onBlur: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onChange: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseEnter: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseLeave: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onFocus: (e: ChangeEvent<HTMLInputElement>) => unknown;
+    onBlur: (e: ChangeEvent<HTMLInputElement>) => unknown;
 };
 export declare type StatefulContainerProps = {
     overrides?: CheckboxOverrides;
     /** Component or String value for label of checkbox. */
-    children?: (a: StatefulContainerChildProps) => React.ReactNode;
+    children?: (a: StatefulContainerChildProps) => ReactNode;
     /** Defines the components initial state value */
     initialState?: CheckboxReducerState;
     /** A state change handler. Used to override default state transitions. */
     stateReducer: StateReducer;
     /** Handler for change events on trigger element. */
-    onChange?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onChange?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for mouseenter events on trigger element. */
-    onMouseEnter?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseEnter?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for mouseleave events on trigger element. */
-    onMouseLeave?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onMouseLeave?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for focus events on trigger element. */
-    onFocus?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onFocus?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Handler for blur events on trigger element. */
-    onBlur?: (e: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onBlur?: (e: ChangeEvent<HTMLInputElement>) => unknown;
     /** Focus the checkbox on initial render. */
     autoFocus?: boolean;
 };

package/combobox/combobox.js

@@ -215,7 +215,6 @@ function Combobox(props) {
     if (listboxRef.current && event.relatedTarget && // NOTE(chase): Contains method expects a Node type, but relatedTarget is
     // EventTarget which is a super type of Node. Passing an EventTarget seems
     // to work fine, assuming the flow type is too strict.
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     listboxRef.current.contains(event.relatedTarget)) {
       return;
     }
@@ -308,84 +307,78 @@ function Combobox(props) {
       popoverOverrides = _getOverrides12$$over === void 0 ? {} : _getOverrides12$$over,
       restPopoverProps = _objectWithoutProperties(_getOverrides12$, _excluded2);
 
-  return (
-    /*#__PURE__*/
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    React.createElement(Root, _extends({
-      ref: rootRef
-    }, rootProps), /*#__PURE__*/React.createElement(OverriddenPopover // React-focus-lock used in Popover used to skip non-tabbable elements (`tabIndex=-1`) elements for focus, we had ListBox with tabIndex to disable focus on
-    // the ListBox, but we can just disable autoFocus (as ListBox / ListItem should not be focusable) (and input is also not autoFocused).
-    // Select Component does the same thing
+  return /*#__PURE__*/React.createElement(Root, _extends({
+    ref: rootRef
+  }, rootProps), /*#__PURE__*/React.createElement(OverriddenPopover // React-focus-lock used in Popover used to skip non-tabbable elements (`tabIndex=-1`) elements for focus, we had ListBox with tabIndex to disable focus on
+  // the ListBox, but we can just disable autoFocus (as ListBox / ListItem should not be focusable) (and input is also not autoFocused).
+  // Select Component does the same thing
+  , _extends({
+    autoFocus: false,
+    isOpen: isOpen,
+    overrides: popoverOverrides,
+    placement: _popover.PLACEMENT.bottomLeft,
+    onClick: handleInputClick,
+    content: /*#__PURE__*/React.createElement(ListBox // TabIndex attribute exists to exclude option clicks from triggering onBlur event actions.
     , _extends({
-      autoFocus: false,
-      isOpen: isOpen,
-      overrides: popoverOverrides,
-      placement: _popover.PLACEMENT.bottomLeft,
-      onClick: handleInputClick,
-      content: /*#__PURE__*/React.createElement(ListBox // TabIndex attribute exists to exclude option clicks from triggering onBlur event actions.
-      , _extends({
-        tabIndex: "-1",
-        id: listboxId // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        ,
-        ref: listboxRef,
-        role: "listbox",
-        "aria-label": listBoxLabel,
-        $width: listboxWidth
-      }, listBoxProps), options.map(function (option, index) {
-        var isSelected = selectionIndex === index;
-        var ReplacementNode = mapOptionToNode;
-        return (
-          /*#__PURE__*/
-          // List items are not focusable, therefore will never trigger a key event from it.
-          // Secondly, key events are handled from the input element.
-          // eslint-disable-next-line jsx-a11y/click-events-have-key-events
-          React.createElement(ListItem, _extends({
-            "aria-selected": isSelected,
-            id: isSelected ? activeDescendantId : null,
-            key: index,
-            onClick: function onClick() {
-              return handleOptionClick(index);
-            } // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            ,
-            ref: isSelected ? selectedOptionRef : null,
-            role: "option",
-            $isSelected: isSelected,
-            $size: size
-          }, listItemProps), ReplacementNode ? /*#__PURE__*/React.createElement(ReplacementNode, {
-            isSelected: isSelected,
-            option: option
-          }) : mapOptionToString(option))
-        );
-      }))
-    }, restPopoverProps), /*#__PURE__*/React.createElement(InputContainer, _extends({
-      "aria-expanded": isOpen,
-      "aria-haspopup": "listbox",
-      "aria-owns": listboxId // a11y linter implements the older 1.0 spec, suppressing to use updated 1.1
-      // https://github.com/A11yance/aria-query/issues/43
-      // https://github.com/evcohen/eslint-plugin-jsx-a11y/issues/442
-      // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
-      ,
-      role: "combobox"
-    }, inputContainerProps), /*#__PURE__*/React.createElement(OverriddenInput, _extends({
-      inputRef: handleInputRef,
-      "aria-activedescendant": isOpen && selectionIndex >= 0 ? activeDescendantId : undefined,
-      "aria-autocomplete": "list",
-      disabled: disabled,
-      error: error,
-      name: name,
-      id: id,
-      onBlur: handleBlur,
-      onChange: handleInputChange,
-      onFocus: handleFocus,
-      onKeyDown: handleKeyDown,
-      overrides: inputOverrides,
-      positive: positive,
-      size: size,
-      value: tempValue ? tempValue : value
-    }, isOpen ? {
-      'aria-controls': listboxId
-    } : {}, restInputProps)))))
-  );
+      tabIndex: "-1",
+      id: listboxId,
+      ref: listboxRef,
+      role: "listbox",
+      "aria-label": listBoxLabel,
+      $width: listboxWidth
+    }, listBoxProps), options.map(function (option, index) {
+      var isSelected = selectionIndex === index;
+      var ReplacementNode = mapOptionToNode;
+      return (
+        /*#__PURE__*/
+        // List items are not focusable, therefore will never trigger a key event from it.
+        // Secondly, key events are handled from the input element.
+        // eslint-disable-next-line jsx-a11y/click-events-have-key-events
+        React.createElement(ListItem, _extends({
+          "aria-selected": isSelected,
+          id: isSelected ? activeDescendantId : null,
+          key: index,
+          onClick: function onClick() {
+            return handleOptionClick(index);
+          },
+          ref: isSelected ? selectedOptionRef : null,
+          role: "option",
+          $isSelected: isSelected,
+          $size: size
+        }, listItemProps), ReplacementNode ? /*#__PURE__*/React.createElement(ReplacementNode, {
+          isSelected: isSelected,
+          option: option
+        }) : mapOptionToString(option))
+      );
+    }))
+  }, restPopoverProps), /*#__PURE__*/React.createElement(InputContainer, _extends({
+    "aria-expanded": isOpen,
+    "aria-haspopup": "listbox",
+    "aria-owns": listboxId // a11y linter implements the older 1.0 spec, suppressing to use updated 1.1
+    // https://github.com/A11yance/aria-query/issues/43
+    // https://github.com/evcohen/eslint-plugin-jsx-a11y/issues/442
+    // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
+    ,
+    role: "combobox"
+  }, inputContainerProps), /*#__PURE__*/React.createElement(OverriddenInput, _extends({
+    inputRef: handleInputRef,
+    "aria-activedescendant": isOpen && selectionIndex >= 0 ? activeDescendantId : undefined,
+    "aria-autocomplete": "list",
+    disabled: disabled,
+    error: error,
+    name: name,
+    id: id,
+    onBlur: handleBlur,
+    onChange: handleInputChange,
+    onFocus: handleFocus,
+    onKeyDown: handleKeyDown,
+    overrides: inputOverrides,
+    positive: positive,
+    size: size,
+    value: tempValue ? tempValue : value
+  }, isOpen ? {
+    'aria-controls': listboxId
+  } : {}, restInputProps)))));
 }
 
 var _default = Combobox;

package/combobox/styled-components.js

@@ -18,11 +18,9 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
 var StyledRoot = (0, _styles.styled)('div', {});
 exports.StyledRoot = StyledRoot;
 StyledRoot.displayName = "StyledRoot";
-StyledRoot.displayName = 'StyledRoot';
 var StyledInputContainer = (0, _styles.styled)('div', {});
 exports.StyledInputContainer = StyledInputContainer;
 StyledInputContainer.displayName = "StyledInputContainer";
-StyledInputContainer.displayName = 'StyledInputContainer';
 var StyledListBox = (0, _styles.styled)('ul', function (_ref) {
   var $theme = _ref.$theme,
       $width = _ref.$width;
@@ -39,7 +37,6 @@ var StyledListBox = (0, _styles.styled)('ul', function (_ref) {
 });
 exports.StyledListBox = StyledListBox;
 StyledListBox.displayName = "StyledListBox";
-StyledListBox.displayName = 'StyledListBox';
 
 function buildStylesForSize(size, theme) {
   var paddingDir = theme.direction === 'rtl' ? 'paddingRight' : 'paddingLeft';
@@ -84,5 +81,4 @@ var StyledListItem = (0, _styles.styled)('li', function (_ref2) {
   });
 });
 exports.StyledListItem = StyledListItem;
-StyledListItem.displayName = "StyledListItem";
-StyledListItem.displayName = 'StyledListItem';
+StyledListItem.displayName = "StyledListItem";

package/combobox/types.d.ts

@@ -1,6 +1,7 @@
-import type * as React from 'react';
+import * as React from 'react';
 import type { Override } from '../helpers/overrides';
-import type { SIZE } from '../input';
+import { SIZE } from '../input';
+import type { ChangeEvent } from 'react';
 export declare type ComboboxOverrides = {
     Root?: Override;
     InputContainer?: Override;
@@ -22,9 +23,9 @@ export declare type ComboboxProps<Option = unknown> = {
     id?: string;
     name?: string;
     inputRef?: React.Ref<HTMLElement>;
-    onBlur?: (a: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onBlur?: (a: ChangeEvent<HTMLInputElement>) => unknown;
     onChange: (b: string, a: Option | null) => unknown;
-    onFocus?: (a: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onFocus?: (a: ChangeEvent<HTMLInputElement>) => unknown;
     onSubmit?: (a: {
         closeListbox: () => void;
         value: string;

package/data-table/column-anchor.js

@@ -37,7 +37,6 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 function AnchorFilter(props) {
   return /*#__PURE__*/React.createElement("div", null, "not implemented for anchor column");
 }
@@ -63,9 +62,7 @@ function AnchorCell(props) {
 function AnchorColumn(options) {
   return (0, _column.default)({
     kind: _constants.COLUMNS.ANCHOR,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     buildFilter: function buildFilter(params) {
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       return function (data) {
         return true;
       };

package/data-table/column-datetime.js

@@ -264,8 +264,7 @@ function DatetimeFilter(props) {
   var _React$useState7 = React.useState([initialState.categoricalOperator]),
       _React$useState8 = _slicedToArray(_React$useState7, 2),
       categoricalOperator = _React$useState8[0],
-      setCategoricalOperator = _React$useState8[1]; // eslint-disable-next-line @typescript-eslint/no-explicit-any
-
+      setCategoricalOperator = _React$useState8[1];
 
   var _React$useState9 = React.useState(initialState.rangeDates.length ? initialState.rangeDates : [new Date(datesSorted[0]), new Date(datesSorted[datesSorted.length - 1])]),
       _React$useState10 = _slicedToArray(_React$useState9, 2),
@@ -306,7 +305,6 @@ function DatetimeFilter(props) {
     },
     onApply: function onApply() {
       if (isRange) {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var op = rangeOperator[0].id;
         var description = '';
 
@@ -338,7 +336,6 @@ function DatetimeFilter(props) {
       }
 
       if (isCategorical) {
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         var _op = categoricalOperator[0].id;
         var selection = [];
         var operatorLocaleLabelKey = '';
@@ -431,8 +428,7 @@ function DatetimeFilter(props) {
     value: rangeOperator,
     onChange: function onChange(params) {
       return setRangeOperator(params.value);
-    } // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    ,
+    },
     mountNode: mountNode.current,
     options: RANGE_OPERATIONS.map(function (op) {
       return {
@@ -446,8 +442,7 @@ function DatetimeFilter(props) {
     className: css({
       paddingTop: theme.sizing.scale600
     })
-  }, (rangeOperator[0].id === _constants.DATETIME_OPERATIONS.RANGE_DATETIME || rangeOperator[0].id === _constants.DATETIME_OPERATIONS.RANGE_DATE) && /*#__PURE__*/React.createElement(_datepicker.Datepicker // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  , {
+  }, (rangeOperator[0].id === _constants.DATETIME_OPERATIONS.RANGE_DATETIME || rangeOperator[0].id === _constants.DATETIME_OPERATIONS.RANGE_DATE) && /*#__PURE__*/React.createElement(_datepicker.Datepicker, {
     mountNode: mountNode.current,
     value: rangeDates,
     onChange: function onChange(_ref2) {
@@ -518,8 +513,7 @@ function DatetimeFilter(props) {
         label: locale.datatable[op.localeLabelKey],
         id: op.id
       };
-    }) // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    ,
+    }),
     mountNode: mountNode.current,
     size: "compact",
     clearable: false

package/data-table/column-numerical.js

@@ -103,7 +103,6 @@ function validateInput(input) {
 var bisect = (0, _d2.bisector)(function (d) {
   return d.x0;
 });
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 var Histogram = /*#__PURE__*/React.memo(function Histogram(_ref) {
   var data = _ref.data,
       lower = _ref.lower,
@@ -412,7 +411,6 @@ function NumericalFilter(props) {
             $thumbIndex = _ref4.$thumbIndex;
         return /*#__PURE__*/React.createElement(React.Fragment, null, $value[$thumbIndex]);
       },
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       TickBar: function TickBar(_ref5) {
         var $min = _ref5.$min,
             $max = _ref5.$max;
@@ -432,7 +430,9 @@ function NumericalFilter(props) {
         }
       },
       InnerTrack: {
-        style: function style() {
+        style: function style(_ref6) {
+          var $theme = _ref6.$theme;
+
           if (!isRange) {
             return {
               // For range selection we use the color as is, but when selecting the single value,
@@ -542,7 +542,7 @@ var defaultOptions = {
   sortable: true,
   filterable: true,
   format: _constants.NUMERICAL_FORMATS.DEFAULT,
-  highlight: function () {
+  highlight: function (n) {
     return false;
   },
   precision: 0

package/data-table/column-string.js

@@ -37,7 +37,6 @@ function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Sy
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
 function StringFilter(props) {
   return /*#__PURE__*/React.createElement("div", null, "not implemented for string column");
 }
@@ -64,9 +63,7 @@ function StringColumn(options) {
   return (0, _column.default)({
     kind: _constants.COLUMNS.STRING,
     cellBlockAlign: options.cellBlockAlign,
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     buildFilter: function buildFilter(params) {
-      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       return function (data) {
         return true;
       };

package/data-table/column.js

@@ -11,8 +11,6 @@ var React = _interopRequireWildcard(require("react"));
 
 var _checkbox = require("../checkbox");
 
-var _locale = require("../locale");
-
 var _styles = require("../styles");
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -52,10 +50,8 @@ function Column(options) {
     maxWidth: options.maxWidth,
     minWidth: options.minWidth,
     // todo(flow->ts) add proper type annotation
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any,react/display-name
+    // eslint-disable-next-line react/display-name
     renderCell: /*#__PURE__*/React.forwardRef(function (props, ref) {
-      var locale = React.useContext(_locale.LocaleContext);
-
       var _useStyletron = (0, _styles.useStyletron)(),
           _useStyletron2 = _slicedToArray(_useStyletron, 2),
           css = _useStyletron2[0],
@@ -94,7 +90,6 @@ function Column(options) {
           paddingRight: theme.sizing.scale300
         })
       }, /*#__PURE__*/React.createElement(_checkbox.Checkbox, {
-        "aria-label": locale.datatable.selectRow,
         onChange: props.onSelect,
         checked: props.isSelected,
         overrides: {