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

package/modal/modal.js.flow

@@ -6,7 +6,7 @@ LICENSE file in the root directory of this source tree.
 */
 // @flow
 /* global document */
-
+/* eslint-disable cup/no-undef */
 import * as React from 'react';
 import FocusLock from 'react-focus-lock';
 
@@ -148,6 +148,7 @@ class Modal extends React.Component<ModalPropsT, ModalStateT> {
       clearTimeout(this.animateOutTimer);
     }
     if (this.animateStartTimer) {
+      // eslint-disable-next-line cup/no-undef
       cancelAnimationFrame(this.animateStartTimer);
     }
   }
@@ -165,6 +166,7 @@ class Modal extends React.Component<ModalPropsT, ModalStateT> {
 
     this.disableMountNodeScroll();
 
+    // eslint-disable-next-line cup/no-undef
     this.animateStartTimer = requestAnimationFrame(() => {
       this.setState({ isVisible: true });
     });

package/modal/styled-components.js

@@ -50,7 +50,6 @@ var Root = (0, _styles.styled)('div', function (props) {
 });
 exports.Root = Root;
 Root.displayName = "Root";
-Root.displayName = 'Root';
 var DialogContainer = (0, _styles.styled)('div', function (props) {
   var $animate = props.$animate,
       $isOpen = props.$isOpen,
@@ -77,7 +76,6 @@ var DialogContainer = (0, _styles.styled)('div', function (props) {
 });
 exports.DialogContainer = DialogContainer;
 DialogContainer.displayName = "DialogContainer";
-DialogContainer.displayName = 'DialogContainer';
 var Dialog = (0, _styles.styled)('div', function (props) {
   var $animate = props.$animate,
       $isOpen = props.$isOpen,
@@ -115,7 +113,6 @@ var Dialog = (0, _styles.styled)('div', function (props) {
 });
 exports.Dialog = Dialog;
 Dialog.displayName = "Dialog";
-Dialog.displayName = 'Dialog';
 var Close = (0, _styles.styled)('button', function (props) {
   var _ref;
 
@@ -159,7 +156,6 @@ var Close = (0, _styles.styled)('button', function (props) {
 });
 exports.Close = Close;
 Close.displayName = "Close";
-Close.displayName = 'Close';
 var ModalHeader = (0, _styles.styled)('div', function (_ref2) {
   var _objectSpread2;
 
@@ -174,7 +170,6 @@ var ModalHeader = (0, _styles.styled)('div', function (_ref2) {
 });
 exports.ModalHeader = ModalHeader;
 ModalHeader.displayName = "ModalHeader";
-ModalHeader.displayName = 'ModalHeader';
 var ModalBody = (0, _styles.styled)('div', function (_ref3) {
   var $theme = _ref3.$theme;
   return _objectSpread(_objectSpread({}, $theme.typography.font200), {}, {
@@ -187,7 +182,6 @@ var ModalBody = (0, _styles.styled)('div', function (_ref3) {
 });
 exports.ModalBody = ModalBody;
 ModalBody.displayName = "ModalBody";
-ModalBody.displayName = 'ModalBody';
 var ModalFooter = (0, _styles.styled)('div', function (_ref4) {
   var $theme = _ref4.$theme;
   return _objectSpread(_objectSpread({}, $theme.typography.font200), {}, {
@@ -200,5 +194,4 @@ var ModalFooter = (0, _styles.styled)('div', function (_ref4) {
   });
 });
 exports.ModalFooter = ModalFooter;
-ModalFooter.displayName = "ModalFooter";
-ModalFooter.displayName = 'ModalFooter';
+ModalFooter.displayName = "ModalFooter";

package/modal/types.d.ts

@@ -1,6 +1,6 @@
-import type * as React from 'react';
+import * as React from 'react';
 import type { Override } from '../helpers/overrides';
-import type { SIZE, ROLE, CLOSE_SOURCE } from './constants';
+import { SIZE, ROLE, CLOSE_SOURCE } from './constants';
 export declare type Size = keyof typeof SIZE;
 export declare type SizeProp = Size | number | string;
 export declare type Role = keyof typeof ROLE;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "baseui",
-  "version": "0.0.0-alpha-8ab2335",
+  "version": "0.0.0-alpha-e79754d",
   "description": "A React Component library implementing the Base design language",
   "keywords": [
     "react",
@@ -36,7 +36,7 @@
     "e2e:serve": "static-server build-ladle --port 8080",
     "e2e:test": "playwright test",
     "e2e:test:ci": "PUPPETEER_TARGET_URL=http://e2e-server:8080 yarn e2e:test",
-    "vrt": "playwright test --config playwright-vrt.config.ts",
+    "vrt": "playwright test --config playwright-vrt.config.js",
     "vrt:docker:run": "docker-compose run e2e-test bash -c 'PUPPETEER_TARGET_URL=http://e2e-server:8080 yarn vrt'",
     "vrt:docker:update": "docker-compose run e2e-test bash -c 'PUPPETEER_TARGET_URL=http://e2e-server:8080 yarn vrt --update'",
     "vrt:ci": "PUPPETEER_TARGET_URL=http://e2e-server:8080 node ./vrt/ci.js",
@@ -53,7 +53,7 @@
     "documentation:build": "run-s prebuild build:cjs next:build next:export",
     "documentation:serve": "static-server public --port 8081",
     "next:dev": "next dev documentation-site",
-    "next:build": "NODE_OPTIONS=--max_old_space_size=8192 next build documentation-site",
+    "next:build": "NODE_OPTIONS=--max_old_space_size=4096 next build documentation-site",
     "next:export": "next export documentation-site -o public",
     "tsc": "tsc",
     "validate:examples": "node ./scripts/validate-examples.js"
@@ -85,12 +85,12 @@
     "@date-io/luxon": "^2.7.0",
     "@date-io/moment": "^2.7.0",
     "@dubstep/core": "^3.5.3",
-    "@ladle/react": "^2.0.2",
+    "@ladle/react": "^1.0.1",
     "@mdx-js/tag": "^0.20.0",
     "@octokit/rest": "^16.33.1",
-    "@playwright/test": "^1.24.0",
+    "@playwright/test": "^1.22.2",
     "@svgr/cli": "^4.3.2",
-    "@testing-library/dom": "^8.17.1",
+    "@testing-library/dom": "^8.13.0",
     "@testing-library/jest-dom": "^5.16.3",
     "@testing-library/react": "^12.1.4",
     "@testing-library/user-event": "^13.5.0",
@@ -117,7 +117,7 @@
     "@typescript-eslint/parser": "^5.26.0",
     "@zeit/next-css": "^1.0.1",
     "@zeit/next-mdx": "^1.2.0",
-    "axe-core": "^4.4.3",
+    "axe-core": "^4.2.2",
     "babel-core": "^7.0.0-bridge.0",
     "babel-eslint": "10.1.0",
     "babel-jest": "^24.0.0",
@@ -145,6 +145,7 @@
     "eslint-plugin-react": "^7.27.0",
     "eslint-plugin-react-hooks": "3.0.0",
     "flow-bin": "0.131.0",
+    "flow-remove-types": "^2.179.0",
     "globby": "^10.0.1",
     "husky": "^3.0.0",
     "isomorphic-fetch": "^2.2.1",
@@ -166,7 +167,7 @@
     "node-fetch": "^2.6.1",
     "now": "16.5.2",
     "npm-run-all": "^4.1.5",
-    "playwright": "^1.24.0",
+    "playwright": "^1.22.2",
     "prettier": "^2.5.1",
     "pretty-proptypes": "^1.0.5",
     "pretty-quick": "^1.4.1",
@@ -186,6 +187,7 @@
     "react-view": "^2.3.3",
     "react-vis": "^1.11.6",
     "remove-flow-types-loader": "^1.1.0",
+    "rollup-pluginutils": "^2.8.2",
     "semver": "^6.2.0",
     "shx": "^0.3.2",
     "static-server": "^2.2.1",
@@ -214,7 +216,7 @@
     "mockdate": "^3.0.5",
     "polished": "^3.2.0",
     "popper.js": "^1.16.0",
-    "react-dropzone": "9.0.0",
+    "react-dropzone": "^10.1.18",
     "react-focus-lock": "^2.7.1",
     "react-input-mask": "^2.0.4",
     "react-is": "^16.8.6",
@@ -244,7 +246,7 @@
     }
   },
   "volta": {
-    "node": "16.16.0",
+    "node": "14.15.4",
     "yarn": "1.19.1"
   },
   "engines": {

package/pagination/stateful-container.js

@@ -115,7 +115,6 @@ exports.default = PaginationStatefulContainer;
 
 _defineProperty(PaginationStatefulContainer, "defaultProps", {
   initialState: initialState,
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   stateReducer: function stateReducer(changeType, changes) {
     return changes;
   }

package/pagination/stateful-pagination.js

@@ -50,7 +50,6 @@ StatefulPagination.defaultProps = {
   initialState: {
     currentPage: 1
   },
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   stateReducer: function stateReducer(changeType, changes) {
     return changes;
   },

package/pagination/styled-components.js

@@ -23,7 +23,6 @@ var StyledRoot = (0, _styles.styled)('div', function (_ref) {
 });
 exports.StyledRoot = StyledRoot;
 StyledRoot.displayName = "StyledRoot";
-StyledRoot.displayName = 'StyledRoot';
 var StyledMaxLabel = (0, _styles.styled)('span', function (_ref2) {
   var _ref3;
 
@@ -34,7 +33,6 @@ var StyledMaxLabel = (0, _styles.styled)('span', function (_ref2) {
 });
 exports.StyledMaxLabel = StyledMaxLabel;
 StyledMaxLabel.displayName = "StyledMaxLabel";
-StyledMaxLabel.displayName = 'StyledMaxLabel';
 var StyledDropdownContainer = (0, _styles.styled)('div', function (_ref4) {
   var _ref5;
 
@@ -48,5 +46,4 @@ var StyledDropdownContainer = (0, _styles.styled)('div', function (_ref4) {
   }, _defineProperty(_ref5, marginStartDir, $theme.sizing.scale600), _defineProperty(_ref5, marginEndDir, $theme.sizing.scale300), _ref5;
 });
 exports.StyledDropdownContainer = StyledDropdownContainer;
-StyledDropdownContainer.displayName = "StyledDropdownContainer";
-StyledDropdownContainer.displayName = 'StyledDropdownContainer';
+StyledDropdownContainer.displayName = "StyledDropdownContainer";

package/pagination/types.d.ts

@@ -1,6 +1,6 @@
 import type { Override } from '../helpers/overrides';
-import type { STATE_CHANGE_TYPE } from './constants';
-import type { SIZE } from '../input';
+import { STATE_CHANGE_TYPE } from './constants';
+import { SIZE } from '../input';
 export declare type Labels = {
     prevButton?: string;
     nextButton?: string;

package/payment-card/styled-components.js

@@ -20,5 +20,4 @@ var IconWrapper = (0, _styles.styled)('div', function (props) {
   return _ref = {}, _defineProperty(_ref, $theme.direction === 'rtl' ? 'marginRight' : 'marginLeft', margin[$size]), _defineProperty(_ref, "height", '100%'), _defineProperty(_ref, "display", 'flex'), _defineProperty(_ref, "alignItems", 'center'), _ref;
 });
 exports.IconWrapper = IconWrapper;
-IconWrapper.displayName = "IconWrapper";
-IconWrapper.displayName = 'IconWrapper';
+IconWrapper.displayName = "IconWrapper";

package/phone-input/base-country-picker.js

@@ -68,7 +68,6 @@ CountryPicker.defaultProps = {
 };
 
 var DropdownListItem = /*#__PURE__*/_react.default.forwardRef(function (props, ref) {
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   var children = props.children,
       rest = _objectWithoutProperties(props, _excluded);
 
@@ -222,8 +221,7 @@ function CountryPicker(props) {
 
   return /*#__PURE__*/_react.default.createElement(Select, _extends({
     clearable: false,
-    disabled: disabled // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    ,
+    disabled: disabled,
     getOptionLabel: function getOptionLabel(_ref) {
       var option = _ref.option,
           optionState = _ref.optionState;

package/phone-input/country-select-dropdown.js

@@ -129,7 +129,6 @@ function CountrySelectDropdown(props) {
             style = _ref2.style;
 
         // resetMenu and getItemLabel should not end up on native html elements
-        // eslint-disable-next-line @typescript-eslint/no-unused-vars
         var _children$index$props = // @ts-expect-error todo(flow->ts) type issue introduced in react 17
         children[index].props,
             item = _children$index$props.item,

package/phone-input/styled-components.js

@@ -39,7 +39,6 @@ var StyledPhoneInputRoot = (0, _styles.styled)('div', {
 });
 exports.StyledPhoneInputRoot = StyledPhoneInputRoot;
 StyledPhoneInputRoot.displayName = "StyledPhoneInputRoot";
-StyledPhoneInputRoot.displayName = 'StyledPhoneInputRoot';
 var StyledFlagContainer = (0, _styles.styled)('span', function (_ref) {
   var _sizeToFont;
 
@@ -50,11 +49,10 @@ var StyledFlagContainer = (0, _styles.styled)('span', function (_ref) {
   return {
     fontSize: sizeToFont[$size]
   };
-});
+}); // An override component for the Select's Root styled element
+
 exports.StyledFlagContainer = StyledFlagContainer;
 StyledFlagContainer.displayName = "StyledFlagContainer";
-StyledFlagContainer.displayName = 'StyledFlagContainer'; // An override component for the Select's Root styled element
-
 var StyledRoot = (0, _styles.withStyle)(_select.StyledRoot, function (props) {
   var _sizeToWidth;
 
@@ -67,7 +65,6 @@ var StyledRoot = (0, _styles.withStyle)(_select.StyledRoot, function (props) {
 });
 exports.StyledRoot = StyledRoot;
 StyledRoot.displayName = "StyledRoot";
-StyledRoot.displayName = 'StyledRoot';
 var StyledDialCode = (0, _styles.styled)('div', function (_ref2) {
   var _ref3;
 
@@ -79,14 +76,12 @@ var StyledDialCode = (0, _styles.styled)('div', function (_ref2) {
 });
 exports.StyledDialCode = StyledDialCode;
 StyledDialCode.displayName = "StyledDialCode";
-StyledDialCode.displayName = 'StyledDialCode';
 var StyledCountrySelectContainer = (0, _styles.styled)('div', {
   display: 'flex',
   alignItems: 'center'
 });
 exports.StyledCountrySelectContainer = StyledCountrySelectContainer;
 StyledCountrySelectContainer.displayName = "StyledCountrySelectContainer";
-StyledCountrySelectContainer.displayName = 'StyledCountrySelectContainer';
 var StyledCountrySelectDropdownContainer = (0, _styles.withStyle)(_menu.StyledList, function (props) {
   var _props$$height = props.$height,
       $height = _props$$height === void 0 ? _defaultProps.default.maxDropdownHeight : _props$$height;
@@ -98,7 +93,6 @@ var StyledCountrySelectDropdownContainer = (0, _styles.withStyle)(_menu.StyledLi
 });
 exports.StyledCountrySelectDropdownContainer = StyledCountrySelectDropdownContainer;
 StyledCountrySelectDropdownContainer.displayName = "StyledCountrySelectDropdownContainer";
-StyledCountrySelectDropdownContainer.displayName = 'StyledCountrySelectDropdownContainer';
 var StyledCountrySelectDropdownListItemElement = (0, _styles.withStyle)(_select.StyledDropdownListItem, {
   paddingTop: 0,
   paddingBottom: 0,
@@ -110,16 +104,13 @@ var StyledCountrySelectDropdownListItemElement = (0, _styles.withStyle)(_select.
 });
 exports.StyledCountrySelectDropdownListItemElement = StyledCountrySelectDropdownListItemElement;
 StyledCountrySelectDropdownListItemElement.displayName = "StyledCountrySelectDropdownListItemElement";
-StyledCountrySelectDropdownListItemElement.displayName = 'StyledCountrySelectDropdownListItemElement';
 var StyledCountrySelectDropdownListItem = (0, _styles.withWrapper)(StyledCountrySelectDropdownListItemElement, function (Styled) {
-  return (// eslint-disable-next-line @typescript-eslint/no-unused-vars
-    function StyledCountrySelectDropdownListItem(_ref4) {
-      var item = _ref4.item,
-          restProps = _objectWithoutProperties(_ref4, _excluded);
-
-      return /*#__PURE__*/React.createElement(Styled, restProps);
-    }
-  );
+  return function StyledCountrySelectDropdownListItem(_ref4) {
+    var item = _ref4.item,
+        restProps = _objectWithoutProperties(_ref4, _excluded);
+
+    return /*#__PURE__*/React.createElement(Styled, restProps);
+  };
 });
 exports.StyledCountrySelectDropdownListItem = StyledCountrySelectDropdownListItem;
 var StyledCountrySelectDropdownFlagColumn = (0, _styles.styled)('div', function (_ref5) {
@@ -133,7 +124,6 @@ var StyledCountrySelectDropdownFlagColumn = (0, _styles.styled)('div', function
 });
 exports.StyledCountrySelectDropdownFlagColumn = StyledCountrySelectDropdownFlagColumn;
 StyledCountrySelectDropdownFlagColumn.displayName = "StyledCountrySelectDropdownFlagColumn";
-StyledCountrySelectDropdownFlagColumn.displayName = 'StyledCountrySelectDropdownFlagColumn';
 var StyledCountrySelectDropdownNameColumn = (0, _styles.styled)('div', function (_ref7) {
   var _ref7$$theme = _ref7.$theme,
       direction = _ref7$$theme.direction,
@@ -143,7 +133,6 @@ var StyledCountrySelectDropdownNameColumn = (0, _styles.styled)('div', function
 });
 exports.StyledCountrySelectDropdownNameColumn = StyledCountrySelectDropdownNameColumn;
 StyledCountrySelectDropdownNameColumn.displayName = "StyledCountrySelectDropdownNameColumn";
-StyledCountrySelectDropdownNameColumn.displayName = 'StyledCountrySelectDropdownNameColumn';
 var StyledCountrySelectDropdownDialcodeColumn = (0, _styles.styled)('div', function (_ref9) {
   var _ref10;
 
@@ -155,5 +144,4 @@ var StyledCountrySelectDropdownDialcodeColumn = (0, _styles.styled)('div', funct
   return _ref10 = {}, _defineProperty(_ref10, paddingDir, sizing.scale600), _defineProperty(_ref10, marginDir, 'auto'), _ref10;
 });
 exports.StyledCountrySelectDropdownDialcodeColumn = StyledCountrySelectDropdownDialcodeColumn;
-StyledCountrySelectDropdownDialcodeColumn.displayName = "StyledCountrySelectDropdownDialcodeColumn";
-StyledCountrySelectDropdownDialcodeColumn.displayName = 'StyledCountrySelectDropdownDialcodeColumn';
+StyledCountrySelectDropdownDialcodeColumn.displayName = "StyledCountrySelectDropdownDialcodeColumn";

package/phone-input/types.d.ts

@@ -1,7 +1,8 @@
-import type * as React from 'react';
-import type { STATE_CHANGE_TYPE, SIZE, COUNTRIES } from './constants';
+import * as React from 'react';
+import { STATE_CHANGE_TYPE, SIZE, COUNTRIES } from './constants';
 import type { Override } from '../helpers/overrides';
 import type { OnChangeParams } from '../select';
+import type { ChangeEvent } from 'react';
 export declare type Size = keyof typeof SIZE;
 export declare type CountryIso = keyof typeof COUNTRIES;
 export declare type Countries = Readonly<Country>;
@@ -100,7 +101,7 @@ export declare type PhoneInputProps = {
     /** A handler for the country select's change events. */
     onCountryChange: (event: OnChangeParams) => unknown;
     /** A handler for the input element's change events. */
-    onTextChange: (event: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onTextChange: (event: ChangeEvent<HTMLInputElement>) => unknown;
     overrides: PhoneInputOverrides;
     /** Sets the placeholder text for the input element.  */
     placeholder?: string;
@@ -124,12 +125,12 @@ export declare type StatefulPhoneInputContainerProps = {
     children: (a: PhoneInputProps) => React.ReactNode;
     initialState: State;
     stateReducer: StateReducer;
-    onTextChange: (event: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onTextChange: (event: ChangeEvent<HTMLInputElement>) => unknown;
     onCountryChange: (event: OnChangeParams) => unknown;
 } & PhoneInputProps;
 export declare type StatefulPhoneInputProps = PhoneInputProps & {
     initialState?: State;
     stateReducer?: StateReducer;
-    onTextChange?: (event: React.ChangeEvent<HTMLInputElement>) => unknown;
+    onTextChange?: (event: ChangeEvent<HTMLInputElement>) => unknown;
     onCountryChange?: (event: OnChangeParams) => unknown;
 };

package/pin-code/styled-components.js

@@ -17,7 +17,6 @@ var StyledRoot = (0, _styles.styled)('div', {
 });
 exports.StyledRoot = StyledRoot;
 StyledRoot.displayName = "StyledRoot";
-StyledRoot.displayName = 'StyledRoot';
 var StyledInputOverrideRoot = (0, _styles.withStyle)(_input.StyledRoot, function (_ref) {
   var _SIZE$mini$SIZE$compa;
 
@@ -31,12 +30,10 @@ var StyledInputOverrideRoot = (0, _styles.withStyle)(_input.StyledRoot, function
 });
 exports.StyledInputOverrideRoot = StyledInputOverrideRoot;
 StyledInputOverrideRoot.displayName = "StyledInputOverrideRoot";
-StyledInputOverrideRoot.displayName = 'StyledInputOverrideRoot';
 var StyledInputOverrideInput = (0, _styles.withStyle)(_input.StyledInput, {
   textAlign: 'center',
   paddingLeft: '0',
   paddingRight: '0'
 });
 exports.StyledInputOverrideInput = StyledInputOverrideInput;
-StyledInputOverrideInput.displayName = "StyledInputOverrideInput";
-StyledInputOverrideInput.displayName = 'StyledInputOverrideInput';
+StyledInputOverrideInput.displayName = "StyledInputOverrideInput";

package/pin-code/types.d.ts

@@ -1,6 +1,6 @@
-import type * as React from 'react';
+import * as React from 'react';
 import type { Override } from '../helpers/overrides';
-import type { SIZE, STATE_CHANGE_TYPE } from '../input';
+import { SIZE, STATE_CHANGE_TYPE } from '../input';
 export declare type ChangeEvent = {
     values: string[];
     event: any;

package/popover/popover.js

@@ -184,11 +184,13 @@ var PopoverInner = /*#__PURE__*/function (_React$Component) {
       var popper = _this.popperRef.current;
       var anchor = _this.anchorRef.current; // Ignore document click if it came from popover or anchor
 
-      if (!popper || popper === target || target instanceof Node && popper.contains(target)) {
+      if (!popper || popper === target || // eslint-disable-next-line cup/no-undef
+      target instanceof Node && popper.contains(target)) {
         return;
       }
 
-      if (!anchor || anchor === target || target instanceof Node && popper.contains(target)) {
+      if (!anchor || anchor === target || // eslint-disable-next-line cup/no-undef
+      target instanceof Node && popper.contains(target)) {
         return;
       }
 
@@ -212,7 +214,7 @@ var PopoverInner = /*#__PURE__*/function (_React$Component) {
     value: function componentDidUpdate(prevProps, prevState) {
       this.init(prevProps, prevState);
 
-      if (this.props.accessibilityType !== _constants.ACCESSIBILITY_TYPE.tooltip && this.props.autoFocus && !this.state.autoFocusAfterPositioning && this.popperRef.current !== null && this.popperRef.current.getBoundingClientRect().top > 0) {
+      if (this.props.autoFocus && !this.state.autoFocusAfterPositioning && this.popperRef.current !== null && this.popperRef.current.getBoundingClientRect().top > 0) {
         this.setState({
           autoFocusAfterPositioning: true
         });
@@ -344,6 +346,10 @@ var PopoverInner = /*#__PURE__*/function (_React$Component) {
     value: function getAnchorProps() {
       var isOpen = this.props.isOpen;
       var anchorProps = {
+        'aria-haspopup': true,
+        'aria-expanded': isOpen ? true : false,
+        // @ts-expect-error todo(flow->ts): should it be here?
+        key: 'popover-anchor',
         ref: this.anchorRef
       };
       var popoverId = this.getPopoverIdAttr();
@@ -351,8 +357,6 @@ var PopoverInner = /*#__PURE__*/function (_React$Component) {
       if (this.isAccessibilityTypeMenu()) {
         var relationAttr = this.isClickTrigger() ? 'aria-controls' : 'aria-owns';
         anchorProps[relationAttr] = isOpen ? popoverId : null;
-        anchorProps['aria-haspopup'] = true;
-        anchorProps['aria-expanded'] = Boolean(isOpen);
       } else if (this.isAccessibilityTypeTooltip()) {
         anchorProps.id = this.getAnchorIdAttr();
         anchorProps['aria-describedby'] = isOpen ? popoverId : null;
@@ -444,9 +448,7 @@ var PopoverInner = /*#__PURE__*/function (_React$Component) {
         return /*#__PURE__*/React.cloneElement(anchor, anchorProps);
       }
 
-      return /*#__PURE__*/React.createElement("span", _extends({
-        key: "popover-anchor"
-      }, anchorProps), anchor);
+      return /*#__PURE__*/React.createElement("span", anchorProps, anchor);
     }
   }, {
     key: "renderPopover",
@@ -526,7 +528,7 @@ var PopoverInner = /*#__PURE__*/function (_React$Component) {
             popperOptions: _objectSpread(_objectSpread({}, defaultPopperOptions), this.props.popperOptions),
             onPopperUpdate: this.onPopperUpdate,
             placement: this.state.placement
-          }, this.props.focusLock && this.props.accessibilityType !== _constants.ACCESSIBILITY_TYPE.tooltip ? /*#__PURE__*/React.createElement(_reactFocusLock.default, {
+          }, this.props.focusLock ? /*#__PURE__*/React.createElement(_reactFocusLock.default, {
             disabled: !this.props.focusLock,
             noFocusGuards: false // see popover-focus-loop.scenario.js for why hover cannot return focus
             ,

package/popover/popover.js.flow

@@ -240,10 +240,20 @@ class PopoverInner extends React.Component<PopoverPropsT, PopoverPrivateStateT>
     const popper = this.popperRef.current;
     const anchor = this.anchorRef.current;
     // Ignore document click if it came from popover or anchor
-    if (!popper || popper === target || (target instanceof Node && popper.contains(target))) {
+    if (
+      !popper ||
+      popper === target ||
+      // eslint-disable-next-line cup/no-undef
+      (target instanceof Node && popper.contains(target))
+    ) {
       return;
     }
-    if (!anchor || anchor === target || (target instanceof Node && popper.contains(target))) {
+    if (
+      !anchor ||
+      anchor === target ||
+      // eslint-disable-next-line cup/no-undef
+      (target instanceof Node && popper.contains(target))
+    ) {
       return;
     }
     if (this.props.onClickOutside) {

package/popover/stateful-container.js

@@ -11,8 +11,6 @@ var React = _interopRequireWildcard(require("react"));
 
 var _constants = require("./constants");
 
-var _focusVisible = require("../utils/focusVisible");
-
 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); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -104,9 +102,7 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
         _this.props.onFocus(e);
       }
 
-      if ((0, _focusVisible.isFocusVisible)(e)) {
-        _this.open();
-      }
+      _this.open();
     });
 
     _defineProperty(_assertThisInitialized(_this), "onMouseEnter", function (e) {

package/popover/styled-components.js

@@ -65,13 +65,13 @@ function getBodyStyles(props) {
 }
 
 var Body = (0, _styles.styled)('div', getBodyStyles);
-exports.Body = Body;
-Body.displayName = "Body";
-Body.displayName = 'Body';
 /**
  * Arrow shown between the popover and the anchor element
  */
 
+exports.Body = Body;
+Body.displayName = "Body";
+
 function getArrowStyles(props) {
   var $arrowOffset = props.$arrowOffset,
       $placement = props.$placement,
@@ -87,9 +87,6 @@ function getArrowStyles(props) {
 }
 
 var Arrow = (0, _styles.styled)('div', getArrowStyles);
-exports.Arrow = Arrow;
-Arrow.displayName = "Arrow";
-Arrow.displayName = 'Arrow';
 /**
  * Extra div that holds the popover content. This extra element
  * is needed for the arrow–the arrow is just a 45deg rotated div,
@@ -97,6 +94,9 @@ Arrow.displayName = 'Arrow';
  * clips the part of the arrow that extends into the popover.
  */
 
+exports.Arrow = Arrow;
+Arrow.displayName = "Arrow";
+
 function getInnerStyles(_ref) {
   var $theme = _ref.$theme;
   return {
@@ -111,15 +111,14 @@ function getInnerStyles(_ref) {
 }
 
 var Inner = (0, _styles.styled)('div', getInnerStyles);
-exports.Inner = Inner;
-Inner.displayName = "Inner";
-Inner.displayName = 'Inner';
 /**
  * A drop-in component that provides the recommended padding
  * for popovers. Mostly a convenience for users so they don't
  * have to define this themselves.
  */
 
+exports.Inner = Inner;
+Inner.displayName = "Inner";
 var Padding = (0, _styles.styled)('div', {
   paddingLeft: '12px',
   paddingTop: '12px',
@@ -128,10 +127,8 @@ var Padding = (0, _styles.styled)('div', {
 });
 exports.Padding = Padding;
 Padding.displayName = "Padding";
-Padding.displayName = 'Padding';
 var Hidden = (0, _styles.styled)('div', {
   display: 'none'
 });
 exports.Hidden = Hidden;
-Hidden.displayName = "Hidden";
-Hidden.displayName = 'Hidden';
+Hidden.displayName = "Hidden";

package/popover/types.d.ts

@@ -1,7 +1,7 @@
-import type * as React from 'react';
+import * as React from 'react';
 import type { Override } from '../helpers/overrides';
 import type { TetherPlacement } from '../layer';
-import type { ACCESSIBILITY_TYPE, STATE_CHANGE_TYPE, TRIGGER_TYPE } from './constants';
+import { ACCESSIBILITY_TYPE, STATE_CHANGE_TYPE, TRIGGER_TYPE } from './constants';
 export type { PopperDataObject, PopperOffset, PopperOptions } from '../layer';
 export declare type PopoverPlacement = TetherPlacement;
 export declare type TriggerType = keyof typeof TRIGGER_TYPE;

package/progress-bar/progressbar-rounded.js

@@ -100,7 +100,6 @@ function ProgressBarRounded(_ref) {
       setPathLength(pathRef.current.getTotalLength());
     }
   }, []); // Animation
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
 
   var animationFrameRef = React.useRef();
 

package/progress-bar/styled-components.d.ts

@@ -1,10 +1,7 @@
 import type { StyleProps, Size } from './types';
 export declare const StyledRoot: import("styletron-react").StyletronComponent<"div", StyleProps>;
 export declare const StyledBarContainer: import("styletron-react").StyletronComponent<"div", StyleProps>;
-export declare const StyledBar: import("styletron-react").StyletronComponent<"div", {
-    $size: Size;
-    $steps?: number;
-}>;
+export declare const StyledBar: import("styletron-react").StyletronComponent<"div", StyleProps>;
 export declare const StyledBarProgress: import("styletron-react").StyletronComponent<"div", StyleProps>;
 export declare const StyledInfiniteBar: import("styletron-react").StyletronComponent<"div", {
     $isLeft?: boolean;