baseui 12.1.0 → 12.1.1

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.
Files changed (27) hide show
  1. package/breadcrumbs/styled-components.js +2 -1
  2. package/es/breadcrumbs/styled-components.js +2 -1
  3. package/es/input/base-input.js +8 -12
  4. package/es/input/input.js +9 -13
  5. package/es/popover/stateful-container.js +4 -1
  6. package/es/textarea/textarea.js +9 -13
  7. package/es/themes/dark-theme/color-component-tokens.js +1 -1
  8. package/es/themes/light-theme/color-component-tokens.js +1 -1
  9. package/esm/breadcrumbs/styled-components.js +2 -1
  10. package/esm/input/base-input.js +8 -12
  11. package/esm/input/input.js +9 -13
  12. package/esm/popover/stateful-container.js +4 -1
  13. package/esm/textarea/textarea.js +9 -13
  14. package/esm/themes/dark-theme/color-component-tokens.js +1 -1
  15. package/esm/themes/light-theme/color-component-tokens.js +1 -1
  16. package/input/base-input.js +8 -12
  17. package/input/base-input.js.flow +4 -8
  18. package/input/input.js +9 -13
  19. package/input/input.js.flow +5 -9
  20. package/package.json +1 -1
  21. package/popover/stateful-container.js +5 -1
  22. package/textarea/textarea.js +9 -13
  23. package/textarea/textarea.js.flow +5 -9
  24. package/themes/dark-theme/color-component-tokens.js +1 -1
  25. package/themes/dark-theme/color-component-tokens.js.flow +1 -1
  26. package/themes/light-theme/color-component-tokens.js +1 -1
  27. package/themes/light-theme/color-component-tokens.js.flow +1 -1
package/breadcrumbs/styled-components.js CHANGED
@@ -45,7 +45,8 @@ StyledListItem.displayName = 'StyledListItem';
45
45
  var StyledSeparator = (0, _styles.styled)('div', function (_ref4) {
46
46
  var $theme = _ref4.$theme;
47
47
  return {
48
- display: 'inline-block',
48
+ display: 'inline-flex',
49
+ alignItems: 'center',
49
50
  color: $theme.colors.breadcrumbsSeparatorFill,
50
51
  marginLeft: $theme.sizing.scale300,
51
52
  marginRight: $theme.sizing.scale300,
package/es/breadcrumbs/styled-components.js CHANGED
@@ -41,7 +41,8 @@ export const StyledSeparator = styled('div', ({
41
41
  $theme
42
42
  }) => {
43
43
  return {
44
- display: 'inline-block',
44
+ display: 'inline-flex',
45
+ alignItems: 'center',
45
46
  color: $theme.colors.breadcrumbsSeparatorFill,
46
47
  marginLeft: $theme.sizing.scale300,
47
48
  marginRight: $theme.sizing.scale300,
package/es/input/base-input.js CHANGED
@@ -52,21 +52,17 @@ class BaseInput extends React.Component {
52
52
  });
53
53
 
54
54
  _defineProperty(this, "onFocus", e => {
55
- if (!this.props.readOnly) {
56
- this.setState({
57
- isFocused: true
58
- });
59
- this.props.onFocus(e);
60
- }
55
+ this.setState({
56
+ isFocused: true
57
+ });
58
+ this.props.onFocus(e);
61
59
  });
62
60
 
63
61
  _defineProperty(this, "onBlur", e => {
64
- if (!this.props.readOnly) {
65
- this.setState({
66
- isFocused: false
67
- });
68
- this.props.onBlur(e);
69
- }
62
+ this.setState({
63
+ isFocused: false
64
+ });
65
+ this.props.onBlur(e);
70
66
  });
71
67
 
72
68
  _defineProperty(this, "handleFocusForMaskToggle", event => {
package/es/input/input.js CHANGED
@@ -20,25 +20,21 @@ class Input extends React.Component {
20
20
  super(...args);
21
21
 
22
22
  _defineProperty(this, "state", {
23
- isFocused: this.props.autoFocus && !this.props.readOnly || false
23
+ isFocused: this.props.autoFocus || false
24
24
  });
25
25
 
26
26
  _defineProperty(this, "onFocus", e => {
27
- if (!this.props.readOnly) {
28
- this.setState({
29
- isFocused: true
30
- });
31
- this.props.onFocus(e);
32
- }
27
+ this.setState({
28
+ isFocused: true
29
+ });
30
+ this.props.onFocus(e);
33
31
  });
34
32
 
35
33
  _defineProperty(this, "onBlur", e => {
36
- if (!this.props.readOnly) {
37
- this.setState({
38
- isFocused: false
39
- });
40
- this.props.onBlur(e);
41
- }
34
+ this.setState({
35
+ isFocused: false
36
+ });
37
+ this.props.onBlur(e);
42
38
  });
43
39
  }
44
40
 
package/es/popover/stateful-container.js CHANGED
@@ -8,6 +8,7 @@ LICENSE file in the root directory of this source tree.
8
8
  */
9
9
  import * as React from 'react';
10
10
  import { ACCESSIBILITY_TYPE, PLACEMENT, STATE_CHANGE_TYPE, TRIGGER_TYPE, POPOVER_MARGIN } from './constants';
11
+ import { isFocusVisible } from '../utils/focusVisible';
11
12
 
12
13
  const defaultStateReducer = (type, nextState) => nextState;
13
14
 
@@ -57,7 +58,9 @@ class StatefulContainer extends React.Component {
57
58
  this.props.onFocus(e);
58
59
  }
59
60
 
60
- this.open();
61
+ if (isFocusVisible(e)) {
62
+ this.open();
63
+ }
61
64
  });
62
65
 
63
66
  _defineProperty(this, "onMouseEnter", e => {
package/es/textarea/textarea.js CHANGED
@@ -18,25 +18,21 @@ class Textarea extends React.Component {
18
18
  super(...args);
19
19
 
20
20
  _defineProperty(this, "state", {
21
- isFocused: this.props.autoFocus && !this.props.readOnly || false
21
+ isFocused: this.props.autoFocus || false
22
22
  });
23
23
 
24
24
  _defineProperty(this, "onFocus", e => {
25
- if (!this.props.readOnly) {
26
- this.setState({
27
- isFocused: true
28
- });
29
- this.props.onFocus(e);
30
- }
25
+ this.setState({
26
+ isFocused: true
27
+ });
28
+ this.props.onFocus(e);
31
29
  });
32
30
 
33
31
  _defineProperty(this, "onBlur", e => {
34
- if (!this.props.readOnly) {
35
- this.setState({
36
- isFocused: false
37
- });
38
- this.props.onBlur(e);
39
- }
32
+ this.setState({
33
+ isFocused: false
34
+ });
35
+ this.props.onBlur(e);
40
36
  });
41
37
  }
42
38
 
package/es/themes/dark-theme/color-component-tokens.js CHANGED
@@ -55,7 +55,7 @@ export default ((themePrimitives = colorTokens) => ({
55
55
  buttonDisabledSpinnerForeground: themePrimitives.mono200,
56
56
  buttonDisabledSpinnerBackground: themePrimitives.mono400,
57
57
  // Breadcrumbs
58
- breadcrumbsText: themePrimitives.mono100,
58
+ breadcrumbsText: themePrimitives.white,
59
59
  breadcrumbsSeparatorFill: themePrimitives.mono200,
60
60
  // Datepicker
61
61
  calendarBackground: themePrimitives.mono800,
package/es/themes/light-theme/color-component-tokens.js CHANGED
@@ -55,7 +55,7 @@ export default ((themePrimitives = colorTokens) => ({
55
55
  buttonDisabledSpinnerForeground: themePrimitives.mono600,
56
56
  buttonDisabledSpinnerBackground: themePrimitives.mono400,
57
57
  // Breadcrumbs
58
- breadcrumbsText: themePrimitives.mono900,
58
+ breadcrumbsText: themePrimitives.black,
59
59
  breadcrumbsSeparatorFill: themePrimitives.mono700,
60
60
  // Datepicker
61
61
  calendarBackground: themePrimitives.mono100,
package/esm/breadcrumbs/styled-components.js CHANGED
@@ -40,7 +40,8 @@ StyledListItem.displayName = 'StyledListItem';
40
40
  export var StyledSeparator = styled('div', function (_ref4) {
41
41
  var $theme = _ref4.$theme;
42
42
  return {
43
- display: 'inline-block',
43
+ display: 'inline-flex',
44
+ alignItems: 'center',
44
45
  color: $theme.colors.breadcrumbsSeparatorFill,
45
46
  marginLeft: $theme.sizing.scale300,
46
47
  marginRight: $theme.sizing.scale300,
package/esm/input/base-input.js CHANGED
@@ -101,23 +101,19 @@ var BaseInput = /*#__PURE__*/function (_React$Component) {
101
101
  });
102
102
 
103
103
  _defineProperty(_assertThisInitialized(_this), "onFocus", function (e) {
104
- if (!_this.props.readOnly) {
105
- _this.setState({
106
- isFocused: true
107
- });
104
+ _this.setState({
105
+ isFocused: true
106
+ });
108
107
 
109
- _this.props.onFocus(e);
110
- }
108
+ _this.props.onFocus(e);
111
109
  });
112
110
 
113
111
  _defineProperty(_assertThisInitialized(_this), "onBlur", function (e) {
114
- if (!_this.props.readOnly) {
115
- _this.setState({
116
- isFocused: false
117
- });
112
+ _this.setState({
113
+ isFocused: false
114
+ });
118
115
 
119
- _this.props.onBlur(e);
120
- }
116
+ _this.props.onBlur(e);
121
117
  });
122
118
 
123
119
  _defineProperty(_assertThisInitialized(_this), "handleFocusForMaskToggle", function (event) {
package/esm/input/input.js CHANGED
@@ -73,27 +73,23 @@ var Input = /*#__PURE__*/function (_React$Component) {
73
73
  _this = _super.call.apply(_super, [this].concat(args));
74
74
 
75
75
  _defineProperty(_assertThisInitialized(_this), "state", {
76
- isFocused: _this.props.autoFocus && !_this.props.readOnly || false
76
+ isFocused: _this.props.autoFocus || false
77
77
  });
78
78
 
79
79
  _defineProperty(_assertThisInitialized(_this), "onFocus", function (e) {
80
- if (!_this.props.readOnly) {
81
- _this.setState({
82
- isFocused: true
83
- });
80
+ _this.setState({
81
+ isFocused: true
82
+ });
84
83
 
85
- _this.props.onFocus(e);
86
- }
84
+ _this.props.onFocus(e);
87
85
  });
88
86
 
89
87
  _defineProperty(_assertThisInitialized(_this), "onBlur", function (e) {
90
- if (!_this.props.readOnly) {
91
- _this.setState({
92
- isFocused: false
93
- });
88
+ _this.setState({
89
+ isFocused: false
90
+ });
94
91
 
95
- _this.props.onBlur(e);
96
- }
92
+ _this.props.onBlur(e);
97
93
  });
98
94
 
99
95
  return _this;
package/esm/popover/stateful-container.js CHANGED
@@ -34,6 +34,7 @@ LICENSE file in the root directory of this source tree.
34
34
  */
35
35
  import * as React from 'react';
36
36
  import { ACCESSIBILITY_TYPE, PLACEMENT, STATE_CHANGE_TYPE, TRIGGER_TYPE, POPOVER_MARGIN } from './constants';
37
+ import { isFocusVisible } from '../utils/focusVisible';
37
38
 
38
39
  var defaultStateReducer = function defaultStateReducer(type, nextState) {
39
40
  return nextState;
@@ -96,7 +97,9 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
96
97
  _this.props.onFocus(e);
97
98
  }
98
99
 
99
- _this.open();
100
+ if (isFocusVisible(e)) {
101
+ _this.open();
102
+ }
100
103
  });
101
104
 
102
105
  _defineProperty(_assertThisInitialized(_this), "onMouseEnter", function (e) {
package/esm/textarea/textarea.js CHANGED
@@ -64,27 +64,23 @@ var Textarea = /*#__PURE__*/function (_React$Component) {
64
64
  _this = _super.call.apply(_super, [this].concat(args));
65
65
 
66
66
  _defineProperty(_assertThisInitialized(_this), "state", {
67
- isFocused: _this.props.autoFocus && !_this.props.readOnly || false
67
+ isFocused: _this.props.autoFocus || false
68
68
  });
69
69
 
70
70
  _defineProperty(_assertThisInitialized(_this), "onFocus", function (e) {
71
- if (!_this.props.readOnly) {
72
- _this.setState({
73
- isFocused: true
74
- });
71
+ _this.setState({
72
+ isFocused: true
73
+ });
75
74
 
76
- _this.props.onFocus(e);
77
- }
75
+ _this.props.onFocus(e);
78
76
  });
79
77
 
80
78
  _defineProperty(_assertThisInitialized(_this), "onBlur", function (e) {
81
- if (!_this.props.readOnly) {
82
- _this.setState({
83
- isFocused: false
84
- });
79
+ _this.setState({
80
+ isFocused: false
81
+ });
85
82
 
86
- _this.props.onBlur(e);
87
- }
83
+ _this.props.onBlur(e);
88
84
  });
89
85
 
90
86
  return _this;
package/esm/themes/dark-theme/color-component-tokens.js CHANGED
@@ -57,7 +57,7 @@ export default (function () {
57
57
  buttonDisabledSpinnerForeground: themePrimitives.mono200,
58
58
  buttonDisabledSpinnerBackground: themePrimitives.mono400,
59
59
  // Breadcrumbs
60
- breadcrumbsText: themePrimitives.mono100,
60
+ breadcrumbsText: themePrimitives.white,
61
61
  breadcrumbsSeparatorFill: themePrimitives.mono200,
62
62
  // Datepicker
63
63
  calendarBackground: themePrimitives.mono800,
package/esm/themes/light-theme/color-component-tokens.js CHANGED
@@ -57,7 +57,7 @@ export default (function () {
57
57
  buttonDisabledSpinnerForeground: themePrimitives.mono600,
58
58
  buttonDisabledSpinnerBackground: themePrimitives.mono400,
59
59
  // Breadcrumbs
60
- breadcrumbsText: themePrimitives.mono900,
60
+ breadcrumbsText: themePrimitives.black,
61
61
  breadcrumbsSeparatorFill: themePrimitives.mono700,
62
62
  // Datepicker
63
63
  calendarBackground: themePrimitives.mono100,
package/input/base-input.js CHANGED
@@ -113,23 +113,19 @@ var BaseInput = /*#__PURE__*/function (_React$Component) {
113
113
  });
114
114
 
115
115
  _defineProperty(_assertThisInitialized(_this), "onFocus", function (e) {
116
- if (!_this.props.readOnly) {
117
- _this.setState({
118
- isFocused: true
119
- });
116
+ _this.setState({
117
+ isFocused: true
118
+ });
120
119
 
121
- _this.props.onFocus(e);
122
- }
120
+ _this.props.onFocus(e);
123
121
  });
124
122
 
125
123
  _defineProperty(_assertThisInitialized(_this), "onBlur", function (e) {
126
- if (!_this.props.readOnly) {
127
- _this.setState({
128
- isFocused: false
129
- });
124
+ _this.setState({
125
+ isFocused: false
126
+ });
130
127
 
131
- _this.props.onBlur(e);
132
- }
128
+ _this.props.onBlur(e);
133
129
  });
134
130
 
135
131
  _defineProperty(_assertThisInitialized(_this), "handleFocusForMaskToggle", function (event) {
package/input/base-input.js.flow CHANGED
@@ -137,17 +137,13 @@ class BaseInput<T: HTMLInputElement | HTMLTextAreaElement> extends React.Compone
137
137
  };
138
138
 
139
139
  onFocus = (e: SyntheticFocusEvent<T>) => {
140
- if (!this.props.readOnly) {
141
- this.setState({ isFocused: true });
142
- this.props.onFocus(e);
143
- }
140
+ this.setState({ isFocused: true });
141
+ this.props.onFocus(e);
144
142
  };
145
143
 
146
144
  onBlur = (e: SyntheticFocusEvent<T>) => {
147
- if (!this.props.readOnly) {
148
- this.setState({ isFocused: false });
149
- this.props.onBlur(e);
150
- }
145
+ this.setState({ isFocused: false });
146
+ this.props.onBlur(e);
151
147
  };
152
148
 
153
149
  getInputType() {
package/input/input.js CHANGED
@@ -93,27 +93,23 @@ var Input = /*#__PURE__*/function (_React$Component) {
93
93
  _this = _super.call.apply(_super, [this].concat(args));
94
94
 
95
95
  _defineProperty(_assertThisInitialized(_this), "state", {
96
- isFocused: _this.props.autoFocus && !_this.props.readOnly || false
96
+ isFocused: _this.props.autoFocus || false
97
97
  });
98
98
 
99
99
  _defineProperty(_assertThisInitialized(_this), "onFocus", function (e) {
100
- if (!_this.props.readOnly) {
101
- _this.setState({
102
- isFocused: true
103
- });
100
+ _this.setState({
101
+ isFocused: true
102
+ });
104
103
 
105
- _this.props.onFocus(e);
106
- }
104
+ _this.props.onFocus(e);
107
105
  });
108
106
 
109
107
  _defineProperty(_assertThisInitialized(_this), "onBlur", function (e) {
110
- if (!_this.props.readOnly) {
111
- _this.setState({
112
- isFocused: false
113
- });
108
+ _this.setState({
109
+ isFocused: false
110
+ });
114
111
 
115
- _this.props.onBlur(e);
116
- }
112
+ _this.props.onBlur(e);
117
113
  });
118
114
 
119
115
  return _this;
package/input/input.js.flow CHANGED
@@ -36,21 +36,17 @@ class Input extends React.Component<InputPropsT, InternalStateT> {
36
36
  * customers shouldn't have to manage themselves, such as input's focus state.
37
37
  */
38
38
  state = {
39
- isFocused: (this.props.autoFocus && !this.props.readOnly) || false,
39
+ isFocused: this.props.autoFocus || false,
40
40
  };
41
41
 
42
42
  onFocus = (e: SyntheticFocusEvent<HTMLInputElement>) => {
43
- if (!this.props.readOnly) {
44
- this.setState({ isFocused: true });
45
- this.props.onFocus(e);
46
- }
43
+ this.setState({ isFocused: true });
44
+ this.props.onFocus(e);
47
45
  };
48
46
 
49
47
  onBlur = (e: SyntheticFocusEvent<HTMLInputElement>) => {
50
- if (!this.props.readOnly) {
51
- this.setState({ isFocused: false });
52
- this.props.onBlur(e);
53
- }
48
+ this.setState({ isFocused: false });
49
+ this.props.onBlur(e);
54
50
  };
55
51
 
56
52
  render() {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "baseui",
3
- "version": "12.1.0",
3
+ "version": "12.1.1",
4
4
  "description": "A React Component library implementing the Base design language",
5
5
  "keywords": [
6
6
  "react",
package/popover/stateful-container.js CHANGED
@@ -11,6 +11,8 @@ var React = _interopRequireWildcard(require("react"));
11
11
 
12
12
  var _constants = require("./constants");
13
13
 
14
+ var _focusVisible = require("../utils/focusVisible");
15
+
14
16
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
15
17
 
16
18
  function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -102,7 +104,9 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
102
104
  _this.props.onFocus(e);
103
105
  }
104
106
 
105
- _this.open();
107
+ if ((0, _focusVisible.isFocusVisible)(e)) {
108
+ _this.open();
109
+ }
106
110
  });
107
111
 
108
112
  _defineProperty(_assertThisInitialized(_this), "onMouseEnter", function (e) {
package/textarea/textarea.js CHANGED
@@ -72,27 +72,23 @@ var Textarea = /*#__PURE__*/function (_React$Component) {
72
72
  _this = _super.call.apply(_super, [this].concat(args));
73
73
 
74
74
  _defineProperty(_assertThisInitialized(_this), "state", {
75
- isFocused: _this.props.autoFocus && !_this.props.readOnly || false
75
+ isFocused: _this.props.autoFocus || false
76
76
  });
77
77
 
78
78
  _defineProperty(_assertThisInitialized(_this), "onFocus", function (e) {
79
- if (!_this.props.readOnly) {
80
- _this.setState({
81
- isFocused: true
82
- });
79
+ _this.setState({
80
+ isFocused: true
81
+ });
83
82
 
84
- _this.props.onFocus(e);
85
- }
83
+ _this.props.onFocus(e);
86
84
  });
87
85
 
88
86
  _defineProperty(_assertThisInitialized(_this), "onBlur", function (e) {
89
- if (!_this.props.readOnly) {
90
- _this.setState({
91
- isFocused: false
92
- });
87
+ _this.setState({
88
+ isFocused: false
89
+ });
93
90
 
94
- _this.props.onBlur(e);
95
- }
91
+ _this.props.onBlur(e);
96
92
  });
97
93
 
98
94
  return _this;
package/textarea/textarea.js.flow CHANGED
@@ -36,21 +36,17 @@ class Textarea extends React.Component<TextareaPropsT, { isFocused: boolean }> {
36
36
  };
37
37
 
38
38
  state = {
39
- isFocused: (this.props.autoFocus && !this.props.readOnly) || false,
39
+ isFocused: this.props.autoFocus || false,
40
40
  };
41
41
 
42
42
  onFocus = (e: SyntheticFocusEvent<HTMLTextAreaElement>) => {
43
- if (!this.props.readOnly) {
44
- this.setState({ isFocused: true });
45
- this.props.onFocus(e);
46
- }
43
+ this.setState({ isFocused: true });
44
+ this.props.onFocus(e);
47
45
  };
48
46
 
49
47
  onBlur = (e: SyntheticFocusEvent<HTMLTextAreaElement>) => {
50
- if (!this.props.readOnly) {
51
- this.setState({ isFocused: false });
52
- this.props.onBlur(e);
53
- }
48
+ this.setState({ isFocused: false });
49
+ this.props.onBlur(e);
54
50
  };
55
51
 
56
52
  render() {
package/themes/dark-theme/color-component-tokens.js CHANGED
@@ -67,7 +67,7 @@ var _default = function _default() {
67
67
  buttonDisabledSpinnerForeground: themePrimitives.mono200,
68
68
  buttonDisabledSpinnerBackground: themePrimitives.mono400,
69
69
  // Breadcrumbs
70
- breadcrumbsText: themePrimitives.mono100,
70
+ breadcrumbsText: themePrimitives.white,
71
71
  breadcrumbsSeparatorFill: themePrimitives.mono200,
72
72
  // Datepicker
73
73
  calendarBackground: themePrimitives.mono800,
package/themes/dark-theme/color-component-tokens.js.flow CHANGED
@@ -63,7 +63,7 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
63
63
  buttonDisabledSpinnerBackground: themePrimitives.mono400,
64
64
 
65
65
  // Breadcrumbs
66
- breadcrumbsText: themePrimitives.mono100,
66
+ breadcrumbsText: themePrimitives.white,
67
67
  breadcrumbsSeparatorFill: themePrimitives.mono200,
68
68
 
69
69
  // Datepicker
package/themes/light-theme/color-component-tokens.js CHANGED
@@ -67,7 +67,7 @@ var _default = function _default() {
67
67
  buttonDisabledSpinnerForeground: themePrimitives.mono600,
68
68
  buttonDisabledSpinnerBackground: themePrimitives.mono400,
69
69
  // Breadcrumbs
70
- breadcrumbsText: themePrimitives.mono900,
70
+ breadcrumbsText: themePrimitives.black,
71
71
  breadcrumbsSeparatorFill: themePrimitives.mono700,
72
72
  // Datepicker
73
73
  calendarBackground: themePrimitives.mono100,
package/themes/light-theme/color-component-tokens.js.flow CHANGED
@@ -63,7 +63,7 @@ export default (themePrimitives: ColorTokensT = colorTokens): ComponentColorToke
63
63
  buttonDisabledSpinnerBackground: themePrimitives.mono400,
64
64
 
65
65
  // Breadcrumbs
66
- breadcrumbsText: themePrimitives.mono900,
66
+ breadcrumbsText: themePrimitives.black,
67
67
  breadcrumbsSeparatorFill: themePrimitives.mono700,
68
68
 
69
69
  // Datepicker