Sha256: 0e1639285ac8adfc16ca0f7c19cff53fa2e43faa29374b583949d3ec0d108acc

Contents?: true

Size: 1.98 KB

Versions: 26

Compression:

Stored size: 1.98 KB

Contents

import React, { useContext } from "react"
import Flex from "../../pb_flex/_flex"
import Caption from "../../pb_caption/_caption"
import { Row, Table } from "@tanstack/react-table"

import AdvancedTableContext from "../Context/AdvancedTableContext";
import { ToggleIconButton } from "./ToggleIconButton"
import { renderCollapsibleTrail } from "./CollapsibleTrail"

import { isChrome } from "../Utilities/BrowserCheck"
import { DataType } from "../Utilities/types"
import { GlobalProps } from "../../utilities/globalProps"

interface SubRowHeaderRowProps {
  collapsibleTrail?: boolean
  enableToggleExpansion?: "all" | "header" | "none"
  onClick: (row: Row<DataType>) => void
  row: Row<DataType>
  subRowHeaders?: string[]
  table: Table<DataType>
}

export const SubRowHeaderRow = ({
  collapsibleTrail,
  enableToggleExpansion,
  onClick,
  row,
  subRowHeaders,
  table,
}: SubRowHeaderRowProps & GlobalProps) => {
  const { inlineRowLoading } = useContext(AdvancedTableContext);

  const numberOfColumns = table.getAllFlatColumns().length
  const rowHasChildren = row.original.children ? true : false
  const canExpand = inlineRowLoading ? rowHasChildren : row.getCanExpand()

  return (
    <tr className="custom-row bg-silver">
      <td
          className={`custom-row-first-column ${
          isChrome() ? "chrome-styles" : ""
          }`}
          colSpan={1}
      >
        {collapsibleTrail && row.depth > 0 && renderCollapsibleTrail(row.depth)}
        <div style={{ paddingLeft: `${row.depth * 1.25}em` }}>
          <Flex align="center" 
              columnGap="xs"
          >
            {enableToggleExpansion === "all" && canExpand ? (
              <ToggleIconButton onClick={onClick} 
                  row={row}
              />
            ) : null}
            <Caption
                marginLeft={canExpand ? "none" : "xs"}
                text={subRowHeaders[row.depth - 1]}
            />
          </Flex>
        </div>
      </td>

      <td colSpan={numberOfColumns - 1} />
    </tr>
  )
}

Version data entries

26 entries across 26 versions & 1 rubygems

Version Path
playbook_ui-13.19.0.pre.alpha.PBNTR207tabledivsupport2245 app/pb_kits/playbook/pb_advanced_table/Components/SubRowHeaderRow.tsx
playbook_ui-13.19.0 app/pb_kits/playbook/pb_advanced_table/Components/SubRowHeaderRow.tsx
playbook_ui-13.18.0.pre.alpha.PBNTR191AdvancedTableFinalFixes2197 app/pb_kits/playbook/pb_advanced_table/Components/SubRowHeaderRow.tsx
playbook_ui-13.18.0.pre.alpha.PBNTR191AdvancedTableFinalFixes2178 app/pb_kits/playbook/pb_advanced_table/Components/SubRowHeaderRow.tsx
playbook_ui-13.18.0.pre.alpha.PBNTR191AdvancedTableFinalFixes2176 app/pb_kits/playbook/pb_advanced_table/Components/SubRowHeaderRow.tsx
playbook_ui-13.18.0.pre.alpha.PBNTR191AdvancedTableFinalFixes2173 app/pb_kits/playbook/pb_advanced_table/Components/SubRowHeaderRow.tsx