react-better-html 1.1.145 → 1.1.146

package/dist/index.mjs

@@ -7329,12 +7329,65 @@ import { Fragment as Fragment6, jsx as jsx22, jsxs as jsxs17 } from "react/jsx-r
 var defaultImageWidth = 160;
 var maximumVisiblePages = 11;
 var TableStyledComponent = styled11.table.withConfig({
-  shouldForwardProp: (prop) => !["isStriped", "withHover", "withStickyHeader", "colorTheme", "theme"].includes(prop)
+  shouldForwardProp: (prop) => ![
+    "isStriped",
+    "withHover",
+    "withStickyHeader",
+    "colorTheme",
+    "theme",
+    "containsOverflowComponents",
+    "withFooter"
+  ].includes(prop)
 })`
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
 
+   thead {
+      tr:first-child {
+         border-top-left-radius: ${(props) => props.containsOverflowComponents ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+         border-top-right-radius: ${(props) => props.containsOverflowComponents ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+
+         th:first-child {
+            border-top-left-radius: ${(props) => props.containsOverflowComponents ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+         }
+
+         th:last-child {
+            border-top-right-radius: ${(props) => props.containsOverflowComponents ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+         }
+      }
+   }
+
+   tbody {
+      tr:last-child {
+         border-bottom-left-radius: ${(props) => props.containsOverflowComponents && !props.withFooter ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+         border-bottom-right-radius: ${(props) => props.containsOverflowComponents && !props.withFooter ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+
+         td:first-child {
+            border-bottom-left-radius: ${(props) => props.containsOverflowComponents && !props.withFooter ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+         }
+
+         td:last-child {
+            border-bottom-right-radius: ${(props) => props.containsOverflowComponents && !props.withFooter ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+         }
+      }
+   }
+
+   tfoot {
+      tr:last-child {
+         border-bottom-left-radius: ${(props) => props.containsOverflowComponents ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+         border-bottom-right-radius: ${(props) => props.containsOverflowComponents ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+
+         td:first-child {
+            border-bottom-left-radius: ${(props) => props.containsOverflowComponents ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+         }
+
+         td:last-child {
+            border-bottom-right-radius: ${(props) => props.containsOverflowComponents ? `${props.theme.styles.borderRadius * 2 - 1}px` : void 0};
+         }
+      }
+   }
+
    tr {
       background-color: ${(props) => props.theme.colors.backgroundContent};
 
@@ -7427,6 +7480,7 @@ var TableComponent = forwardRef15(function Table({
   pageSize,
   pageCount,
   isInsideTableExpandRow,
+  containsOverflowComponents,
   getRowStyle,
   onClickRow,
   onClickAllCheckboxes,
@@ -7797,6 +7851,7 @@ var TableComponent = forwardRef15(function Table({
     },
     [currentPage, setCurrentPage, pageCountInternal, setCheckedItems]
   );
+  const withFooter = pageSize !== void 0 && pageCountInternal > 1;
   const mobileFooterBreakingPoint = mediaQuery.size700 && pageCountInternal > maximumVisiblePages / 1.4;
   return /* @__PURE__ */ jsxs17(Fragment6, { children: [
     /* @__PURE__ */ jsx22(
@@ -7804,7 +7859,7 @@ var TableComponent = forwardRef15(function Table({
       {
         border: `1px solid ${theme2.colors.border}`,
         borderRadius: theme2.styles.borderRadius * 2,
-        overflow: "auto",
+        overflow: !containsOverflowComponents ? "auto" : void 0,
         ...props,
         children: /* @__PURE__ */ jsxs17(
           TableStyledComponent,
@@ -7814,6 +7869,8 @@ var TableComponent = forwardRef15(function Table({
             withStickyHeader,
             colorTheme,
             theme: theme2,
+            containsOverflowComponents,
+            withFooter,
             children: [
               /* @__PURE__ */ jsx22("thead", { children: /* @__PURE__ */ jsx22("tr", { className: "isHeader", children: columns.map((column, index) => /* @__PURE__ */ jsx22(
                 ThStyledComponent,
@@ -7875,7 +7932,7 @@ var TableComponent = forwardRef15(function Table({
                 ),
                 expandedRows[rowIndex] && /* @__PURE__ */ jsx22("tr", { className: "withoutHover isExpandRow", children: /* @__PURE__ */ jsx22("td", { colSpan: columns.length, children: renderExpandedRow(item, rowIndex) }) })
               ] }, JSON.stringify(item) + rowIndex)) : /* @__PURE__ */ jsx22("tr", { className: "withoutHover", children: /* @__PURE__ */ jsx22("td", { className: "noData", colSpan: columns.length, children: /* @__PURE__ */ jsx22(Text_default.unknown, { children: noDataItemsMessage }) }) }) }),
-              pageSize !== void 0 && pageCountInternal > 1 && /* @__PURE__ */ jsx22("tfoot", { children: /* @__PURE__ */ jsx22("tr", { className: "isFooter", children: /* @__PURE__ */ jsx22("td", { colSpan: columns.length, children: /* @__PURE__ */ jsxs17(
+              withFooter && /* @__PURE__ */ jsx22("tfoot", { children: /* @__PURE__ */ jsx22("tr", { className: "isFooter", children: /* @__PURE__ */ jsx22("td", { colSpan: columns.length, children: /* @__PURE__ */ jsxs17(
                 Div_default.column,
                 {
                   position: "relative",