baseui 0.0.0-next-e57c3c1 → 0.0.0-next-9622e4a

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 (11) hide show
  1. package/es/themes/dark-theme/color-semantic-tokens.js +7 -4
  2. package/es/themes/light-theme/color-semantic-tokens.js +7 -4
  3. package/esm/themes/dark-theme/color-semantic-tokens.js +6 -4
  4. package/esm/themes/light-theme/color-semantic-tokens.js +6 -4
  5. package/package.json +1 -1
  6. package/themes/dark-theme/color-semantic-tokens.js +6 -4
  7. package/themes/dark-theme/color-semantic-tokens.js.flow +7 -3
  8. package/themes/light-theme/color-semantic-tokens.js +6 -4
  9. package/themes/light-theme/color-semantic-tokens.js.flow +7 -2
  10. package/themes/types.d.ts +6 -3
  11. package/themes/types.js.flow +7 -2
package/es/themes/dark-theme/color-semantic-tokens.js CHANGED
@@ -37,9 +37,7 @@ foundation = colorTokens) => {
37
37
  // Backgrounds
38
38
  backgroundStateDisabled: colors.gray800,
39
39
  // @ts-ignore
40
- backgroundOverlayDark: hexToRgba(colors.black, '0.3'),
41
- // @ts-ignore
42
- backgroundOverlayLight: hexToRgba(colors.black, '0.08'),
40
+ backgroundOverlay: hexToRgba(colors.black, '0.7'),
43
41
  // @ts-ignore
44
42
  backgroundOverlayArt: hexToRgba(colors.black, '0.16'),
45
43
  backgroundAccent: foundation.accent,
@@ -81,7 +79,12 @@ foundation = colorTokens) => {
81
79
  rewardsTier4: colors.gray200,
82
80
  membership: colors.yellow600
83
81
  };
82
+ const deprecated = {
83
+ backgroundOverlayLight: coreExtensions.backgroundOverlay,
84
+ backgroundOverlayDark: coreExtensions.backgroundOverlay
85
+ };
84
86
  return { ...core,
85
- ...coreExtensions
87
+ ...coreExtensions,
88
+ ...deprecated
86
89
  };
87
90
  });
package/es/themes/light-theme/color-semantic-tokens.js CHANGED
@@ -37,9 +37,7 @@ foundation = colorTokens) => {
37
37
  // Backgrounds
38
38
  backgroundStateDisabled: colors.gray50,
39
39
  // @ts-ignore
40
- backgroundOverlayDark: hexToRgba(colors.black, '0.3'),
41
- // @ts-ignore
42
- backgroundOverlayLight: hexToRgba(colors.black, '0.08'),
40
+ backgroundOverlay: hexToRgba(colors.black, '0.7'),
43
41
  // @ts-ignore
44
42
  backgroundOverlayArt: hexToRgba(colors.black, '0.00'),
45
43
  backgroundAccent: foundation.accent,
@@ -81,7 +79,12 @@ foundation = colorTokens) => {
81
79
  rewardsTier4: colors.black,
82
80
  membership: colors.yellow600
83
81
  };
82
+ const deprecated = {
83
+ backgroundOverlayLight: coreExtensions.backgroundOverlay,
84
+ backgroundOverlayDark: coreExtensions.backgroundOverlay
85
+ };
84
86
  return { ...core,
85
- ...coreExtensions
87
+ ...coreExtensions,
88
+ ...deprecated
86
89
  };
87
90
  });
package/esm/themes/dark-theme/color-semantic-tokens.js CHANGED
@@ -43,9 +43,7 @@ export default (function () {
43
43
  // Backgrounds
44
44
  backgroundStateDisabled: colors.gray800,
45
45
  // @ts-ignore
46
- backgroundOverlayDark: hexToRgba(colors.black, '0.3'),
47
- // @ts-ignore
48
- backgroundOverlayLight: hexToRgba(colors.black, '0.08'),
46
+ backgroundOverlay: hexToRgba(colors.black, '0.7'),
49
47
  // @ts-ignore
50
48
  backgroundOverlayArt: hexToRgba(colors.black, '0.16'),
51
49
  backgroundAccent: foundation.accent,
@@ -87,5 +85,9 @@ export default (function () {
87
85
  rewardsTier4: colors.gray200,
88
86
  membership: colors.yellow600
89
87
  };
90
- return _objectSpread(_objectSpread({}, core), coreExtensions);
88
+ var deprecated = {
89
+ backgroundOverlayLight: coreExtensions.backgroundOverlay,
90
+ backgroundOverlayDark: coreExtensions.backgroundOverlay
91
+ };
92
+ return _objectSpread(_objectSpread(_objectSpread({}, core), coreExtensions), deprecated);
91
93
  });
package/esm/themes/light-theme/color-semantic-tokens.js CHANGED
@@ -43,9 +43,7 @@ export default (function () {
43
43
  // Backgrounds
44
44
  backgroundStateDisabled: colors.gray50,
45
45
  // @ts-ignore
46
- backgroundOverlayDark: hexToRgba(colors.black, '0.3'),
47
- // @ts-ignore
48
- backgroundOverlayLight: hexToRgba(colors.black, '0.08'),
46
+ backgroundOverlay: hexToRgba(colors.black, '0.7'),
49
47
  // @ts-ignore
50
48
  backgroundOverlayArt: hexToRgba(colors.black, '0.00'),
51
49
  backgroundAccent: foundation.accent,
@@ -87,5 +85,9 @@ export default (function () {
87
85
  rewardsTier4: colors.black,
88
86
  membership: colors.yellow600
89
87
  };
90
- return _objectSpread(_objectSpread({}, core), coreExtensions);
88
+ var deprecated = {
89
+ backgroundOverlayLight: coreExtensions.backgroundOverlay,
90
+ backgroundOverlayDark: coreExtensions.backgroundOverlay
91
+ };
92
+ return _objectSpread(_objectSpread(_objectSpread({}, core), coreExtensions), deprecated);
91
93
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "baseui",
3
- "version": "0.0.0-next-e57c3c1",
3
+ "version": "0.0.0-next-9622e4a",
4
4
  "description": "A React Component library implementing the Base design language",
5
5
  "keywords": [
6
6
  "react",
package/themes/dark-theme/color-semantic-tokens.js CHANGED
@@ -49,9 +49,7 @@ var _default = function _default() {
49
49
  // Backgrounds
50
50
  backgroundStateDisabled: _colors.default.gray800,
51
51
  // @ts-ignore
52
- backgroundOverlayDark: (0, _util.hexToRgb)(_colors.default.black, '0.3'),
53
- // @ts-ignore
54
- backgroundOverlayLight: (0, _util.hexToRgb)(_colors.default.black, '0.08'),
52
+ backgroundOverlay: (0, _util.hexToRgb)(_colors.default.black, '0.7'),
55
53
  // @ts-ignore
56
54
  backgroundOverlayArt: (0, _util.hexToRgb)(_colors.default.black, '0.16'),
57
55
  backgroundAccent: foundation.accent,
@@ -93,7 +91,11 @@ var _default = function _default() {
93
91
  rewardsTier4: _colors.default.gray200,
94
92
  membership: _colors.default.yellow600
95
93
  };
96
- return _objectSpread(_objectSpread({}, core), coreExtensions);
94
+ var deprecated = {
95
+ backgroundOverlayLight: coreExtensions.backgroundOverlay,
96
+ backgroundOverlayDark: coreExtensions.backgroundOverlay
97
+ };
98
+ return _objectSpread(_objectSpread(_objectSpread({}, core), coreExtensions), deprecated);
97
99
  };
98
100
 
99
101
  exports.default = _default;
package/themes/dark-theme/color-semantic-tokens.js.flow CHANGED
@@ -9,6 +9,7 @@ import type {
9
9
  ColorTokensT,
10
10
  CoreSemanticColorTokensT,
11
11
  CoreExtensionSemanticColorTokensT,
12
+ DeprecatedSemanticColorTokensT,
12
13
  SemanticColorTokensT,
13
14
  } from '../types.js';
14
15
  import colorTokens from './color-tokens.js';
@@ -47,8 +48,7 @@ export default (
47
48
  const coreExtensions: CoreExtensionSemanticColorTokensT = {
48
49
  // Backgrounds
49
50
  backgroundStateDisabled: colors.gray800,
50
- backgroundOverlayDark: hexToRgba(colors.black, '0.3'),
51
- backgroundOverlayLight: hexToRgba(colors.black, '0.08'),
51
+ backgroundOverlay: hexToRgba(colors.black, '0.7'),
52
52
  backgroundOverlayArt: hexToRgba(colors.black, '0.16'),
53
53
  backgroundAccent: foundation.accent,
54
54
  backgroundNegative: foundation.negative,
@@ -92,10 +92,14 @@ export default (
92
92
  rewardsTier4: colors.gray200,
93
93
  membership: colors.yellow600,
94
94
  };
95
-
95
+ const deprecated: DeprecatedSemanticColorTokensT = {
96
+ backgroundOverlayLight: coreExtensions.backgroundOverlay,
97
+ backgroundOverlayDark: coreExtensions.backgroundOverlay,
98
+ };
96
99
  return {
97
100
  ...core,
98
101
  ...coreExtensions,
102
+ ...deprecated,
99
103
  };
100
104
  };
101
105
 
package/themes/light-theme/color-semantic-tokens.js CHANGED
@@ -49,9 +49,7 @@ var _default = function _default() {
49
49
  // Backgrounds
50
50
  backgroundStateDisabled: _colors.default.gray50,
51
51
  // @ts-ignore
52
- backgroundOverlayDark: (0, _util.hexToRgb)(_colors.default.black, '0.3'),
53
- // @ts-ignore
54
- backgroundOverlayLight: (0, _util.hexToRgb)(_colors.default.black, '0.08'),
52
+ backgroundOverlay: (0, _util.hexToRgb)(_colors.default.black, '0.7'),
55
53
  // @ts-ignore
56
54
  backgroundOverlayArt: (0, _util.hexToRgb)(_colors.default.black, '0.00'),
57
55
  backgroundAccent: foundation.accent,
@@ -93,7 +91,11 @@ var _default = function _default() {
93
91
  rewardsTier4: _colors.default.black,
94
92
  membership: _colors.default.yellow600
95
93
  };
96
- return _objectSpread(_objectSpread({}, core), coreExtensions);
94
+ var deprecated = {
95
+ backgroundOverlayLight: coreExtensions.backgroundOverlay,
96
+ backgroundOverlayDark: coreExtensions.backgroundOverlay
97
+ };
98
+ return _objectSpread(_objectSpread(_objectSpread({}, core), coreExtensions), deprecated);
97
99
  };
98
100
 
99
101
  exports.default = _default;
package/themes/light-theme/color-semantic-tokens.js.flow CHANGED
@@ -9,6 +9,7 @@ import type {
9
9
  ColorTokensT,
10
10
  CoreSemanticColorTokensT,
11
11
  CoreExtensionSemanticColorTokensT,
12
+ DeprecatedSemanticColorTokensT,
12
13
  SemanticColorTokensT,
13
14
  } from '../types.js';
14
15
  import colorTokens from './color-tokens.js';
@@ -47,8 +48,7 @@ export default (
47
48
  const coreExtensions: CoreExtensionSemanticColorTokensT = {
48
49
  // Backgrounds
49
50
  backgroundStateDisabled: colors.gray50,
50
- backgroundOverlayDark: hexToRgba(colors.black, '0.3'),
51
- backgroundOverlayLight: hexToRgba(colors.black, '0.08'),
51
+ backgroundOverlay: hexToRgba(colors.black, '0.7'),
52
52
  backgroundOverlayArt: hexToRgba(colors.black, '0.00'),
53
53
  backgroundAccent: foundation.accent,
54
54
  backgroundNegative: foundation.negative,
@@ -92,9 +92,14 @@ export default (
92
92
  rewardsTier4: colors.black,
93
93
  membership: colors.yellow600,
94
94
  };
95
+ const deprecated: DeprecatedSemanticColorTokensT = {
96
+ backgroundOverlayLight: coreExtensions.backgroundOverlay,
97
+ backgroundOverlayDark: coreExtensions.backgroundOverlay,
98
+ };
95
99
  return {
96
100
  ...core,
97
101
  ...coreExtensions,
102
+ ...deprecated,
98
103
  };
99
104
  };
100
105
 
package/themes/types.d.ts CHANGED
@@ -86,8 +86,7 @@ export type CoreSemanticColorTokens = {
86
86
  };
87
87
  export type CoreExtensionSemanticColorTokens = {
88
88
  backgroundStateDisabled: string;
89
- backgroundOverlayDark?: string;
90
- backgroundOverlayLight?: string;
89
+ backgroundOverlay: string;
91
90
  backgroundOverlayArt?: string;
92
91
  backgroundAccent: string;
93
92
  backgroundNegative: string;
@@ -125,7 +124,11 @@ export type CoreExtensionSemanticColorTokens = {
125
124
  rewardsTier4: string;
126
125
  membership: string;
127
126
  };
128
- export type SemanticColorTokens = {} & CoreSemanticColorTokens & CoreExtensionSemanticColorTokens;
127
+ export type DeprecatedSemanticColorTokens = {
128
+ backgroundOverlayLight: string;
129
+ backgroundOverlayDark: string;
130
+ };
131
+ export type SemanticColorTokens = {} & CoreSemanticColorTokens & CoreExtensionSemanticColorTokens & DeprecatedSemanticColorTokens;
129
132
  export type ComponentColorTokens = {
130
133
  bannerActionLowInfo: string;
131
134
  bannerActionLowNegative: string;
package/themes/types.js.flow CHANGED
@@ -125,8 +125,7 @@ export type CoreSemanticColorTokensT = {|
125
125
  export type CoreExtensionSemanticColorTokensT = {|
126
126
  // Backgrounds
127
127
  backgroundStateDisabled: string,
128
- backgroundOverlayDark: ?string,
129
- backgroundOverlayLight: ?string,
128
+ backgroundOverlay: ?string,
130
129
  backgroundOverlayArt: ?string,
131
130
  backgroundAccent: string,
132
131
  backgroundNegative: string,
@@ -171,9 +170,15 @@ export type CoreExtensionSemanticColorTokensT = {|
171
170
  membership: string,
172
171
  |};
173
172
 
173
+ export type DeprecatedSemanticColorTokensT = {|
174
+ backgroundOverlayLight: ?string,
175
+ backgroundOverlayDark: ?string,
176
+ |};
177
+
174
178
  export type SemanticColorTokensT = {|
175
179
  ...CoreSemanticColorTokensT,
176
180
  ...CoreExtensionSemanticColorTokensT,
181
+ ...DeprecatedSemanticColorTokensT,
177
182
  |};
178
183
 
179
184
  export type ComponentColorTokensT = {|