baseui 10.0.0 → 10.3.0

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 (162) hide show
  1. package/app-nav-bar/index.d.ts +24 -0
  2. package/app-nav-bar/mobile-menu.js +5 -3
  3. package/app-nav-bar/mobile-menu.js.flow +3 -2
  4. package/app-nav-bar/user-menu.js +5 -3
  5. package/app-nav-bar/user-menu.js.flow +3 -2
  6. package/block/index.d.ts +7 -0
  7. package/combobox/combobox.js +4 -9
  8. package/combobox/combobox.js.flow +4 -3
  9. package/combobox/index.d.ts +1 -1
  10. package/data-table/filter-menu.js +5 -3
  11. package/data-table/filter-menu.js.flow +3 -2
  12. package/data-table/header-cell.js +1 -1
  13. package/data-table/header-cell.js.flow +1 -1
  14. package/datepicker/calendar.js +6 -1
  15. package/datepicker/calendar.js.flow +4 -0
  16. package/datepicker/datepicker.js +1 -1
  17. package/datepicker/datepicker.js.flow +5 -2
  18. package/datepicker/index.d.ts +9 -1
  19. package/datepicker/month.js +2 -1
  20. package/datepicker/month.js.flow +8 -1
  21. package/datepicker/types.js.flow +13 -6
  22. package/es/app-nav-bar/mobile-menu.js +5 -5
  23. package/es/app-nav-bar/user-menu.js +5 -5
  24. package/es/combobox/combobox.js +4 -3
  25. package/es/data-table/filter-menu.js +3 -2
  26. package/es/data-table/header-cell.js +1 -1
  27. package/es/datepicker/calendar.js +6 -1
  28. package/es/datepicker/datepicker.js +1 -1
  29. package/es/datepicker/month.js +2 -1
  30. package/es/form-control/form-control.js +6 -14
  31. package/es/helper/helper.js +10 -6
  32. package/es/helpers/base-provider.js +4 -1
  33. package/es/input/input.js +9 -5
  34. package/es/layer/layer.js +5 -1
  35. package/es/layout-grid/grid.js +16 -10
  36. package/es/layout-grid/styled-components.js +24 -12
  37. package/es/list/index.js +1 -0
  38. package/es/list/list-heading.js +77 -0
  39. package/es/list/list-item.js +1 -1
  40. package/es/list/menu-adapter.js +4 -2
  41. package/es/list/styled-components.js +101 -4
  42. package/es/menu/stateful-container.js +41 -27
  43. package/es/phone-input/base-country-picker.js +2 -0
  44. package/es/popover/popover.js +21 -10
  45. package/es/select/select-component.js +34 -22
  46. package/es/table-semantic/styled-components.js +8 -10
  47. package/es/table-semantic/table-builder.js +3 -2
  48. package/es/table-semantic/table.js +1 -0
  49. package/es/tag/index.js +1 -1
  50. package/es/tag/styled-components.js +2 -4
  51. package/es/tag/tag.js +16 -16
  52. package/es/textarea/textarea.js +1 -2
  53. package/es/themes/dark-theme/color-semantic-tokens.js +18 -8
  54. package/es/themes/light-theme/color-semantic-tokens.js +14 -4
  55. package/es/tokens/colors.js +3 -3
  56. package/es/tree-view/tree-view.js +0 -2
  57. package/esm/app-nav-bar/mobile-menu.js +5 -3
  58. package/esm/app-nav-bar/user-menu.js +5 -3
  59. package/esm/combobox/combobox.js +4 -7
  60. package/esm/data-table/filter-menu.js +4 -3
  61. package/esm/data-table/header-cell.js +1 -1
  62. package/esm/datepicker/calendar.js +6 -1
  63. package/esm/datepicker/datepicker.js +1 -1
  64. package/esm/datepicker/month.js +2 -1
  65. package/esm/form-control/form-control.js +21 -33
  66. package/esm/helper/helper.js +10 -6
  67. package/esm/helpers/base-provider.js +4 -1
  68. package/esm/input/input.js +9 -5
  69. package/esm/layer/layer.js +5 -1
  70. package/esm/layout-grid/grid.js +20 -10
  71. package/esm/layout-grid/styled-components.js +52 -35
  72. package/esm/list/index.js +1 -0
  73. package/esm/list/list-heading.js +116 -0
  74. package/esm/list/list-item.js +1 -1
  75. package/esm/list/menu-adapter.js +4 -2
  76. package/esm/list/styled-components.js +99 -3
  77. package/esm/menu/stateful-container.js +56 -40
  78. package/esm/phone-input/base-country-picker.js +2 -0
  79. package/esm/popover/popover.js +25 -16
  80. package/esm/select/select-component.js +87 -79
  81. package/esm/table-semantic/styled-components.js +8 -10
  82. package/esm/table-semantic/table-builder.js +3 -2
  83. package/esm/table-semantic/table.js +1 -0
  84. package/esm/tag/index.js +1 -1
  85. package/esm/tag/styled-components.js +2 -4
  86. package/esm/tag/tag.js +18 -16
  87. package/esm/textarea/textarea.js +1 -2
  88. package/esm/themes/dark-theme/color-semantic-tokens.js +18 -8
  89. package/esm/themes/light-theme/color-semantic-tokens.js +14 -4
  90. package/esm/tokens/colors.js +3 -3
  91. package/esm/tree-view/tree-view.js +0 -2
  92. package/form-control/form-control.js +21 -35
  93. package/form-control/form-control.js.flow +37 -35
  94. package/helper/helper.js +10 -6
  95. package/helper/helper.js.flow +1 -0
  96. package/helpers/base-provider.js +5 -1
  97. package/helpers/base-provider.js.flow +4 -1
  98. package/index.d.ts +1 -0
  99. package/input/input.js +9 -5
  100. package/input/input.js.flow +9 -5
  101. package/layer/layer.js +5 -1
  102. package/layer/layer.js.flow +3 -1
  103. package/layer/types.js.flow +4 -0
  104. package/layout-grid/grid.js +19 -9
  105. package/layout-grid/grid.js.flow +52 -26
  106. package/layout-grid/index.d.ts +1 -0
  107. package/layout-grid/styled-components.js +54 -36
  108. package/layout-grid/styled-components.js.flow +48 -24
  109. package/layout-grid/types.js.flow +12 -0
  110. package/list/index.js +9 -0
  111. package/list/index.js.flow +1 -0
  112. package/list/list-heading.js +124 -0
  113. package/list/list-heading.js.flow +138 -0
  114. package/list/list-item.js +1 -1
  115. package/list/list-item.js.flow +1 -1
  116. package/list/menu-adapter.js +5 -2
  117. package/list/menu-adapter.js.flow +21 -11
  118. package/list/styled-components.js +108 -5
  119. package/list/styled-components.js.flow +103 -2
  120. package/list/types.js.flow +22 -0
  121. package/menu/stateful-container.js +57 -42
  122. package/menu/stateful-container.js.flow +38 -26
  123. package/package.json +1 -1
  124. package/phone-input/base-country-picker.js +2 -0
  125. package/phone-input/base-country-picker.js.flow +2 -0
  126. package/popover/popover.js +26 -17
  127. package/popover/popover.js.flow +19 -7
  128. package/select/select-component.js +87 -79
  129. package/select/select-component.js.flow +119 -103
  130. package/snackbar/index.d.ts +3 -3
  131. package/snackbar/types.js.flow +1 -1
  132. package/table-semantic/index.d.ts +1 -0
  133. package/table-semantic/styled-components.js +8 -10
  134. package/table-semantic/styled-components.js.flow +20 -20
  135. package/table-semantic/table-builder.js +3 -2
  136. package/table-semantic/table-builder.js.flow +3 -2
  137. package/table-semantic/table.js +1 -0
  138. package/table-semantic/table.js.flow +1 -0
  139. package/tag/index.d.ts +0 -1
  140. package/tag/index.js +0 -6
  141. package/tag/index.js.flow +0 -1
  142. package/tag/styled-components.js +3 -6
  143. package/tag/styled-components.js.flow +0 -2
  144. package/tag/tag.js +19 -14
  145. package/tag/tag.js.flow +13 -19
  146. package/textarea/textarea.js +1 -2
  147. package/textarea/textarea.js.flow +0 -1
  148. package/theme.ts +12 -0
  149. package/themes/dark-theme/color-semantic-tokens.js +18 -8
  150. package/themes/dark-theme/color-semantic-tokens.js.flow +18 -7
  151. package/themes/light-theme/color-semantic-tokens.js +14 -4
  152. package/themes/light-theme/color-semantic-tokens.js.flow +14 -3
  153. package/themes/types.js.flow +11 -0
  154. package/toast/index.d.ts +1 -0
  155. package/tokens/colors.js +3 -3
  156. package/tokens/colors.js.flow +3 -3
  157. package/tree-view/tree-view.js +0 -2
  158. package/tree-view/tree-view.js.flow +0 -1
  159. package/es/utils/get-bui-id.js +0 -33
  160. package/esm/utils/get-bui-id.js +0 -33
  161. package/utils/get-bui-id.js +0 -41
  162. package/utils/get-bui-id.js.flow +0 -39
@@ -14,7 +14,7 @@ const colors: ColorTokensT = {
14
14
  gray200: '#E2E2E2',
15
15
  gray300: '#CBCBCB',
16
16
  gray400: '#AFAFAF',
17
- gray500: '#757575',
17
+ gray500: '#6B6B6B',
18
18
  gray600: '#545454',
19
19
  gray700: '#333333',
20
20
  gray800: '#1F1F1F',
@@ -55,14 +55,14 @@ const colors: ColorTokensT = {
55
55
  yellow300: '#FFCF70',
56
56
  yellow400: '#FFC043',
57
57
  yellow500: '#BC8B2C',
58
- yellow600: '#997328',
58
+ yellow600: '#996F00',
59
59
  yellow700: '#674D1B',
60
60
 
61
61
  green50: '#E6F2ED',
62
62
  green100: '#ADDEC9',
63
63
  green200: '#66D19E',
64
64
  green300: '#06C167',
65
- green400: '#05944F',
65
+ green400: '#048848',
66
66
  green500: '#03703C',
67
67
  green600: '#03582F',
68
68
  green700: '#10462D',
@@ -150,8 +150,6 @@ function TreeView(props) {
150
150
  break;
151
151
 
152
152
  default:
153
- e.preventDefault();
154
-
155
153
  if (timeOutRef.current !== null) {
156
154
  clearTimeout(timeOutRef.current);
157
155
  }
@@ -113,7 +113,6 @@ export default function TreeView(props: TreeViewPropsT) {
113
113
  );
114
114
  break;
115
115
  default:
116
- e.preventDefault();
117
116
  if (timeOutRef.current !== null) {
118
117
  clearTimeout(timeOutRef.current);
119
118
  }
@@ -1,33 +0,0 @@
1
- /*
2
- Copyright (c) Uber Technologies, Inc.
3
-
4
- This source code is licensed under the MIT license found in the
5
- LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- /**
9
- * For aria and other attributes like htmlFor, we often need
10
- * to attach identifiers to elements. Making `id` a required
11
- * prop in our components shifts this burden to our customers
12
- * but it's nice to try to automatically provide these unique
13
- * ids when possible.
14
- *
15
- * Generating unique IDs that match across server/client renders
16
- * is a hard problem that doesn't have any perfect solutions
17
- * currently [1] [2]. UUIDs/Math.random will never match, whereas
18
- * auto-incrementing IDs may work if server and client render
19
- * exactly the same DOM, so that's what we'll use here. If this
20
- * is insufficient for users they can apply ids manually.
21
- *
22
- * One other technique that we can use internally is to do a
23
- * setState in componentDidMount or something similar, so that
24
- * these ids are only used client-side, but this could of course
25
- * have perf implications.
26
- *
27
- * [1] https://github.com/facebook/react/issues/5867
28
- * [2] https://github.com/reactjs/rfcs/pull/32/files
29
- */
30
- let id = 0;
31
- export default function getBuiId() {
32
- return `bui-${++id}`;
33
- }
@@ -1,33 +0,0 @@
1
- /*
2
- Copyright (c) Uber Technologies, Inc.
3
-
4
- This source code is licensed under the MIT license found in the
5
- LICENSE file in the root directory of this source tree.
6
- */
7
-
8
- /**
9
- * For aria and other attributes like htmlFor, we often need
10
- * to attach identifiers to elements. Making `id` a required
11
- * prop in our components shifts this burden to our customers
12
- * but it's nice to try to automatically provide these unique
13
- * ids when possible.
14
- *
15
- * Generating unique IDs that match across server/client renders
16
- * is a hard problem that doesn't have any perfect solutions
17
- * currently [1] [2]. UUIDs/Math.random will never match, whereas
18
- * auto-incrementing IDs may work if server and client render
19
- * exactly the same DOM, so that's what we'll use here. If this
20
- * is insufficient for users they can apply ids manually.
21
- *
22
- * One other technique that we can use internally is to do a
23
- * setState in componentDidMount or something similar, so that
24
- * these ids are only used client-side, but this could of course
25
- * have perf implications.
26
- *
27
- * [1] https://github.com/facebook/react/issues/5867
28
- * [2] https://github.com/reactjs/rfcs/pull/32/files
29
- */
30
- var id = 0;
31
- export default function getBuiId() {
32
- return "bui-".concat(++id);
33
- }
@@ -1,41 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = getBuiId;
7
-
8
- /*
9
- Copyright (c) Uber Technologies, Inc.
10
-
11
- This source code is licensed under the MIT license found in the
12
- LICENSE file in the root directory of this source tree.
13
- */
14
-
15
- /**
16
- * For aria and other attributes like htmlFor, we often need
17
- * to attach identifiers to elements. Making `id` a required
18
- * prop in our components shifts this burden to our customers
19
- * but it's nice to try to automatically provide these unique
20
- * ids when possible.
21
- *
22
- * Generating unique IDs that match across server/client renders
23
- * is a hard problem that doesn't have any perfect solutions
24
- * currently [1] [2]. UUIDs/Math.random will never match, whereas
25
- * auto-incrementing IDs may work if server and client render
26
- * exactly the same DOM, so that's what we'll use here. If this
27
- * is insufficient for users they can apply ids manually.
28
- *
29
- * One other technique that we can use internally is to do a
30
- * setState in componentDidMount or something similar, so that
31
- * these ids are only used client-side, but this could of course
32
- * have perf implications.
33
- *
34
- * [1] https://github.com/facebook/react/issues/5867
35
- * [2] https://github.com/reactjs/rfcs/pull/32/files
36
- */
37
- var id = 0;
38
-
39
- function getBuiId() {
40
- return "bui-".concat(++id);
41
- }
@@ -1,39 +0,0 @@
1
- /*
2
- Copyright (c) Uber Technologies, Inc.
3
-
4
- This source code is licensed under the MIT license found in the
5
- LICENSE file in the root directory of this source tree.
6
- */
7
- // @flow
8
-
9
- /**
10
- * For aria and other attributes like htmlFor, we often need
11
- * to attach identifiers to elements. Making `id` a required
12
- * prop in our components shifts this burden to our customers
13
- * but it's nice to try to automatically provide these unique
14
- * ids when possible.
15
- *
16
- * Generating unique IDs that match across server/client renders
17
- * is a hard problem that doesn't have any perfect solutions
18
- * currently [1] [2]. UUIDs/Math.random will never match, whereas
19
- * auto-incrementing IDs may work if server and client render
20
- * exactly the same DOM, so that's what we'll use here. If this
21
- * is insufficient for users they can apply ids manually.
22
- *
23
- * One other technique that we can use internally is to do a
24
- * setState in componentDidMount or something similar, so that
25
- * these ids are only used client-side, but this could of course
26
- * have perf implications.
27
- *
28
- * [1] https://github.com/facebook/react/issues/5867
29
- * [2] https://github.com/reactjs/rfcs/pull/32/files
30
- */
31
- let id = 0;
32
-
33
- export default function getBuiId() {
34
- return `bui-${++id}`;
35
- }
36
-
37
- declare var __DEV__: boolean;
38
- declare var __NODE__: boolean;
39
- declare var __BROWSER__: boolean;