@atlaskit/react-select 4.0.1 → 4.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,16 @@
1
1
  # @atlaskit/react-select
2
2
 
3
+ ## 4.0.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`61f82ad80594c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/61f82ad80594c) -
8
+ Removed OKLCH / `color-mix()` runtime colour transformations from the tag-like multi-value
9
+ rendering (behind the `platform-dst-lozenge-tag-badge-visual-uplifts` feature gate). The
10
+ decorative border colour now comes directly from the `color.border.accent.*.subtle` tokens
11
+ (introduced in `@atlaskit/tokens@13.2.0`) instead of being derived at runtime, matching the new
12
+ Tag component's border logic.
13
+
3
14
  ## 4.0.1
4
15
 
5
16
  ### Patch Changes
@@ -5,26 +5,24 @@
5
5
  ._189ee4h9{border-width:var(--ds-border-width,1px)}
6
6
  ._195gze3t{margin-inline:var(--ds-space-0,0)}
7
7
  ._1dqonqa1{border-style:solid}
8
- ._1h6dpryq{border-color:color-mix(in oklch,var(--tag-border-token) 100%,var(--cm-border-color) var(--cm-border-value))}
9
- ._1mouze3t{margin-block:var(--ds-space-0,0)}._119b16y8{--tag-border-token:var(--ds-border-accent-red,#e2483d)}
10
- ._119b1b2s{--tag-border-token:var(--ds-border-accent-orange,#e06c00)}
11
- ._119b1crs{--tag-border-token:var(--ds-border-accent-green,#22a06b)}
12
- ._119b1h3o{--tag-border-token:var(--ds-border-accent-teal,#2898bd)}
13
- ._119b1hqq{--tag-border-token:var(--ds-border-accent-purple,#af59e1)}
14
- ._119b1w55{--tag-border-token:var(--ds-border-accent-blue,#357de8)}
15
- ._119b8yml{--tag-border-token:var(--ds-border-accent-gray,#7d818a)}
16
- ._119bfeiv{--tag-border-token:var(--ds-border-accent-yellow,#b38600)}
17
- ._119bnf89{--tag-border-token:var(--ds-border-accent-lime,#6a9a23)}
18
- ._119buwd0{--tag-border-token:var(--ds-border-accent-magenta,#cd519d)}
8
+ ._1h6dip4g{border-color:var(--tag-border-token)}
9
+ ._1mouze3t{margin-block:var(--ds-space-0,0)}._119b131p{--tag-border-token:var(--ds-border-accent-teal-subtle,#9dd9ee)}
10
+ ._119b132u{--tag-border-token:var(--ds-border-accent-magenta-subtle,#f797d2)}
11
+ ._119b18hp{--tag-border-token:var(--ds-border-accent-blue-subtle,#8fb8f6)}
12
+ ._119b1ip5{--tag-border-token:var(--ds-border-accent-orange-subtle,#fbc828)}
13
+ ._119b1m7d{--tag-border-token:var(--ds-border-accent-lime-subtle,#b3df72)}
14
+ ._119b1s7j{--tag-border-token:var(--ds-border-accent-yellow-subtle,#eed12b)}
15
+ ._119b5d2u{--tag-border-token:var(--ds-border-accent-green-subtle,#7ee2b8)}
16
+ ._119bluwt{--tag-border-token:var(--ds-border-accent-purple-subtle,#d8a0f7)}
17
+ ._119bmsup{--tag-border-token:var(--ds-border-accent-gray-subtle,#b7b9be)}
18
+ ._119bn9dc{--tag-border-token:var(--ds-border-accent-red-subtle,#fd9891)}
19
19
  ._13lsf1ug>*{flex-basis:0%}
20
- ._13muu67f{--cm-border-color:#fff}
21
20
  ._16jlidpf{flex-grow:0}
22
21
  ._16jlkb7n{flex-grow:1}
23
22
  ._16qs1xv8{box-shadow:0 0 0 2px var(--ds-surface,#fff),0 0 0 4px var(--ds-border-focused,#4688ec)}
24
23
  ._18m915vq{overflow-y:hidden}
25
24
  ._1e0c116y{display:inline-flex}
26
25
  ._1e0c1txw{display:flex}
27
- ._1k671038{--border-l-factor:1.33}
28
26
  ._1o9zkb7n{flex-shrink:1}
29
27
  ._1ouwze3t>*{min-width:var(--ds-space-0,0)}
30
28
  ._1reo15vq{overflow-x:hidden}
@@ -42,7 +40,6 @@
42
40
  ._i0dl1wug{flex-basis:auto}
43
41
  ._i0dlf1ug{flex-basis:0%}
44
42
  ._kqswh2mm{position:relative}
45
- ._oe6mmko7{--cm-border-value:45%}
46
43
  ._p12ff6dh{max-width:11.25rem}
47
44
  ._syaz1gmx{color:var(--ds-text-disabled,#080f214a)}
48
45
  ._syaz6x5g{color:var(--ds-text-selected,#1868db)}
@@ -50,7 +47,4 @@
50
47
  ._v5ynkb7n>*{flex-shrink:1}
51
48
  ._vchhusvi{box-sizing:border-box}
52
49
  ._zdxokb7n>*{flex-grow:1}
53
- [data-color-mode=dark] ._hg5mr3uz{--cm-border-color:#000}
54
- [data-color-mode=dark] ._u8p61h4e{--border-l-factor:0.7}
55
- @media screen and (-ms-high-contrast:active){._1aewe4h9{border-width:var(--ds-border-width,1px)}._6up51j28{border-color:transparent}._1xdnnqa1{border-style:solid}._3yq3glyw{border:none}}
56
- @supports (color:oklch(from white l c h)){._1easrqqc{border-color:oklch(from var(--tag-border-token) calc(l * var(--border-l-factor)) c h)}}
50
+ @media screen and (-ms-high-contrast:active){._1aewe4h9{border-width:var(--ds-border-width,1px)}._6up51j28{border-color:transparent}._1xdnnqa1{border-style:solid}._3yq3glyw{border:none}}
@@ -28,19 +28,17 @@ var multiValueTagWrapperStyles = {
28
28
 
29
29
  // Tag-like color styles
30
30
  var tagLikeColorStyles = {
31
- gray: "_119b8yml",
32
- blue: "_119b1w55",
33
- green: "_119b1crs",
34
- red: "_119b16y8",
35
- yellow: "_119bfeiv",
36
- purple: "_119b1hqq",
37
- lime: "_119bnf89",
38
- magenta: "_119buwd0",
39
- orange: "_119b1b2s",
40
- teal: "_119b1h3o"
31
+ gray: "_119bmsup",
32
+ blue: "_119b18hp",
33
+ green: "_119b5d2u",
34
+ red: "_119bn9dc",
35
+ yellow: "_119b1s7j",
36
+ purple: "_119bluwt",
37
+ lime: "_119b1m7d",
38
+ magenta: "_119b132u",
39
+ orange: "_119b1ip5",
40
+ teal: "_119b131p"
41
41
  };
42
-
43
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-important-styles, @atlaskit/ui-styling-standard/no-unsafe-values -- match TagNew border color logic
44
42
  var tagLikeBorderFilterStyles = null;
45
43
 
46
44
  // Tag-like styles for custom content values (not plain text) when FF is on.
@@ -137,7 +135,7 @@ var MultiValue = function MultiValue(props) {
137
135
  style: containerCss
138
136
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/ui-styling-standard/local-cx-xcss, @compiled/local-cx-xcss
139
137
  ,
140
- className: (0, _runtime.ax)([multiValueTagLikeStyles.root, tagLikeColorStyles.gray, colorKey === 'blue' && tagLikeColorStyles.blue, colorKey === 'green' && tagLikeColorStyles.green, colorKey === 'red' && tagLikeColorStyles.red, colorKey === 'yellow' && tagLikeColorStyles.yellow, colorKey === 'purple' && tagLikeColorStyles.purple, colorKey === 'lime' && tagLikeColorStyles.lime, colorKey === 'magenta' && tagLikeColorStyles.magenta, colorKey === 'orange' && tagLikeColorStyles.orange, colorKey === 'teal' && tagLikeColorStyles.teal, "_1h6dpryq _1k671038 _13muu67f _oe6mmko7 _u8p61h4e _hg5mr3uz _1easrqqc", isDisabled && multiValueTagLikeStyles.disabled, isFocused && multiValueTagLikeStyles.focused, (0, _react2.cx)(props.className, containerClassName, props.xcss, '-multiValue')])
138
+ className: (0, _runtime.ax)([multiValueTagLikeStyles.root, tagLikeColorStyles.gray, colorKey === 'blue' && tagLikeColorStyles.blue, colorKey === 'green' && tagLikeColorStyles.green, colorKey === 'red' && tagLikeColorStyles.red, colorKey === 'yellow' && tagLikeColorStyles.yellow, colorKey === 'purple' && tagLikeColorStyles.purple, colorKey === 'lime' && tagLikeColorStyles.lime, colorKey === 'magenta' && tagLikeColorStyles.magenta, colorKey === 'orange' && tagLikeColorStyles.orange, colorKey === 'teal' && tagLikeColorStyles.teal, "_1h6dip4g", isDisabled && multiValueTagLikeStyles.disabled, isFocused && multiValueTagLikeStyles.focused, (0, _react2.cx)(props.className, containerClassName, props.xcss, '-multiValue')])
141
139
  }), /*#__PURE__*/React.createElement("div", {
142
140
  className: (0, _runtime.ax)([multiValueTagLikeStyles.labelWrapper])
143
141
  }, /*#__PURE__*/React.createElement(Label, {
@@ -5,26 +5,24 @@
5
5
  ._189ee4h9{border-width:var(--ds-border-width,1px)}
6
6
  ._195gze3t{margin-inline:var(--ds-space-0,0)}
7
7
  ._1dqonqa1{border-style:solid}
8
- ._1h6dpryq{border-color:color-mix(in oklch,var(--tag-border-token) 100%,var(--cm-border-color) var(--cm-border-value))}
9
- ._1mouze3t{margin-block:var(--ds-space-0,0)}._119b16y8{--tag-border-token:var(--ds-border-accent-red,#e2483d)}
10
- ._119b1b2s{--tag-border-token:var(--ds-border-accent-orange,#e06c00)}
11
- ._119b1crs{--tag-border-token:var(--ds-border-accent-green,#22a06b)}
12
- ._119b1h3o{--tag-border-token:var(--ds-border-accent-teal,#2898bd)}
13
- ._119b1hqq{--tag-border-token:var(--ds-border-accent-purple,#af59e1)}
14
- ._119b1w55{--tag-border-token:var(--ds-border-accent-blue,#357de8)}
15
- ._119b8yml{--tag-border-token:var(--ds-border-accent-gray,#7d818a)}
16
- ._119bfeiv{--tag-border-token:var(--ds-border-accent-yellow,#b38600)}
17
- ._119bnf89{--tag-border-token:var(--ds-border-accent-lime,#6a9a23)}
18
- ._119buwd0{--tag-border-token:var(--ds-border-accent-magenta,#cd519d)}
8
+ ._1h6dip4g{border-color:var(--tag-border-token)}
9
+ ._1mouze3t{margin-block:var(--ds-space-0,0)}._119b131p{--tag-border-token:var(--ds-border-accent-teal-subtle,#9dd9ee)}
10
+ ._119b132u{--tag-border-token:var(--ds-border-accent-magenta-subtle,#f797d2)}
11
+ ._119b18hp{--tag-border-token:var(--ds-border-accent-blue-subtle,#8fb8f6)}
12
+ ._119b1ip5{--tag-border-token:var(--ds-border-accent-orange-subtle,#fbc828)}
13
+ ._119b1m7d{--tag-border-token:var(--ds-border-accent-lime-subtle,#b3df72)}
14
+ ._119b1s7j{--tag-border-token:var(--ds-border-accent-yellow-subtle,#eed12b)}
15
+ ._119b5d2u{--tag-border-token:var(--ds-border-accent-green-subtle,#7ee2b8)}
16
+ ._119bluwt{--tag-border-token:var(--ds-border-accent-purple-subtle,#d8a0f7)}
17
+ ._119bmsup{--tag-border-token:var(--ds-border-accent-gray-subtle,#b7b9be)}
18
+ ._119bn9dc{--tag-border-token:var(--ds-border-accent-red-subtle,#fd9891)}
19
19
  ._13lsf1ug>*{flex-basis:0%}
20
- ._13muu67f{--cm-border-color:#fff}
21
20
  ._16jlidpf{flex-grow:0}
22
21
  ._16jlkb7n{flex-grow:1}
23
22
  ._16qs1xv8{box-shadow:0 0 0 2px var(--ds-surface,#fff),0 0 0 4px var(--ds-border-focused,#4688ec)}
24
23
  ._18m915vq{overflow-y:hidden}
25
24
  ._1e0c116y{display:inline-flex}
26
25
  ._1e0c1txw{display:flex}
27
- ._1k671038{--border-l-factor:1.33}
28
26
  ._1o9zkb7n{flex-shrink:1}
29
27
  ._1ouwze3t>*{min-width:var(--ds-space-0,0)}
30
28
  ._1reo15vq{overflow-x:hidden}
@@ -42,7 +40,6 @@
42
40
  ._i0dl1wug{flex-basis:auto}
43
41
  ._i0dlf1ug{flex-basis:0%}
44
42
  ._kqswh2mm{position:relative}
45
- ._oe6mmko7{--cm-border-value:45%}
46
43
  ._p12ff6dh{max-width:11.25rem}
47
44
  ._syaz1gmx{color:var(--ds-text-disabled,#080f214a)}
48
45
  ._syaz6x5g{color:var(--ds-text-selected,#1868db)}
@@ -50,7 +47,4 @@
50
47
  ._v5ynkb7n>*{flex-shrink:1}
51
48
  ._vchhusvi{box-sizing:border-box}
52
49
  ._zdxokb7n>*{flex-grow:1}
53
- [data-color-mode=dark] ._hg5mr3uz{--cm-border-color:#000}
54
- [data-color-mode=dark] ._u8p61h4e{--border-l-factor:0.7}
55
- @media screen and (-ms-high-contrast:active){._1aewe4h9{border-width:var(--ds-border-width,1px)}._6up51j28{border-color:transparent}._1xdnnqa1{border-style:solid}._3yq3glyw{border:none}}
56
- @supports (color:oklch(from white l c h)){._1easrqqc{border-color:oklch(from var(--tag-border-token) calc(l * var(--border-l-factor)) c h)}}
50
+ @media screen and (-ms-high-contrast:active){._1aewe4h9{border-width:var(--ds-border-width,1px)}._6up51j28{border-color:transparent}._1xdnnqa1{border-style:solid}._3yq3glyw{border:none}}
@@ -16,19 +16,17 @@ const multiValueTagWrapperStyles = {
16
16
 
17
17
  // Tag-like color styles
18
18
  const tagLikeColorStyles = {
19
- gray: "_119b8yml",
20
- blue: "_119b1w55",
21
- green: "_119b1crs",
22
- red: "_119b16y8",
23
- yellow: "_119bfeiv",
24
- purple: "_119b1hqq",
25
- lime: "_119bnf89",
26
- magenta: "_119buwd0",
27
- orange: "_119b1b2s",
28
- teal: "_119b1h3o"
19
+ gray: "_119bmsup",
20
+ blue: "_119b18hp",
21
+ green: "_119b5d2u",
22
+ red: "_119bn9dc",
23
+ yellow: "_119b1s7j",
24
+ purple: "_119bluwt",
25
+ lime: "_119b1m7d",
26
+ magenta: "_119b132u",
27
+ orange: "_119b1ip5",
28
+ teal: "_119b131p"
29
29
  };
30
-
31
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-important-styles, @atlaskit/ui-styling-standard/no-unsafe-values -- match TagNew border color logic
32
30
  const tagLikeBorderFilterStyles = null;
33
31
 
34
32
  // Tag-like styles for custom content values (not plain text) when FF is on.
@@ -133,7 +131,7 @@ const MultiValue = props => {
133
131
  style: containerCss
134
132
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/ui-styling-standard/local-cx-xcss, @compiled/local-cx-xcss
135
133
  ,
136
- className: ax([multiValueTagLikeStyles.root, tagLikeColorStyles.gray, colorKey === 'blue' && tagLikeColorStyles.blue, colorKey === 'green' && tagLikeColorStyles.green, colorKey === 'red' && tagLikeColorStyles.red, colorKey === 'yellow' && tagLikeColorStyles.yellow, colorKey === 'purple' && tagLikeColorStyles.purple, colorKey === 'lime' && tagLikeColorStyles.lime, colorKey === 'magenta' && tagLikeColorStyles.magenta, colorKey === 'orange' && tagLikeColorStyles.orange, colorKey === 'teal' && tagLikeColorStyles.teal, "_1h6dpryq _1k671038 _13muu67f _oe6mmko7 _u8p61h4e _hg5mr3uz _1easrqqc", isDisabled && multiValueTagLikeStyles.disabled, isFocused && multiValueTagLikeStyles.focused, cx(props.className, containerClassName, props.xcss, '-multiValue')])
134
+ className: ax([multiValueTagLikeStyles.root, tagLikeColorStyles.gray, colorKey === 'blue' && tagLikeColorStyles.blue, colorKey === 'green' && tagLikeColorStyles.green, colorKey === 'red' && tagLikeColorStyles.red, colorKey === 'yellow' && tagLikeColorStyles.yellow, colorKey === 'purple' && tagLikeColorStyles.purple, colorKey === 'lime' && tagLikeColorStyles.lime, colorKey === 'magenta' && tagLikeColorStyles.magenta, colorKey === 'orange' && tagLikeColorStyles.orange, colorKey === 'teal' && tagLikeColorStyles.teal, "_1h6dip4g", isDisabled && multiValueTagLikeStyles.disabled, isFocused && multiValueTagLikeStyles.focused, cx(props.className, containerClassName, props.xcss, '-multiValue')])
137
135
  }), /*#__PURE__*/React.createElement("div", {
138
136
  className: ax([multiValueTagLikeStyles.labelWrapper])
139
137
  }, /*#__PURE__*/React.createElement(Label, {
@@ -5,26 +5,24 @@
5
5
  ._189ee4h9{border-width:var(--ds-border-width,1px)}
6
6
  ._195gze3t{margin-inline:var(--ds-space-0,0)}
7
7
  ._1dqonqa1{border-style:solid}
8
- ._1h6dpryq{border-color:color-mix(in oklch,var(--tag-border-token) 100%,var(--cm-border-color) var(--cm-border-value))}
9
- ._1mouze3t{margin-block:var(--ds-space-0,0)}._119b16y8{--tag-border-token:var(--ds-border-accent-red,#e2483d)}
10
- ._119b1b2s{--tag-border-token:var(--ds-border-accent-orange,#e06c00)}
11
- ._119b1crs{--tag-border-token:var(--ds-border-accent-green,#22a06b)}
12
- ._119b1h3o{--tag-border-token:var(--ds-border-accent-teal,#2898bd)}
13
- ._119b1hqq{--tag-border-token:var(--ds-border-accent-purple,#af59e1)}
14
- ._119b1w55{--tag-border-token:var(--ds-border-accent-blue,#357de8)}
15
- ._119b8yml{--tag-border-token:var(--ds-border-accent-gray,#7d818a)}
16
- ._119bfeiv{--tag-border-token:var(--ds-border-accent-yellow,#b38600)}
17
- ._119bnf89{--tag-border-token:var(--ds-border-accent-lime,#6a9a23)}
18
- ._119buwd0{--tag-border-token:var(--ds-border-accent-magenta,#cd519d)}
8
+ ._1h6dip4g{border-color:var(--tag-border-token)}
9
+ ._1mouze3t{margin-block:var(--ds-space-0,0)}._119b131p{--tag-border-token:var(--ds-border-accent-teal-subtle,#9dd9ee)}
10
+ ._119b132u{--tag-border-token:var(--ds-border-accent-magenta-subtle,#f797d2)}
11
+ ._119b18hp{--tag-border-token:var(--ds-border-accent-blue-subtle,#8fb8f6)}
12
+ ._119b1ip5{--tag-border-token:var(--ds-border-accent-orange-subtle,#fbc828)}
13
+ ._119b1m7d{--tag-border-token:var(--ds-border-accent-lime-subtle,#b3df72)}
14
+ ._119b1s7j{--tag-border-token:var(--ds-border-accent-yellow-subtle,#eed12b)}
15
+ ._119b5d2u{--tag-border-token:var(--ds-border-accent-green-subtle,#7ee2b8)}
16
+ ._119bluwt{--tag-border-token:var(--ds-border-accent-purple-subtle,#d8a0f7)}
17
+ ._119bmsup{--tag-border-token:var(--ds-border-accent-gray-subtle,#b7b9be)}
18
+ ._119bn9dc{--tag-border-token:var(--ds-border-accent-red-subtle,#fd9891)}
19
19
  ._13lsf1ug>*{flex-basis:0%}
20
- ._13muu67f{--cm-border-color:#fff}
21
20
  ._16jlidpf{flex-grow:0}
22
21
  ._16jlkb7n{flex-grow:1}
23
22
  ._16qs1xv8{box-shadow:0 0 0 2px var(--ds-surface,#fff),0 0 0 4px var(--ds-border-focused,#4688ec)}
24
23
  ._18m915vq{overflow-y:hidden}
25
24
  ._1e0c116y{display:inline-flex}
26
25
  ._1e0c1txw{display:flex}
27
- ._1k671038{--border-l-factor:1.33}
28
26
  ._1o9zkb7n{flex-shrink:1}
29
27
  ._1ouwze3t>*{min-width:var(--ds-space-0,0)}
30
28
  ._1reo15vq{overflow-x:hidden}
@@ -42,7 +40,6 @@
42
40
  ._i0dl1wug{flex-basis:auto}
43
41
  ._i0dlf1ug{flex-basis:0%}
44
42
  ._kqswh2mm{position:relative}
45
- ._oe6mmko7{--cm-border-value:45%}
46
43
  ._p12ff6dh{max-width:11.25rem}
47
44
  ._syaz1gmx{color:var(--ds-text-disabled,#080f214a)}
48
45
  ._syaz6x5g{color:var(--ds-text-selected,#1868db)}
@@ -50,7 +47,4 @@
50
47
  ._v5ynkb7n>*{flex-shrink:1}
51
48
  ._vchhusvi{box-sizing:border-box}
52
49
  ._zdxokb7n>*{flex-grow:1}
53
- [data-color-mode=dark] ._hg5mr3uz{--cm-border-color:#000}
54
- [data-color-mode=dark] ._u8p61h4e{--border-l-factor:0.7}
55
- @media screen and (-ms-high-contrast:active){._1aewe4h9{border-width:var(--ds-border-width,1px)}._6up51j28{border-color:transparent}._1xdnnqa1{border-style:solid}._3yq3glyw{border:none}}
56
- @supports (color:oklch(from white l c h)){._1easrqqc{border-color:oklch(from var(--tag-border-token) calc(l * var(--border-l-factor)) c h)}}
50
+ @media screen and (-ms-high-contrast:active){._1aewe4h9{border-width:var(--ds-border-width,1px)}._6up51j28{border-color:transparent}._1xdnnqa1{border-style:solid}._3yq3glyw{border:none}}
@@ -19,19 +19,17 @@ var multiValueTagWrapperStyles = {
19
19
 
20
20
  // Tag-like color styles
21
21
  var tagLikeColorStyles = {
22
- gray: "_119b8yml",
23
- blue: "_119b1w55",
24
- green: "_119b1crs",
25
- red: "_119b16y8",
26
- yellow: "_119bfeiv",
27
- purple: "_119b1hqq",
28
- lime: "_119bnf89",
29
- magenta: "_119buwd0",
30
- orange: "_119b1b2s",
31
- teal: "_119b1h3o"
22
+ gray: "_119bmsup",
23
+ blue: "_119b18hp",
24
+ green: "_119b5d2u",
25
+ red: "_119bn9dc",
26
+ yellow: "_119b1s7j",
27
+ purple: "_119bluwt",
28
+ lime: "_119b1m7d",
29
+ magenta: "_119b132u",
30
+ orange: "_119b1ip5",
31
+ teal: "_119b131p"
32
32
  };
33
-
34
- // eslint-disable-next-line @atlaskit/ui-styling-standard/no-nested-selectors, @atlaskit/ui-styling-standard/no-unsafe-selectors, @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/no-nested-styles, @atlaskit/ui-styling-standard/no-important-styles, @atlaskit/ui-styling-standard/no-unsafe-values -- match TagNew border color logic
35
33
  var tagLikeBorderFilterStyles = null;
36
34
 
37
35
  // Tag-like styles for custom content values (not plain text) when FF is on.
@@ -128,7 +126,7 @@ var MultiValue = function MultiValue(props) {
128
126
  style: containerCss
129
127
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop, @atlaskit/ui-styling-standard/local-cx-xcss, @compiled/local-cx-xcss
130
128
  ,
131
- className: ax([multiValueTagLikeStyles.root, tagLikeColorStyles.gray, colorKey === 'blue' && tagLikeColorStyles.blue, colorKey === 'green' && tagLikeColorStyles.green, colorKey === 'red' && tagLikeColorStyles.red, colorKey === 'yellow' && tagLikeColorStyles.yellow, colorKey === 'purple' && tagLikeColorStyles.purple, colorKey === 'lime' && tagLikeColorStyles.lime, colorKey === 'magenta' && tagLikeColorStyles.magenta, colorKey === 'orange' && tagLikeColorStyles.orange, colorKey === 'teal' && tagLikeColorStyles.teal, "_1h6dpryq _1k671038 _13muu67f _oe6mmko7 _u8p61h4e _hg5mr3uz _1easrqqc", isDisabled && multiValueTagLikeStyles.disabled, isFocused && multiValueTagLikeStyles.focused, cx(props.className, containerClassName, props.xcss, '-multiValue')])
129
+ className: ax([multiValueTagLikeStyles.root, tagLikeColorStyles.gray, colorKey === 'blue' && tagLikeColorStyles.blue, colorKey === 'green' && tagLikeColorStyles.green, colorKey === 'red' && tagLikeColorStyles.red, colorKey === 'yellow' && tagLikeColorStyles.yellow, colorKey === 'purple' && tagLikeColorStyles.purple, colorKey === 'lime' && tagLikeColorStyles.lime, colorKey === 'magenta' && tagLikeColorStyles.magenta, colorKey === 'orange' && tagLikeColorStyles.orange, colorKey === 'teal' && tagLikeColorStyles.teal, "_1h6dip4g", isDisabled && multiValueTagLikeStyles.disabled, isFocused && multiValueTagLikeStyles.focused, cx(props.className, containerClassName, props.xcss, '-multiValue')])
132
130
  }), /*#__PURE__*/React.createElement("div", {
133
131
  className: ax([multiValueTagLikeStyles.labelWrapper])
134
132
  }, /*#__PURE__*/React.createElement(Label, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/react-select",
3
- "version": "4.0.1",
3
+ "version": "4.0.2",
4
4
  "description": "A forked version of react-select to only be used in atlaskit/select",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",