ghost-portal/packages/react-components/src/Table/Foot.tsx
Jaco eacf028ba6
Use .js imports in src (#9132)
* Use .js imports in src

* Additional

* Additional

* Additional

* Additional

* Additional

* Additional

* Additional

* Additional

* Additional

* Additional

* Additional

* Additional

* Additional

* Add WP extension aliases

* Bump dev

* Additional

* Additional

* Adjust extensionAlias order
2023-03-09 12:11:03 +02:00

43 lines
877 B
TypeScript

// Copyright 2017-2023 @polkadot/react-components authors & contributors
// SPDX-License-Identifier: Apache-2.0
import React from 'react';
import { styled } from '../styled.js';
interface Props {
className?: string;
footer?: React.ReactNode;
isEmpty: boolean;
}
function Foot ({ className = '', footer, isEmpty }: Props): React.ReactElement<Props> | null {
if (!footer || isEmpty) {
return null;
}
return (
<StyledTfoot className={`${className} ui--Table-Foot`}>
{footer}
</StyledTfoot>
);
}
const StyledTfoot = styled.tfoot`
td {
color: var(--color-table-foot);
font: var(--font-sans);
font-weight: var(--font-weight-normal);
padding: 0.75rem 1rem 0.25rem;
text-align: right;
vertical-align: baseline;
white-space: nowrap;
}
tr {
background: var(--bg-page);
}
`;
export default React.memo(Foot);