@guardian/interactive-component-library 0.1.0-alpha.37 → 0.1.0-alpha.39

package/dist/interactive-component-library.umd.cjs

@@ -1326,18 +1326,20 @@
       return this.row[this.column.accessor] !== null ? this.row[this.column.accessor].toString() : "null";
     }
   }
-  const table = "_table_1dg64_9";
-  const hideHeader = "_hideHeader_1dg64_19";
-  const hideHeaderNoBorder = "_hideHeaderNoBorder_1dg64_28";
-  const headerCell = "_headerCell_1dg64_32";
-  const headerCellButton = "_headerCellButton_1dg64_40";
-  const bodyRow = "_bodyRow_1dg64_49";
-  const bodyCell = "_bodyCell_1dg64_54";
+  const table = "_table_fhbur_9";
+  const hideHeader = "_hideHeader_fhbur_20";
+  const hideHeaderNoBorder = "_hideHeaderNoBorder_fhbur_29";
+  const headerCell = "_headerCell_fhbur_33";
+  const stickyHeader = "_stickyHeader_fhbur_42";
+  const headerCellButton = "_headerCellButton_fhbur_49";
+  const bodyRow = "_bodyRow_fhbur_58";
+  const bodyCell = "_bodyCell_fhbur_62";
   const defaultStyles$f = {
     table,
     hideHeader,
     hideHeaderNoBorder,
     headerCell,
+    stickyHeader,
     headerCellButton,
     bodyRow,
     bodyCell
@@ -1346,6 +1348,7 @@
     columns,
     data,
     hideHeader: hideHeader2 = false,
+    stickyHeader: stickyHeader2 = false,
     styles: styles2
   }) {
     const [sortState, setSortState] = hooks.useState(() => {
@@ -1384,9 +1387,13 @@
         children: jsxRuntime.jsx("tr", {
           children: table2.columns.map((column, index) => {
             var _a;
+            let columnStyle = mergeStyles(styles2.headerCell, (_a = column.styles) == null ? void 0 : _a.headerCell);
+            if (stickyHeader2) {
+              columnStyle = mergeStyles(columnStyle, styles2.stickyHeader);
+            }
             return jsxRuntime.jsx("th", {
               scope: "col",
-              className: mergeStyles(styles2.headerCell, (_a = column.styles) == null ? void 0 : _a.headerCell),
+              className: columnStyle,
               children: jsxRuntime.jsx(HeaderCell, {
                 styles: mergeStyles(styles2, column.styles),
                 onClick: () => sortByColumn(index),
@@ -1866,11 +1873,11 @@
       })]
     });
   });
-  const borderTop = "_borderTop_1yz7f_9";
-  const section = "_section_1yz7f_14";
-  const fullWidth = "_fullWidth_1yz7f_57";
-  const header = "_header_1yz7f_96";
-  const content = "_content_1yz7f_133";
+  const borderTop = "_borderTop_gph7y_9";
+  const section = "_section_gph7y_13";
+  const fullWidth = "_fullWidth_gph7y_19";
+  const header = "_header_gph7y_95";
+  const content = "_content_gph7y_132";
   const defaultStyles$9 = {
     borderTop,
     section,
@@ -2337,13 +2344,13 @@
       return preact.cloneElement(t, { className: i });
     });
   };
-  const transitionContainer = "_transitionContainer_1syip_1";
-  const blur = "_blur_1syip_12";
-  const modalBox = "_modalBox_1syip_17";
-  const enter = "_enter_1syip_26";
-  const exitDone = "_exitDone_1syip_27";
-  const enterActive = "_enterActive_1syip_38";
-  const exitActive = "_exitActive_1syip_49";
+  const transitionContainer = "_transitionContainer_48fp9_1";
+  const blur = "_blur_48fp9_11";
+  const modalBox = "_modalBox_48fp9_16";
+  const enter = "_enter_48fp9_25";
+  const exitDone = "_exitDone_48fp9_26";
+  const enterActive = "_enterActive_48fp9_37";
+  const exitActive = "_exitActive_48fp9_48";
   const styles$6 = {
     transitionContainer,
     blur,