baseui 0.0.0-alpha-29a759d → 0.0.0-alpha-d3f908b

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 (9) hide show
  1. package/data-table/data-table.js +1 -0
  2. package/data-table/data-table.js.flow +1 -0
  3. package/data-table/measure-column-widths.js +8 -19
  4. package/data-table/measure-column-widths.js.flow +7 -16
  5. package/es/data-table/data-table.js +1 -0
  6. package/es/data-table/measure-column-widths.js +8 -15
  7. package/esm/data-table/data-table.js +1 -0
  8. package/esm/data-table/measure-column-widths.js +8 -19
  9. package/package.json +1 -1
package/data-table/data-table.js CHANGED
@@ -609,6 +609,7 @@ function DataTable(_ref2) {
609
609
  }
610
610
  }, [gridRef]);
611
611
  var handleWidthsChange = React.useCallback(function (nextWidths) {
612
+ console.log('next widths', nextWidths);
612
613
  setMeasuredWidths(nextWidths);
613
614
  resetAfterColumnIndex(0);
614
615
  }, [setMeasuredWidths, resetAfterColumnIndex]);
package/data-table/data-table.js.flow CHANGED
@@ -726,6 +726,7 @@ export function DataTable({
726
726
  );
727
727
  const handleWidthsChange = React.useCallback(
728
728
  nextWidths => {
729
+ console.log('next widths', nextWidths);
729
730
  setMeasuredWidths(nextWidths);
730
731
  resetAfterColumnIndex(0);
731
732
  },
package/data-table/measure-column-widths.js CHANGED
@@ -44,29 +44,17 @@ function MeasureColumn(_ref) {
44
44
  _useStyletron2 = _slicedToArray(_useStyletron, 1),
45
45
  css = _useStyletron2[0];
46
46
 
47
- var _React$useState = React.useState(null),
48
- _React$useState2 = _slicedToArray(_React$useState, 2),
49
- node = _React$useState2[0],
50
- setNode = _React$useState2[1];
51
-
52
- var ref = React.useCallback(function (node) {
53
- setNode(node);
54
- }, []);
47
+ var ref = React.useRef();
55
48
  React.useEffect(function () {
56
49
  if (typeof document !== 'undefined') {
57
- if (node) {
58
- onLayout(columnIndex, node.getBoundingClientRect());
50
+ if (ref.current) {
51
+ // onLayout(columnIndex, ref.current.getBoundingClientRect());
52
+ onLayout(columnIndex, {
53
+ width: 0
54
+ });
59
55
  }
60
56
  }
61
- }, [node, onLayout]); // const ref = React.useRef();
62
- // React.useEffect(() => {
63
- // if (__BROWSER__) {
64
- // if (ref.current) {
65
- // onLayout(columnIndex, ref.current.getBoundingClientRect());
66
- // }
67
- // }
68
- // }, []);
69
-
57
+ }, []);
70
58
  return /*#__PURE__*/React.createElement("div", {
71
59
  ref: ref,
72
60
  className: css({
@@ -156,6 +144,7 @@ function MeasureColumnWidths(_ref2) {
156
144
  var handleDimensionsChange = React.useCallback(function (columnIndex, dimensions) {
157
145
  console.log('handle dimensions change', columnIndex, dimensions);
158
146
  var nextWidth = Math.min(Math.max(columns[columnIndex].minWidth || 0, widthMap.get(columnIndex) || 0, dimensions.width + 1), columns[columnIndex].maxWidth || Infinity);
147
+ console.log('next width', columnIndex, nextWidth);
159
148
 
160
149
  if (nextWidth !== widthMap.get(columnIndex)) {
161
150
  widthMap.set(columnIndex, nextWidth);
package/data-table/measure-column-widths.js.flow CHANGED
@@ -25,26 +25,15 @@ function MeasureColumn({
25
25
  }) {
26
26
  const [css] = useStyletron();
27
27
 
28
- const [node, setNode] = React.useState(null);
29
- const ref = React.useCallback(node => {
30
- setNode(node);
31
- }, []);
28
+ const ref = React.useRef();
32
29
  React.useEffect(() => {
33
30
  if (__BROWSER__) {
34
- if (node) {
35
- onLayout(columnIndex, node.getBoundingClientRect());
31
+ if (ref.current) {
32
+ // onLayout(columnIndex, ref.current.getBoundingClientRect());
33
+ onLayout(columnIndex, {width: 0});
36
34
  }
37
35
  }
38
- }, [node, onLayout]);
39
-
40
- // const ref = React.useRef();
41
- // React.useEffect(() => {
42
- // if (__BROWSER__) {
43
- // if (ref.current) {
44
- // onLayout(columnIndex, ref.current.getBoundingClientRect());
45
- // }
46
- // }
47
- // }, []);
36
+ }, []);
48
37
 
49
38
  return (
50
39
  <div
@@ -154,10 +143,12 @@ export default function MeasureColumnWidths({
154
143
  ),
155
144
  columns[columnIndex].maxWidth || Infinity,
156
145
  );
146
+ console.log('next width', columnIndex, nextWidth);
157
147
 
158
148
  if (nextWidth !== widthMap.get(columnIndex)) {
159
149
  widthMap.set(columnIndex, nextWidth);
160
150
  }
151
+
161
152
  if (
162
153
  // Refresh at 100% of done
163
154
  widthMap.size === columns.length ||
package/es/data-table/data-table.js CHANGED
@@ -490,6 +490,7 @@ export function DataTable({
490
490
  }
491
491
  }, [gridRef]);
492
492
  const handleWidthsChange = React.useCallback(nextWidths => {
493
+ console.log('next widths', nextWidths);
493
494
  setMeasuredWidths(nextWidths);
494
495
  resetAfterColumnIndex(0);
495
496
  }, [setMeasuredWidths, resetAfterColumnIndex]);
package/es/data-table/measure-column-widths.js CHANGED
@@ -18,25 +18,17 @@ function MeasureColumn({
18
18
  onLayout
19
19
  }) {
20
20
  const [css] = useStyletron();
21
- const [node, setNode] = React.useState(null);
22
- const ref = React.useCallback(node => {
23
- setNode(node);
24
- }, []);
21
+ const ref = React.useRef();
25
22
  React.useEffect(() => {
26
23
  if (typeof document !== 'undefined') {
27
- if (node) {
28
- onLayout(columnIndex, node.getBoundingClientRect());
24
+ if (ref.current) {
25
+ // onLayout(columnIndex, ref.current.getBoundingClientRect());
26
+ onLayout(columnIndex, {
27
+ width: 0
28
+ });
29
29
  }
30
30
  }
31
- }, [node, onLayout]); // const ref = React.useRef();
32
- // React.useEffect(() => {
33
- // if (__BROWSER__) {
34
- // if (ref.current) {
35
- // onLayout(columnIndex, ref.current.getBoundingClientRect());
36
- // }
37
- // }
38
- // }, []);
39
-
31
+ }, []);
40
32
  return /*#__PURE__*/React.createElement("div", {
41
33
  ref: ref,
42
34
  className: css({
@@ -120,6 +112,7 @@ export default function MeasureColumnWidths({
120
112
  const handleDimensionsChange = React.useCallback((columnIndex, dimensions) => {
121
113
  console.log('handle dimensions change', columnIndex, dimensions);
122
114
  const nextWidth = Math.min(Math.max(columns[columnIndex].minWidth || 0, widthMap.get(columnIndex) || 0, dimensions.width + 1), columns[columnIndex].maxWidth || Infinity);
115
+ console.log('next width', columnIndex, nextWidth);
123
116
 
124
117
  if (nextWidth !== widthMap.get(columnIndex)) {
125
118
  widthMap.set(columnIndex, nextWidth);
package/esm/data-table/data-table.js CHANGED
@@ -590,6 +590,7 @@ export function DataTable(_ref2) {
590
590
  }
591
591
  }, [gridRef]);
592
592
  var handleWidthsChange = React.useCallback(function (nextWidths) {
593
+ console.log('next widths', nextWidths);
593
594
  setMeasuredWidths(nextWidths);
594
595
  resetAfterColumnIndex(0);
595
596
  }, [setMeasuredWidths, resetAfterColumnIndex]);
package/esm/data-table/measure-column-widths.js CHANGED
@@ -33,29 +33,17 @@ function MeasureColumn(_ref) {
33
33
  _useStyletron2 = _slicedToArray(_useStyletron, 1),
34
34
  css = _useStyletron2[0];
35
35
 
36
- var _React$useState = React.useState(null),
37
- _React$useState2 = _slicedToArray(_React$useState, 2),
38
- node = _React$useState2[0],
39
- setNode = _React$useState2[1];
40
-
41
- var ref = React.useCallback(function (node) {
42
- setNode(node);
43
- }, []);
36
+ var ref = React.useRef();
44
37
  React.useEffect(function () {
45
38
  if (typeof document !== 'undefined') {
46
- if (node) {
47
- onLayout(columnIndex, node.getBoundingClientRect());
39
+ if (ref.current) {
40
+ // onLayout(columnIndex, ref.current.getBoundingClientRect());
41
+ onLayout(columnIndex, {
42
+ width: 0
43
+ });
48
44
  }
49
45
  }
50
- }, [node, onLayout]); // const ref = React.useRef();
51
- // React.useEffect(() => {
52
- // if (__BROWSER__) {
53
- // if (ref.current) {
54
- // onLayout(columnIndex, ref.current.getBoundingClientRect());
55
- // }
56
- // }
57
- // }, []);
58
-
46
+ }, []);
59
47
  return /*#__PURE__*/React.createElement("div", {
60
48
  ref: ref,
61
49
  className: css({
@@ -145,6 +133,7 @@ export default function MeasureColumnWidths(_ref2) {
145
133
  var handleDimensionsChange = React.useCallback(function (columnIndex, dimensions) {
146
134
  console.log('handle dimensions change', columnIndex, dimensions);
147
135
  var nextWidth = Math.min(Math.max(columns[columnIndex].minWidth || 0, widthMap.get(columnIndex) || 0, dimensions.width + 1), columns[columnIndex].maxWidth || Infinity);
136
+ console.log('next width', columnIndex, nextWidth);
148
137
 
149
138
  if (nextWidth !== widthMap.get(columnIndex)) {
150
139
  widthMap.set(columnIndex, nextWidth);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "baseui",
3
- "version": "0.0.0-alpha-29a759d",
3
+ "version": "0.0.0-alpha-d3f908b",
4
4
  "description": "A React Component library implementing the Base design language",
5
5
  "keywords": [
6
6
  "react",