baseui 10.12.0 → 11.0.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 (291) hide show
  1. package/README.md +3 -3
  2. package/accordion/accordion.js +60 -13
  3. package/accordion/accordion.js.flow +49 -12
  4. package/accordion/index.d.ts +0 -3
  5. package/accordion/panel.js +7 -6
  6. package/accordion/panel.js.flow +20 -20
  7. package/accordion/stateless-accordion.js +2 -4
  8. package/accordion/stateless-accordion.js.flow +0 -2
  9. package/accordion/types.js.flow +0 -5
  10. package/button/constants.js +1 -2
  11. package/button/constants.js.flow +0 -1
  12. package/button/index.d.ts +0 -1
  13. package/button/styled-components.js +2 -29
  14. package/button/styled-components.js.flow +2 -30
  15. package/checkbox/checkbox.js +6 -30
  16. package/checkbox/checkbox.js.flow +7 -38
  17. package/checkbox/constants.js +2 -1
  18. package/checkbox/constants.js.flow +2 -1
  19. package/checkbox/index.d.ts +4 -6
  20. package/checkbox/index.js +0 -6
  21. package/checkbox/index.js.flow +0 -1
  22. package/checkbox/styled-components.js +52 -149
  23. package/checkbox/styled-components.js.flow +59 -165
  24. package/checkbox/types.js.flow +0 -5
  25. package/data-table/column-categorical.js +1 -1
  26. package/data-table/column-categorical.js.flow +1 -1
  27. package/data-table/column-datetime.js +1 -1
  28. package/data-table/column-datetime.js.flow +3 -1
  29. package/data-table/column.js +6 -2
  30. package/data-table/column.js.flow +9 -7
  31. package/data-table/data-table.js +10 -2
  32. package/data-table/data-table.js.flow +4 -1
  33. package/data-table/header-cell.js +3 -0
  34. package/data-table/header-cell.js.flow +1 -1
  35. package/data-table/index.d.ts +7 -8
  36. package/data-table/stateful-data-table.js +2 -1
  37. package/data-table/stateful-data-table.js.flow +1 -0
  38. package/data-table/types.js.flow +8 -0
  39. package/datepicker/calendar.js +15 -7
  40. package/datepicker/calendar.js.flow +23 -9
  41. package/datepicker/constants.js +12 -2
  42. package/datepicker/constants.js.flow +10 -0
  43. package/datepicker/datepicker.js +61 -30
  44. package/datepicker/datepicker.js.flow +77 -37
  45. package/datepicker/day.js +85 -34
  46. package/datepicker/day.js.flow +118 -54
  47. package/datepicker/locale.js.flow +0 -1
  48. package/datepicker/month.js +3 -1
  49. package/datepicker/month.js.flow +2 -0
  50. package/datepicker/stateful-container.js.flow +2 -1
  51. package/datepicker/styled-components.js +23 -1
  52. package/datepicker/styled-components.js.flow +12 -2
  53. package/datepicker/types.js.flow +35 -10
  54. package/datepicker/utils/date-helpers.js +30 -0
  55. package/datepicker/utils/date-helpers.js.flow +12 -0
  56. package/datepicker/week.js +3 -1
  57. package/datepicker/week.js.flow +2 -0
  58. package/es/accordion/accordion.js +52 -12
  59. package/es/accordion/panel.js +7 -5
  60. package/es/accordion/stateless-accordion.js +2 -4
  61. package/es/button/constants.js +1 -2
  62. package/es/button/styled-components.js +2 -29
  63. package/es/checkbox/checkbox.js +7 -32
  64. package/es/checkbox/constants.js +2 -1
  65. package/es/checkbox/index.js +1 -1
  66. package/es/checkbox/styled-components.js +51 -146
  67. package/es/data-table/column-categorical.js +1 -1
  68. package/es/data-table/column-datetime.js +1 -1
  69. package/es/data-table/column.js +6 -2
  70. package/es/data-table/data-table.js +6 -2
  71. package/es/data-table/header-cell.js +3 -0
  72. package/es/data-table/stateful-data-table.js +2 -1
  73. package/es/datepicker/calendar.js +15 -7
  74. package/es/datepicker/constants.js +8 -0
  75. package/es/datepicker/datepicker.js +56 -29
  76. package/es/datepicker/day.js +77 -34
  77. package/es/datepicker/month.js +3 -1
  78. package/es/datepicker/styled-components.js +8 -2
  79. package/es/datepicker/types.js +1 -1
  80. package/es/datepicker/utils/date-helpers.js +16 -0
  81. package/es/datepicker/week.js +3 -1
  82. package/es/file-uploader/file-uploader.js +4 -4
  83. package/es/form-control/styled-components.js +0 -1
  84. package/es/header-navigation/styled-components.js +3 -3
  85. package/es/helpers/overrides.js +1 -2
  86. package/es/input/styled-components.js +4 -4
  87. package/es/layer/layer.js +4 -4
  88. package/es/list/list-item.js +5 -1
  89. package/es/list/menu-adapter.js +4 -0
  90. package/es/locale/index.js +0 -7
  91. package/es/menu/stateful-container.js +0 -1
  92. package/es/menu/styled-components.js +1 -1
  93. package/es/modal/index.js +1 -1
  94. package/es/modal/modal.js +19 -65
  95. package/es/modal/styled-components.js +12 -48
  96. package/es/phone-input/default-props.js +1 -1
  97. package/es/phone-input/index.js +0 -4
  98. package/es/phone-input/phone-input-lite.js +55 -31
  99. package/es/radio/radio.js +1 -7
  100. package/es/radio/radiogroup.js +3 -28
  101. package/es/radio/styled-components.js +4 -5
  102. package/es/rating/styled-components.js +3 -3
  103. package/es/select/index.js +1 -2
  104. package/es/select/select-component.js +20 -20
  105. package/es/select/styled-components.js +21 -17
  106. package/es/snackbar/styled-components.js +2 -2
  107. package/es/spinner/index.js +3 -9
  108. package/es/spinner/styled-components.js +2 -32
  109. package/es/table/filter.js +3 -3
  110. package/es/tag/styled-components.js +1 -1
  111. package/es/themes/dark-theme/color-component-tokens.js +0 -38
  112. package/es/themes/dark-theme/color-tokens.js +0 -2
  113. package/es/themes/dark-theme/create-dark-theme.js +0 -2
  114. package/es/themes/dark-theme/dark-theme.js +0 -2
  115. package/es/themes/light-theme/color-component-tokens.js +0 -38
  116. package/es/themes/light-theme/color-tokens.js +0 -2
  117. package/es/themes/light-theme/create-light-theme.js +0 -2
  118. package/es/themes/light-theme/light-theme.js +0 -2
  119. package/es/timepicker/timepicker.js +1 -8
  120. package/es/typography/index.js +1 -31
  121. package/esm/accordion/accordion.js +60 -13
  122. package/esm/accordion/panel.js +7 -6
  123. package/esm/accordion/stateless-accordion.js +2 -4
  124. package/esm/button/constants.js +1 -2
  125. package/esm/button/styled-components.js +2 -29
  126. package/esm/checkbox/checkbox.js +7 -30
  127. package/esm/checkbox/constants.js +2 -1
  128. package/esm/checkbox/index.js +1 -1
  129. package/esm/checkbox/styled-components.js +52 -147
  130. package/esm/data-table/column-categorical.js +1 -1
  131. package/esm/data-table/column-datetime.js +1 -1
  132. package/esm/data-table/column.js +6 -2
  133. package/esm/data-table/data-table.js +10 -2
  134. package/esm/data-table/header-cell.js +3 -0
  135. package/esm/data-table/stateful-data-table.js +2 -1
  136. package/esm/datepicker/calendar.js +15 -7
  137. package/esm/datepicker/constants.js +8 -0
  138. package/esm/datepicker/datepicker.js +60 -30
  139. package/esm/datepicker/day.js +84 -34
  140. package/esm/datepicker/month.js +3 -1
  141. package/esm/datepicker/styled-components.js +24 -2
  142. package/esm/datepicker/types.js +1 -1
  143. package/esm/datepicker/utils/date-helpers.js +30 -0
  144. package/esm/datepicker/week.js +3 -1
  145. package/esm/file-uploader/file-uploader.js +4 -4
  146. package/esm/form-control/styled-components.js +0 -1
  147. package/esm/header-navigation/styled-components.js +3 -3
  148. package/esm/helpers/overrides.js +1 -2
  149. package/esm/input/styled-components.js +4 -4
  150. package/esm/layer/layer.js +4 -4
  151. package/esm/list/list-item.js +5 -1
  152. package/esm/list/menu-adapter.js +4 -0
  153. package/esm/locale/index.js +0 -7
  154. package/esm/menu/stateful-container.js +0 -1
  155. package/esm/menu/styled-components.js +1 -1
  156. package/esm/modal/index.js +1 -1
  157. package/esm/modal/modal.js +28 -71
  158. package/esm/modal/styled-components.js +6 -38
  159. package/esm/phone-input/default-props.js +1 -1
  160. package/esm/phone-input/index.js +0 -4
  161. package/esm/phone-input/phone-input-lite.js +60 -37
  162. package/esm/radio/radio.js +1 -7
  163. package/esm/radio/radiogroup.js +3 -28
  164. package/esm/radio/styled-components.js +4 -5
  165. package/esm/rating/styled-components.js +3 -3
  166. package/esm/select/index.js +1 -2
  167. package/esm/select/select-component.js +20 -20
  168. package/esm/select/styled-components.js +21 -14
  169. package/esm/snackbar/styled-components.js +2 -2
  170. package/esm/spinner/index.js +3 -9
  171. package/esm/spinner/styled-components.js +2 -40
  172. package/esm/table/filter.js +3 -3
  173. package/esm/tag/styled-components.js +1 -1
  174. package/esm/themes/dark-theme/color-component-tokens.js +0 -38
  175. package/esm/themes/dark-theme/color-tokens.js +0 -2
  176. package/esm/themes/dark-theme/create-dark-theme.js +1 -2
  177. package/esm/themes/dark-theme/dark-theme.js +1 -2
  178. package/esm/themes/light-theme/color-component-tokens.js +0 -38
  179. package/esm/themes/light-theme/color-tokens.js +0 -2
  180. package/esm/themes/light-theme/create-light-theme.js +1 -2
  181. package/esm/themes/light-theme/light-theme.js +1 -2
  182. package/esm/timepicker/timepicker.js +1 -8
  183. package/esm/typography/index.js +1 -35
  184. package/file-uploader/file-uploader.js +3 -3
  185. package/file-uploader/file-uploader.js.flow +4 -4
  186. package/form-control/index.d.ts +9 -0
  187. package/form-control/styled-components.js +0 -1
  188. package/form-control/styled-components.js.flow +0 -1
  189. package/header-navigation/styled-components.js +3 -3
  190. package/header-navigation/styled-components.js.flow +3 -3
  191. package/helpers/overrides.js +1 -2
  192. package/helpers/overrides.js.flow +1 -1
  193. package/input/index.d.ts +5 -9
  194. package/input/styled-components.js +4 -4
  195. package/input/styled-components.js.flow +4 -4
  196. package/layer/layer.js +4 -4
  197. package/layer/layer.js.flow +4 -3
  198. package/list/list-item.js +5 -1
  199. package/list/list-item.js.flow +4 -0
  200. package/list/menu-adapter.js +4 -0
  201. package/list/menu-adapter.js.flow +4 -0
  202. package/list/types.js.flow +4 -0
  203. package/locale/index.js +0 -7
  204. package/locale/index.js.flow +0 -7
  205. package/locale.ts +0 -1
  206. package/menu/index.d.ts +1 -3
  207. package/menu/stateful-container.js +0 -1
  208. package/menu/stateful-container.js.flow +0 -1
  209. package/menu/styled-components.js +1 -1
  210. package/menu/styled-components.js.flow +1 -1
  211. package/modal/index.d.ts +4 -6
  212. package/modal/index.js +0 -6
  213. package/modal/index.js.flow +0 -1
  214. package/modal/modal.js +27 -70
  215. package/modal/modal.js.flow +17 -83
  216. package/modal/styled-components.js +7 -40
  217. package/modal/styled-components.js.flow +12 -44
  218. package/modal/types.js.flow +1 -10
  219. package/package.json +3 -2
  220. package/phone-input/default-props.js +1 -1
  221. package/phone-input/default-props.js.flow +1 -1
  222. package/phone-input/index.d.ts +0 -1
  223. package/phone-input/index.js +0 -36
  224. package/phone-input/index.js.flow +0 -4
  225. package/phone-input/phone-input-lite.js +63 -38
  226. package/phone-input/phone-input-lite.js.flow +66 -44
  227. package/radio/index.d.ts +4 -9
  228. package/radio/radio.js +1 -7
  229. package/radio/radio.js.flow +1 -8
  230. package/radio/radiogroup.js +3 -28
  231. package/radio/radiogroup.js.flow +2 -26
  232. package/radio/styled-components.js +4 -5
  233. package/radio/styled-components.js.flow +3 -4
  234. package/radio/types.js.flow +4 -15
  235. package/rating/styled-components.js +3 -3
  236. package/rating/styled-components.js.flow +3 -3
  237. package/select/index.d.ts +0 -2
  238. package/select/index.js +0 -6
  239. package/select/index.js.flow +0 -2
  240. package/select/select-component.js +23 -24
  241. package/select/select-component.js.flow +25 -14
  242. package/select/styled-components.js +23 -17
  243. package/select/styled-components.js.flow +17 -12
  244. package/snackbar/styled-components.js +1 -1
  245. package/snackbar/styled-components.js.flow +11 -11
  246. package/spinner/index.d.ts +5 -18
  247. package/spinner/index.js +2 -68
  248. package/spinner/index.js.flow +2 -27
  249. package/spinner/styled-components.js +9 -45
  250. package/spinner/styled-components.js.flow +2 -34
  251. package/spinner/types.js.flow +1 -19
  252. package/styles/types.js.flow +0 -2
  253. package/table/filter.js +3 -3
  254. package/table/filter.js.flow +3 -3
  255. package/tag/styled-components.js +1 -1
  256. package/tag/styled-components.js.flow +1 -1
  257. package/theme.ts +0 -81
  258. package/themes/dark-theme/color-component-tokens.js +0 -38
  259. package/themes/dark-theme/color-component-tokens.js.flow +0 -42
  260. package/themes/dark-theme/color-tokens.js +0 -2
  261. package/themes/dark-theme/color-tokens.js.flow +0 -2
  262. package/themes/dark-theme/create-dark-theme.js +1 -3
  263. package/themes/dark-theme/create-dark-theme.js.flow +0 -2
  264. package/themes/dark-theme/dark-theme.js +1 -3
  265. package/themes/dark-theme/dark-theme.js.flow +0 -2
  266. package/themes/light-theme/color-component-tokens.js +0 -38
  267. package/themes/light-theme/color-component-tokens.js.flow +0 -43
  268. package/themes/light-theme/color-tokens.js +0 -2
  269. package/themes/light-theme/color-tokens.js.flow +0 -2
  270. package/themes/light-theme/create-light-theme.js +1 -3
  271. package/themes/light-theme/create-light-theme.js.flow +0 -2
  272. package/themes/light-theme/light-theme.js +1 -3
  273. package/themes/light-theme/light-theme.js.flow +0 -2
  274. package/themes/types.js.flow +0 -68
  275. package/timepicker/timepicker.js +1 -8
  276. package/timepicker/timepicker.js.flow +4 -10
  277. package/typography/index.d.ts +0 -23
  278. package/typography/index.js +2 -57
  279. package/typography/index.js.flow +0 -31
  280. package/es/spinner/spinner.js +0 -68
  281. package/es/themes/dark-theme/color-deprecated-semantic-tokens.js +0 -35
  282. package/es/themes/light-theme/color-deprecated-semantic-tokens.js +0 -35
  283. package/esm/spinner/spinner.js +0 -125
  284. package/esm/themes/dark-theme/color-deprecated-semantic-tokens.js +0 -38
  285. package/esm/themes/light-theme/color-deprecated-semantic-tokens.js +0 -38
  286. package/spinner/spinner.js +0 -136
  287. package/spinner/spinner.js.flow +0 -75
  288. package/themes/dark-theme/color-deprecated-semantic-tokens.js +0 -50
  289. package/themes/dark-theme/color-deprecated-semantic-tokens.js.flow +0 -42
  290. package/themes/light-theme/color-deprecated-semantic-tokens.js +0 -50
  291. package/themes/light-theme/color-deprecated-semantic-tokens.js.flow +0 -42
package/spinner/index.js CHANGED
@@ -3,70 +3,10 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- Object.defineProperty(exports, "SpinnerDeterminate", {
7
- enumerable: true,
8
- get: function get() {
9
- return _index.ProgressBarRounded;
10
- }
11
- });
12
- Object.defineProperty(exports, "StyledSpinnerDeterminateRoot", {
13
- enumerable: true,
14
- get: function get() {
15
- return _index.StyledProgressBarRoundedRoot;
16
- }
17
- });
18
- Object.defineProperty(exports, "StyledSpinnerDeterminateSvg", {
19
- enumerable: true,
20
- get: function get() {
21
- return _index.StyledProgressBarRoundedSvg;
22
- }
23
- });
24
- Object.defineProperty(exports, "StyledSpinnerDeterminateText", {
25
- enumerable: true,
26
- get: function get() {
27
- return _index.StyledProgressBarRoundedText;
28
- }
29
- });
30
- Object.defineProperty(exports, "StyledSpinnerDeterminateTrackBackground", {
31
- enumerable: true,
32
- get: function get() {
33
- return _index.StyledProgressBarRoundedTrackBackground;
34
- }
35
- });
36
- Object.defineProperty(exports, "StyledSpinnerDeterminateTrackForeground", {
37
- enumerable: true,
38
- get: function get() {
39
- return _index.StyledProgressBarRoundedTrackForeground;
40
- }
41
- });
42
6
  Object.defineProperty(exports, "Spinner", {
43
7
  enumerable: true,
44
8
  get: function get() {
45
- return _spinner.default;
46
- }
47
- });
48
- Object.defineProperty(exports, "StyledSvg", {
49
- enumerable: true,
50
- get: function get() {
51
- return _styledComponents.Svg;
52
- }
53
- });
54
- Object.defineProperty(exports, "StyledTrackPath", {
55
- enumerable: true,
56
- get: function get() {
57
- return _styledComponents.StyledTrackPath;
58
- }
59
- });
60
- Object.defineProperty(exports, "StyledActivePath", {
61
- enumerable: true,
62
- get: function get() {
63
- return _styledComponents.StyledActivePath;
64
- }
65
- });
66
- Object.defineProperty(exports, "StyledSpinnerNext", {
67
- enumerable: true,
68
- get: function get() {
69
- return _styledComponents.StyledSpinnerNext;
9
+ return _styledComponents.StyledSpinner;
70
10
  }
71
11
  });
72
12
  Object.defineProperty(exports, "SIZE", {
@@ -76,12 +16,6 @@ Object.defineProperty(exports, "SIZE", {
76
16
  }
77
17
  });
78
18
 
79
- var _index = require("../progress-bar/index.js");
80
-
81
- var _spinner = _interopRequireDefault(require("./spinner.js"));
82
-
83
19
  var _styledComponents = require("./styled-components.js");
84
20
 
85
- var _constants = require("./constants.js");
86
-
87
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
21
+ var _constants = require("./constants.js");
@@ -5,38 +5,13 @@ This source code is licensed under the MIT license found in the
5
5
  LICENSE file in the root directory of this source tree.
6
6
  */
7
7
  // @flow
8
- import {
9
- ProgressBarRounded,
10
- StyledProgressBarRoundedRoot,
11
- StyledProgressBarRoundedSvg,
12
- StyledProgressBarRoundedText,
13
- StyledProgressBarRoundedTrackBackground,
14
- StyledProgressBarRoundedTrackForeground,
15
- } from '../progress-bar/index.js';
8
+ import { StyledSpinner } from './styled-components.js';
16
9
 
17
- export { default as Spinner } from './spinner.js';
18
- // Styled elements
19
- export {
20
- Svg as StyledSvg,
21
- StyledTrackPath,
22
- StyledActivePath,
23
- StyledSpinnerNext,
24
- } from './styled-components.js';
10
+ export { StyledSpinner as Spinner };
25
11
  export { SIZE } from './constants.js';
26
12
  // Flow
27
13
  export type * from './types.js';
28
14
 
29
- // Backward compatibility with SpinnerDeterminate
30
- // Deprecated
31
- export {
32
- ProgressBarRounded as SpinnerDeterminate,
33
- StyledProgressBarRoundedRoot as StyledSpinnerDeterminateRoot,
34
- StyledProgressBarRoundedSvg as StyledSpinnerDeterminateSvg,
35
- StyledProgressBarRoundedTrackBackground as StyledSpinnerDeterminateTrackBackground,
36
- StyledProgressBarRoundedTrackForeground as StyledSpinnerDeterminateTrackForeground,
37
- StyledProgressBarRoundedText as StyledSpinnerDeterminateText,
38
- };
39
-
40
15
  declare var __DEV__: boolean;
41
16
  declare var __NODE__: boolean;
42
17
  declare var __BROWSER__: boolean;
@@ -3,20 +3,18 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.StyledSpinnerNext = exports.StyledActivePath = exports.StyledTrackPath = exports.Svg = void 0;
6
+ exports.StyledSpinner = void 0;
7
7
 
8
8
  var _index = require("../styles/index.js");
9
9
 
10
- var _styledComponents = require("../icon/styled-components.js");
11
-
12
10
  var _constants = require("./constants.js");
13
11
 
14
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
15
-
16
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
17
-
18
- function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
12
+ /*
13
+ Copyright (c) Uber Technologies, Inc.
19
14
 
15
+ This source code is licensed under the MIT license found in the
16
+ LICENSE file in the root directory of this source tree.
17
+ */
20
18
  var spin = {
21
19
  from: {
22
20
  transform: 'rotate(0deg)'
@@ -25,41 +23,7 @@ var spin = {
25
23
  transform: 'rotate(360deg)'
26
24
  }
27
25
  };
28
- /**
29
- * Spinner icon overrides
30
- */
31
-
32
- var Svg = (0, _index.styled)('svg', function (props) {
33
- var $theme = props.$theme,
34
- $color = props.$color;
35
- return _objectSpread(_objectSpread({}, (0, _styledComponents.getSvgStyles)(props)), {}, {
36
- fill: $color || $theme.colors.accent,
37
- cursor: 'wait',
38
- animationName: spin,
39
- animationDuration: $theme.animation.timing1000,
40
- animationIterationCount: 'infinite',
41
- animationTimingFunction: 'linear'
42
- });
43
- });
44
- exports.Svg = Svg;
45
- Svg.displayName = "Svg";
46
- var StyledTrackPath = (0, _index.styled)('path', function (props) {
47
- return {
48
- fill: props.$theme.colors.spinnerTrackFill,
49
- opacity: 0.16
50
- };
51
- });
52
- exports.StyledTrackPath = StyledTrackPath;
53
- StyledTrackPath.displayName = "StyledTrackPath";
54
- var StyledActivePath = (0, _index.styled)('path', function (props) {
55
- return {
56
- fill: props.$color || props.$theme.colors.accent
57
- };
58
- }); // TODO(v11): Replace Spinner with SpinnerNext
59
-
60
- exports.StyledActivePath = StyledActivePath;
61
- StyledActivePath.displayName = "StyledActivePath";
62
- var StyledSpinnerNext = (0, _index.styled)('i', function (_ref) {
26
+ var StyledSpinner = (0, _index.styled)('i', function (_ref) {
63
27
  var $theme = _ref.$theme,
64
28
  _ref$$color = _ref.$color,
65
29
  $color = _ref$$color === void 0 ? $theme.colors.contentAccent : _ref$$color,
@@ -117,5 +81,5 @@ var StyledSpinnerNext = (0, _index.styled)('i', function (_ref) {
117
81
  cursor: 'wait'
118
82
  };
119
83
  });
120
- exports.StyledSpinnerNext = StyledSpinnerNext;
121
- StyledSpinnerNext.displayName = "StyledSpinnerNext";
84
+ exports.StyledSpinner = StyledSpinner;
85
+ StyledSpinner.displayName = "StyledSpinner";
@@ -6,14 +6,8 @@ LICENSE file in the root directory of this source tree.
6
6
  */
7
7
  // @flow
8
8
  import { styled } from '../styles/index.js';
9
- import { getSvgStyles } from '../icon/styled-components.js';
10
9
  import { SIZE } from './constants.js';
11
- import type { StyledSpinnerNextPropsT } from './types.js';
12
-
13
- type StylePropsT = {
14
- $size?: number | string,
15
- $color?: string,
16
- };
10
+ import type { SpinnerPropsT } from './types.js';
17
11
 
18
12
  const spin = {
19
13
  from: {
@@ -24,33 +18,7 @@ const spin = {
24
18
  },
25
19
  };
26
20
 
27
- /**
28
- * Spinner icon overrides
29
- */
30
- export const Svg = styled<StylePropsT>('svg', (props) => {
31
- const { $theme, $color } = props;
32
- return {
33
- ...getSvgStyles(props),
34
- fill: $color || $theme.colors.accent,
35
- cursor: 'wait',
36
- animationName: spin,
37
- animationDuration: $theme.animation.timing1000,
38
- animationIterationCount: 'infinite',
39
- animationTimingFunction: 'linear',
40
- };
41
- });
42
-
43
- export const StyledTrackPath = styled<StylePropsT>('path', (props) => ({
44
- fill: props.$theme.colors.spinnerTrackFill,
45
- opacity: 0.16,
46
- }));
47
-
48
- export const StyledActivePath = styled<StylePropsT>('path', (props) => ({
49
- fill: props.$color || props.$theme.colors.accent,
50
- }));
51
-
52
- // TODO(v11): Replace Spinner with SpinnerNext
53
- export const StyledSpinnerNext = styled<StyledSpinnerNextPropsT>(
21
+ export const StyledSpinner = styled<SpinnerPropsT>(
54
22
  'i',
55
23
  ({
56
24
  //$FlowFixMe
@@ -7,29 +7,11 @@ LICENSE file in the root directory of this source tree.
7
7
  // @flow
8
8
 
9
9
  import { SIZE } from './constants.js';
10
- import type { OverrideT } from '../helpers/overrides.js';
11
10
  import type { SizingT } from '../themes/types.js';
12
11
 
13
12
  export type SizeT = $Keys<typeof SIZE>;
14
- export type SpinnerPropsT = {
15
- /** Sets aria-label attribute. */
16
- 'aria-label'?: string,
17
- /** Size of element, will be passed to the svg width/height style. Can also be a value included in */
18
- size?: number | string,
19
- /** Color of icon, will be used as svg fill */
20
- color?: string,
21
- /** Silence should only be used in baseui. Used to not spam console on composed components like Select */
22
- $silenceV11DeprecationWarning?: boolean,
23
- /** Allows you to set the SVG `<title>` label, which is used for accessibility */
24
- title?: string,
25
- overrides?: {
26
- Svg?: OverrideT,
27
- ActivePath?: OverrideT,
28
- TrackPath?: OverrideT,
29
- },
30
- };
31
13
 
32
- export type StyledSpinnerNextPropsT = {
14
+ export type SpinnerPropsT = {
33
15
  /** Color of progress indicator */
34
16
  $color?: string,
35
17
  /** Width of the progress indicator "stroke". */
@@ -12,7 +12,6 @@ import type {
12
12
  ColorTokensT,
13
13
  ComponentColorTokensT,
14
14
  SemanticColorTokensT,
15
- DeprecatedSemanticColorTokensT,
16
15
  AnimationT,
17
16
  BreakpointsT,
18
17
  BorderT,
@@ -44,7 +43,6 @@ export type ColorsT = {
44
43
  ...ColorTokensT,
45
44
  ...ComponentColorTokensT,
46
45
  ...SemanticColorTokensT,
47
- ...DeprecatedSemanticColorTokensT,
48
46
  };
49
47
 
50
48
  export type ThemeT = {|
package/table/filter.js CHANGED
@@ -95,19 +95,19 @@ function Filter(props) {
95
95
  ,
96
96
  crossFrame: false
97
97
  }, /*#__PURE__*/React.createElement(Heading, headingProps, "Filter Column"), /*#__PURE__*/React.createElement(Content, contentProps, props.children), /*#__PURE__*/React.createElement(Footer, footerProps, /*#__PURE__*/React.createElement(_index.Button, {
98
- kind: _index.KIND.minimal,
98
+ kind: _index.KIND.tertiary,
99
99
  size: _index.SIZE.compact,
100
100
  onClick: function onClick() {
101
101
  onSelectAll();
102
102
  }
103
103
  }, "Select All"), /*#__PURE__*/React.createElement(_index.Button, {
104
- kind: _index.KIND.minimal,
104
+ kind: _index.KIND.tertiary,
105
105
  size: _index.SIZE.compact,
106
106
  onClick: function onClick() {
107
107
  onReset();
108
108
  }
109
109
  }, "Reset"), props.hasCloseButton && /*#__PURE__*/React.createElement(_index.Button, {
110
- kind: _index.KIND.minimal,
110
+ kind: _index.KIND.tertiary,
111
111
  size: _index.SIZE.compact,
112
112
  onClick: close
113
113
  }, "Close")));
@@ -54,7 +54,7 @@ export default function Filter(props: FilterProps) {
54
54
  <Content {...contentProps}>{props.children}</Content>
55
55
  <Footer {...footerProps}>
56
56
  <Button
57
- kind={KIND.minimal}
57
+ kind={KIND.tertiary}
58
58
  size={SIZE.compact}
59
59
  onClick={() => {
60
60
  onSelectAll();
@@ -64,7 +64,7 @@ export default function Filter(props: FilterProps) {
64
64
  </Button>
65
65
 
66
66
  <Button
67
- kind={KIND.minimal}
67
+ kind={KIND.tertiary}
68
68
  size={SIZE.compact}
69
69
  onClick={() => {
70
70
  onReset();
@@ -74,7 +74,7 @@ export default function Filter(props: FilterProps) {
74
74
  </Button>
75
75
 
76
76
  {props.hasCloseButton && (
77
- <Button kind={KIND.minimal} size={SIZE.compact} onClick={close}>
77
+ <Button kind={KIND.tertiary} size={SIZE.compact} onClick={close}>
78
78
  Close
79
79
  </Button>
80
80
  )}
@@ -251,7 +251,7 @@ var customColorStates = (_customColorStates = {}, _defineProperty(_customColorSt
251
251
  return {
252
252
  color: customOnRamp(color, theme.colors.tagFontDisabledRampUnit),
253
253
  backgroundColor: null,
254
- borderColor: customOnRamp(color, theme.colors.tagOutlinedDisabledRampUnit)
254
+ borderColor: customOnRamp(color, theme.colors.tagSolidDisabledRampUnit)
255
255
  };
256
256
  }), _defineProperty(_customColorStates, COLOR_STATE.solid, function (theme, color) {
257
257
  return {
@@ -217,7 +217,7 @@ const customColorStates = {
217
217
  [COLOR_STATE.disabled]: (theme, color) => ({
218
218
  color: customOnRamp(color, theme.colors.tagFontDisabledRampUnit),
219
219
  backgroundColor: null,
220
- borderColor: customOnRamp(color, theme.colors.tagOutlinedDisabledRampUnit),
220
+ borderColor: customOnRamp(color, theme.colors.tagSolidDisabledRampUnit),
221
221
  }),
222
222
  [COLOR_STATE.solid]: (theme, color) => ({
223
223
  color: customOnRamp(color, theme.colors.tagSolidFontRampUnit),
package/theme.ts CHANGED
@@ -120,8 +120,6 @@ export interface Colors {
120
120
  black: string;
121
121
 
122
122
  // Rating Palette
123
- rating200: string;
124
- rating400: string;
125
123
  ratingInactiveFill: string;
126
124
  ratingStroke: string;
127
125
 
@@ -199,30 +197,6 @@ export interface Colors {
199
197
 
200
198
  /* ---- End of Semantic Colors ---- */
201
199
 
202
- /* ---- Deprecated Semantic Colors ---- */
203
-
204
- // Font Color
205
- colorPrimary: string;
206
- colorSecondary: string;
207
-
208
- // Background
209
- background: string;
210
- backgroundAlt: string;
211
- backgroundInv: string;
212
-
213
- // Foreground
214
- foreground: string;
215
- foregroundAlt: string;
216
- foregroundInv: string;
217
-
218
- // Borders
219
- border: string;
220
- borderAlt: string;
221
- borderFocus: string;
222
- borderError: string;
223
-
224
- /* ---- End of Deprecated Semantic Colors ---- */
225
-
226
200
  /* ---- Component Specific Colors ---- */
227
201
 
228
202
  // Buttons
@@ -250,14 +224,6 @@ export interface Colors {
250
224
  buttonTertiarySelectedFill: string;
251
225
  buttonTertiarySpinnerForeground: string;
252
226
  buttonTertiarySpinnerBackground: string;
253
- buttonMinimalFill: string;
254
- buttonMinimalText: string;
255
- buttonMinimalHover: string;
256
- buttonMinimalActive: string;
257
- buttonMinimalSelectedText: string;
258
- buttonMinimalSelectedFill: string;
259
- buttonMinimalSpinnerForeground: string;
260
- buttonMinimalSpinnerBackground: string;
261
227
  buttonDisabledFill: string;
262
228
  buttonDisabledText: string;
263
229
  buttonDisabledSpinnerForeground: string;
@@ -268,12 +234,6 @@ export interface Colors {
268
234
  breadcrumbsSeparatorFill: string;
269
235
 
270
236
  // Datepicker
271
- datepickerBackground: string;
272
- datepickerDayFont: string;
273
- datepickerDayFontDisabled: string;
274
- datepickerDayPseudoSelected: string;
275
- datepickerDayPseudoHighlighted: string;
276
-
277
237
  calendarBackground: string;
278
238
  calendarForeground: string;
279
239
  calendarForegroundDisabled: string;
@@ -310,15 +270,12 @@ export interface Colors {
310
270
  // Lists
311
271
  listHeaderFill: string;
312
272
  listBodyFill: string;
313
- listIconFill: string;
314
- listBorder: string;
315
273
 
316
274
  // ProgressSteps
317
275
  progressStepsCompletedText: string;
318
276
  progressStepsCompletedFill: string;
319
277
  progressStepsActiveText: string;
320
278
  progressStepsActiveFill: string;
321
- progressStepsIconActiveFill: string;
322
279
 
323
280
  // Toggle
324
281
  toggleFill: string;
@@ -351,24 +308,13 @@ export interface Colors {
351
308
  sliderTrackFill: string;
352
309
  sliderTrackFillHover: string;
353
310
  sliderTrackFillActive: string;
354
- sliderTrackFillSelected: string;
355
- sliderTrackFillSelectedHover: string;
356
- sliderTrackFillSelectedActive: string;
357
311
  sliderTrackFillDisabled: string;
358
312
  sliderHandleFill: string;
359
- sliderHandleFillHover: string;
360
- sliderHandleFillActive: string;
361
- sliderHandleFillSelected: string;
362
- sliderHandleFillSelectedHover: string;
363
- sliderHandleFillSelectedActive: string;
364
313
  sliderHandleFillDisabled: string;
365
314
  sliderHandleInnerFill: string;
366
315
  sliderHandleInnerFillDisabled: string;
367
316
  sliderHandleInnerFillSelectedHover: string;
368
317
  sliderHandleInnerFillSelectedActive: string;
369
- sliderBorder: string;
370
- sliderBorderHover: string;
371
- sliderBorderDisabled: string;
372
318
 
373
319
  // Input
374
320
  inputBorder: string;
@@ -387,8 +333,6 @@ export interface Colors {
387
333
  inputPlaceholderDisabled: string;
388
334
 
389
335
  // Notification
390
- notificationPrimaryBackground: string;
391
- notificationPrimaryText: string;
392
336
  notificationInfoBackground: string;
393
337
  notificationInfoText: string;
394
338
  notificationPositiveBackground: string;
@@ -411,12 +355,6 @@ export interface Colors {
411
355
  modalCloseColorHover: string;
412
356
  modalCloseColorFocus: string;
413
357
 
414
- // Pagination
415
- paginationTriangleDown: string;
416
-
417
- // Header navigation
418
- headerNavigationFill: string;
419
-
420
358
  // Tab
421
359
  tabBarFill: string;
422
360
  tabColor: string;
@@ -426,18 +364,6 @@ export interface Colors {
426
364
  shadowError: string;
427
365
 
428
366
  // Tag
429
-
430
- // Remove this section of theme values in next major version
431
- tagBackground: string;
432
- tagNeutralBackground: string;
433
- tagPrimaryBackground: string;
434
- tagPositiveBackground: string;
435
- tagWarningBackground: string;
436
- tagNegativeBackground: string;
437
- tagRGBGradient: string;
438
- tagRGBGradientSecondary: string;
439
- // ^^^^^^^
440
-
441
367
  tagSolidRampUnit: string;
442
368
  tagSolidHoverRampUnit: string;
443
369
  tagSolidActiveRampUnit: string;
@@ -447,13 +373,11 @@ export interface Colors {
447
373
  tagLightRampUnit: string;
448
374
  tagLightHoverRampUnit: string;
449
375
  tagLightActiveRampUnit: string;
450
- tagLightDisabledRampUnit: string;
451
376
  tagLightFontRampUnit: string;
452
377
  tagLightFontHoverRampUnit: string;
453
378
  tagOutlinedRampUnit: string;
454
379
  tagOutlinedHoverRampUnit: string;
455
380
  tagOutlinedActiveRampUnit: string;
456
- tagOutlinedDisabledRampUnit: string;
457
381
  tagOutlinedFontRampUnit: string;
458
382
  tagOutlinedFontHoverRampUnit: string;
459
383
  tagFontDisabledRampUnit: string;
@@ -589,7 +513,6 @@ export interface Colors {
589
513
 
590
514
  // Toast
591
515
  toastText: string;
592
- toastPrimaryBackground: string;
593
516
  toastInfoBackground: string;
594
517
  toastPositiveBackground: string;
595
518
  toastWarningBackground: string;
@@ -858,9 +781,5 @@ export interface ThemePrimitives {
858
781
  mono900: string;
859
782
  mono1000: string;
860
783
 
861
- // Rating Palette
862
- rating200: string;
863
- rating400: string;
864
-
865
784
  primaryFontFamily: string;
866
785
  }
@@ -52,14 +52,6 @@ var _default = function _default() {
52
52
  buttonTertiaryDisabledActiveText: themePrimitives.mono300,
53
53
  buttonTertiarySpinnerForeground: themePrimitives.primary50,
54
54
  buttonTertiarySpinnerBackground: themePrimitives.primary500,
55
- buttonMinimalFill: 'transparent',
56
- buttonMinimalText: themePrimitives.primary,
57
- buttonMinimalHover: themePrimitives.primary700,
58
- buttonMinimalActive: themePrimitives.primary600,
59
- buttonMinimalSelectedText: themePrimitives.primary,
60
- buttonMinimalSelectedFill: themePrimitives.primary600,
61
- buttonMinimalSpinnerForeground: themePrimitives.primary50,
62
- buttonMinimalSpinnerBackground: themePrimitives.primary500,
63
55
  buttonDisabledFill: themePrimitives.mono600,
64
56
  buttonDisabledText: themePrimitives.mono300,
65
57
  buttonDisabledActiveFill: themePrimitives.mono200,
@@ -70,12 +62,6 @@ var _default = function _default() {
70
62
  breadcrumbsText: themePrimitives.mono100,
71
63
  breadcrumbsSeparatorFill: themePrimitives.mono200,
72
64
  // Datepicker
73
- datepickerBackground: themePrimitives.mono600,
74
- datepickerDayFont: themePrimitives.white,
75
- datepickerDayFontDisabled: themePrimitives.mono100,
76
- datepickerDayPseudoSelected: themePrimitives.mono500,
77
- datepickerDayPseudoHighlighted: themePrimitives.mono600,
78
- // Calendar
79
65
  calendarBackground: themePrimitives.mono800,
80
66
  calendarForeground: themePrimitives.white,
81
67
  calendarForegroundDisabled: themePrimitives.mono300,
@@ -83,7 +69,6 @@ var _default = function _default() {
83
69
  calendarHeaderForeground: themePrimitives.primary,
84
70
  calendarHeaderBackgroundActive: themePrimitives.primary600,
85
71
  calendarHeaderForegroundDisabled: themePrimitives.primary500,
86
- calendarDayBackgroundPseudoSelected: themePrimitives.primary700,
87
72
  calendarDayForegroundPseudoSelected: themePrimitives.primary,
88
73
  calendarDayBackgroundPseudoSelectedHighlighted: themePrimitives.primary600,
89
74
  calendarDayForegroundPseudoSelectedHighlighted: themePrimitives.primary,
@@ -108,21 +93,16 @@ var _default = function _default() {
108
93
  // List
109
94
  listHeaderFill: themePrimitives.mono600,
110
95
  listBodyFill: themePrimitives.mono800,
111
- listIconFill: themePrimitives.mono100,
112
- listBorder: themePrimitives.mono500,
113
96
  // ProgressSteps
114
97
  progressStepsCompletedText: themePrimitives.black,
115
98
  progressStepsCompletedFill: themePrimitives.primary,
116
99
  progressStepsActiveText: themePrimitives.black,
117
100
  progressStepsActiveFill: themePrimitives.primary,
118
- progressStepsIconActiveFill: themePrimitives.primary,
119
101
  // Modal
120
102
  modalCloseColor: themePrimitives.mono300,
121
103
  modalCloseColorHover: themePrimitives.mono400,
122
104
  modalCloseColorFocus: themePrimitives.mono400,
123
105
  // Notification
124
- notificationPrimaryBackground: themePrimitives.primary700,
125
- notificationPrimaryText: themePrimitives.primaryA,
126
106
  notificationInfoBackground: themePrimitives.accent700,
127
107
  notificationInfoText: themePrimitives.primaryA,
128
108
  notificationPositiveBackground: themePrimitives.positive700,
@@ -134,7 +114,6 @@ var _default = function _default() {
134
114
  // Tag
135
115
  // Custom ramps
136
116
  tagFontDisabledRampUnit: '600',
137
- tagOutlinedDisabledRampUnit: '700',
138
117
  tagSolidFontRampUnit: '0',
139
118
  tagSolidRampUnit: '500',
140
119
  tagOutlinedFontRampUnit: '500',
@@ -147,7 +126,6 @@ var _default = function _default() {
147
126
  tagLightRampUnit: '700',
148
127
  tagLightHoverRampUnit: '700',
149
128
  tagLightActiveRampUnit: '600',
150
- tagLightDisabledRampUnit: '700',
151
129
  tagLightFontRampUnit: '100',
152
130
  tagLightFontHoverRampUnit: '100',
153
131
  tagOutlinedActiveRampUnit: '300',
@@ -290,7 +268,6 @@ var _default = function _default() {
290
268
  tableFilterFooterBackground: themePrimitives.mono800,
291
269
  // Toast
292
270
  toastText: themePrimitives.white,
293
- toastPrimaryBackground: themePrimitives.primary400,
294
271
  toastPrimaryText: themePrimitives.white,
295
272
  toastInfoBackground: themePrimitives.accent400,
296
273
  toastInfoText: themePrimitives.white,
@@ -330,23 +307,12 @@ var _default = function _default() {
330
307
  sliderHandleFill: themePrimitives.primaryA,
331
308
  sliderHandleFillDisabled: themePrimitives.primary500,
332
309
  sliderHandleInnerFill: themePrimitives.primaryA,
333
- sliderHandleFillHover: themePrimitives.mono300,
334
- sliderHandleFillActive: themePrimitives.mono300,
335
- sliderHandleFillSelected: themePrimitives.primary500,
336
- sliderHandleFillSelectedHover: themePrimitives.primary600,
337
- sliderHandleFillSelectedActive: themePrimitives.primary700,
338
310
  sliderTrackFillHover: themePrimitives.mono500,
339
311
  sliderTrackFillActive: themePrimitives.mono400,
340
- sliderTrackFillSelected: themePrimitives.primary500,
341
- sliderTrackFillSelectedActive: themePrimitives.primary600,
342
- sliderTrackFillSelectedHover: themePrimitives.primary700,
343
312
  sliderTrackFillDisabled: themePrimitives.mono700,
344
313
  sliderHandleInnerFillDisabled: themePrimitives.mono500,
345
314
  sliderHandleInnerFillSelectedHover: themePrimitives.primary600,
346
315
  sliderHandleInnerFillSelectedActive: themePrimitives.primary700,
347
- sliderBorder: themePrimitives.white,
348
- sliderBorderHover: themePrimitives.white,
349
- sliderBorderDisabled: themePrimitives.mono400,
350
316
  // Input
351
317
  inputBorder: themePrimitives.mono600,
352
318
  inputFill: themePrimitives.mono600,
@@ -369,10 +335,6 @@ var _default = function _default() {
369
335
  menuFontDisabled: themePrimitives.mono400,
370
336
  menuFontHighlighted: themePrimitives.white,
371
337
  menuFontSelected: themePrimitives.white,
372
- // Pagination
373
- paginationTriangleDown: themePrimitives.mono100,
374
- // Header navigation
375
- headerNavigationFill: themePrimitives.mono700,
376
338
  // Tab
377
339
  tabBarFill: themePrimitives.mono1000,
378
340
  tabColor: themePrimitives.mono300,