@atlaskit/select 18.8.2 → 18.9.1

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/select
 
+## 18.9.1
+
+### Patch Changes
+
+- Updated dependencies
+
+## 18.9.0
+
+### Minor Changes
+
+- [#177875](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/177875)
+  [`d0c3d27216b7c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/d0c3d27216b7c) -
+  Remove theme prop and merge customized components for performance
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 18.8.2
 
 ### Patch Changes

package/codemods/18.3.0-select-props.tsx

@@ -64,7 +64,6 @@ function updateSelectProps(j: core.JSCodeshift, source: ReturnType<typeof j>, va
 			'isRTL',
 			'menuShouldBlockScroll',
 			'screenReaderStatus',
-			'theme',
 		];
 
 		const propsToReplace = {

package/codemods/__tests__/next-select-props.tsx

@@ -22,7 +22,6 @@ describe('Update Select props', () => {
 						isRTL={true}
 						menuShouldBlockScroll={true}
 						screenReaderStatus={''}
-						theme={{}}
 					/>
 				);
 			};
@@ -54,7 +53,6 @@ describe('Update Select props', () => {
 						isRTL={true}
 						menuShouldBlockScroll={true}
 						screenReaderStatus={''}
-						theme={{}}
 					/>
 				);
 			};
@@ -73,7 +71,6 @@ describe('Update Select props', () => {
 						isRTL={true}
 						menuShouldBlockScroll={true}
 						screenReaderStatus={''}
-						theme={{}}
 					/>
 				);
 			};
@@ -108,7 +105,6 @@ describe('Update Select props', () => {
 							isRTL={true}
 							menuShouldBlockScroll={true}
 							screenReaderStatus={''}
-							theme={{}}
 						/>
 					);
 				};
@@ -247,7 +243,6 @@ describe('Update Select props', () => {
 							isRTL={true}
 							menuShouldBlockScroll={true}
 							screenReaderStatus={''}
-							theme={{}}
 						/>
 					);
 				};
@@ -264,7 +259,6 @@ describe('Update Select props', () => {
 							isRTL={true}
 							menuShouldBlockScroll={true}
 							screenReaderStatus={''}
-							theme={{}}
 						/>
 					);
 				};
@@ -289,7 +283,6 @@ describe('Update Select props', () => {
 							isRTL={true}
 							menuShouldBlockScroll={true}
 							screenReaderStatus={''}
-							theme={{}}
 						/>
 					);
 				};

package/dist/cjs/CountrySelect.js

@@ -21,6 +21,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 var labelStyles = (0, _react.css)({
   display: 'flex',
   alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   lineHeight: 1.2
 });
 var flagStyles = (0, _react.css)({

package/dist/cjs/PopupSelect/components.js

@@ -108,9 +108,6 @@ var Menu = function Menu(_ref3) {
     innerProps = _ref3.innerProps;
   return (0, _react2.jsx)("div", innerProps, children);
 };
-var IndicatorSeparator = function IndicatorSeparator(props) {
-  return (0, _react2.jsx)(_reactSelect.components.IndicatorSeparator, props);
-};
 var ClearIndicator = function ClearIndicator(props) {
   return (0, _react2.jsx)(_reactSelect.components.ClearIndicator, props);
 };
@@ -121,7 +118,6 @@ var defaultComponents = exports.defaultComponents = {
   Control: Control,
   DropdownIndicator: DropdownIndicator,
   Menu: Menu,
-  IndicatorSeparator: IndicatorSeparator,
   ClearIndicator: ClearIndicator,
   MultiValueRemove: MultiValueRemove
 };

package/dist/cjs/Select.js

@@ -11,7 +11,7 @@ var _createSelect = _interopRequireDefault(require("./createSelect"));
 /* eslint-disable @repo/internal/react/require-jsdoc */
 
 var packageName = "@atlaskit/select";
-var packageVersion = "18.8.2";
+var packageVersion = "18.9.1";
 var SelectWithoutAnalytics = exports.SelectWithoutAnalytics = (0, _createSelect.default)(_async.default);
 var createAndFireEventOnAtlaskit = (0, _analyticsNext.createAndFireEvent)('atlaskit');
 var Select = (0, _analyticsNext.withAnalyticsContext)({

package/dist/cjs/createSelect.js

@@ -11,11 +11,8 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _components = require("./components");
-var _inputAriaDescribedby = require("./components/input-aria-describedby");
-var _noOptions = require("./components/no-options");
 var _groupedOptionsAnnouncement = require("./utils/grouped-options-announcement");
-var _excluded = ["ariaLiveMessages", "components", "isInvalid", "onClickPreventDefault", "tabSelectsValue", "validationState"];
+var _excluded = ["ariaLiveMessages", "isInvalid", "onClickPreventDefault", "tabSelectsValue", "validationState"];
 /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -25,7 +22,6 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 function createSelect(WrappedComponent) {
   var AtlaskitSelect = /*#__PURE__*/(0, _react.forwardRef)(function AtlaskitSelect(props, forwardedRef) {
     var ariaLiveMessages = props.ariaLiveMessages,
-      componentsProp = props.components,
       isInvalid = props.isInvalid,
       _props$onClickPrevent = props.onClickPreventDefault,
       onClickPreventDefault = _props$onClickPrevent === void 0 ? true : _props$onClickPrevent,
@@ -35,31 +31,6 @@ function createSelect(WrappedComponent) {
       validationState = _props$validationStat === void 0 ? 'default' : _props$validationStat,
       restProps = (0, _objectWithoutProperties2.default)(props, _excluded);
     var internalSelectRef = (0, _react.useRef)(null);
-    var components = (0, _react.useMemo)(function () {
-      return _objectSpread({
-        ClearIndicator: _components.ClearIndicator,
-        DropdownIndicator: _components.DropdownIndicator,
-        LoadingIndicator: _components.LoadingIndicator,
-        MultiValueRemove: _components.MultiValueRemove,
-        IndicatorSeparator: _components.IndicatorSeparator,
-        Input: _inputAriaDescribedby.Input,
-        NoOptionsMessage: _noOptions.NoOptionsMessage
-      }, componentsProp);
-    }, [componentsProp]);
-    var descriptionId = props['aria-describedby'] || props['descriptionId'];
-    var isSearchable = props.isSearchable;
-    (0, _react.useEffect)(function () {
-      if (!isSearchable && descriptionId) {
-        var _internalSelectRef$cu;
-        // when isSearchable is false, react-select will create its own dummy input instead of using ours,
-        // so we need to manually add the additional aria-describedby using ref.
-        var input = (_internalSelectRef$cu = internalSelectRef.current) === null || _internalSelectRef$cu === void 0 ? void 0 : _internalSelectRef$cu.inputRef;
-        var ariaDescribedby = input === null || input === void 0 ? void 0 : input.getAttribute('aria-describedby');
-        if (!(ariaDescribedby !== null && ariaDescribedby !== void 0 && ariaDescribedby.includes(descriptionId))) {
-          input === null || input === void 0 || input.setAttribute('aria-describedby', "".concat(ariaDescribedby, " ").concat(descriptionId));
-        }
-      }
-    }, [descriptionId, isSearchable]);
 
     /**
      * The following `useImperativeHandle` hook exists for the sake of backwards compatibility.
@@ -72,12 +43,12 @@ function createSelect(WrappedComponent) {
       return {
         select: internalSelectRef.current,
         focus: function focus() {
-          var _internalSelectRef$cu2;
-          return (_internalSelectRef$cu2 = internalSelectRef.current) === null || _internalSelectRef$cu2 === void 0 ? void 0 : _internalSelectRef$cu2.focus();
+          var _internalSelectRef$cu;
+          return (_internalSelectRef$cu = internalSelectRef.current) === null || _internalSelectRef$cu === void 0 ? void 0 : _internalSelectRef$cu.focus();
         },
         blur: function blur() {
-          var _internalSelectRef$cu3;
-          return (_internalSelectRef$cu3 = internalSelectRef.current) === null || _internalSelectRef$cu3 === void 0 ? void 0 : _internalSelectRef$cu3.blur();
+          var _internalSelectRef$cu2;
+          return (_internalSelectRef$cu2 = internalSelectRef.current) === null || _internalSelectRef$cu2 === void 0 ? void 0 : _internalSelectRef$cu2.blur();
         }
       };
     }, []);
@@ -96,10 +67,8 @@ function createSelect(WrappedComponent) {
       onClickPreventDefault: onClickPreventDefault,
       isInvalid: isInvalid || validationState === 'error'
     }, restProps, {
-      components: components
       // indicates react-select to be async by default using the base Select component
       // so that makers can pass all async props on the base select to async load options.
-      ,
       isAsync: true
     }));
   });

package/dist/es2019/CountrySelect.js

@@ -15,6 +15,7 @@ import { isCountryOptionsGrouped, onCountryOptionFocus } from './utils/country-g
 const labelStyles = css({
   display: 'flex',
   alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   lineHeight: 1.2
 });
 const flagStyles = css({

package/dist/es2019/PopupSelect/components.js

@@ -94,14 +94,12 @@ const Menu = ({
   children,
   innerProps
 }) => jsx("div", innerProps, children);
-const IndicatorSeparator = props => jsx(components.IndicatorSeparator, props);
 const ClearIndicator = props => jsx(components.ClearIndicator, props);
 const MultiValueRemove = props => jsx(components.MultiValueRemove, props);
 export const defaultComponents = {
   Control,
   DropdownIndicator,
   Menu,
-  IndicatorSeparator,
   ClearIndicator,
   MultiValueRemove
 };

package/dist/es2019/Select.js

@@ -3,7 +3,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import AsyncSelect from '@atlaskit/react-select/async';
 import createSelect from './createSelect';
 const packageName = "@atlaskit/select";
-const packageVersion = "18.8.2";
+const packageVersion = "18.9.1";
 export const SelectWithoutAnalytics = createSelect(AsyncSelect);
 const createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 const Select = withAnalyticsContext({

package/dist/es2019/createSelect.js

@@ -1,17 +1,13 @@
 import _extends from "@babel/runtime/helpers/extends";
 /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
+import React, { forwardRef, useImperativeHandle, useRef } from 'react';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { ClearIndicator, DropdownIndicator, IndicatorSeparator, LoadingIndicator, MultiValueRemove } from './components';
-import { Input } from './components/input-aria-describedby';
-import { NoOptionsMessage } from './components/no-options';
 import { isOptionsGrouped, onFocus } from './utils/grouped-options-announcement';
 export default function createSelect(WrappedComponent) {
   const AtlaskitSelect = /*#__PURE__*/forwardRef(function AtlaskitSelect(props, forwardedRef) {
     const {
       ariaLiveMessages,
-      components: componentsProp,
       isInvalid,
       // TODO: set to true when cleaning up validationState prop so it has a default value
       onClickPreventDefault = true,
@@ -20,30 +16,6 @@ export default function createSelect(WrappedComponent) {
       ...restProps
     } = props;
     const internalSelectRef = useRef(null);
-    const components = useMemo(() => ({
-      ClearIndicator,
-      DropdownIndicator,
-      LoadingIndicator,
-      MultiValueRemove,
-      IndicatorSeparator,
-      Input,
-      NoOptionsMessage,
-      ...componentsProp
-    }), [componentsProp]);
-    const descriptionId = props['aria-describedby'] || props['descriptionId'];
-    const isSearchable = props.isSearchable;
-    useEffect(() => {
-      if (!isSearchable && descriptionId) {
-        var _internalSelectRef$cu;
-        // when isSearchable is false, react-select will create its own dummy input instead of using ours,
-        // so we need to manually add the additional aria-describedby using ref.
-        const input = (_internalSelectRef$cu = internalSelectRef.current) === null || _internalSelectRef$cu === void 0 ? void 0 : _internalSelectRef$cu.inputRef;
-        const ariaDescribedby = input === null || input === void 0 ? void 0 : input.getAttribute('aria-describedby');
-        if (!(ariaDescribedby !== null && ariaDescribedby !== void 0 && ariaDescribedby.includes(descriptionId))) {
-          input === null || input === void 0 ? void 0 : input.setAttribute('aria-describedby', `${ariaDescribedby} ${descriptionId}`);
-        }
-      }
-    }, [descriptionId, isSearchable]);
 
     /**
      * The following `useImperativeHandle` hook exists for the sake of backwards compatibility.
@@ -55,12 +27,12 @@ export default function createSelect(WrappedComponent) {
     useImperativeHandle(forwardedRef, () => ({
       select: internalSelectRef.current,
       focus: () => {
-        var _internalSelectRef$cu2;
-        return (_internalSelectRef$cu2 = internalSelectRef.current) === null || _internalSelectRef$cu2 === void 0 ? void 0 : _internalSelectRef$cu2.focus();
+        var _internalSelectRef$cu;
+        return (_internalSelectRef$cu = internalSelectRef.current) === null || _internalSelectRef$cu === void 0 ? void 0 : _internalSelectRef$cu.focus();
       },
       blur: () => {
-        var _internalSelectRef$cu3;
-        return (_internalSelectRef$cu3 = internalSelectRef.current) === null || _internalSelectRef$cu3 === void 0 ? void 0 : _internalSelectRef$cu3.blur();
+        var _internalSelectRef$cu2;
+        return (_internalSelectRef$cu2 = internalSelectRef.current) === null || _internalSelectRef$cu2 === void 0 ? void 0 : _internalSelectRef$cu2.blur();
       }
     }), []);
     return /*#__PURE__*/React.createElement(WrappedComponent, _extends({
@@ -79,10 +51,8 @@ export default function createSelect(WrappedComponent) {
       onClickPreventDefault: onClickPreventDefault,
       isInvalid: isInvalid || validationState === 'error'
     }, restProps, {
-      components: components
       // indicates react-select to be async by default using the base Select component
       // so that makers can pass all async props on the base select to async load options.
-      ,
       isAsync: true
     }));
   });

package/dist/esm/CountrySelect.js

@@ -18,6 +18,7 @@ import { isCountryOptionsGrouped, onCountryOptionFocus } from './utils/country-g
 var labelStyles = css({
   display: 'flex',
   alignItems: 'center',
+  // eslint-disable-next-line @atlaskit/design-system/use-tokens-typography
   lineHeight: 1.2
 });
 var flagStyles = css({

package/dist/esm/PopupSelect/components.js

@@ -103,9 +103,6 @@ var Menu = function Menu(_ref3) {
     innerProps = _ref3.innerProps;
   return jsx("div", innerProps, children);
 };
-var IndicatorSeparator = function IndicatorSeparator(props) {
-  return jsx(components.IndicatorSeparator, props);
-};
 var ClearIndicator = function ClearIndicator(props) {
   return jsx(components.ClearIndicator, props);
 };
@@ -116,7 +113,6 @@ export var defaultComponents = {
   Control: Control,
   DropdownIndicator: DropdownIndicator,
   Menu: Menu,
-  IndicatorSeparator: IndicatorSeparator,
   ClearIndicator: ClearIndicator,
   MultiValueRemove: MultiValueRemove
 };

package/dist/esm/Select.js

@@ -3,7 +3,7 @@ import { createAndFireEvent, withAnalyticsContext, withAnalyticsEvents } from '@
 import AsyncSelect from '@atlaskit/react-select/async';
 import createSelect from './createSelect';
 var packageName = "@atlaskit/select";
-var packageVersion = "18.8.2";
+var packageVersion = "18.9.1";
 export var SelectWithoutAnalytics = createSelect(AsyncSelect);
 var createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 var Select = withAnalyticsContext({

package/dist/esm/createSelect.js

@@ -1,21 +1,17 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["ariaLiveMessages", "components", "isInvalid", "onClickPreventDefault", "tabSelectsValue", "validationState"];
+var _excluded = ["ariaLiveMessages", "isInvalid", "onClickPreventDefault", "tabSelectsValue", "validationState"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /* eslint-disable @atlaskit/platform/ensure-feature-flag-prefix */
 // eslint-disable-next-line @repo/internal/fs/filename-pattern-match
-import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useRef } from 'react';
+import React, { forwardRef, useImperativeHandle, useRef } from 'react';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { ClearIndicator, DropdownIndicator, IndicatorSeparator, LoadingIndicator, MultiValueRemove } from './components';
-import { Input } from './components/input-aria-describedby';
-import { NoOptionsMessage } from './components/no-options';
 import { isOptionsGrouped, onFocus as _onFocus } from './utils/grouped-options-announcement';
 export default function createSelect(WrappedComponent) {
   var AtlaskitSelect = /*#__PURE__*/forwardRef(function AtlaskitSelect(props, forwardedRef) {
     var ariaLiveMessages = props.ariaLiveMessages,
-      componentsProp = props.components,
       isInvalid = props.isInvalid,
       _props$onClickPrevent = props.onClickPreventDefault,
       onClickPreventDefault = _props$onClickPrevent === void 0 ? true : _props$onClickPrevent,
@@ -25,31 +21,6 @@ export default function createSelect(WrappedComponent) {
       validationState = _props$validationStat === void 0 ? 'default' : _props$validationStat,
       restProps = _objectWithoutProperties(props, _excluded);
     var internalSelectRef = useRef(null);
-    var components = useMemo(function () {
-      return _objectSpread({
-        ClearIndicator: ClearIndicator,
-        DropdownIndicator: DropdownIndicator,
-        LoadingIndicator: LoadingIndicator,
-        MultiValueRemove: MultiValueRemove,
-        IndicatorSeparator: IndicatorSeparator,
-        Input: Input,
-        NoOptionsMessage: NoOptionsMessage
-      }, componentsProp);
-    }, [componentsProp]);
-    var descriptionId = props['aria-describedby'] || props['descriptionId'];
-    var isSearchable = props.isSearchable;
-    useEffect(function () {
-      if (!isSearchable && descriptionId) {
-        var _internalSelectRef$cu;
-        // when isSearchable is false, react-select will create its own dummy input instead of using ours,
-        // so we need to manually add the additional aria-describedby using ref.
-        var input = (_internalSelectRef$cu = internalSelectRef.current) === null || _internalSelectRef$cu === void 0 ? void 0 : _internalSelectRef$cu.inputRef;
-        var ariaDescribedby = input === null || input === void 0 ? void 0 : input.getAttribute('aria-describedby');
-        if (!(ariaDescribedby !== null && ariaDescribedby !== void 0 && ariaDescribedby.includes(descriptionId))) {
-          input === null || input === void 0 || input.setAttribute('aria-describedby', "".concat(ariaDescribedby, " ").concat(descriptionId));
-        }
-      }
-    }, [descriptionId, isSearchable]);
 
     /**
      * The following `useImperativeHandle` hook exists for the sake of backwards compatibility.
@@ -62,12 +33,12 @@ export default function createSelect(WrappedComponent) {
       return {
         select: internalSelectRef.current,
         focus: function focus() {
-          var _internalSelectRef$cu2;
-          return (_internalSelectRef$cu2 = internalSelectRef.current) === null || _internalSelectRef$cu2 === void 0 ? void 0 : _internalSelectRef$cu2.focus();
+          var _internalSelectRef$cu;
+          return (_internalSelectRef$cu = internalSelectRef.current) === null || _internalSelectRef$cu === void 0 ? void 0 : _internalSelectRef$cu.focus();
         },
         blur: function blur() {
-          var _internalSelectRef$cu3;
-          return (_internalSelectRef$cu3 = internalSelectRef.current) === null || _internalSelectRef$cu3 === void 0 ? void 0 : _internalSelectRef$cu3.blur();
+          var _internalSelectRef$cu2;
+          return (_internalSelectRef$cu2 = internalSelectRef.current) === null || _internalSelectRef$cu2 === void 0 ? void 0 : _internalSelectRef$cu2.blur();
         }
       };
     }, []);
@@ -86,10 +57,8 @@ export default function createSelect(WrappedComponent) {
       onClickPreventDefault: onClickPreventDefault,
       isInvalid: isInvalid || validationState === 'error'
     }, restProps, {
-      components: components
       // indicates react-select to be async by default using the base Select component
       // so that makers can pass all async props on the base select to async load options.
-      ,
       isAsync: true
     }));
   });

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

@@ -114,7 +114,6 @@ export default class PopupSelect<Option = OptionType, IsMulti extends boolean =
             Control: React.FC<import("../types").ControlProps<OptionType, boolean>>;
             DropdownIndicator: () => import("@emotion/react").jsx.JSX.Element;
             Menu: ({ children, innerProps }: import("../types").MenuProps<OptionType, boolean>) => import("@emotion/react").jsx.JSX.Element;
-            IndicatorSeparator: (props: import("@atlaskit/react-select").IndicatorSeparatorProps<unknown, boolean, GroupBase<unknown>>) => import("@emotion/react").jsx.JSX.Element;
             ClearIndicator: (props: import("@atlaskit/react-select").ClearIndicatorProps<unknown, boolean, GroupBase<unknown>>) => import("@emotion/react").jsx.JSX.Element;
             MultiValueRemove: (props: import("@atlaskit/react-select").MultiValueRemoveProps<unknown, boolean, GroupBase<unknown>>) => import("@emotion/react").jsx.JSX.Element;
         };

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

@@ -4,7 +4,7 @@
  */
 import { type CSSProperties, type FC, type ReactNode } from 'react';
 import { jsx } from '@emotion/react';
-import { type ClearIndicatorProps, type ControlProps, type IndicatorSeparatorProps, type MenuProps, type MultiValueRemoveProps, type OptionType } from '../types';
+import { type ClearIndicatorProps, type ControlProps, type MenuProps, type MultiValueRemoveProps, type OptionType } from '../types';
 interface MenuDialogProps {
     maxWidth?: number | string;
     minWidth?: number | string;
@@ -28,7 +28,6 @@ export declare const defaultComponents: {
     Control: FC<ControlProps<OptionType, boolean>>;
     DropdownIndicator: () => jsx.JSX.Element;
     Menu: ({ children, innerProps }: MenuProps<OptionType, boolean>) => jsx.JSX.Element;
-    IndicatorSeparator: (props: IndicatorSeparatorProps) => jsx.JSX.Element;
     ClearIndicator: (props: ClearIndicatorProps) => jsx.JSX.Element;
     MultiValueRemove: (props: MultiValueRemoveProps) => jsx.JSX.Element;
 };

package/dist/types/index.d.ts

@@ -13,7 +13,7 @@ export { default as CountrySelect } from './CountrySelect';
 export { default as RadioSelect } from './RadioSelect';
 export { default as PopupSelect } from './PopupSelect';
 export type { PopupSelectProps, ModifierList } from './PopupSelect';
-export type { SelectInstance, ActionMeta, ControlProps, FormatOptionLabelMeta, InputActionMeta, InputProps, MenuProps, MenuListComponentProps, OptionProps, OptionsType, OptionType, SelectComponentsConfig, SelectProps, StylesConfig, ValueContainerProps, ValueType, GroupedOptionsType, GroupType, ClearIndicatorProps, DropdownIndicatorProps, IndicatorsContainerProps, IndicatorSeparatorProps, LoadingIndicatorProps, MultiValueProps, MultiValueRemoveProps, ReactSelectProps, SingleValueProps, NoticeProps, ValidationState, GroupProps, AsyncSelectProps, PlaceholderProps, AriaOnFocusProps, } from './types';
+export type { SelectInstance, ActionMeta, ControlProps, FormatOptionLabelMeta, InputActionMeta, InputProps, MenuProps, MenuListComponentProps, OptionProps, OptionsType, OptionType, SelectComponentsConfig, SelectProps, StylesConfig, ValueContainerProps, ValueType, GroupedOptionsType, GroupType, ClearIndicatorProps, DropdownIndicatorProps, IndicatorsContainerProps, LoadingIndicatorProps, MultiValueProps, MultiValueRemoveProps, ReactSelectProps, SingleValueProps, NoticeProps, ValidationState, GroupProps, AsyncSelectProps, PlaceholderProps, AriaOnFocusProps, } from './types';
 /**
  * Types not exported on the public API, didn't find usages in sourcegraph
  *

package/dist/types/types.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-import { type AriaOnFocusProps, type ClearIndicatorProps, type DropdownIndicatorProps, type FormatOptionLabelMeta, type GroupBase as GroupType, type IndicatorsContainerProps, type IndicatorSeparatorProps, type InputActionMeta, type InputProps, type LoadingIndicatorProps, type MultiValueProps, type MultiValueRemoveProps, type NoticeProps, type OptionProps as ReactSelectOptionProps, type Props as ReactSelectProps, type ActionMeta as RSActionMeta, type ControlProps as RSControlProps, type GroupProps as RSGroupProps, type MenuListProps as RSMenuListComponentProps, type MenuProps as RSMenuProps, type Options as RSOptionsType, type PlaceholderProps as RSPlaceholderProps, type SelectComponentsConfig as RSSelectComponentsConfig, type StylesConfig as RSStylesConfig, type ValueContainerProps as RSValueContainerProps, type OnChangeValue as RSValueType, type SelectInstance, type SingleValueProps } from '@atlaskit/react-select';
+import { type AriaOnFocusProps, type ClearIndicatorProps, type DropdownIndicatorProps, type FormatOptionLabelMeta, type GroupBase as GroupType, type IndicatorsContainerProps, type InputActionMeta, type InputProps, type LoadingIndicatorProps, type MultiValueProps, type MultiValueRemoveProps, type NoticeProps, type OptionProps as ReactSelectOptionProps, type Props as ReactSelectProps, type ActionMeta as RSActionMeta, type ControlProps as RSControlProps, type GroupProps as RSGroupProps, type MenuListProps as RSMenuListComponentProps, type MenuProps as RSMenuProps, type Options as RSOptionsType, type PlaceholderProps as RSPlaceholderProps, type SelectComponentsConfig as RSSelectComponentsConfig, type StylesConfig as RSStylesConfig, type ValueContainerProps as RSValueContainerProps, type OnChangeValue as RSValueType, type SelectInstance, type SingleValueProps } from '@atlaskit/react-select';
 import { type AsyncProps } from '@atlaskit/react-select/async';
 import type BaseSelect from '@atlaskit/react-select/base';
 import { type CreatableProps } from '@atlaskit/react-select/creatable';
@@ -82,4 +82,4 @@ export type AtlaskitSelectRefType = {
     blur: () => void;
     focus: () => void;
 };
-export type { SelectInstance, FormatOptionLabelMeta, InputActionMeta, GroupType, InputProps, MultiValueProps, ReactSelectProps, SingleValueProps, ClearIndicatorProps, DropdownIndicatorProps, IndicatorsContainerProps, IndicatorSeparatorProps, LoadingIndicatorProps, NoticeProps, MultiValueRemoveProps, AriaOnFocusProps, };
+export type { SelectInstance, FormatOptionLabelMeta, InputActionMeta, GroupType, InputProps, MultiValueProps, ReactSelectProps, SingleValueProps, ClearIndicatorProps, DropdownIndicatorProps, IndicatorsContainerProps, LoadingIndicatorProps, NoticeProps, MultiValueRemoveProps, AriaOnFocusProps, };

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

@@ -114,7 +114,6 @@ export default class PopupSelect<Option = OptionType, IsMulti extends boolean =
             Control: React.FC<import("../types").ControlProps<OptionType, boolean>>;
             DropdownIndicator: () => import("@emotion/react").jsx.JSX.Element;
             Menu: ({ children, innerProps }: import("../types").MenuProps<OptionType, boolean>) => import("@emotion/react").jsx.JSX.Element;
-            IndicatorSeparator: (props: import("@atlaskit/react-select").IndicatorSeparatorProps<unknown, boolean, GroupBase<unknown>>) => import("@emotion/react").jsx.JSX.Element;
             ClearIndicator: (props: import("@atlaskit/react-select").ClearIndicatorProps<unknown, boolean, GroupBase<unknown>>) => import("@emotion/react").jsx.JSX.Element;
             MultiValueRemove: (props: import("@atlaskit/react-select").MultiValueRemoveProps<unknown, boolean, GroupBase<unknown>>) => import("@emotion/react").jsx.JSX.Element;
         };

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

@@ -4,7 +4,7 @@
  */
 import { type CSSProperties, type FC, type ReactNode } from 'react';
 import { jsx } from '@emotion/react';
-import { type ClearIndicatorProps, type ControlProps, type IndicatorSeparatorProps, type MenuProps, type MultiValueRemoveProps, type OptionType } from '../types';
+import { type ClearIndicatorProps, type ControlProps, type MenuProps, type MultiValueRemoveProps, type OptionType } from '../types';
 interface MenuDialogProps {
     maxWidth?: number | string;
     minWidth?: number | string;
@@ -28,7 +28,6 @@ export declare const defaultComponents: {
     Control: FC<ControlProps<OptionType, boolean>>;
     DropdownIndicator: () => jsx.JSX.Element;
     Menu: ({ children, innerProps }: MenuProps<OptionType, boolean>) => jsx.JSX.Element;
-    IndicatorSeparator: (props: IndicatorSeparatorProps) => jsx.JSX.Element;
     ClearIndicator: (props: ClearIndicatorProps) => jsx.JSX.Element;
     MultiValueRemove: (props: MultiValueRemoveProps) => jsx.JSX.Element;
 };

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

@@ -13,7 +13,7 @@ export { default as CountrySelect } from './CountrySelect';
 export { default as RadioSelect } from './RadioSelect';
 export { default as PopupSelect } from './PopupSelect';
 export type { PopupSelectProps, ModifierList } from './PopupSelect';
-export type { SelectInstance, ActionMeta, ControlProps, FormatOptionLabelMeta, InputActionMeta, InputProps, MenuProps, MenuListComponentProps, OptionProps, OptionsType, OptionType, SelectComponentsConfig, SelectProps, StylesConfig, ValueContainerProps, ValueType, GroupedOptionsType, GroupType, ClearIndicatorProps, DropdownIndicatorProps, IndicatorsContainerProps, IndicatorSeparatorProps, LoadingIndicatorProps, MultiValueProps, MultiValueRemoveProps, ReactSelectProps, SingleValueProps, NoticeProps, ValidationState, GroupProps, AsyncSelectProps, PlaceholderProps, AriaOnFocusProps, } from './types';
+export type { SelectInstance, ActionMeta, ControlProps, FormatOptionLabelMeta, InputActionMeta, InputProps, MenuProps, MenuListComponentProps, OptionProps, OptionsType, OptionType, SelectComponentsConfig, SelectProps, StylesConfig, ValueContainerProps, ValueType, GroupedOptionsType, GroupType, ClearIndicatorProps, DropdownIndicatorProps, IndicatorsContainerProps, LoadingIndicatorProps, MultiValueProps, MultiValueRemoveProps, ReactSelectProps, SingleValueProps, NoticeProps, ValidationState, GroupProps, AsyncSelectProps, PlaceholderProps, AriaOnFocusProps, } from './types';
 /**
  * Types not exported on the public API, didn't find usages in sourcegraph
  *

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { type WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-import { type AriaOnFocusProps, type ClearIndicatorProps, type DropdownIndicatorProps, type FormatOptionLabelMeta, type GroupBase as GroupType, type IndicatorsContainerProps, type IndicatorSeparatorProps, type InputActionMeta, type InputProps, type LoadingIndicatorProps, type MultiValueProps, type MultiValueRemoveProps, type NoticeProps, type OptionProps as ReactSelectOptionProps, type Props as ReactSelectProps, type ActionMeta as RSActionMeta, type ControlProps as RSControlProps, type GroupProps as RSGroupProps, type MenuListProps as RSMenuListComponentProps, type MenuProps as RSMenuProps, type Options as RSOptionsType, type PlaceholderProps as RSPlaceholderProps, type SelectComponentsConfig as RSSelectComponentsConfig, type StylesConfig as RSStylesConfig, type ValueContainerProps as RSValueContainerProps, type OnChangeValue as RSValueType, type SelectInstance, type SingleValueProps } from '@atlaskit/react-select';
+import { type AriaOnFocusProps, type ClearIndicatorProps, type DropdownIndicatorProps, type FormatOptionLabelMeta, type GroupBase as GroupType, type IndicatorsContainerProps, type InputActionMeta, type InputProps, type LoadingIndicatorProps, type MultiValueProps, type MultiValueRemoveProps, type NoticeProps, type OptionProps as ReactSelectOptionProps, type Props as ReactSelectProps, type ActionMeta as RSActionMeta, type ControlProps as RSControlProps, type GroupProps as RSGroupProps, type MenuListProps as RSMenuListComponentProps, type MenuProps as RSMenuProps, type Options as RSOptionsType, type PlaceholderProps as RSPlaceholderProps, type SelectComponentsConfig as RSSelectComponentsConfig, type StylesConfig as RSStylesConfig, type ValueContainerProps as RSValueContainerProps, type OnChangeValue as RSValueType, type SelectInstance, type SingleValueProps } from '@atlaskit/react-select';
 import { type AsyncProps } from '@atlaskit/react-select/async';
 import type BaseSelect from '@atlaskit/react-select/base';
 import { type CreatableProps } from '@atlaskit/react-select/creatable';
@@ -82,4 +82,4 @@ export type AtlaskitSelectRefType = {
     blur: () => void;
     focus: () => void;
 };
-export type { SelectInstance, FormatOptionLabelMeta, InputActionMeta, GroupType, InputProps, MultiValueProps, ReactSelectProps, SingleValueProps, ClearIndicatorProps, DropdownIndicatorProps, IndicatorsContainerProps, IndicatorSeparatorProps, LoadingIndicatorProps, NoticeProps, MultiValueRemoveProps, AriaOnFocusProps, };
+export type { SelectInstance, FormatOptionLabelMeta, InputActionMeta, GroupType, InputProps, MultiValueProps, ReactSelectProps, SingleValueProps, ClearIndicatorProps, DropdownIndicatorProps, IndicatorsContainerProps, LoadingIndicatorProps, NoticeProps, MultiValueRemoveProps, AriaOnFocusProps, };

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/select",
-	"version": "18.8.2",
+	"version": "18.9.1",
 	"description": "Select allows users to make a single selection or multiple selections from a list of options.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -43,13 +43,13 @@
 	"dependencies": {
 		"@atlaskit/analytics-next": "^10.2.0",
 		"@atlaskit/ds-lib": "^3.3.0",
-		"@atlaskit/icon": "^23.1.0",
+		"@atlaskit/icon": "^23.3.0",
 		"@atlaskit/platform-feature-flags": "^0.3.0",
 		"@atlaskit/primitives": "^13.3.0",
-		"@atlaskit/react-select": "^1.5.0",
+		"@atlaskit/react-select": "^1.6.0",
 		"@atlaskit/spinner": "^16.3.0",
 		"@atlaskit/theme": "^14.0.0",
-		"@atlaskit/tokens": "^2.4.0",
+		"@atlaskit/tokens": "^3.0.0",
 		"@atlaskit/visually-hidden": "^1.5.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",
@@ -69,7 +69,7 @@
 		"@af/integration-testing": "*",
 		"@af/visual-regression": "*",
 		"@atlaskit/checkbox": "^15.2.0",
-		"@atlaskit/modal-dialog": "^12.18.0",
+		"@atlaskit/modal-dialog": "^12.19.0",
 		"@atlaskit/radio": "^7.0.0",
 		"@atlaskit/ssr": "*",
 		"@atlaskit/visual-regression": "*",