baseui 12.0.0 → 12.1.0

package/esm/data-table/header-cell.js

@@ -24,12 +24,15 @@ LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
 import { Checkbox } from '../checkbox';
+import { LocaleContext } from '../locale';
 import { useStyletron } from '../styles';
 import ChevronDown from '../icon/chevron-down';
 import ChevronUp from '../icon/chevron-up';
 import { SORT_DIRECTIONS } from './constants';
 import { isFocusVisible } from '../utils/focusVisible';
 var HeaderCell = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var locale = React.useContext(LocaleContext);
+
   var _useStyletron = useStyletron(),
       _useStyletron2 = _slicedToArray(_useStyletron, 2),
       css = _useStyletron2[0],
@@ -48,7 +51,7 @@ var HeaderCell = /*#__PURE__*/React.forwardRef(function (props, ref) {
     }
   };
 
-  var handleBlur = function handleBlur(event) {
+  var handleBlur = function handleBlur() {
     if (focusVisible !== false) {
       setFocusVisible(false);
     }
@@ -57,59 +60,64 @@ var HeaderCell = /*#__PURE__*/React.forwardRef(function (props, ref) {
   var backgroundColor = props.isHovered ? theme.colors.backgroundSecondary : theme.colors.backgroundPrimary;
   return /*#__PURE__*/React.createElement("div", {
     ref: ref,
-    role: "button",
-    tabIndex: 0,
     className: css(_objectSpread(_objectSpread({}, theme.typography.font350), {}, {
       alignItems: 'center',
       backgroundColor: backgroundColor,
-      boxSizing: 'border-box',
       color: theme.colors.contentPrimary,
-      cursor: props.sortable ? 'pointer' : null,
       display: props.isMeasured ? 'inline-flex' : 'flex',
       flexGrow: 1,
       height: '100%',
-      paddingLeft: theme.sizing.scale500,
-      paddingRight: theme.sizing.scale500,
-      flexWrap: 'nowrap',
-      whiteSpace: 'nowrap',
-      outline: focusVisible ? "3px solid ".concat(theme.colors.accent) : 'none',
-      outlineOffset: '-3px'
-    })),
-    onMouseEnter: props.onMouseEnter,
-    onMouseLeave: props.onMouseLeave,
-    onKeyUp: function onKeyUp(event) {
-      if (event.key === 'Enter') {
-        props.onSort(props.index);
-      }
-    },
-    onClick: function onClick(event) {
-      // Avoid column sort if select-all checkbox click.
-      if (checkboxRef.current && checkboxRef.current.contains(event.target)) {
-        return;
-      }
-
-      if (props.sortable) {
-        props.onSort(props.index);
-      }
-    },
-    onFocus: handleFocus,
-    onBlur: handleBlur
+      paddingLeft: theme.sizing.scale500
+    }))
   }, props.isSelectable && /*#__PURE__*/React.createElement("span", {
     className: css({
       paddingRight: theme.sizing.scale300
     }),
     ref: checkboxRef
   }, /*#__PURE__*/React.createElement(Checkbox, {
-    onChange: function onChange(e) {
+    onChange: function onChange() {
       if (props.isSelectedAll || props.isSelectedIndeterminate) {
         props.onSelectNone();
       } else {
         props.onSelectAll();
       }
     },
+    "aria-label": locale.datatable.selectAllRows,
     checked: props.isSelectedAll || props.isSelectedIndeterminate,
     isIndeterminate: props.isSelectedIndeterminate
-  })), props.title, /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/React.createElement("div", {
+    className: css({
+      alignItems: 'center',
+      backgroundColor: 'transparent',
+      border: 'none',
+      boxSizing: 'border-box',
+      cursor: props.sortable ? 'pointer' : null,
+      display: 'flex',
+      flexGrow: 1,
+      height: '100%',
+      outline: focusVisible ? "3px solid ".concat(theme.colors.accent) : 'none',
+      outlineOffset: '-3px',
+      // paddingLeft: theme.sizing.scale500,
+      paddingRight: theme.sizing.scale500,
+      whiteSpace: 'nowrap'
+    }),
+    onMouseEnter: props.onMouseEnter,
+    onMouseLeave: props.onMouseLeave,
+    onKeyUp: function onKeyUp(event) {
+      if (event.key === 'Enter') {
+        props.onSort(props.index);
+      }
+    },
+    onClick: function onClick() {
+      if (props.sortable) {
+        props.onSort(props.index);
+      }
+    },
+    onFocus: handleFocus,
+    onBlur: handleBlur,
+    role: "button",
+    tabIndex: 0
+  }, props.title, /*#__PURE__*/React.createElement("div", {
     className: css({
       position: 'relative',
       width: '100%',
@@ -128,7 +136,7 @@ var HeaderCell = /*#__PURE__*/React.forwardRef(function (props, ref) {
     color: props.sortDirection ? theme.colors.contentPrimary : theme.colors.contentSecondary
   }), (props.sortDirection === SORT_DIRECTIONS.ASC || !props.sortDirection) && /*#__PURE__*/React.createElement(ChevronUp, {
     color: props.sortDirection ? theme.colors.contentPrimary : theme.colors.contentSecondary
-  }))));
+  })))));
 });
 HeaderCell.displayName = 'HeaderCell';
 export default HeaderCell;

package/esm/data-table/locale.js

@@ -37,6 +37,8 @@ var locale = {
   booleanFilterTrue: 'true',
   booleanFilterFalse: 'false',
   booleanColumnTrueShort: 'T',
-  booleanColumnFalseShort: 'F'
+  booleanColumnFalseShort: 'F',
+  selectRow: 'Select row',
+  selectAllRows: 'Select all rows'
 };
 export default locale;

package/esm/data-table/measure-column-widths.js

@@ -40,7 +40,7 @@ function MeasureColumn(_ref) {
         onLayout(columnIndex, ref.current.getBoundingClientRect());
       }
     }
-  }, []);
+  }, [onLayout]);
   return /*#__PURE__*/React.createElement("div", {
     ref: ref,
     className: css({
@@ -57,7 +57,8 @@ function MeasureColumn(_ref) {
     onMouseEnter: function onMouseEnter() {},
     onMouseLeave: function onMouseLeave() {},
     onSelectAll: function onSelectAll() {},
-    onSelectNone: function onSelectNone() {},
+    onSelectNone: function onSelectNone() {} // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    ,
     onSort: function onSort(i) {},
     sortable: column.sortable,
     sortDirection: null,
@@ -121,7 +122,7 @@ export default function MeasureColumnWidths(_ref2) {
 
   var widthMap = React.useMemo(function () {
     return new Map();
-  }, []);
+  }, [rows]);
   var sampleSize = rows.length < MAX_SAMPLE_SIZE ? rows.length : MAX_SAMPLE_SIZE;
   var finishedMeasurementCount = (sampleSize + 1) * columns.length;
   var sampleIndexes = React.useMemo(function () {
@@ -140,7 +141,7 @@ export default function MeasureColumnWidths(_ref2) {
     widthMap.size === Math.floor(columns.length / 4)) {
       onWidthsChange(Array.from(widthMap.values()));
     }
-  }, [columns, finishedMeasurementCount, onWidthsChange]);
+  }, [columns, rows, finishedMeasurementCount, onWidthsChange]);
   var hiddenStyle = css({
     position: 'absolute',
     overflow: 'hidden',

package/esm/data-table/stateful-container.js

@@ -174,6 +174,7 @@ export var StatefulContainer = function StatefulContainer(props) {
     selectedRowIds: selectedRowIds,
     sortIndex: sortIndex,
     sortDirection: sortDirection,
-    textQuery: textQuery
+    textQuery: textQuery // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
   });
 };

package/esm/data-table/stateful-data-table.js

@@ -257,12 +257,12 @@ export function StatefulDataTable(props) {
         title: title
       });
     }))), Boolean(selectedRowIds.size) && props.batchActions && /*#__PURE__*/React.createElement("div", {
-      style: {
+      className: css({
         display: 'flex',
         alignItems: 'center',
-        paddingTop: theme.sizing.scale400,
-        paddingBottom: theme.sizing.scale400
-      }
+        paddingTop: theme.sizing.scale300,
+        paddingBottom: theme.sizing.scale300
+      })
     }, props.batchActions.map(function (action) {
       function onClick(event) {
         action.onClick({

package/esm/datepicker/calendar-header.js

@@ -62,6 +62,7 @@ import { DENSITY, ORIENTATION, WEEKDAYS } from './constants';
 import { getOverrides, mergeOverrides } from '../helpers/overrides';
 import { forkBlur, forkFocus, isFocusVisible } from '../utils/focusVisible';
 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 var navBtnStyle = function navBtnStyle(_ref) {
   var $theme = _ref.$theme;
   return {

package/esm/datepicker/calendar.js

@@ -315,6 +315,7 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "handleDateChange", function (data) {
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       var _this$props$onChange = _this.props.onChange,
           onChange = _this$props$onChange === void 0 ? function (params) {} : _this$props$onChange;
       var updatedDate = data.date; // Apply the currently selected time values (saved in state) to the updated date
@@ -354,6 +355,7 @@ var Calendar = /*#__PURE__*/function (_React$Component) {
     });
 
     _defineProperty(_assertThisInitialized(_this), "handleTimeChange", function (time, index) {
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       var _this$props$onChange2 = _this.props.onChange,
           onChange = _this$props$onChange2 === void 0 ? function (params) {} : _this$props$onChange2; // Save/update the time value in internal state
 

package/esm/datepicker/datepicker.js

@@ -56,7 +56,7 @@ LICENSE file in the root directory of this source tree.
 */
 import * as React from 'react';
 import { MaskedInput } from '../input';
-import { Popover, PLACEMENT } from '../popover';
+import { Popover, PLACEMENT, ACCESSIBILITY_TYPE } from '../popover';
 import Calendar from './calendar';
 import { getOverrides } from '../helpers/overrides';
 import getInterpolatedString from '../helpers/i18n-interpolation';
@@ -113,6 +113,7 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
 
       if (Array.isArray(date)) {
         if (onChange && date.every(Boolean)) {
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
           onChange({
             date: date
           });
@@ -599,6 +600,7 @@ var Datepicker = /*#__PURE__*/function (_React$Component) {
 
       return /*#__PURE__*/React.createElement(LocaleContext.Consumer, null, function (locale) {
         return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(PopoverComponent, _extends({
+          accessibilityType: ACCESSIBILITY_TYPE.none,
           focusLock: false,
           autoFocus: false,
           mountNode: _this4.props.mountNode,

package/esm/datepicker/day.js

@@ -284,7 +284,8 @@ var Day = /*#__PURE__*/function (_React$Component) {
           this.dayElm.focus();
         }
       }
-    }
+    } // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {

package/esm/datepicker/index.js

@@ -12,7 +12,7 @@ export { default as StatefulDatepicker, default as StatefulDatePicker } from './
 
 export { formatDate } from './utils'; // Constants
 
-export { ORIENTATION, STATE_CHANGE_TYPE } from './constants'; // Styled elements
+export { DENSITY, ORIENTATION, STATE_CHANGE_TYPE } from './constants'; // Styled elements
 
 export * from './styled-components'; // Dependency components and their types
 

package/esm/datepicker/stateful-calendar.js

@@ -49,9 +49,13 @@ var StatefulComponent = /*#__PURE__*/function (_React$Component) {
     key: "render",
     value: function render() {
       return /*#__PURE__*/React.createElement(StatefulContainer, this.props, function (extendedProps) {
-        return /*#__PURE__*/React.createElement(Calendar, _extends({}, extendedProps, {
-          onChange: extendedProps.onChange
-        }));
+        return (
+          /*#__PURE__*/
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
+          React.createElement(Calendar, _extends({}, extendedProps, {
+            onChange: extendedProps.onChange
+          }))
+        );
       });
     }
   }]);

package/esm/datepicker/stateful-container.js

@@ -65,6 +65,7 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
       if (onChange) {
         if (Array.isArray(date)) {
           if (date.every(Boolean)) {
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
             onChange({
               date: date
             });
@@ -103,6 +104,7 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "render",
     value: function render() {
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       var _this$props = this.props,
           children = _this$props.children,
           initialState = _this$props.initialState,

package/esm/datepicker/stateful-datepicker.js

@@ -47,11 +47,16 @@ var StatefulComponent = /*#__PURE__*/function (_React$Component) {
 
   _createClass(StatefulComponent, [{
     key: "render",
-    value: function render() {
+    value: // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    function render() {
       return /*#__PURE__*/React.createElement(StatefulContainer, this.props, function (extendedProps) {
-        return /*#__PURE__*/React.createElement(Datepicker, _extends({}, extendedProps, {
-          onChange: extendedProps.onChange
-        }));
+        return (
+          /*#__PURE__*/
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
+          React.createElement(Datepicker, _extends({}, extendedProps, {
+            onChange: extendedProps.onChange
+          }))
+        );
       });
     }
   }]);

package/esm/datepicker/styled-components.js

@@ -39,6 +39,7 @@ export var StyledInputWrapper = styled('div', function (props) {
   } : {});
 });
 StyledInputWrapper.displayName = "StyledInputWrapper";
+StyledInputWrapper.displayName = 'StyledInputWrapper';
 export var StyledInputLabel = styled('div', function (_ref) {
   var $theme = _ref.$theme;
   return _objectSpread(_objectSpread({}, $theme.typography.LabelMedium), {}, {
@@ -46,6 +47,7 @@ export var StyledInputLabel = styled('div', function (_ref) {
   });
 });
 StyledInputLabel.displayName = "StyledInputLabel";
+StyledInputLabel.displayName = 'StyledInputLabel';
 export var StyledStartDate = styled('div', function (_ref2) {
   var $theme = _ref2.$theme;
   return {
@@ -54,17 +56,20 @@ export var StyledStartDate = styled('div', function (_ref2) {
   };
 });
 StyledStartDate.displayName = "StyledStartDate";
+StyledStartDate.displayName = 'StyledStartDate'; // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
 export var StyledEndDate = styled('div', function (_ref3) {
   var $theme = _ref3.$theme;
   return {
     width: '100%'
   };
 });
+StyledEndDate.displayName = "StyledEndDate";
+StyledEndDate.displayName = 'StyledEndDate';
 /**
  * Main component container element
  */
 
-StyledEndDate.displayName = "StyledEndDate";
 export var StyledRoot = styled('div', function (props) {
   var _props$$theme = props.$theme,
       typography = _props$$theme.typography,
@@ -82,6 +87,7 @@ export var StyledRoot = styled('div', function (props) {
   });
 });
 StyledRoot.displayName = "StyledRoot";
+StyledRoot.displayName = 'StyledRoot';
 export var StyledMonthContainer = styled('div', function (props) {
   var $orientation = props.$orientation;
   return {
@@ -90,6 +96,7 @@ export var StyledMonthContainer = styled('div', function (props) {
   };
 });
 StyledMonthContainer.displayName = "StyledMonthContainer";
+StyledMonthContainer.displayName = 'StyledMonthContainer';
 export var StyledCalendarContainer = styled('div', function (props) {
   var sizing = props.$theme.sizing,
       $density = props.$density;
@@ -101,6 +108,7 @@ export var StyledCalendarContainer = styled('div', function (props) {
   };
 });
 StyledCalendarContainer.displayName = "StyledCalendarContainer";
+StyledCalendarContainer.displayName = 'StyledCalendarContainer';
 export var StyledSelectorContainer = styled('div', function (_ref4) {
   var $theme = _ref4.$theme;
   var textAlign = $theme.direction === 'rtl' ? 'right' : 'left';
@@ -112,6 +120,7 @@ export var StyledSelectorContainer = styled('div', function (_ref4) {
   };
 });
 StyledSelectorContainer.displayName = "StyledSelectorContainer";
+StyledSelectorContainer.displayName = 'StyledSelectorContainer';
 export var StyledCalendarHeader = styled('div', function (props) {
   var _props$$theme2 = props.$theme,
       typography = _props$$theme2.typography,
@@ -138,6 +147,7 @@ export var StyledCalendarHeader = styled('div', function (props) {
   });
 });
 StyledCalendarHeader.displayName = "StyledCalendarHeader";
+StyledCalendarHeader.displayName = 'StyledCalendarHeader';
 export var StyledMonthHeader = styled('div', function (props) {
   return {
     color: props.$theme.colors.calendarHeaderForeground,
@@ -146,6 +156,7 @@ export var StyledMonthHeader = styled('div', function (props) {
   };
 });
 StyledMonthHeader.displayName = "StyledMonthHeader";
+StyledMonthHeader.displayName = 'StyledMonthHeader';
 export var StyledMonthYearSelectButton = styled('button', function (props) {
   var _props$$theme3 = props.$theme,
       typography = _props$$theme3.typography,
@@ -169,6 +180,7 @@ export var StyledMonthYearSelectButton = styled('button', function (props) {
   });
 });
 StyledMonthYearSelectButton.displayName = "StyledMonthYearSelectButton";
+StyledMonthYearSelectButton.displayName = 'StyledMonthYearSelectButton';
 export var StyledMonthYearSelectIconContainer = styled('span', function (props) {
   var marginDirection = props.$theme.direction === 'rtl' ? 'marginRight' : 'marginLeft';
   return _defineProperty({
@@ -177,6 +189,7 @@ export var StyledMonthYearSelectIconContainer = styled('span', function (props)
   }, marginDirection, props.$theme.sizing.scale500);
 });
 StyledMonthYearSelectIconContainer.displayName = "StyledMonthYearSelectIconContainer";
+StyledMonthYearSelectIconContainer.displayName = 'StyledMonthYearSelectIconContainer';
 
 function getArrowBtnStyle(_ref6) {
   var $theme = _ref6.$theme,
@@ -207,14 +220,18 @@ function getArrowBtnStyle(_ref6) {
 
 export var StyledPrevButton = styled('button', getArrowBtnStyle);
 StyledPrevButton.displayName = "StyledPrevButton";
+StyledPrevButton.displayName = 'StyledPrevButton';
 export var StyledNextButton = styled('button', getArrowBtnStyle);
 StyledNextButton.displayName = "StyledNextButton";
+StyledNextButton.displayName = 'StyledNextButton'; // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
 export var StyledMonth = styled('div', function (props) {
   return {
     display: 'inline-block'
   };
 });
 StyledMonth.displayName = "StyledMonth";
+StyledMonth.displayName = 'StyledMonth';
 export var StyledWeek = styled('div', function (props) {
   var sizing = props.$theme.sizing;
   return {
@@ -224,6 +241,7 @@ export var StyledWeek = styled('div', function (props) {
   };
 });
 StyledWeek.displayName = "StyledWeek";
+StyledWeek.displayName = 'StyledWeek';
 
 function generateDayStyles(defaultCode, defaultStyle) {
   var _ref7;
@@ -231,7 +249,8 @@ function generateDayStyles(defaultCode, defaultStyle) {
   var codeForSM = defaultCode.substr(0, 12) + '1' + defaultCode.substr(12 + 1);
   var codeForEM = defaultCode.substr(0, 13) + '1' + defaultCode.substr(13 + 1);
   return _ref7 = {}, _defineProperty(_ref7, defaultCode, defaultStyle), _defineProperty(_ref7, codeForSM, defaultStyle), _defineProperty(_ref7, codeForEM, defaultStyle), _ref7;
-}
+} // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
 
 function getDayStyles(code, _ref8) {
   var colors = _ref8.colors;
@@ -563,9 +582,11 @@ export var StyledDay = styled('div', function (props) {
       content: '""'
     } : {})
   } : // a hack to make flow happy, otherwise it complains about complexity
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   {});
 });
 StyledDay.displayName = "StyledDay";
+StyledDay.displayName = 'StyledDay';
 export var StyledDayLabel = styled('div', function (props) {
   var _props$$theme5 = props.$theme,
       typography = _props$$theme5.typography,
@@ -576,6 +597,7 @@ export var StyledDayLabel = styled('div', function (props) {
   });
 });
 StyledDayLabel.displayName = "StyledDayLabel";
+StyledDayLabel.displayName = 'StyledDayLabel';
 export var StyledWeekdayHeader = styled('div', function (props) {
   var _props$$theme6 = props.$theme,
       typography = _props$$theme6.typography,
@@ -604,4 +626,5 @@ export var StyledWeekdayHeader = styled('div', function (props) {
     backgroundColor: 'transparent'
   });
 });
-StyledWeekdayHeader.displayName = "StyledWeekdayHeader";
+StyledWeekdayHeader.displayName = "StyledWeekdayHeader";
+StyledWeekdayHeader.displayName = 'StyledWeekdayHeader';

package/esm/datepicker/utils/date-helpers.js

@@ -86,7 +86,8 @@ var DateHelpers = /*#__PURE__*/_createClass(function DateHelpers(_adapter) {
       };
     };
 
-    var updateOptions = updateOptionsBase || defaultGetOptions;
+    var updateOptions = updateOptionsBase || defaultGetOptions; // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
     var UtilsClass = adapter.constructor;
     var className = adapter.constructor.name; // This ensures that if the adapter class isn't
     // supported it just falls back the default formats

package/esm/datepicker/utils/index.js

@@ -78,7 +78,8 @@ export var subMonths = createDirtySetter(defaultDateHelpers.subMonths);
 export var subYears = createDirtySetter(defaultDateHelpers.subYears); // ** Date Comparison
 
 export var isBefore = createDirtyCompare(defaultDateHelpers.isBefore);
-export var isAfter = createDirtyCompare(defaultDateHelpers.isAfter);
+export var isAfter = createDirtyCompare(defaultDateHelpers.isAfter); // eslint-disable-next-line @typescript-eslint/no-explicit-any
+
 export var format = function format(date, _format, locale) {
   return defaultDateHelpers.format(date, _format, locale);
 };

package/esm/divider/styled-components.js

@@ -4,7 +4,7 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
-import { styled } from '../styles/index';
+import { styled } from '../styles';
 import { SIZE } from './constants';
 export var StyledDivider = styled('hr', function (props) {
   var $theme = props.$theme,
@@ -54,4 +54,5 @@ export var StyledDivider = styled('hr', function (props) {
     borderLeftStyle: 'none'
   };
 });
-StyledDivider.displayName = "StyledDivider";
+StyledDivider.displayName = "StyledDivider";
+StyledDivider.displayName = 'StyledDivider';

package/esm/dnd-list/stateful-list-container.js

@@ -97,6 +97,7 @@ var StatefulListContainer = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "render",
     value: function render() {
+      // eslint-disable-next-line @typescript-eslint/no-unused-vars
       var _this$props = this.props,
           children = _this$props.children,
           initialState = _this$props.initialState,

package/esm/dnd-list/styled-components.js

@@ -15,6 +15,7 @@ import { styled } from '../styles';
 /**
  * Main component container element
  */
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 export var Root = styled('div', function (_ref) {
   var $theme = _ref.$theme;
   return {
@@ -22,6 +23,7 @@ export var Root = styled('div', function (_ref) {
   };
 });
 Root.displayName = "Root";
+Root.displayName = 'Root';
 Root.displayName = 'StyledRoot';
 export var List = styled('ul', function (_ref2) {
   var $isDragged = _ref2.$isDragged;
@@ -32,6 +34,7 @@ export var List = styled('ul', function (_ref2) {
   };
 });
 List.displayName = "List";
+List.displayName = 'List';
 List.displayName = 'StyledList';
 export var Item = styled('li', function (_ref3) {
   var $isDragged = _ref3.$isDragged,
@@ -84,6 +87,7 @@ export var Item = styled('li', function (_ref3) {
   };
 });
 Item.displayName = "Item";
+Item.displayName = 'Item';
 List.displayName = 'StyledItem';
 export var DragHandle = styled('div', function (_ref4) {
   var _ref5;
@@ -93,6 +97,7 @@ export var DragHandle = styled('div', function (_ref4) {
   return _ref5 = {}, _defineProperty(_ref5, marginDir, $theme.sizing.scale600), _defineProperty(_ref5, "width", $theme.sizing.scale800), _defineProperty(_ref5, "color", '#CCC'), _defineProperty(_ref5, "display", 'flex'), _defineProperty(_ref5, "alignItems", 'center'), _ref5;
 });
 DragHandle.displayName = "DragHandle";
+DragHandle.displayName = 'DragHandle';
 DragHandle.displayName = 'StyledDragHandle';
 export var CloseHandle = styled('button', function (_ref6) {
   var _ref7;
@@ -117,6 +122,7 @@ export var CloseHandle = styled('button', function (_ref6) {
   }), _ref7;
 });
 CloseHandle.displayName = "CloseHandle";
+CloseHandle.displayName = 'CloseHandle';
 CloseHandle.displayName = 'StyledCloseHandle';
 export var Label = styled('div', function (_ref8) {
   var $theme = _ref8.$theme;
@@ -125,4 +131,5 @@ export var Label = styled('div', function (_ref8) {
   }, $theme.typography.font300);
 });
 Label.displayName = "Label";
+Label.displayName = 'Label';
 Label.displayName = 'StyledLabel';

package/esm/drawer/constants.js

@@ -4,6 +4,7 @@ Copyright (c) Uber Technologies, Inc.
 This source code is licensed under the MIT license found in the
 LICENSE file in the root directory of this source tree.
 */
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 export var SIZE = {
   default: 'default',
   full: 'full',

package/esm/drawer/drawer.js

@@ -44,8 +44,6 @@ LICENSE file in the root directory of this source tree.
 */
 
 /* global document */
-
-/* eslint-disable cup/no-undef */
 import * as React from 'react';
 import FocusLock from 'react-focus-lock';
 import { LocaleContext } from '../locale';
@@ -194,6 +192,7 @@ var Drawer = /*#__PURE__*/function (_React$Component) {
       if (mountNode) {
         return mountNode;
       } // Flow thinks body could be null (cast through any)
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
 
       return document.body;
@@ -206,7 +205,6 @@ var Drawer = /*#__PURE__*/function (_React$Component) {
       }
 
       if (this.animateStartTimer) {
-        // eslint-disable-next-line cup/no-undef
         cancelAnimationFrame(this.animateStartTimer);
       }
     }
@@ -225,8 +223,7 @@ var Drawer = /*#__PURE__*/function (_React$Component) {
 
 
       this.clearTimers();
-      this.disableMountNodeScroll(); // eslint-disable-next-line cup/no-undef
-
+      this.disableMountNodeScroll();
       this.animateStartTimer = requestAnimationFrame(function () {
         _this2.setState({
           isVisible: true