datastake-daf 0.6.322 → 0.6.324

package/dist/components/index.js

@@ -12734,13 +12734,12 @@ const useHeader = _ref => {
   const actionButtons = onDownload && _actionButtons.length < 3 ? [..._actionButtons, ...(hasFilters ? filterButton : []), downloadButton] : [..._actionButtons, ...(hasFilters ? filterButton : [])];
   const extraButtons = onDownload && _actionButtons.length >= 3 ? [..._extraButtons, downloadButtonAction] : [..._extraButtons];
   const mainCont = React.useRef();
-  React.useRef();
   const buttonCont = React.useRef();
   const [mainContWidth, setMainContWidth] = React.useState(600);
   const [buttonContWidth, setButtonContWidth] = React.useState(0);
   const hasSupportText = !!(supportText !== null && supportText !== void 0 && supportText.length);
   const hasTags = !!(tags !== null && tags !== void 0 && tags.length);
-  const hasButtons = !!(actionButtons !== null && actionButtons !== void 0 && actionButtons.length || extraButtons !== null && extraButtons !== void 0 && extraButtons.length);
+  const hasButtons = React.useMemo(() => !!(actionButtons !== null && actionButtons !== void 0 && actionButtons.length || extraButtons !== null && extraButtons !== void 0 && extraButtons.length), [actionButtons, extraButtons]);
   React.useEffect(() => {
     const mainContObserver = new ResizeObserver(entries => {
       const _mainEntry = entries[0];
@@ -12761,6 +12760,7 @@ const useHeader = _ref => {
       });
     }
     if (hasButtons) {
+      console.log("button observer before", buttonCont.current);
       buttonContObserver.observe(buttonCont.current);
     }
     return () => {
@@ -12770,8 +12770,12 @@ const useHeader = _ref => {
       }
     };
   }, []);
-  const maxWidth = React.useMemo(() => mainContWidth - buttonContWidth - 24, [mainContWidth, buttonContWidth]);
-  console.log(buttonContWidth, mainContWidth, maxWidth);
+  const maxWidth = React.useMemo(() => mainContWidth - buttonContWidth, [mainContWidth, buttonContWidth]);
+  console.log({
+    buttonContWidth,
+    mainContWidth,
+    maxWidth
+  });
   const renderMainCont = () => /*#__PURE__*/jsxRuntime.jsxs("div", {
     children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
       className: formatClassname(["main-cont flex", className]),

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "datastake-daf",
-	"version": "0.6.322",
+	"version": "0.6.324",
 	"dependencies": {
 		"@ant-design/icons": "^5.2.5",
 		"@antv/g2": "^5.1.1",

package/src/@daf/core/components/Header/hook.js

@@ -101,13 +101,15 @@ export const useHeader = ({
 			: [..._extraButtons];
 
 	const mainCont = useRef();
-	const addedHeaderCont = useRef();
 	const buttonCont = useRef();
 	const [mainContWidth, setMainContWidth] = useState(600);
 	const [buttonContWidth, setButtonContWidth] = useState(0);
 	const hasSupportText = !!supportText?.length;
 	const hasTags = !!tags?.length;
-	const hasButtons = !!(actionButtons?.length || extraButtons?.length);
+	const hasButtons = useMemo(
+		() => !!(actionButtons?.length || extraButtons?.length),
+		[actionButtons, extraButtons],
+	);
 
 	useEffect(() => {
 		const mainContObserver = new ResizeObserver((entries) => {
@@ -120,6 +122,8 @@ export const useHeader = ({
 		});
 
 		mainContObserver.observe(mainCont.current);
+
+
 		let buttonContObserver;
 
 		if (hasButtons) {
@@ -134,6 +138,7 @@ export const useHeader = ({
 		}
 
 		if (hasButtons) {
+			console.log("button observer before", buttonCont.current);
 			buttonContObserver.observe(buttonCont.current);
 		}
 
@@ -146,11 +151,11 @@ export const useHeader = ({
 	}, []);
 
 	const maxWidth = useMemo(
-		() => mainContWidth - buttonContWidth - 24,
+		() => mainContWidth - buttonContWidth ,
 		[mainContWidth, buttonContWidth],
 	);
 
-	console.log(buttonContWidth, mainContWidth, maxWidth);
+	console.log({ buttonContWidth, mainContWidth, maxWidth });
 
 	const renderMainCont = () => (
 		<div>