baseui 12.0.0 → 12.1.2

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

package/esm/drawer/styled-components.js

@@ -96,7 +96,8 @@ function getAnchorStyles(props) {
         return {};
       }
   }
-}
+} // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
 
 export var StyledRoot = styled('div', function (props) {
   return {
@@ -109,6 +110,7 @@ export var StyledRoot = styled('div', function (props) {
   };
 });
 StyledRoot.displayName = "StyledRoot";
+StyledRoot.displayName = 'StyledRoot';
 export var StyledBackdrop = styled('div', function (props) {
   var $animating = props.$animating,
       $isOpen = props.$isOpen,
@@ -134,6 +136,7 @@ export var StyledBackdrop = styled('div', function (props) {
   } : null);
 });
 StyledBackdrop.displayName = "StyledBackdrop";
+StyledBackdrop.displayName = 'StyledBackdrop';
 export var StyledDrawerContainer = styled('div', function (props) {
   var $animating = props.$animating,
       $isOpen = props.$isOpen,
@@ -156,6 +159,7 @@ export var StyledDrawerContainer = styled('div', function (props) {
   });
 });
 StyledDrawerContainer.displayName = "StyledDrawerContainer";
+StyledDrawerContainer.displayName = 'StyledDrawerContainer';
 export var StyledDrawerBody = styled('div', function (props) {
   var $theme = props.$theme;
   return _objectSpread(_objectSpread({}, $theme.typography.font200), {}, {
@@ -169,6 +173,7 @@ export var StyledDrawerBody = styled('div', function (props) {
   });
 });
 StyledDrawerBody.displayName = "StyledDrawerBody";
+StyledDrawerBody.displayName = 'StyledDrawerBody';
 export var StyledClose = styled('button', function (props) {
   var _ref;
 
@@ -211,7 +216,9 @@ export var StyledClose = styled('button', function (props) {
   }, _defineProperty(_ref, dir, $theme.sizing.scale500), _defineProperty(_ref, "width", $theme.sizing.scale800), _defineProperty(_ref, "height", $theme.sizing.scale800), _defineProperty(_ref, "display", 'flex'), _defineProperty(_ref, "justifyContent", 'center'), _defineProperty(_ref, "alignItems", 'center'), _defineProperty(_ref, "cursor", 'pointer'), _ref;
 });
 StyledClose.displayName = "StyledClose";
+StyledClose.displayName = 'StyledClose';
 export var Hidden = styled('div', {
   display: 'none'
 });
-Hidden.displayName = "Hidden";
+Hidden.displayName = "Hidden";
+Hidden.displayName = 'Hidden';