xref: /expo/docs/ui/components/Table/HeaderCell.tsx (revision d10239f8)
1import { css } from '@emotion/react';
2import { theme, typography } from '@expo/styleguide';
3import React, { PropsWithChildren } from 'react';
4
5import { TextAlign } from './types';
6
7type HeaderCellProps = PropsWithChildren<{
8  textAlign?: TextAlign;
9}>;
10
11export const HeaderCell = ({ children, textAlign }: HeaderCellProps) => (
12  <th css={[tableHeadersCellStyle, textAlign && { textAlign }]}>{children}</th>
13);
14
15const tableHeadersCellStyle = css({
16  color: theme.text.default,
17  fontFamily: typography.fontFaces.medium,
18  verticalAlign: 'middle',
19});
20