@atlaskit/select 16.7.3 → 16.7.5

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/select
 
+## 16.7.5
+
+### Patch Changes
+
+- [#42429](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/42429) [`1cc562c4005`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1cc562c4005) - upgrade shallow-equal version to 3.1.0
+
+## 16.7.4
+
+### Patch Changes
+
+- [#41990](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/41990) [`7a88114cef7`](https://bitbucket.org/atlassian/atlassian-frontend/commits/7a88114cef7) - added type dependency for @types/react-node-resolver
+
 ## 16.7.3
 
 ### Patch Changes

package/dist/cjs/PopupSelect/PopupSelect.js

@@ -22,7 +22,7 @@ var _reactSelect = _interopRequireWildcard(require("react-select"));
 var _reactUid = require("react-uid");
 var _reactPopper = require("react-popper");
 var _reactNodeResolver = _interopRequireDefault(require("react-node-resolver"));
-var _objects = _interopRequireDefault(require("shallow-equal/objects"));
+var _shallowEqual = require("shallow-equal");
 var _colors = require("@atlaskit/theme/colors");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _components = require("./components");
@@ -484,13 +484,13 @@ var PopupSelect = exports.default = /*#__PURE__*/function (_PureComponent) {
 
       // Merge consumer and default popper props
       var mergedPopperProps = _objectSpread(_objectSpread({}, defaultPopperProps), props.popperProps);
-      if (!(0, _objects.default)(mergedPopperProps, state.mergedPopperProps)) {
+      if (!(0, _shallowEqual.shallowEqualObjects)(mergedPopperProps, state.mergedPopperProps)) {
         newState.mergedPopperProps = mergedPopperProps;
       }
 
       // Merge consumer and default components
       var mergedComponents = _objectSpread(_objectSpread({}, _components.defaultComponents), props.components);
-      if (!(0, _objects.default)(mergedComponents, state.mergedComponents)) {
+      if (!(0, _shallowEqual.shallowEqualObjects)(mergedComponents, state.mergedComponents)) {
         newState.mergedComponents = mergedComponents;
       }
       if (!isEmpty(newState)) {

package/dist/cjs/Select.js

@@ -9,7 +9,7 @@ var _reactSelect = _interopRequireDefault(require("react-select"));
 var _analyticsNext = require("@atlaskit/analytics-next");
 var _createSelect = _interopRequireDefault(require("./createSelect"));
 var packageName = "@atlaskit/select";
-var packageVersion = "16.7.3";
+var packageVersion = "16.7.5";
 var SelectWithoutAnalytics = exports.SelectWithoutAnalytics = (0, _createSelect.default)(_reactSelect.default);
 var createAndFireEventOnAtlaskit = (0, _analyticsNext.createAndFireEvent)('atlaskit');
 var _default = exports.default = (0, _analyticsNext.withAnalyticsContext)({

package/dist/es2019/PopupSelect/PopupSelect.js

@@ -7,7 +7,7 @@ import Select, { mergeStyles } from 'react-select';
 import { uid } from 'react-uid';
 import { Manager, Reference, Popper } from 'react-popper';
 import NodeResolver from 'react-node-resolver';
-import shallowEqualObjects from 'shallow-equal/objects';
+import { shallowEqualObjects } from 'shallow-equal';
 import { N80 } from '@atlaskit/theme/colors';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { MenuDialog, DummyControl, defaultComponents } from './components';

package/dist/es2019/Select.js

@@ -2,7 +2,7 @@ import Select from 'react-select';
 import { withAnalyticsEvents, withAnalyticsContext, createAndFireEvent } from '@atlaskit/analytics-next';
 import createSelect from './createSelect';
 const packageName = "@atlaskit/select";
-const packageVersion = "16.7.3";
+const packageVersion = "16.7.5";
 export const SelectWithoutAnalytics = createSelect(Select);
 const createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 export default withAnalyticsContext({

package/dist/esm/PopupSelect/PopupSelect.js

@@ -19,7 +19,7 @@ import Select, { mergeStyles } from 'react-select';
 import { uid } from 'react-uid';
 import { Manager, Reference, Popper } from 'react-popper';
 import NodeResolver from 'react-node-resolver';
-import shallowEqualObjects from 'shallow-equal/objects';
+import { shallowEqualObjects } from 'shallow-equal';
 import { N80 } from '@atlaskit/theme/colors';
 import { getBooleanFF } from '@atlaskit/platform-feature-flags';
 import { MenuDialog, DummyControl, defaultComponents } from './components';

package/dist/esm/Select.js

@@ -2,7 +2,7 @@ import Select from 'react-select';
 import { withAnalyticsEvents, withAnalyticsContext, createAndFireEvent } from '@atlaskit/analytics-next';
 import createSelect from './createSelect';
 var packageName = "@atlaskit/select";
-var packageVersion = "16.7.3";
+var packageVersion = "16.7.5";
 export var SelectWithoutAnalytics = createSelect(Select);
 var createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 export default withAnalyticsContext({

package/dist/types/PopupSelect/PopupSelect.d.ts

@@ -173,15 +173,11 @@ export default class PopupSelect<Option = OptionType, IsMulti extends boolean =
         loadingMessage?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").NoticeProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         menu?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MenuProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         menuList?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MenuListProps<Option, IsMulti, GroupBase<Option>>> | undefined;
-        menuPortal?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select/dist/declarations/src/components/Menu").PortalStyleArgs> | undefined;
+        menuPortal?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select/dist/declarations/src/components/Menu").PortalStyleArgs> | undefined; /** @deprecated Use isInvalid instead. The state of validation if used in a form */
         multiValue?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MultiValueProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         multiValueLabel?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MultiValueProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         multiValueRemove?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MultiValueProps<Option, IsMulti, GroupBase<Option>>> | undefined;
-        noOptionsMessage?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").NoticeProps<Option, IsMulti, GroupBase<Option>>> | undefined; /**
-         * TODO: This type should be cleaned up with `platform.design-system-team.popup-select-render-perf_i0s6m`.
-         *  - If discarded, revert to `focusLockEnabled: boolean`
-         *  - If kept, delete this type.
-         */
+        noOptionsMessage?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").NoticeProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         option?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").OptionProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         placeholder?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").PlaceholderProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         singleValue?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").SingleValueProps<Option, IsMulti, GroupBase<Option>>> | undefined;
@@ -191,6 +187,19 @@ export default class PopupSelect<Option = OptionType, IsMulti extends boolean =
         ClearIndicator: <Option_1, IsMulti_1 extends boolean, Group extends GroupBase<Option_1>>(props: import("react-select").ClearIndicatorProps<Option_1, IsMulti_1, Group>) => import("@emotion/react").jsx.JSX.Element;
         Control: <Option_1, IsMulti_1 extends boolean, Group_1 extends GroupBase<Option_1>>(props: import("react-select").ControlProps<Option_1, IsMulti_1, Group_1>) => import("@emotion/react").jsx.JSX.Element;
         DropdownIndicator: <Option_2, IsMulti_2 extends boolean, Group_2 extends GroupBase<Option_2>>(props: import("react-select").DropdownIndicatorProps<Option_2, IsMulti_2, Group_2>) => import("@emotion/react").jsx.JSX.Element;
+        /**
+          Render props used to anchor the popup to your content.
+      
+          Make this an interactive element, such as an @atlaskit/button component.
+      
+          The provided render props in `options` are detailed below:
+          - `isOpen`: The current state of the popup.
+              Use this to change the appearance of your target based on the state of your component
+          - `ref`: Pass this ref to the element the Popup should be attached to
+          - `onKeyDown`: Pass this keydown handler to the element to allow keyboard users to access the element.
+          - `aria-haspopup`, `aria-expanded`, `aria-controls`: Spread these onto a target element to
+              ensure your experience is accessible
+         */
         DownChevron: (props: import("react-select/dist/declarations/src/components/indicators").DownChevronProps) => import("@emotion/react").jsx.JSX.Element;
         CrossIcon: (props: import("react-select/dist/declarations/src/components/indicators").CrossIconProps) => import("@emotion/react").jsx.JSX.Element;
         Group: <Option_3, IsMulti_3 extends boolean, Group_3 extends GroupBase<Option_3>>(props: import("react-select").GroupProps<Option_3, IsMulti_3, Group_3>) => import("@emotion/react").jsx.JSX.Element;

package/dist/types-ts4.5/PopupSelect/PopupSelect.d.ts

@@ -173,15 +173,11 @@ export default class PopupSelect<Option = OptionType, IsMulti extends boolean =
         loadingMessage?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").NoticeProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         menu?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MenuProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         menuList?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MenuListProps<Option, IsMulti, GroupBase<Option>>> | undefined;
-        menuPortal?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select/dist/declarations/src/components/Menu").PortalStyleArgs> | undefined;
+        menuPortal?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select/dist/declarations/src/components/Menu").PortalStyleArgs> | undefined; /** @deprecated Use isInvalid instead. The state of validation if used in a form */
         multiValue?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MultiValueProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         multiValueLabel?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MultiValueProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         multiValueRemove?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").MultiValueProps<Option, IsMulti, GroupBase<Option>>> | undefined;
-        noOptionsMessage?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").NoticeProps<Option, IsMulti, GroupBase<Option>>> | undefined; /**
-         * TODO: This type should be cleaned up with `platform.design-system-team.popup-select-render-perf_i0s6m`.
-         *  - If discarded, revert to `focusLockEnabled: boolean`
-         *  - If kept, delete this type.
-         */
+        noOptionsMessage?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").NoticeProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         option?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").OptionProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         placeholder?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").PlaceholderProps<Option, IsMulti, GroupBase<Option>>> | undefined;
         singleValue?: import("react-select/dist/declarations/src/styles").StylesConfigFunction<import("react-select").SingleValueProps<Option, IsMulti, GroupBase<Option>>> | undefined;
@@ -191,6 +187,19 @@ export default class PopupSelect<Option = OptionType, IsMulti extends boolean =
         ClearIndicator: <Option_1, IsMulti_1 extends boolean, Group extends GroupBase<Option_1>>(props: import("react-select").ClearIndicatorProps<Option_1, IsMulti_1, Group>) => import("@emotion/react").jsx.JSX.Element;
         Control: <Option_1, IsMulti_1 extends boolean, Group_1 extends GroupBase<Option_1>>(props: import("react-select").ControlProps<Option_1, IsMulti_1, Group_1>) => import("@emotion/react").jsx.JSX.Element;
         DropdownIndicator: <Option_2, IsMulti_2 extends boolean, Group_2 extends GroupBase<Option_2>>(props: import("react-select").DropdownIndicatorProps<Option_2, IsMulti_2, Group_2>) => import("@emotion/react").jsx.JSX.Element;
+        /**
+          Render props used to anchor the popup to your content.
+      
+          Make this an interactive element, such as an @atlaskit/button component.
+      
+          The provided render props in `options` are detailed below:
+          - `isOpen`: The current state of the popup.
+              Use this to change the appearance of your target based on the state of your component
+          - `ref`: Pass this ref to the element the Popup should be attached to
+          - `onKeyDown`: Pass this keydown handler to the element to allow keyboard users to access the element.
+          - `aria-haspopup`, `aria-expanded`, `aria-controls`: Spread these onto a target element to
+              ensure your experience is accessible
+         */
         DownChevron: (props: import("react-select/dist/declarations/src/components/indicators").DownChevronProps) => import("@emotion/react").jsx.JSX.Element;
         CrossIcon: (props: import("react-select/dist/declarations/src/components/indicators").CrossIconProps) => import("@emotion/react").jsx.JSX.Element;
         Group: <Option_3, IsMulti_3 extends boolean, Group_3 extends GroupBase<Option_3>>(props: import("react-select").GroupProps<Option_3, IsMulti_3, Group_3>) => import("@emotion/react").jsx.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/select",
-  "version": "16.7.3",
+  "version": "16.7.5",
   "description": "Select allows users to make a single selection or multiple selections from a list of options.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -43,7 +43,7 @@
     "@atlaskit/platform-feature-flags": "^0.2.0",
     "@atlaskit/spinner": "^15.6.0",
     "@atlaskit/theme": "^12.6.0",
-    "@atlaskit/tokens": "^1.26.0",
+    "@atlaskit/tokens": "^1.28.0",
     "@atlaskit/visually-hidden": "^1.2.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
@@ -56,7 +56,7 @@
     "react-popper": "^2.2.3",
     "react-select": "^5.4.0",
     "react-uid": "^2.2.0",
-    "shallow-equal": "^1.0.0"
+    "shallow-equal": "^3.1.0"
   },
   "peerDependencies": {
     "react": "^16.8.0",
@@ -73,6 +73,7 @@
     "@emotion/styled": "^11.0.0",
     "@testing-library/react": "^12.1.5",
     "@testing-library/user-event": "^14.4.3",
+    "@types/react-node-resolver": "^2.0.0",
     "ast-types": "^0.13.3",
     "jscodeshift": "^0.13.0",
     "react-dom": "^16.8.0",

package/report.api.md

@@ -1028,7 +1028,9 @@ export class PopupSelect<
             MenuListProps<Option, IsMulti, GroupType<Option>>
           >
         | undefined;
-      menuPortal?: StylesConfigFunction<PortalStyleArgs> | undefined;
+      menuPortal?:
+        | StylesConfigFunction<PortalStyleArgs>
+        | undefined /** @deprecated Use isInvalid instead. The state of validation if used in a form */;
       multiValue?:
         | StylesConfigFunction<
             MultiValueProps<Option, IsMulti, GroupType<Option>>
@@ -1047,11 +1049,6 @@ export class PopupSelect<
       noOptionsMessage?:
         | StylesConfigFunction<NoticeProps<Option, IsMulti, GroupType<Option>>>
         | undefined;
-      /**
-       * TODO: This type should be cleaned up with `platform.design-system-team.popup-select-render-perf_i0s6m`.
-       *  - If discarded, revert to `focusLockEnabled: boolean`
-       *  - If kept, delete this type.
-       */
       option?:
         | StylesConfigFunction<
             OptionProps_2<Option, IsMulti, GroupType<Option>>

package/tmp/api-report-tmp.d.ts

@@ -496,15 +496,11 @@ export class PopupSelect<Option = OptionType, IsMulti extends boolean = false, M
     loadingMessage?: StylesConfigFunction<NoticeProps<Option, IsMulti, GroupType<Option>>> | undefined;
     menu?: StylesConfigFunction<MenuProps_2<Option, IsMulti, GroupType<Option>>> | undefined;
     menuList?: StylesConfigFunction<MenuListProps<Option, IsMulti, GroupType<Option>>> | undefined;
-    menuPortal?: StylesConfigFunction<PortalStyleArgs> | undefined;
+    menuPortal?: StylesConfigFunction<PortalStyleArgs> | undefined; /** @deprecated Use isInvalid instead. The state of validation if used in a form */
     multiValue?: StylesConfigFunction<MultiValueProps<Option, IsMulti, GroupType<Option>>> | undefined;
     multiValueLabel?: StylesConfigFunction<MultiValueProps<Option, IsMulti, GroupType<Option>>> | undefined;
     multiValueRemove?: StylesConfigFunction<MultiValueProps<Option, IsMulti, GroupType<Option>>> | undefined;
-    noOptionsMessage?: StylesConfigFunction<NoticeProps<Option, IsMulti, GroupType<Option>>> | undefined; /**
-    * TODO: This type should be cleaned up with `platform.design-system-team.popup-select-render-perf_i0s6m`.
-    *  - If discarded, revert to `focusLockEnabled: boolean`
-    *  - If kept, delete this type.
-    */
+    noOptionsMessage?: StylesConfigFunction<NoticeProps<Option, IsMulti, GroupType<Option>>> | undefined;
     option?: StylesConfigFunction<OptionProps_2<Option, IsMulti, GroupType<Option>>> | undefined;
     placeholder?: StylesConfigFunction<PlaceholderProps_2<Option, IsMulti, GroupType<Option>>> | undefined;
     singleValue?: StylesConfigFunction<SingleValueProps<Option, IsMulti, GroupType<Option>>> | undefined;