@atlaskit/select 21.2.9 → 21.3.0

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/select
 
+## 21.3.0
+
+### Minor Changes
+
+- [`153fad932190f`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/153fad932190f) -
+  [ux] Added a new prop shouldKeepInputOnSelect to the select component to prevent clearing the
+  input when isMulti is true
+
+### Patch Changes
+
+- Updated dependencies
+
+## 21.2.10
+
+### Patch Changes
+
+- [`f0662cd7a143e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/f0662cd7a143e) -
+  Internal changes to how borders are applied.
+- Updated dependencies
+
 ## 21.2.9
 
 ### Patch Changes

package/dist/cjs/CountrySelect.js

@@ -1,4 +1,4 @@
-/* CountrySelect.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* CountrySelect.tsx generated by @compiled/babel-plugin v0.38.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/PopupSelect/components.js

@@ -1,4 +1,4 @@
-/* components.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* components.tsx generated by @compiled/babel-plugin v0.38.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

package/dist/cjs/components/input-options.compiled.css

@@ -1,4 +1,4 @@
-._16cu892t svg circle:first-of-type, ._1xci892t svg rect{stroke-linejoin:round}
+._16cu892t svg circle:first-of-type{stroke-linejoin:round}
 ._16jlkb7n{flex-grow:1}
 ._16qs1kw7{box-shadow:inherit}
 ._16qsn8hf{box-shadow:inset 2px 0 0 var(--ds-border-focused,#388bff)}
@@ -6,14 +6,18 @@
 ._1bsb1osq{width:100%}
 ._1bto1l2s{text-overflow:ellipsis}
 ._1e0c1txw{display:flex}
+._1gqp1elr svg rect{stroke:var(--ds-border-input,#8590a2)}
+._1gqp1r31 svg rect{stroke:currentColor}
 ._1o9zidpf{flex-shrink:0}
 ._1q511b66{padding-block-start:var(--ds-space-050,4px)}
 ._1reo15vq{overflow-x:hidden}
-._1u9j1elr svg circle:first-of-type, ._1gqp1elr svg rect{stroke:var(--ds-border-input,#8590a2)}
-._1u9j1r31 svg circle:first-of-type, ._1gqp1r31 svg rect{stroke:currentColor}
+._1u9j1elr svg circle:first-of-type{stroke:var(--ds-border-input,#8590a2)}
+._1u9j1r31 svg circle:first-of-type{stroke:currentColor}
+._1xci892t svg rect{stroke-linejoin:round}
 ._4cvr1h6o{align-items:center}
-._59qxe4h9 svg circle:first-of-type, ._8y3xe4h9 svg rect{stroke-width:var(--ds-border-width,1px)}
+._59qxe4h9 svg circle:first-of-type{stroke-width:var(--ds-border-width,1px)}
 ._85i51b66{padding-block-end:var(--ds-space-050,4px)}
+._8y3xe4h9 svg rect{stroke-width:var(--ds-border-width,1px)}
 ._bfhk166n{background-color:var(--ds-background-neutral-subtle-hovered,#091e420f)}
 ._bfhk1j28{background-color:transparent}
 ._bozgpxbi{padding-inline-start:var(--ds-space-200,1pc)}

package/dist/cjs/components/input-options.js

@@ -1,4 +1,4 @@
-/* input-options.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* input-options.tsx generated by @compiled/babel-plugin v0.38.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -122,7 +122,7 @@ var ControlOption = function ControlOption(props) {
 var NewCheckboxIcon = function NewCheckboxIcon(props) {
   return (
     /*#__PURE__*/
-    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props, @atlaskit/design-system/no-custom-icons
     React.createElement(_svg.default, props, /*#__PURE__*/React.createElement("g", {
       fillRule: "evenodd"
     }, /*#__PURE__*/React.createElement("rect", {
@@ -143,7 +143,7 @@ var NewCheckboxIcon = function NewCheckboxIcon(props) {
 var NewRadioIcon = function NewRadioIcon(props) {
   return (
     /*#__PURE__*/
-    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props, @atlaskit/design-system/no-custom-icons
     React.createElement(_svg.default, props, /*#__PURE__*/React.createElement("g", {
       fillRule: "evenodd"
     }, /*#__PURE__*/React.createElement("circle", {

package/dist/es2019/CountrySelect.js

@@ -1,4 +1,4 @@
-/* CountrySelect.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* CountrySelect.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./CountrySelect.compiled.css";
 import * as React from 'react';

package/dist/es2019/PopupSelect/components.js

@@ -1,4 +1,4 @@
-/* components.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* components.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./components.compiled.css";
 import * as React from 'react';

package/dist/es2019/components/input-options.compiled.css

@@ -1,4 +1,4 @@
-._16cu892t svg circle:first-of-type, ._1xci892t svg rect{stroke-linejoin:round}
+._16cu892t svg circle:first-of-type{stroke-linejoin:round}
 ._16jlkb7n{flex-grow:1}
 ._16qs1kw7{box-shadow:inherit}
 ._16qsn8hf{box-shadow:inset 2px 0 0 var(--ds-border-focused,#388bff)}
@@ -6,14 +6,18 @@
 ._1bsb1osq{width:100%}
 ._1bto1l2s{text-overflow:ellipsis}
 ._1e0c1txw{display:flex}
+._1gqp1elr svg rect{stroke:var(--ds-border-input,#8590a2)}
+._1gqp1r31 svg rect{stroke:currentColor}
 ._1o9zidpf{flex-shrink:0}
 ._1q511b66{padding-block-start:var(--ds-space-050,4px)}
 ._1reo15vq{overflow-x:hidden}
-._1u9j1elr svg circle:first-of-type, ._1gqp1elr svg rect{stroke:var(--ds-border-input,#8590a2)}
-._1u9j1r31 svg circle:first-of-type, ._1gqp1r31 svg rect{stroke:currentColor}
+._1u9j1elr svg circle:first-of-type{stroke:var(--ds-border-input,#8590a2)}
+._1u9j1r31 svg circle:first-of-type{stroke:currentColor}
+._1xci892t svg rect{stroke-linejoin:round}
 ._4cvr1h6o{align-items:center}
-._59qxe4h9 svg circle:first-of-type, ._8y3xe4h9 svg rect{stroke-width:var(--ds-border-width,1px)}
+._59qxe4h9 svg circle:first-of-type{stroke-width:var(--ds-border-width,1px)}
 ._85i51b66{padding-block-end:var(--ds-space-050,4px)}
+._8y3xe4h9 svg rect{stroke-width:var(--ds-border-width,1px)}
 ._bfhk166n{background-color:var(--ds-background-neutral-subtle-hovered,#091e420f)}
 ._bfhk1j28{background-color:transparent}
 ._bozgpxbi{padding-inline-start:var(--ds-space-200,1pc)}

package/dist/es2019/components/input-options.js

@@ -1,4 +1,4 @@
-/* input-options.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* input-options.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./input-options.compiled.css";
 import * as React from 'react';
@@ -106,7 +106,7 @@ const ControlOption = props => {
 };
 const NewCheckboxIcon = props =>
 /*#__PURE__*/
-// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props, @atlaskit/design-system/no-custom-icons
 React.createElement(PrimitiveSVGIcon, props, /*#__PURE__*/React.createElement("g", {
   fillRule: "evenodd"
 }, /*#__PURE__*/React.createElement("rect", {
@@ -124,7 +124,7 @@ React.createElement(PrimitiveSVGIcon, props, /*#__PURE__*/React.createElement("g
 })));
 const NewRadioIcon = props =>
 /*#__PURE__*/
-// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+// eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props, @atlaskit/design-system/no-custom-icons
 React.createElement(PrimitiveSVGIcon, props, /*#__PURE__*/React.createElement("g", {
   fillRule: "evenodd"
 }, /*#__PURE__*/React.createElement("circle", {

package/dist/esm/CountrySelect.js

@@ -1,4 +1,4 @@
-/* CountrySelect.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* CountrySelect.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./CountrySelect.compiled.css";
 import * as React from 'react';

package/dist/esm/PopupSelect/components.js

@@ -1,4 +1,4 @@
-/* components.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* components.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";

package/dist/esm/components/input-options.compiled.css

@@ -1,4 +1,4 @@
-._16cu892t svg circle:first-of-type, ._1xci892t svg rect{stroke-linejoin:round}
+._16cu892t svg circle:first-of-type{stroke-linejoin:round}
 ._16jlkb7n{flex-grow:1}
 ._16qs1kw7{box-shadow:inherit}
 ._16qsn8hf{box-shadow:inset 2px 0 0 var(--ds-border-focused,#388bff)}
@@ -6,14 +6,18 @@
 ._1bsb1osq{width:100%}
 ._1bto1l2s{text-overflow:ellipsis}
 ._1e0c1txw{display:flex}
+._1gqp1elr svg rect{stroke:var(--ds-border-input,#8590a2)}
+._1gqp1r31 svg rect{stroke:currentColor}
 ._1o9zidpf{flex-shrink:0}
 ._1q511b66{padding-block-start:var(--ds-space-050,4px)}
 ._1reo15vq{overflow-x:hidden}
-._1u9j1elr svg circle:first-of-type, ._1gqp1elr svg rect{stroke:var(--ds-border-input,#8590a2)}
-._1u9j1r31 svg circle:first-of-type, ._1gqp1r31 svg rect{stroke:currentColor}
+._1u9j1elr svg circle:first-of-type{stroke:var(--ds-border-input,#8590a2)}
+._1u9j1r31 svg circle:first-of-type{stroke:currentColor}
+._1xci892t svg rect{stroke-linejoin:round}
 ._4cvr1h6o{align-items:center}
-._59qxe4h9 svg circle:first-of-type, ._8y3xe4h9 svg rect{stroke-width:var(--ds-border-width,1px)}
+._59qxe4h9 svg circle:first-of-type{stroke-width:var(--ds-border-width,1px)}
 ._85i51b66{padding-block-end:var(--ds-space-050,4px)}
+._8y3xe4h9 svg rect{stroke-width:var(--ds-border-width,1px)}
 ._bfhk166n{background-color:var(--ds-background-neutral-subtle-hovered,#091e420f)}
 ._bfhk1j28{background-color:transparent}
 ._bozgpxbi{padding-inline-start:var(--ds-space-200,1pc)}

package/dist/esm/components/input-options.js

@@ -1,4 +1,4 @@
-/* input-options.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* input-options.tsx generated by @compiled/babel-plugin v0.38.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./input-options.compiled.css";
@@ -113,7 +113,7 @@ var ControlOption = function ControlOption(props) {
 var NewCheckboxIcon = function NewCheckboxIcon(props) {
   return (
     /*#__PURE__*/
-    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props, @atlaskit/design-system/no-custom-icons
     React.createElement(PrimitiveSVGIcon, props, /*#__PURE__*/React.createElement("g", {
       fillRule: "evenodd"
     }, /*#__PURE__*/React.createElement("rect", {
@@ -134,7 +134,7 @@ var NewCheckboxIcon = function NewCheckboxIcon(props) {
 var NewRadioIcon = function NewRadioIcon(props) {
   return (
     /*#__PURE__*/
-    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props
+    // eslint-disable-next-line @repo/internal/react/no-unsafe-spread-props, @atlaskit/design-system/no-custom-icons
     React.createElement(PrimitiveSVGIcon, props, /*#__PURE__*/React.createElement("g", {
       fillRule: "evenodd"
     }, /*#__PURE__*/React.createElement("circle", {

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

@@ -90,6 +90,10 @@ export interface PopupSelectProps<Option = OptionType, IsMulti extends boolean =
      * The `testId` prop appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests. It will be set on the menu element when defined: `{testId}--menu`
      */
     testId?: string;
+    /**
+     * If `true`, the input value will be kept when an option is selected. The default is `false`.
+     */
+    shouldKeepInputOnSelect?: boolean;
 }
 interface State<Modifiers = string> {
     focusLockEnabled: boolean;

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

@@ -90,6 +90,10 @@ export interface PopupSelectProps<Option = OptionType, IsMulti extends boolean =
      * The `testId` prop appears as a data attribute `data-testid` in the rendered code, serving as a hook for automated tests. It will be set on the menu element when defined: `{testId}--menu`
      */
     testId?: string;
+    /**
+     * If `true`, the input value will be kept when an option is selected. The default is `false`.
+     */
+    shouldKeepInputOnSelect?: boolean;
 }
 interface State<Modifiers = string> {
     focusLockEnabled: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/select",
-	"version": "21.2.9",
+	"version": "21.3.0",
 	"description": "Select allows users to make a single selection or multiple selections from a list of options.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -34,12 +34,12 @@
 	"dependencies": {
 		"@atlaskit/analytics-next": "^11.1.0",
 		"@atlaskit/ds-lib": "^5.0.0",
-		"@atlaskit/icon": "^28.1.0",
+		"@atlaskit/icon": "^28.2.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^14.14.0",
-		"@atlaskit/react-select": "^3.5.0",
+		"@atlaskit/react-select": "^3.6.0",
 		"@atlaskit/spinner": "^19.0.0",
-		"@atlaskit/theme": "^20.0.0",
+		"@atlaskit/theme": "^21.0.0",
 		"@atlaskit/tokens": "^6.3.0",
 		"@atlaskit/visually-hidden": "^3.0.0",
 		"@babel/runtime": "^7.0.0",
@@ -60,9 +60,9 @@
 		"@af/visual-regression": "workspace:^",
 		"@atlaskit/button": "^23.4.0",
 		"@atlaskit/checkbox": "^17.1.0",
-		"@atlaskit/docs": "^11.0.0",
+		"@atlaskit/docs": "^11.1.0",
 		"@atlaskit/drawer": "^11.0.0",
-		"@atlaskit/form": "^12.5.0",
+		"@atlaskit/form": "^12.6.0",
 		"@atlaskit/link": "^3.2.0",
 		"@atlaskit/logo": "^19.7.0",
 		"@atlaskit/modal-dialog": "^14.3.0",