@trackunit/react-components 1.0.5 → 1.0.7

package/index.cjs.js

@@ -1163,9 +1163,8 @@ const useGeometry = (ref) => {
         y: 0,
     });
     const resizeObserver = React.useRef(null);
-    const refCurrent = ref.current;
     React.useEffect(() => {
-        if (!refCurrent) {
+        if (!ref.current) {
             return;
         }
         if (!resizeObserver.current) {
@@ -1185,13 +1184,14 @@ const useGeometry = (ref) => {
                 }
             });
         }
-        resizeObserver.current.observe(refCurrent);
+        resizeObserver.current.observe(ref.current);
         return () => {
             if (resizeObserver.current) {
                 resizeObserver.current.disconnect();
             }
         };
-    }, [refCurrent]);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [ref.current]);
     return geometry;
 };
 
@@ -1660,8 +1660,8 @@ const Card = ({ children, onClick, fullHeight = false, onMouseEnter, onMouseLeav
  * @param {CardBodyProps} props - The props for the CardBody component
  * @returns {JSX.Element} CardBody component
  */
-const CardBody = ({ density = "auto", children, dataTestId, className, disableGap, id }) => {
-    return (jsxRuntime.jsx("div", { className: cvaCardBodyDensityContainer({ density, disableGap, className }), "data-testid": dataTestId, id: id, children: children }));
+const CardBody = ({ density = "auto", children, dataTestId, className, direction, disableGap, id, }) => {
+    return (jsxRuntime.jsx("div", { className: cvaCardBodyDensityContainer({ density, disableGap, className, direction }), "data-testid": dataTestId, id: id, children: children }));
 };
 
 /**

package/index.esm.js

@@ -1143,9 +1143,8 @@ const useGeometry = (ref) => {
         y: 0,
     });
     const resizeObserver = useRef(null);
-    const refCurrent = ref.current;
     useEffect(() => {
-        if (!refCurrent) {
+        if (!ref.current) {
             return;
         }
         if (!resizeObserver.current) {
@@ -1165,13 +1164,14 @@ const useGeometry = (ref) => {
                 }
             });
         }
-        resizeObserver.current.observe(refCurrent);
+        resizeObserver.current.observe(ref.current);
         return () => {
             if (resizeObserver.current) {
                 resizeObserver.current.disconnect();
             }
         };
-    }, [refCurrent]);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [ref.current]);
     return geometry;
 };
 
@@ -1640,8 +1640,8 @@ const Card = ({ children, onClick, fullHeight = false, onMouseEnter, onMouseLeav
  * @param {CardBodyProps} props - The props for the CardBody component
  * @returns {JSX.Element} CardBody component
  */
-const CardBody = ({ density = "auto", children, dataTestId, className, disableGap, id }) => {
-    return (jsx("div", { className: cvaCardBodyDensityContainer({ density, disableGap, className }), "data-testid": dataTestId, id: id, children: children }));
+const CardBody = ({ density = "auto", children, dataTestId, className, direction, disableGap, id, }) => {
+    return (jsx("div", { className: cvaCardBodyDensityContainer({ density, disableGap, className, direction }), "data-testid": dataTestId, id: id, children: children }));
 };
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-components",
-  "version": "1.0.5",
+  "version": "1.0.7",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {

package/src/components/Card/CardBody.d.ts

@@ -5,6 +5,10 @@ export interface CardBodyProps extends CommonProps {
      * Sets gap, padding and margin.
      */
     density?: Density;
+    /**
+     * Sets flex direction
+     */
+    direction?: "row" | "row-reverse" | "column" | "column-reverse";
     /**
      * Set gap to be 0px (not preferable)
      */
@@ -26,4 +30,4 @@ export interface CardBodyProps extends CommonProps {
  * @param {CardBodyProps} props - The props for the CardBody component
  * @returns {JSX.Element} CardBody component
  */
-export declare const CardBody: ({ density, children, dataTestId, className, disableGap, id }: CardBodyProps) => import("react/jsx-runtime").JSX.Element;
+export declare const CardBody: ({ density, children, dataTestId, className, direction, disableGap, id, }: CardBodyProps) => import("react/jsx-runtime").JSX.Element;