playbook_ui 14.21.2.pre.alpha.PLAY22558410 → 14.21.2

data/app/pb_kits/playbook/pb_advanced_table/SubKits/TableHeader.tsx

@@ -40,13 +40,9 @@ export const TableHeader = ({
     showActionsBar,
     selectableRows,
     responsive,
-    headerRef,
-    virtualizedRows,
-    enableVirtualization,
+    headerRef
   } = useContext(AdvancedTableContext)
 
-  const isVirtualized = virtualizedRows || enableVirtualization;
-
   const classes = classnames(
     buildCss("pb_advanced_table_header"),
     globalProps(props),
@@ -61,93 +57,46 @@ export const TableHeader = ({
     `${isChrome() ? "chrome-styles" : ""}`,
     `${responsive === "scroll" && "pinned-left"}`,
   );
-
-  const renderRegularTableHeader = () => (
-    <thead className={classes} 
-        id={id}
-    >
-      {table.getHeaderGroups().map((headerGroup: HeaderGroup<GenericObject>, index: number) => (
-        <tr 
-            key={`${headerGroup.id}-headerGroup`}
-            ref={index === 0 ? headerRef : null}
-        >
-          {!hasAnySubRows && selectableRows && (
-            <th className={customCellClassnames}>
-              <Checkbox
-                  checked={table?.getIsAllRowsSelected()}
-                  indeterminate={table?.getIsSomeRowsSelected()}
-                  onChange={table?.getToggleAllRowsSelectedHandler()}
-              />
-            </th>
-          )}
-          {headerGroup.headers.map(header => {
-            const isPinnedLeft = columnPinning.left.includes(header.id)
-            return (
-              <TableHeaderCell
-                  enableSorting={enableSorting}
-                  enableToggleExpansion={enableToggleExpansion}
-                  handleExpandOrCollapse={handleExpandOrCollapse}
-                  header={header}
-                  headerChildren={children}
-                  isPinnedLeft={isPinnedLeft}
-                  key={`${header.id}-header`}
-                  loading={loading}
-                  sortIcon={sortIcon}
-                  table={table}
-              />
-            )
-          })}
-        </tr>
-      ))}
-    </thead>
-  );
-
-  const renderVirtualizedTableHeader = () => (
-    <thead 
-        className={classes} 
-        data-virtualized="true"
-        id={id}
-    >
-      {table.getHeaderGroups().map((headerGroup: HeaderGroup<GenericObject>, index: number) => (
-        <tr 
-            className="virtualized-header-row-header"
-            key={`${headerGroup.id}-headerGroup-virtualized`}
-            ref={index === 0 ? headerRef : null}
-        >
-          {!hasAnySubRows && selectableRows && (
-            <th className={classnames(customCellClassnames, "virtualized-header-cell")}>
-              <Checkbox
-                  checked={table?.getIsAllRowsSelected()}
-                  indeterminate={table?.getIsSomeRowsSelected()}
-                  onChange={table?.getToggleAllRowsSelectedHandler()}
-              />
-            </th>
-          )}
-          {headerGroup.headers.map(header => {
-            const isPinnedLeft = columnPinning.left.includes(header.id)
-            return (
-              <TableHeaderCell
-                  enableSorting={enableSorting}
-                  enableToggleExpansion={enableToggleExpansion}
-                  handleExpandOrCollapse={handleExpandOrCollapse}
-                  header={header}
-                  headerChildren={children}
-                  isPinnedLeft={isPinnedLeft}
-                  isVirtualized
-                  key={`${header.id}-header-virtualized`}
-                  loading={loading}
-                  sortIcon={sortIcon}
-                  table={table}
-              />
-            )
-          })}
-        </tr>
-      ))}
-    </thead>
-  );
   return (
-    <>      
-      {isVirtualized ? renderVirtualizedTableHeader() : renderRegularTableHeader()}
+    <>
+      <thead className={classes}
+          id={id}
+      >
+        {/* Get the header groups (only one in this example) */}
+        {table.getHeaderGroups().map((headerGroup: HeaderGroup<GenericObject>, index: number) => (
+          <tr 
+              key={`${headerGroup.id}-headerGroup`}
+              ref={index === 0 ? headerRef : null}
+          >
+            {!hasAnySubRows && selectableRows && (
+              <th className={customCellClassnames}>
+                <Checkbox
+                    checked={table?.getIsAllRowsSelected()}
+                    indeterminate={table?.getIsSomeRowsSelected()}
+                    onChange={table?.getToggleAllRowsSelectedHandler()}
+                />
+              </th>
+            )}
+            {headerGroup.headers.map(header => {
+              const isPinnedLeft = columnPinning.left.includes(header.id)
+              return (
+                <TableHeaderCell
+                    enableSorting={enableSorting}
+                    enableToggleExpansion={enableToggleExpansion}
+                    handleExpandOrCollapse={handleExpandOrCollapse}
+                    header={header}
+                    headerChildren={children}
+                    isPinnedLeft={isPinnedLeft}
+                    key={`${header.id}-header`}
+                    loading={loading}
+                    sortIcon={sortIcon}
+                    table={table}
+                />
+              )
+            })}
+          </tr>
+        ))}
+      </thead>
     </>
   )
 }

data/app/pb_kits/playbook/pb_advanced_table/Utilities/CellRendererUtils.tsx

@@ -17,8 +17,7 @@ export const createCellFunction = (
   customRenderer?: (row: Row<GenericObject>, value: any) => JSX.Element,
   isFirstColumn?: boolean,
   onRowToggleClick?: (row: Row<GenericObject>) => void,
-  selectableRows?: boolean,
-  rowStyling?: GenericObject
+  selectableRows?: boolean
 ) => {
   // Add display name to the returned function
   const cellRenderer = ({
@@ -29,7 +28,6 @@ export const createCellFunction = (
     getValue: Getter<string>
   }) => {
     const rowData = row.original;
-    const customStyle = rowStyling?.length > 0 && rowStyling?.find((s:GenericObject) => s?.rowId === row.id);
 
     if (isFirstColumn) {
       switch (row.depth) {
@@ -37,7 +35,6 @@ export const createCellFunction = (
           return (
             <CustomCell
                 customRenderer={customRenderer}
-                customStyle={customStyle}
                 getValue={getValue}
                 onRowToggleClick={onRowToggleClick}
                 row={row}

data/app/pb_kits/playbook/pb_advanced_table/Utilities/TableContainerStyles.ts

@@ -57,6 +57,7 @@ export const getVirtualizedContainerStyles = (maxHeight?: string): React.CSSProp
       position: 'absolute',
       top: 0,
       left: 0,
+      width: '100%',
       height: '40px', // Match standard table row height
       transform: `translateY(${startPosition}px)`,
       tableLayout: 'fixed',
@@ -66,14 +67,12 @@ export const getVirtualizedContainerStyles = (maxHeight?: string): React.CSSProp
   /**
    * Get height estimates for different row types
    */
-  export const getRowHeightEstimate = (rowType: 'header' | 'row' | 'loading' | 'footer') => {
+  export const getRowHeightEstimate = (rowType: 'header' | 'row' | 'loading') => {
     switch (rowType) {
       case 'header':
         return 40; // Header height
       case 'loading':
         return 30; // Loading indicator height
-      case 'footer':
-        return 40
       case 'row':
       default:
         return 40; // Standard row height - match this to your design system

data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.scss

@@ -63,30 +63,11 @@
     width: 100%;
   }
 
-  // Virtualized Table and Rows for Infinite Scroll
-  scrollbar-gutter: stable right-edges;
-  .virtualized-header-row-header {
-    width: 100% !important;
-    .table-header-cells:first-child {
-      min-width: 180px;
-    }
-  }
-
-  .virtualized-footer {
-    width: 100% !important;
-    td {
-      border-bottom-left-radius: 4px !important;
-      border-bottom-right-radius: 4px !important;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-    }
-  }
-
+  // Virtualized table styles
   .virtualized-table-row {
     display: table !important;
     table-layout: fixed !important;
-    box-sizing: border-box !important;
+    width: 100% !important;
 
     td {
       display: table-cell !important;
@@ -123,7 +104,7 @@
 
       -ms-overflow-style: none !important;
       scrollbar-width: none !important;
-  }
+    }
   
 
   .row-selection-actions-card {
@@ -212,6 +193,7 @@
 
     // Fix virtualized row borders
     tr.virtualized-table-row {
+      border-bottom: 1px solid $border_light;
 
       &.bg-silver {
         td:first-child {
@@ -624,16 +606,6 @@
         td.sticky-left {
           border-right: 1px solid $border_light !important;
         }
-        // Virtualized Table in Responsive Styles
-        .virtualized-header,
-        .virtualized-header-row-header,
-        .virtualized-table-row,
-        .virtualized-footer {
-          border-right: 1px solid $border_light !important;
-          .table-header-cells:first-child {
-            box-shadow: 0 0 10px 0 rgba($shadow, 0.16) !important;
-          }
-        }
       }
     }
   }
@@ -649,23 +621,6 @@
     box-shadow: 0 4px 10px 0 rgba($shadow, 0.16) !important;
   }
 
-  // For Rails, we can't target the &:last-child since collapsed rows are display: none;
-  // With JS, we add a .last-visible-row class and add rounded corners to bottom row
-  .last-visible-row {
-    td, .pb_table_td {
-      border-width: 0 0 1px 0;
-
-      &:first-child {
-        border-radius: 0 0 0 4px;
-        border-width: 0 0 1px 1px;
-      }
-      &:last-child {
-        border-radius: 0 0 4px 0;
-        border-width: 0 1px 1px 0;
-      }
-    }
-  }
-
   &.dark {
     // Override default border color for dark mode
     --column-border-color: #{$border_dark};

data/app/pb_kits/playbook/pb_advanced_table/_advanced_table.tsx

@@ -57,7 +57,6 @@ type AdvancedTableProps = {
     onChange?: (value: RowPinningState) => void;
   };
   responsive?: "scroll" | "none",
-  rowStyling?: GenericObject[],
   scrollBarNone?: boolean,
   selectableRows?: boolean,
   showActionsBar?: boolean,
@@ -99,7 +98,6 @@ const AdvancedTable = (props: AdvancedTableProps) => {
     paginationProps,
     pinnedRows,
     responsive = "scroll",
-    rowStyling,
     scrollBarNone= false,
     showActionsBar = true,
     selectableRows,
@@ -146,7 +144,6 @@ const AdvancedTable = (props: AdvancedTableProps) => {
     onRowSelectionChange,
     columnVisibilityControl,
     pinnedRows,
-    rowStyling
   });
 
   // Initialize table actions
@@ -269,29 +266,6 @@ const AdvancedTable = (props: AdvancedTableProps) => {
   // Visibility flag for action bar
   const isActionBarVisible = (selectableRows && showActionsBar && selectedRowsLength > 0) || columnVisibilityControl;
 
-  // The actual Main <Table /> element
-  const tableElement = (
-    <Table
-        className={`${loading ? "content-loading" : ""}`}
-        dark={dark}
-        dataTable
-        numberSpacing="tabular"
-        responsive="none"
-        {...tableProps}
-    >
-      {children ? (
-        children
-      ) : (
-        <>
-          <TableHeader />
-          <TableBody   
-              isFetching={isFetching}
-          />
-        </>
-      )}
-    </Table>
-  )
-
   return (
     <>
       {/* Top Pagination */}
@@ -339,7 +313,6 @@ const AdvancedTable = (props: AdvancedTableProps) => {
             onExpandByDepthClick={onExpandByDepthClick}
             pinnedRows={pinnedRows}
             responsive={responsive}
-            rowStyling={rowStyling}
             selectableRows={selectableRows}
             setExpanded={setExpanded}
             showActionsBar={showActionsBar}
@@ -349,7 +322,6 @@ const AdvancedTable = (props: AdvancedTableProps) => {
             table={table}
             tableContainerRef={tableWrapperRef}
             toggleExpansionIcon={toggleExpansionIcon}
-            totalAvailableCount={fullData.length}
             virtualizedRows={virtualizedRows}
         >
           <React.Fragment>
@@ -361,14 +333,24 @@ const AdvancedTable = (props: AdvancedTableProps) => {
                 type={columnVisibilityControl ? "column-visibility" : "row-selection"}
             />
 
-            {/* Virtualized wrapper div only if virtualizedRows is true */}
-            {virtualizedRows ? (
-              <div style={{ overflow: 'auto', width: '100%' }}>
-                {tableElement}
-              </div>
-            ) : (
-              tableElement
-            )}
+            {/* Main Table */}
+            <Table
+                className={`${loading ? "content-loading" : ""}`}
+                dark={dark}
+                dataTable
+                numberSpacing="tabular"
+                responsive="none"
+                {...tableProps}
+            >
+              {children ? (
+                children
+              ) : (
+                <>
+                  <TableHeader />
+                  <TableBody />
+                </>
+              )}
+            </Table>
           </React.Fragment>
         </AdvancedTableProvider>
 

data/app/pb_kits/playbook/pb_advanced_table/advanced_table.test.jsx

@@ -1,7 +1,7 @@
 import React, {useState} from "react"
 import { render, screen, waitFor } from "../utilities/test-utils"
 
-import { AdvancedTable, Pill, colors } from "playbook-ui"
+import { AdvancedTable, Pill } from "playbook-ui"
 
 global.ResizeObserver = class {
   observe() {}
@@ -572,107 +572,4 @@ test("pinnedRows prop renders pinned rows at top", () => {
   const firstPinnedRow = pinnedRows[0]
   expect(firstPinnedRow).toHaveStyle("position: sticky")
   expect(firstPinnedRow).toHaveStyle("background-color: white")
-})
-
-test("columnStyling.headerAlignment aligns header as expected", () => {
-  const styledColumnDefs = [
-    {
-      accessor: "year",
-      label: "Year",
-      cellAccessors: ["quarter", "month", "day"],
-    },
-    {
-      accessor: "newEnrollments",
-      label: "New Enrollments",
-      columnStyling: { headerAlignment: "left" },
-    },
-    {
-      accessor: "scheduledMeetings",
-      label: "Scheduled Meetings",
-    },
-  ];
-
-  render(
-    <AdvancedTable
-        columnDefinitions={styledColumnDefs}
-        data={{ testid: testId }}
-        tableData={MOCK_DATA}
-    />
-  );
-
-  const headerCell = screen.getByText("New Enrollments").closest("th");
-  expect(headerCell).toHaveAttribute("align", "left");
-});
-
-test("columnStyling.cellAlignment sets each <td> align attribute as expected", () => {
-  const styledColumnDefs = [
-    {
-      accessor: "year",
-      label: "Year",
-      cellAccessors: ["quarter", "month", "day"],
-    },
-    {
-      accessor: "newEnrollments",
-      label: "New Enrollments",
-      columnStyling: { cellAlignment: "left" },
-    },
-    {
-      accessor: "scheduledMeetings",
-      label: "Scheduled Meetings",
-    },
-  ];
-
-  render(
-    <AdvancedTable
-        columnDefinitions={styledColumnDefs}
-        data={{ testid: testId }}
-        tableData={MOCK_DATA}
-    />
-  );
-
-  const firstEnrollmentCell = screen.getAllByText("20")[0].closest("td");
-  expect(firstEnrollmentCell).toHaveAttribute("align", "left");
-});
-
-test("renders virtualized table rows and header", () => {
-  render(
-    <AdvancedTable
-        columnDefinitions={columnDefinitions}
-        data={{ testid: testId }}
-        tableData={MOCK_DATA_WITH_ID}
-        virtualizedRows
-    />
-  )
-
-  const kit = screen.getByTestId(testId)
-
-  const virtualizedHeader = kit.querySelector('.virtualized-header-row-header')
-  expect(virtualizedHeader).toBeInTheDocument()
-
-  const virtualizedRows = kit.querySelectorAll('.virtualized-table-row')
-  expect(virtualizedRows.length).toBeLessThan(MOCK_DATA_WITH_ID.length)
-})
-
-test("rowStyling prop works as expected", () => {
-  const rowStyling = [
-  {
-    rowId: "1",
-    backgroundColor: colors.white,
-    fontColor: colors.black
-  },
-];
-
-  render(
-    <AdvancedTable
-        columnDefinitions={columnDefinitions}
-        data={{ testid: testId }}
-        rowStyling={rowStyling}
-        tableData={MOCK_DATA_WITH_ID}
-    />
-  )
-
-  const kit = screen.getByTestId(testId)
-  const tableBody = kit.querySelector('tbody')
-  const row1 = tableBody.querySelector('tr:nth-child(1)') 
-  expect(row1).toHaveStyle({backgroundColor: colors.white, color: colors.black})
-})
+})

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_beta_sort.html.erb

@@ -51,7 +51,7 @@
   ]
 %>
 
-<%= pb_rails("advanced_table", props: { table_data: @table_data, column_definitions: column_definitions, id: "beta_sort" }) do %>
+<%= pb_rails("advanced_table", props: { table_data: @table_data, column_definitions: column_definitions }) do %>
   <%= pb_rails("advanced_table/table_header", props: { column_definitions: column_definitions }) %>
   <%= pb_rails("advanced_table/table_body", props: { id: "beta_sort", table_data: @table_data, column_definitions: column_definitions, enable_toggle_expansion: "all" }) %>
 <% end %>

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_beta_subrow_headers.html.erb

@@ -34,7 +34,7 @@
   subrow_headers = ["Quarter", "Month", "Day"]
 %>
 
-<%= pb_rails("advanced_table", props: { table_data: @table_data, column_definitions: column_definitions, id: "test_table" }) do %>
+<%= pb_rails("advanced_table", props: { table_data: @table_data, column_definitions: column_definitions }) do %>
   <%= pb_rails("advanced_table/table_header", props: { column_definitions: column_definitions }) %>
   <%= pb_rails("advanced_table/table_body", props: { id: "test_table", table_data: @table_data, column_definitions: column_definitions, subrow_headers: subrow_headers, enable_toggle_expansion: "all" }) %>
 <% end %>

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_column_border_color_rails.html.erb

@@ -55,4 +55,4 @@
   },
 ] %>
 
-<%= pb_rails("advanced_table", props: { id: "beta_table_with_color_headers", table_data: @table_data, column_definitions: column_definitions, column_group_border_color: "text_lt_default", table_props: { vertical_border: true } }) %>
+<%= pb_rails("advanced_table", props: { id: "beta_table_with_muilti_headers", table_data: @table_data, column_definitions: column_definitions, column_group_border_color: "text_lt_default", table_props: { vertical_border: true } }) %>

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_loading.html.erb

@@ -30,4 +30,4 @@
     }
 ] %>
 
-<%= pb_rails("advanced_table", props: { id: "loading_table", table_data: @table_data, column_definitions: column_definitions, loading: true }) %>
+<%= pb_rails("advanced_table", props: { id: "beta_table", table_data: @table_data, column_definitions: column_definitions, loading: true }) %>

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pinned_rows.jsx

@@ -35,7 +35,7 @@ const AdvancedTableRowPinning = (props) => {
     },
   ]
 
-  const [pinnedRows, setPinnedRows] = useState({top: ["8"]})
+  const [pinnedRows, setPinnedRows] = useState({top: ["8", "9", "10", "11", "12", "13", "14"]})
 
   return (
     <div>

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_pinned_rows_react.md

@@ -1,7 +1,5 @@
-Use the `pinnedRows` prop to pin specific rows to the top of an Advanced Table. Pinned rows will remain at the top when scrolling through table data and will not change position if sorting is used.
+Use the `pinnedRows` prop to pin specific rows to the top of an Advanced Table. Pinned rows will remain at the top when scrolling through table data and reorganizing via sorting.
 
-**NOTE:** 
+**NOTE:** This prop is in Beta. Current Requirements for V1:
 - Sticky header required: Pinned rows must be used with `sticky: true` via `tableProps` (works with both responsive and non-responsive tables)
-- Row ids required: Each object within the `tableData` Array must contain a unique id in order to attach an id to all Rows for this to function. 
-- `pinnedRows` takes an array of row ids to the `top` property as shown in the code snippet below. 
-- For expandable rows, use the parent id in `pinnedRows`, all its children will automatically be pinned with it. If id for a child is passed in without parent being pinned, nothing will be pinned. 
+- Row ids required: Pass an array of row ids to the `top` property. For expandable rows, both parent and all its child row ids must be included individually

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_actions.jsx

@@ -47,14 +47,14 @@ const CustomActions = () => {
       <CircleIconButton
           icon="file-csv"
           onClick={() =>
-            alert(rowIds.length === 0 ? "No Selection Made" : 'Row ids ' + rowIds.join(", ") + 'will be exported!')
+            alert(rowIds.length === 0 ? "No Selection Made" : `Row ids ${rowIds.join(", ")} will be exported!`)
           }
           variant="link"
       />
       <CircleIconButton
           icon="trash-alt"
           onClick={() =>
-            alert(rowIds.length === 0 ? "No Selection Made" : 'Row ids ' + rowIds.join(", ") + 'will be deleted!')
+            alert(rowIds.length === 0 ? "No Selection Made" : `Row ids ${rowIds.join(", ")} will be deleted!`)
           }
           variant="link"
         />

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_selectable_rows_actions_rails.html.erb

@@ -88,11 +88,10 @@ actions = [
     if (!selectedRowIds || selectedRowIds.length === 0) {
       alert('No Selection Made');
     } else {
-      const selectedRowsString = selectedRowIds.join(', ');
       if (actionType === 'export') {
-        alert('Row ids ' + selectedRowsString + ' will be exported!');
+        alert(`Row ids ${selectedRowIds.join(', ')} will be exported!`);
       } else if (actionType === 'delete') {
-        alert('Row ids ' + selectedRowsString + ' will be deleted!');
+        alert(`Row ids ${selectedRowIds.join(', ')} will be deleted!`);
       }
     }
   };

data/app/pb_kits/playbook/pb_advanced_table/docs/_advanced_table_table_props_sticky_header.html.erb

@@ -30,4 +30,4 @@
     }
 ] %>
 
-<%= pb_rails("advanced_table", props: { id: "table_props_sticky_table", table_data: @table_data, column_definitions: column_definitions, max_height: "xs", table_props: { sticky: true }}) %>
+<%= pb_rails("advanced_table", props: { id: "table_props_table", table_data: @table_data, column_definitions: column_definitions, max_height: "xs", table_props: { sticky: true }}) %>

data/app/pb_kits/playbook/pb_advanced_table/docs/example.yml

@@ -19,8 +19,6 @@ examples:
   - advanced_table_selectable_rows_actions_rails: Selectable Rows (With Actions)
   - advanced_table_selectable_rows_header_rails: Selectable Rows (No Actions Bar)
   - advanced_table_scrollbar_none: Advanced Table Scrollbar None
-  # - advanced_table_column_styling_rails: Column Styling
-  # - advanced_table_column_styling_column_headers_rails: Column Styling with Multiple Headers
 
   react:
   - advanced_table_default: Default (Required Props)
@@ -59,7 +57,3 @@ examples:
   - advanced_table_column_visibility_multi: Column Visibility Control with Multi-Header Columns
   - advanced_table_pinned_rows: Pinned Rows
   - advanced_table_scrollbar_none: Advanced Table Scrollbar None
-  - advanced_table_row_styling: Row Styling
-  - advanced_table_column_styling: Column Styling
-  - advanced_table_column_styling_column_headers: Column Styling with Multiple Headers
-  - advanced_table_infinite_scroll: Infinite Scroll

data/app/pb_kits/playbook/pb_advanced_table/docs/index.js

@@ -34,7 +34,3 @@ export { default as AdvancedTableColumnVisibilityMulti } from './_advanced_table
 export { default as AdvancedTableColumnVisibilityWithState } from './_advanced_table_column_visibility_with_state.jsx'
 export { default as AdvancedTablePinnedRows } from './_advanced_table_pinned_rows.jsx'
 export { default as AdvancedTableScrollbarNone} from './_advanced_table_scrollbar_none.jsx'
-export { default as AdvancedTableRowStyling } from './_advanced_table_row_styling.jsx'
-export { default as AdvancedTableColumnStyling } from './_advanced_table_column_styling.jsx'
-export { default as AdvancedTableColumnStylingColumnHeaders } from './_advanced_table_column_styling_column_headers.jsx'
-export { default as AdvancedTableInfiniteScroll} from './_advanced_table_infinite_scroll.jsx'