datastake-daf 0.6.148 → 0.6.150

package/dist/components/index.js

@@ -11984,7 +11984,7 @@ GoToSelect.propTypes = {
 
 const _excluded$k = ["options", "defaultSelected", "onChange", "textWhenMultiple", "withCount", "oneAlwaysSelected", "canUnselectLast", "isAvatarGroup", "maxAvatarCount", "dropDownWidth", "topAvatarValue", "isSingle", "selectionType"];
 const {
-  useToken: useToken$i
+  useToken: useToken$j
 } = antd.theme;
 
 /**
@@ -12078,7 +12078,7 @@ function Multiselect(_ref) {
     restProps = _objectWithoutProperties(_ref, _excluded$k);
   const {
     token
-  } = useToken$i();
+  } = useToken$j();
   const [selectValue, setSelectValue] = React.useState(Array.isArray(defaultSelected) ? defaultSelected.length > 0 ? defaultSelected : [] : [defaultSelected]);
   function onSelectChange(value) {
     if (!canUnselectLast && value.length === 0) {
@@ -12582,7 +12582,7 @@ const useHeader = _ref => {
 };
 
 const {
-  useToken: useToken$h
+  useToken: useToken$i
 } = antd.theme;
 function BreadCrumbs({
   breadcrumbs = [],
@@ -12591,7 +12591,7 @@ function BreadCrumbs({
   const [splitIndex, setSplitIndex] = React.useState(0);
   const {
     token
-  } = useToken$h();
+  } = useToken$i();
   const _renderBreadcrumb = (b, i, isLast, noOnClickLast = false) => {
     return /*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex breadcrumb-item",
@@ -12956,9 +12956,11 @@ DAFFooter.propTypes = {
 };
 
 const PAGE_HEIGHT = 1587;
-// margin-top: 20, bottom: 20;
 const FOOTER_HEIGHT = 70;
 const HEADER_HEIGHT = 100;
+const ROW_SPACING = 24; // Spacing between content rows
+const CONTENT_BOTTOM_PADDING = 30; // Extra padding at the very bottom of the last section of the document
+
 const Row = _ref => {
   let {
     widgets,
@@ -13007,49 +13009,84 @@ function PdfView(_ref2) {
     const keys = Object.keys(sectionsConfig);
     let _pages = [1];
     let _page = 1;
+
+    // The total vertical space available for flowing content on each page,
+    // considering that HEADER_HEIGHT and FOOTER_HEIGHT are for absolutely positioned elements
+    // and content should flow between them.
+    const usableContentHeightPerPage = PAGE_HEIGHT - HEADER_HEIGHT - FOOTER_HEIGHT;
     if (keys.length === config.length) {
-      let incrHeight = 0;
+      let currentFlowHeight = 0; // Tracks height accumulated within the `usableContentHeightPerPage` for the current page
+
+      // Reset all margins/paddings first for a clean slate
       keys.forEach(k => {
         const {
           ref
         } = sectionsConfig[k];
-        ref.current.style.marginBottom = '0px';
-        // ref.current.style.marginTop = '15px';
+        if (ref.current) {
+          ref.current.style.marginBottom = '0px';
+          ref.current.style.marginTop = '0px';
+          ref.current.style.paddingBottom = '0px';
+        }
       });
       keys.forEach((k, i) => {
         const {
           height,
           ref
         } = sectionsConfig[k];
-        if (i === 0) {
-          ref.current.style.marginTop = "".concat(HEADER_HEIGHT, "px");
-          incrHeight += HEADER_HEIGHT;
+        if (!ref.current) return; // Skip if ref is not available yet
+
+        let sectionTopMargin = ROW_SPACING; // Default margin for sections that follow another on the same page
+
+        // The first section on *any* page (either global first or first on a new page)
+        // needs to be offset by HEADER_HEIGHT from the top of the page.
+        if (i === 0 || currentFlowHeight === 0) {
+          sectionTopMargin = HEADER_HEIGHT;
         }
-        const newHeight = incrHeight + height;
-        if (i === keys.length - 1) {
-          ref.current.style.paddingBottom = '30px';
+
+        // Calculate the total height this section would occupy *including its immediate top margin and its own height*.
+        let totalHeightForThisSection = sectionTopMargin + height;
+
+        // If it's not the very last section of the document, add the standard row spacing.
+        if (i < keys.length - 1) {
+          totalHeightForThisSection += ROW_SPACING;
+        } else {
+          // For the very last section, add the document-level bottom padding.
+          totalHeightForThisSection += CONTENT_BOTTOM_PADDING;
         }
-        if (newHeight > PAGE_HEIGHT - 30 - FOOTER_HEIGHT - HEADER_HEIGHT) {
-          const dif = Math.abs(PAGE_HEIGHT - incrHeight);
-          ref.current.style.marginTop = '30px';
+
+        // Check if placing this section (with its calculated space) on the current page
+        // would exceed the usable content area for a theoretical page.
+        if (currentFlowHeight + totalHeightForThisSection > usableContentHeightPerPage) {
+          // This section overflows, so it starts on a new page.
           _page += 1;
           _pages.push(_page);
-          if (sectionsConfig[keys[i - 1]]) {
-            const {
-              ref: topRef
-            } = sectionsConfig[keys[i - 1]];
-            topRef.current.style.marginBottom = "".concat(dif + HEADER_HEIGHT - 24, "px");
-            incrHeight = height + 24 + HEADER_HEIGHT;
-            // console.log('margin', dif);
+
+          // Reset flow height for the new page.
+          // This section is now the first on a new page, so its top margin is HEADER_HEIGHT.
+          ref.current.style.marginTop = "".concat(HEADER_HEIGHT, "px");
+          currentFlowHeight = HEADER_HEIGHT + height; // Start accumulated height for new page
+
+          // Add row spacing or bottom padding for this section on its new page
+          if (i < keys.length - 1) {
+            currentFlowHeight += ROW_SPACING;
+          } else {
+            ref.current.style.paddingBottom = "".concat(CONTENT_BOTTOM_PADDING, "px");
+            currentFlowHeight += CONTENT_BOTTOM_PADDING;
           }
         } else {
-          incrHeight = newHeight + 24;
+          // This section fits on the current page.
+          ref.current.style.marginTop = "".concat(sectionTopMargin, "px");
+          currentFlowHeight += totalHeightForThisSection; // Accumulate the height this section takes
+
+          // Apply special padding for the very last section of the document if it fits on current page
+          if (i === keys.length - 1) {
+            ref.current.style.paddingBottom = "".concat(CONTENT_BOTTOM_PADDING, "px");
+          }
         }
-        // console.groupEnd();
       });
       setPages(_pages);
     }
-  }, [sectionsConfig]);
+  }, [sectionsConfig, config.length]);
   React.useEffect(() => {
     doSizing();
   }, [doSizing]);
@@ -13075,16 +13112,6 @@ function PdfView(_ref2) {
       })
     });
   }, [config, onChangeHeight]);
-
-  // <div className="daf-analysis">
-  // <Header title={t('Dashboard Title')} />
-
-  // <div className="content">
-  //   <div className="view-content">
-  //     <div className="daf-analysis-layout">
-  //       <div className='sections-cont w-pt'>
-  //         <section>
-
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     className: contClassName,
     style: {
@@ -13095,11 +13122,13 @@ function PdfView(_ref2) {
         style: {
           top: (page - 1) * PAGE_HEIGHT,
           width: '100%',
-          height: HEADER_HEIGHT - 24,
+          height: HEADER_HEIGHT,
           position: 'absolute',
           left: 0,
           zIndex: 1000000
-        },
+        } // Changed height from HEADER_HEIGHT - 24 to HEADER_HEIGHT for consistency
+        ,
+
         className: "flex-row dashboard-header",
         children: [/*#__PURE__*/jsxRuntime.jsx("div", {
           className: "flex flex-column justify-center flex-1",
@@ -13160,15 +13189,6 @@ function PdfView(_ref2) {
     }))]
   });
 }
-PdfView.propTypes = {
-  config: PropTypes__default["default"].array,
-  customClassName: PropTypes__default["default"].any,
-  title: PropTypes__default["default"].string,
-  imgSrc: PropTypes__default["default"].string,
-  userId: PropTypes__default["default"].string,
-  accountId: PropTypes__default["default"].string,
-  documentId: PropTypes__default["default"].string
-};
 
 const ajaxSelectFieldData = async (value, config, getApiBaseUrl = () => {}, getAppHeader = () => {}, app, formValues = {}) => {
   const url = getApiBaseUrl();
@@ -15269,7 +15289,11 @@ function Widget(_ref) {
           className: "flex justify-content-end",
           children: /*#__PURE__*/jsxRuntime.jsx(antd.Button, {
             size: "small",
-            className: "flex-1 no-min-width",
+            className: "squareIconButton no-min-width",
+            style: {
+              height: '25px',
+              width: '25px'
+            },
             onClick: handleCollapseToggle,
             icon: isCollapsed ? /*#__PURE__*/jsxRuntime.jsx(Icons.RightOutlined, {
               style: {
@@ -20375,6 +20399,9 @@ const Label = dt.span`
 const {
   Meta
 } = antd.Card;
+const {
+  useToken: useToken$h
+} = antd.theme;
 function ProjectWidget(_ref) {
   let {
     title,
@@ -20387,10 +20414,17 @@ function ProjectWidget(_ref) {
     hideSDGList = false,
     t = x => x
   } = _ref;
+  const [isHovered, setIsHovered] = React__default["default"].useState(false);
+  const {
+    token
+  } = useToken$h();
   return /*#__PURE__*/jsxRuntime.jsxs(antd.Card, {
     style: {
       flex: 1
     },
+    hoverable: true,
+    onMouseEnter: () => setIsHovered(true),
+    onMouseLeave: () => setIsHovered(false),
     cover: /*#__PURE__*/jsxRuntime.jsxs(ImageContainer, {
       children: [/*#__PURE__*/jsxRuntime.jsx("div", {
         className: "image",
@@ -20404,7 +20438,7 @@ function ProjectWidget(_ref) {
           name: linkIcon,
           width: 16,
           height: 16,
-          color: "black"
+          color: isHovered ? token.colorPrimary7 : "black"
         })
       })]
     }),

package/package.json

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

package/src/@daf/core/components/Dashboard/PdfView/index.jsx

@@ -1,12 +1,14 @@
+// Dashboard/PdfView/index.jsx
 import moment from "moment";
 import PropTypes from 'prop-types';
 import { useCallback, useEffect, useRef, useState } from "react";
 import { formatClassname } from "../../../../../helpers/ClassesHelper";
 
 const PAGE_HEIGHT = 1587;
-// margin-top: 20, bottom: 20;
 const FOOTER_HEIGHT = 70;
 const HEADER_HEIGHT = 100;
+const ROW_SPACING = 24; // Spacing between content rows
+const CONTENT_BOTTOM_PADDING = 30; // Extra padding at the very bottom of the last section of the document
 
 const Row = ({ widgets, i, onChangeHeight = () => { } }) => {
   const ref = useRef();
@@ -55,49 +57,81 @@ export default function PdfView({
     let _pages = [1];
     let _page = 1;
 
+    // The total vertical space available for flowing content on each page,
+    // considering that HEADER_HEIGHT and FOOTER_HEIGHT are for absolutely positioned elements
+    // and content should flow between them.
+    const usableContentHeightPerPage = PAGE_HEIGHT - HEADER_HEIGHT - FOOTER_HEIGHT;
+
     if (keys.length === config.length) {
-      let incrHeight = 0;
+      let currentFlowHeight = 0; // Tracks height accumulated within the `usableContentHeightPerPage` for the current page
 
+      // Reset all margins/paddings first for a clean slate
       keys.forEach(k => {
         const { ref } = sectionsConfig[k];
-        ref.current.style.marginBottom = '0px';
-        // ref.current.style.marginTop = '15px';
-      })
+        if (ref.current) {
+          ref.current.style.marginBottom = '0px';
+          ref.current.style.marginTop = '0px';
+          ref.current.style.paddingBottom = '0px';
+        }
+      });
 
       keys.forEach((k, i) => {
         const { height, ref } = sectionsConfig[k];
+        if (!ref.current) return; // Skip if ref is not available yet
 
-        if (i === 0) {
-          ref.current.style.marginTop = `${HEADER_HEIGHT}px`;
-          incrHeight += HEADER_HEIGHT;
+        let sectionTopMargin = ROW_SPACING; // Default margin for sections that follow another on the same page
+
+        // The first section on *any* page (either global first or first on a new page)
+        // needs to be offset by HEADER_HEIGHT from the top of the page.
+        if (i === 0 || currentFlowHeight === 0) {
+          sectionTopMargin = HEADER_HEIGHT;
         }
 
-        const newHeight = incrHeight + height;
+        // Calculate the total height this section would occupy *including its immediate top margin and its own height*.
+        let totalHeightForThisSection = sectionTopMargin + height;
 
-        if (i === keys.length - 1) {
-          ref.current.style.paddingBottom = '30px';
+        // If it's not the very last section of the document, add the standard row spacing.
+        if (i < keys.length - 1) {
+          totalHeightForThisSection += ROW_SPACING;
+        } else {
+          // For the very last section, add the document-level bottom padding.
+          totalHeightForThisSection += CONTENT_BOTTOM_PADDING;
         }
 
-        if (newHeight > PAGE_HEIGHT - 30 - FOOTER_HEIGHT - HEADER_HEIGHT) {
-          const dif = Math.abs(PAGE_HEIGHT - incrHeight);
-          ref.current.style.marginTop = '30px';
+        // Check if placing this section (with its calculated space) on the current page
+        // would exceed the usable content area for a theoretical page.
+        if (currentFlowHeight + totalHeightForThisSection > usableContentHeightPerPage) {
+          // This section overflows, so it starts on a new page.
           _page += 1;
           _pages.push(_page);
 
-          if (sectionsConfig[keys[i - 1]]) {
-            const { ref: topRef } = sectionsConfig[keys[i - 1]];
-            topRef.current.style.marginBottom = `${dif + HEADER_HEIGHT - 24}px`;
-            incrHeight = height + 24 + HEADER_HEIGHT;
-            // console.log('margin', dif);
+          // Reset flow height for the new page.
+          // This section is now the first on a new page, so its top margin is HEADER_HEIGHT.
+          ref.current.style.marginTop = `${HEADER_HEIGHT}px`;
+          currentFlowHeight = HEADER_HEIGHT + height; // Start accumulated height for new page
+
+          // Add row spacing or bottom padding for this section on its new page
+          if (i < keys.length - 1) {
+            currentFlowHeight += ROW_SPACING;
+          } else {
+            ref.current.style.paddingBottom = `${CONTENT_BOTTOM_PADDING}px`;
+            currentFlowHeight += CONTENT_BOTTOM_PADDING;
           }
+
         } else {
-          incrHeight = newHeight + 24;
+          // This section fits on the current page.
+          ref.current.style.marginTop = `${sectionTopMargin}px`;
+          currentFlowHeight += totalHeightForThisSection; // Accumulate the height this section takes
+
+          // Apply special padding for the very last section of the document if it fits on current page
+          if (i === keys.length - 1) {
+               ref.current.style.paddingBottom = `${CONTENT_BOTTOM_PADDING}px`;
+          }
         }
-        // console.groupEnd();
-      })
+      });
       setPages(_pages);
     }
-  }, [sectionsConfig]);
+  }, [sectionsConfig, config.length]);
 
   useEffect(() => {
     doSizing();
@@ -128,22 +162,13 @@ export default function PdfView({
     );
   }, [config, onChangeHeight]);
 
-  // <div className="daf-analysis">
-  // <Header title={t('Dashboard Title')} />
-
-  // <div className="content">
-  //   <div className="view-content">
-  //     <div className="daf-analysis-layout">
-  //       <div className='sections-cont w-pt'>
-  //         <section>
-
   return (
     <div className={contClassName} style={{ position: 'relative' }}>
       {renderDashboard()}
       {pages.map((page) => (
         <>
           <div
-            style={{ top: ((page - 1) * PAGE_HEIGHT), width: '100%', height: HEADER_HEIGHT - 24, position: 'absolute', left: 0, zIndex: 1000000 }}
+            style={{ top: ((page - 1) * PAGE_HEIGHT), width: '100%', height: HEADER_HEIGHT, position: 'absolute', left: 0, zIndex: 1000000 }} // Changed height from HEADER_HEIGHT - 24 to HEADER_HEIGHT for consistency
             key={`headers-${page}`}
             className="flex-row dashboard-header"
           >
@@ -194,14 +219,4 @@ export default function PdfView({
       ))}
     </div>
   );
-}
-
-PdfView.propTypes = {
-  config: PropTypes.array,
-  customClassName: PropTypes.any,
-  title: PropTypes.string,
-  imgSrc: PropTypes.string,
-  userId: PropTypes.string,
-  accountId: PropTypes.string,
-  documentId: PropTypes.string,
-}
+}