baseui 0.0.0-next-e8c3307 → 0.0.0-next-6acb60a

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 (33) hide show
  1. package/datepicker/calendar-header.js +227 -95
  2. package/datepicker/calendar-header.js.flow +270 -139
  3. package/datepicker/constants.js +4 -2
  4. package/datepicker/constants.js.flow +2 -0
  5. package/datepicker/utils/calendar-header-helpers.js +51 -0
  6. package/datepicker/utils/calendar-header-helpers.js.flow +53 -0
  7. package/drawer/drawer.js +2 -1
  8. package/drawer/drawer.js.flow +1 -1
  9. package/es/datepicker/calendar-header.js +184 -84
  10. package/es/datepicker/constants.js +2 -1
  11. package/es/datepicker/utils/calendar-header-helpers.js +34 -0
  12. package/es/drawer/drawer.js +2 -1
  13. package/es/popover/stateful-container.js +4 -0
  14. package/es/snackbar/snackbar-context.js +16 -4
  15. package/es/themes/dark-theme/color-component-tokens.js +1 -1
  16. package/es/themes/light-theme/color-component-tokens.js +9 -9
  17. package/esm/datepicker/calendar-header.js +226 -95
  18. package/esm/datepicker/constants.js +2 -1
  19. package/esm/datepicker/utils/calendar-header-helpers.js +45 -0
  20. package/esm/drawer/drawer.js +2 -1
  21. package/esm/popover/stateful-container.js +4 -0
  22. package/esm/snackbar/snackbar-context.js +16 -4
  23. package/esm/themes/dark-theme/color-component-tokens.js +1 -1
  24. package/esm/themes/light-theme/color-component-tokens.js +9 -9
  25. package/package.json +1 -1
  26. package/popover/stateful-container.js +4 -0
  27. package/popover/stateful-container.js.flow +3 -0
  28. package/snackbar/snackbar-context.js +15 -4
  29. package/snackbar/snackbar-context.js.flow +15 -3
  30. package/themes/dark-theme/color-component-tokens.js +1 -1
  31. package/themes/dark-theme/color-component-tokens.js.flow +1 -1
  32. package/themes/light-theme/color-component-tokens.js +9 -9
  33. package/themes/light-theme/color-component-tokens.js.flow +9 -9
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "baseui",
3
- "version": "0.0.0-next-e8c3307",
3
+ "version": "0.0.0-next-6acb60a",
4
4
  "description": "A React Component library implementing the Base design language",
5
5
  "keywords": [
6
6
  "react",
package/popover/stateful-container.js CHANGED
@@ -70,6 +70,10 @@ var StatefulContainer = /*#__PURE__*/function (_React$Component) {
70
70
  _this.props.onBlur(e);
71
71
  }
72
72
 
73
+ if (_this.props.focusLock || _this.props.autoFocus) {
74
+ return;
75
+ }
76
+
73
77
  _this.close();
74
78
  });
75
79
 
package/popover/stateful-container.js.flow CHANGED
@@ -52,6 +52,9 @@ class StatefulContainer extends React.Component<
52
52
  if (this.props.onBlur) {
53
53
  this.props.onBlur(e);
54
54
  }
55
+ if (this.props.focusLock || this.props.autoFocus) {
56
+ return;
57
+ }
55
58
  this.close();
56
59
  };
57
60
 
package/snackbar/snackbar-context.js CHANGED
@@ -81,6 +81,14 @@ function useSnackbar() {
81
81
  };
82
82
  }
83
83
 
84
+ function usePrevious(value) {
85
+ var ref = React.useRef();
86
+ React.useEffect(function () {
87
+ ref.current = value;
88
+ });
89
+ return ref.current;
90
+ }
91
+
84
92
  function SnackbarProvider(_ref) {
85
93
  var children = _ref.children,
86
94
  _ref$overrides = _ref.overrides,
@@ -115,10 +123,6 @@ function SnackbarProvider(_ref) {
115
123
  function enqueue(elementProps) {
116
124
  var duration = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultDuration;
117
125
  setSnackbars(function (prev) {
118
- if (prev.length === 0) {
119
- enter(duration);
120
- }
121
-
122
126
  return [].concat(_toConsumableArray(prev), [{
123
127
  elementProps: elementProps,
124
128
  duration: duration
@@ -126,6 +130,13 @@ function SnackbarProvider(_ref) {
126
130
  });
127
131
  }
128
132
 
133
+ var prevSnackbars = usePrevious(snackbars) || [];
134
+ React.useEffect(function () {
135
+ if (prevSnackbars.length === 0 && snackbars.length >= 1) {
136
+ enter(snackbars[0].duration);
137
+ }
138
+ }, [snackbars, prevSnackbars]);
139
+
129
140
  function dequeue() {
130
141
  setContainerHeight(0);
131
142
  setSnackbars(function (prev) {
package/snackbar/snackbar-context.js.flow CHANGED
@@ -43,6 +43,14 @@ export function useSnackbar() {
43
43
  return {enqueue: context.enqueue, dequeue: context.dequeue};
44
44
  }
45
45
 
46
+ function usePrevious(value) {
47
+ const ref = React.useRef();
48
+ React.useEffect(() => {
49
+ ref.current = value;
50
+ });
51
+ return ref.current;
52
+ }
53
+
46
54
  export default function SnackbarProvider({
47
55
  children,
48
56
  overrides = {},
@@ -61,13 +69,17 @@ export default function SnackbarProvider({
61
69
 
62
70
  function enqueue(elementProps, duration = defaultDuration) {
63
71
  setSnackbars(prev => {
64
- if (prev.length === 0) {
65
- enter(duration);
66
- }
67
72
  return [...prev, {elementProps, duration}];
68
73
  });
69
74
  }
70
75
 
76
+ const prevSnackbars = usePrevious(snackbars) || [];
77
+ React.useEffect(() => {
78
+ if (prevSnackbars.length === 0 && snackbars.length >= 1) {
79
+ enter(snackbars[0].duration);
80
+ }
81
+ }, [snackbars, prevSnackbars]);
82
+
71
83
  function dequeue() {
72
84
  setContainerHeight(0);
73
85
 
package/themes/dark-theme/color-component-tokens.js CHANGED
@@ -103,7 +103,7 @@ var _default = function _default() {
103
103
  linkActive: themePrimitives.primary300,
104
104
  // List
105
105
  listHeaderFill: themePrimitives.mono600,
106
- listBodyFill: themePrimitives.mono700,
106
+ listBodyFill: themePrimitives.mono800,
107
107
  listIconFill: themePrimitives.mono100,
108
108
  listBorder: themePrimitives.mono500,
109
109
  // ProgressSteps
package/themes/dark-theme/color-component-tokens.js.flow CHANGED
@@ -107,7 +107,7 @@ export default (
107
107
 
108
108
  // List
109
109
  listHeaderFill: themePrimitives.mono600,
110
- listBodyFill: themePrimitives.mono700,
110
+ listBodyFill: themePrimitives.mono800,
111
111
  listIconFill: themePrimitives.mono100,
112
112
  listBorder: themePrimitives.mono500,
113
113
 
package/themes/light-theme/color-component-tokens.js CHANGED
@@ -32,32 +32,32 @@ var _default = function _default() {
32
32
  buttonPrimaryActive: themePrimitives.primary600,
33
33
  buttonPrimarySelectedFill: themePrimitives.primary600,
34
34
  buttonPrimarySelectedText: themePrimitives.white,
35
- buttonPrimarySpinnerForeground: themePrimitives.primary50,
36
- buttonPrimarySpinnerBackground: themePrimitives.primary500,
35
+ buttonPrimarySpinnerForeground: themePrimitives.accent,
36
+ buttonPrimarySpinnerBackground: themePrimitives.primaryB,
37
37
  buttonSecondaryFill: themePrimitives.primary100,
38
38
  buttonSecondaryText: themePrimitives.primary,
39
39
  buttonSecondaryHover: themePrimitives.primary200,
40
40
  buttonSecondaryActive: themePrimitives.primary300,
41
41
  buttonSecondarySelectedFill: themePrimitives.primary300,
42
42
  buttonSecondarySelectedText: themePrimitives.primary,
43
- buttonSecondarySpinnerForeground: themePrimitives.primary700,
44
- buttonSecondarySpinnerBackground: themePrimitives.primary300,
43
+ buttonSecondarySpinnerForeground: themePrimitives.accent,
44
+ buttonSecondarySpinnerBackground: themePrimitives.primaryB,
45
45
  buttonTertiaryFill: 'transparent',
46
46
  buttonTertiaryText: themePrimitives.primary,
47
47
  buttonTertiaryHover: themePrimitives.primary50,
48
48
  buttonTertiaryActive: themePrimitives.primary100,
49
49
  buttonTertiarySelectedFill: themePrimitives.primary100,
50
50
  buttonTertiarySelectedText: themePrimitives.primary,
51
- buttonTertiarySpinnerForeground: themePrimitives.primary700,
52
- buttonTertiarySpinnerBackground: themePrimitives.primary300,
51
+ buttonTertiarySpinnerForeground: themePrimitives.accent,
52
+ buttonTertiarySpinnerBackground: themePrimitives.primary100,
53
53
  buttonMinimalFill: 'transparent',
54
54
  buttonMinimalText: themePrimitives.primary,
55
55
  buttonMinimalHover: themePrimitives.primary50,
56
56
  buttonMinimalActive: themePrimitives.primary100,
57
57
  buttonMinimalSelectedFill: themePrimitives.primary100,
58
58
  buttonMinimalSelectedText: themePrimitives.primary,
59
- buttonMinimalSpinnerForeground: themePrimitives.primary700,
60
- buttonMinimalSpinnerBackground: themePrimitives.primary300,
59
+ buttonMinimalSpinnerForeground: themePrimitives.accent,
60
+ buttonMinimalSpinnerBackground: themePrimitives.primary100,
61
61
  buttonDisabledFill: themePrimitives.mono200,
62
62
  buttonDisabledText: themePrimitives.mono600,
63
63
  buttonDisabledSpinnerForeground: themePrimitives.mono600,
@@ -103,7 +103,7 @@ var _default = function _default() {
103
103
  linkActive: themePrimitives.primary500,
104
104
  // List
105
105
  listHeaderFill: themePrimitives.white,
106
- listBodyFill: themePrimitives.mono200,
106
+ listBodyFill: themePrimitives.white,
107
107
  listIconFill: themePrimitives.mono500,
108
108
  listBorder: themePrimitives.mono500,
109
109
  // ProgressSteps
package/themes/light-theme/color-component-tokens.js.flow CHANGED
@@ -25,8 +25,8 @@ export default (
25
25
  buttonPrimaryActive: themePrimitives.primary600,
26
26
  buttonPrimarySelectedFill: themePrimitives.primary600,
27
27
  buttonPrimarySelectedText: themePrimitives.white,
28
- buttonPrimarySpinnerForeground: themePrimitives.primary50,
29
- buttonPrimarySpinnerBackground: themePrimitives.primary500,
28
+ buttonPrimarySpinnerForeground: themePrimitives.accent,
29
+ buttonPrimarySpinnerBackground: themePrimitives.primaryB,
30
30
 
31
31
  buttonSecondaryFill: themePrimitives.primary100,
32
32
  buttonSecondaryText: themePrimitives.primary,
@@ -34,8 +34,8 @@ export default (
34
34
  buttonSecondaryActive: themePrimitives.primary300,
35
35
  buttonSecondarySelectedFill: themePrimitives.primary300,
36
36
  buttonSecondarySelectedText: themePrimitives.primary,
37
- buttonSecondarySpinnerForeground: themePrimitives.primary700,
38
- buttonSecondarySpinnerBackground: themePrimitives.primary300,
37
+ buttonSecondarySpinnerForeground: themePrimitives.accent,
38
+ buttonSecondarySpinnerBackground: themePrimitives.primaryB,
39
39
 
40
40
  buttonTertiaryFill: 'transparent',
41
41
  buttonTertiaryText: themePrimitives.primary,
@@ -43,8 +43,8 @@ export default (
43
43
  buttonTertiaryActive: themePrimitives.primary100,
44
44
  buttonTertiarySelectedFill: themePrimitives.primary100,
45
45
  buttonTertiarySelectedText: themePrimitives.primary,
46
- buttonTertiarySpinnerForeground: themePrimitives.primary700,
47
- buttonTertiarySpinnerBackground: themePrimitives.primary300,
46
+ buttonTertiarySpinnerForeground: themePrimitives.accent,
47
+ buttonTertiarySpinnerBackground: themePrimitives.primary100,
48
48
 
49
49
  buttonMinimalFill: 'transparent',
50
50
  buttonMinimalText: themePrimitives.primary,
@@ -52,8 +52,8 @@ export default (
52
52
  buttonMinimalActive: themePrimitives.primary100,
53
53
  buttonMinimalSelectedFill: themePrimitives.primary100,
54
54
  buttonMinimalSelectedText: themePrimitives.primary,
55
- buttonMinimalSpinnerForeground: themePrimitives.primary700,
56
- buttonMinimalSpinnerBackground: themePrimitives.primary300,
55
+ buttonMinimalSpinnerForeground: themePrimitives.accent,
56
+ buttonMinimalSpinnerBackground: themePrimitives.primary100,
57
57
 
58
58
  buttonDisabledFill: themePrimitives.mono200,
59
59
  buttonDisabledText: themePrimitives.mono600,
@@ -107,7 +107,7 @@ export default (
107
107
 
108
108
  // List
109
109
  listHeaderFill: themePrimitives.white,
110
- listBodyFill: themePrimitives.mono200,
110
+ listBodyFill: themePrimitives.white,
111
111
  listIconFill: themePrimitives.mono500,
112
112
  listBorder: themePrimitives.mono500,
113
113