|
@@ -82,6 +82,7 @@ const Table: React.FC<TableProps> = ({
|
|
|
return (
|
|
return (
|
|
|
<StyledTr
|
|
<StyledTr
|
|
|
{...row.getRowProps()}
|
|
{...row.getRowProps()}
|
|
|
|
|
+ enablePointer={!!onRowClick}
|
|
|
onClick={() => onRowClick && onRowClick(row)}
|
|
onClick={() => onRowClick && onRowClick(row)}
|
|
|
selected={false}
|
|
selected={false}
|
|
|
>
|
|
>
|
|
@@ -129,14 +130,21 @@ const TableWrapper = styled.div`
|
|
|
padding-bottom: 20px;
|
|
padding-bottom: 20px;
|
|
|
`;
|
|
`;
|
|
|
|
|
|
|
|
|
|
+type StyledTrProps = {
|
|
|
|
|
+ enablePointer?: boolean;
|
|
|
|
|
+ disableHover?: boolean;
|
|
|
|
|
+ selected?: boolean;
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
export const StyledTr = styled.tr`
|
|
export const StyledTr = styled.tr`
|
|
|
line-height: 2.2em;
|
|
line-height: 2.2em;
|
|
|
- background: ${(props: { disableHover?: boolean; selected?: boolean }) =>
|
|
|
|
|
- props.selected ? "#ffffff11" : ""};
|
|
|
|
|
|
|
+ background: ${(props: StyledTrProps) => (props.selected ? "#ffffff11" : "")};
|
|
|
:hover {
|
|
:hover {
|
|
|
- background: ${(props: { disableHover?: boolean; selected?: boolean }) =>
|
|
|
|
|
|
|
+ background: ${(props: StyledTrProps) =>
|
|
|
props.disableHover ? "" : "#ffffff22"};
|
|
props.disableHover ? "" : "#ffffff22"};
|
|
|
}
|
|
}
|
|
|
|
|
+ cursor: ${(props: StyledTrProps) =>
|
|
|
|
|
+ props.enablePointer ? "pointer" : "unset"};
|
|
|
`;
|
|
`;
|
|
|
|
|
|
|
|
export const StyledTd = styled.td`
|
|
export const StyledTd = styled.td`
|