@atlaskit/select 21.3.0 → 21.3.1

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/select
 
+## 21.3.1
+
+### Patch Changes
+
+- [`248faa32d4835`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/248faa32d4835) -
+  Internal changes to how borders are applied.
+- Updated dependencies
+
 ## 21.3.0
 
 ### Minor Changes

package/dist/cjs/CountrySelect.js

@@ -1,4 +1,4 @@
-/* CountrySelect.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* CountrySelect.tsx generated by @compiled/babel-plugin v0.36.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.38.1 */
+/* components.tsx generated by @compiled/babel-plugin v0.36.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

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 = "0.0.0-development";
+var packageVersion = "21.3.0";
 var SelectWithoutAnalytics = exports.SelectWithoutAnalytics = (0, _createSelect.default)(_async.default);
 var createAndFireEventOnAtlaskit = (0, _analyticsNext.createAndFireEvent)('atlaskit');
 var Select = (0, _analyticsNext.withAnalyticsContext)({

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

@@ -1,4 +1,4 @@
-._16cu892t svg circle:first-of-type{stroke-linejoin:round}
+._16cu892t svg circle:first-of-type, ._1xci892t svg rect{stroke-linejoin:round}
 ._16jlkb7n{flex-grow:1}
 ._16qs1kw7{box-shadow:inherit}
 ._16qsn8hf{box-shadow:inset 2px 0 0 var(--ds-border-focused,#388bff)}
@@ -6,18 +6,14 @@
 ._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{stroke:var(--ds-border-input,#8590a2)}
-._1u9j1r31 svg circle:first-of-type{stroke:currentColor}
-._1xci892t svg rect{stroke-linejoin:round}
+._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}
 ._4cvr1h6o{align-items:center}
-._59qxe4h9 svg circle:first-of-type{stroke-width:var(--ds-border-width,1px)}
+._59qxe4h9 svg circle:first-of-type, ._8y3xe4h9 svg rect{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)}
@@ -29,4 +25,4 @@
 ._y4ti1b66{padding-inline-end:var(--ds-space-050,4px)}
 ._y4tiutpp{padding-inline-end:var(--ds-space-150,9pt)}
 ._1di61dty:active{background-color:var(--ds-background-neutral-subtle-pressed,#091e4224)}
-@media screen and (-ms-high-contrast:active){._112e1vrj{border-inline-start:2px solid transparent}}
+@media screen and (-ms-high-contrast:active){._112e5u6v{border-inline-start:var(--ds-border-width-selected,2px) solid transparent}}

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

@@ -1,4 +1,4 @@
-/* input-options.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* input-options.tsx generated by @compiled/babel-plugin v0.36.1 */
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -20,7 +20,7 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var optionStyles = {
   default: "_1e0c1txw _4cvr1h6o _1bsb1osq _uiztglyw _18ql1j7p _vchhusvi _85i51b66 _1q511b66 _bozgpxbi _y4tiutpp _bfhk1j28 _16qs1kw7 _syaz1kw7 _1di61dty",
-  focused: "_bfhk166n _16qsn8hf _112e1vrj",
+  focused: "_bfhk166n _16qsn8hf _112e5u6v",
   disabled: "_syaz15gi"
 };
 

package/dist/es2019/CountrySelect.js

@@ -1,4 +1,4 @@
-/* CountrySelect.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* CountrySelect.tsx generated by @compiled/babel-plugin v0.36.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.38.1 */
+/* components.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./components.compiled.css";
 import * as React from 'react';

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 = "0.0.0-development";
+const packageVersion = "21.3.0";
 export const SelectWithoutAnalytics = createSelect(AsyncSelect);
 const createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 const Select = withAnalyticsContext({

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

@@ -1,4 +1,4 @@
-._16cu892t svg circle:first-of-type{stroke-linejoin:round}
+._16cu892t svg circle:first-of-type, ._1xci892t svg rect{stroke-linejoin:round}
 ._16jlkb7n{flex-grow:1}
 ._16qs1kw7{box-shadow:inherit}
 ._16qsn8hf{box-shadow:inset 2px 0 0 var(--ds-border-focused,#388bff)}
@@ -6,18 +6,14 @@
 ._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{stroke:var(--ds-border-input,#8590a2)}
-._1u9j1r31 svg circle:first-of-type{stroke:currentColor}
-._1xci892t svg rect{stroke-linejoin:round}
+._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}
 ._4cvr1h6o{align-items:center}
-._59qxe4h9 svg circle:first-of-type{stroke-width:var(--ds-border-width,1px)}
+._59qxe4h9 svg circle:first-of-type, ._8y3xe4h9 svg rect{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)}
@@ -29,4 +25,4 @@
 ._y4ti1b66{padding-inline-end:var(--ds-space-050,4px)}
 ._y4tiutpp{padding-inline-end:var(--ds-space-150,9pt)}
 ._1di61dty:active{background-color:var(--ds-background-neutral-subtle-pressed,#091e4224)}
-@media screen and (-ms-high-contrast:active){._112e1vrj{border-inline-start:2px solid transparent}}
+@media screen and (-ms-high-contrast:active){._112e5u6v{border-inline-start:var(--ds-border-width-selected,2px) solid transparent}}

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

@@ -1,4 +1,4 @@
-/* input-options.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* input-options.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import "./input-options.compiled.css";
 import * as React from 'react';
@@ -10,7 +10,7 @@ import PrimitiveSVGIcon from '@atlaskit/icon/svg';
 import { fg } from '@atlaskit/platform-feature-flags';
 const optionStyles = {
   default: "_1e0c1txw _4cvr1h6o _1bsb1osq _uiztglyw _18ql1j7p _vchhusvi _85i51b66 _1q511b66 _bozgpxbi _y4tiutpp _bfhk1j28 _16qs1kw7 _syaz1kw7 _1di61dty",
-  focused: "_bfhk166n _16qsn8hf _112e1vrj",
+  focused: "_bfhk166n _16qsn8hf _112e5u6v",
   disabled: "_syaz15gi"
 };
 

package/dist/esm/CountrySelect.js

@@ -1,4 +1,4 @@
-/* CountrySelect.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* CountrySelect.tsx generated by @compiled/babel-plugin v0.36.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.38.1 */
+/* components.tsx generated by @compiled/babel-plugin v0.36.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/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 = "0.0.0-development";
+var packageVersion = "21.3.0";
 export var SelectWithoutAnalytics = createSelect(AsyncSelect);
 var createAndFireEventOnAtlaskit = createAndFireEvent('atlaskit');
 var Select = withAnalyticsContext({

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

@@ -1,4 +1,4 @@
-._16cu892t svg circle:first-of-type{stroke-linejoin:round}
+._16cu892t svg circle:first-of-type, ._1xci892t svg rect{stroke-linejoin:round}
 ._16jlkb7n{flex-grow:1}
 ._16qs1kw7{box-shadow:inherit}
 ._16qsn8hf{box-shadow:inset 2px 0 0 var(--ds-border-focused,#388bff)}
@@ -6,18 +6,14 @@
 ._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{stroke:var(--ds-border-input,#8590a2)}
-._1u9j1r31 svg circle:first-of-type{stroke:currentColor}
-._1xci892t svg rect{stroke-linejoin:round}
+._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}
 ._4cvr1h6o{align-items:center}
-._59qxe4h9 svg circle:first-of-type{stroke-width:var(--ds-border-width,1px)}
+._59qxe4h9 svg circle:first-of-type, ._8y3xe4h9 svg rect{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)}
@@ -29,4 +25,4 @@
 ._y4ti1b66{padding-inline-end:var(--ds-space-050,4px)}
 ._y4tiutpp{padding-inline-end:var(--ds-space-150,9pt)}
 ._1di61dty:active{background-color:var(--ds-background-neutral-subtle-pressed,#091e4224)}
-@media screen and (-ms-high-contrast:active){._112e1vrj{border-inline-start:2px solid transparent}}
+@media screen and (-ms-high-contrast:active){._112e5u6v{border-inline-start:var(--ds-border-width-selected,2px) solid transparent}}

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

@@ -1,4 +1,4 @@
-/* input-options.tsx generated by @compiled/babel-plugin v0.38.1 */
+/* input-options.tsx generated by @compiled/babel-plugin v0.36.1 */
 import _extends from "@babel/runtime/helpers/extends";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import "./input-options.compiled.css";
@@ -11,7 +11,7 @@ import PrimitiveSVGIcon from '@atlaskit/icon/svg';
 import { fg } from '@atlaskit/platform-feature-flags';
 var optionStyles = {
   default: "_1e0c1txw _4cvr1h6o _1bsb1osq _uiztglyw _18ql1j7p _vchhusvi _85i51b66 _1q511b66 _bozgpxbi _y4tiutpp _bfhk1j28 _16qs1kw7 _syaz1kw7 _1di61dty",
-  focused: "_bfhk166n _16qsn8hf _112e1vrj",
+  focused: "_bfhk166n _16qsn8hf _112e5u6v",
   disabled: "_syaz15gi"
 };
 

package/offerings.json

@@ -0,0 +1,38 @@
+[
+	{
+		"name": "Select",
+		"package": "@atlaskit/select",
+		"import": {
+			"name": "Select",
+			"package": "@atlaskit/select",
+			"type": "default"
+		},
+		"keywords": ["select", "dropdown", "form", "input", "options", "choice", "picker"],
+		"categories": ["form"],
+		"shortDescription": "A flexible select component for single and multi-selection.",
+		"status": "general-availability",
+		"accessibilityGuidelines": [
+			"Provide clear labels for all selects",
+			"Use appropriate placeholder text",
+			"Ensure keyboard navigation with arrow keys",
+			"Provide clear option descriptions",
+			"Support screen reader announcements"
+		],
+		"usageGuidelines": [
+			"Use for choosing from a list of options",
+			"Use multi-select for multiple choice scenarios",
+			"Enable search for long option lists",
+			"Provide clear placeholder text",
+			"Consider loading states for async data"
+		],
+		"contentGuidelines": [
+			"Write clear, descriptive option labels",
+			"Use consistent terminology across options",
+			"Keep option text concise but meaningful",
+			"Group related options logically"
+		],
+		"examples": [
+			"./examples/constellation/select-appearance-default.tsx"
+		]
+	}
+]

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/select",
-	"version": "21.3.0",
+	"version": "21.3.1",
 	"description": "Select allows users to make a single selection or multiple selections from a list of options.",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -62,7 +62,7 @@
 		"@atlaskit/checkbox": "^17.1.0",
 		"@atlaskit/docs": "^11.1.0",
 		"@atlaskit/drawer": "^11.0.0",
-		"@atlaskit/form": "^12.6.0",
+		"@atlaskit/form": "^12.7.0",
 		"@atlaskit/link": "^3.2.0",
 		"@atlaskit/logo": "^19.7.0",
 		"@atlaskit/modal-dialog": "^14.3.0",