34 lines
641 B
TypeScript
34 lines
641 B
TypeScript
import {
|
|
Flex,
|
|
forwardRef,
|
|
Heading,
|
|
HeadingProps,
|
|
Text,
|
|
} from '@chakra-ui/react';
|
|
|
|
type TileInfoProps = HeadingProps & {
|
|
heading: string;
|
|
info: string;
|
|
width?: number;
|
|
};
|
|
|
|
export const TileInfo = forwardRef<TileInfoProps, 'h2'>(
|
|
({ heading, info, width = 250, ...headingProps }, ref) => (
|
|
<Flex direction="column" alignItems="center">
|
|
<Heading ref={ref} {...headingProps}>
|
|
{heading}
|
|
</Heading>
|
|
<Text
|
|
width={width}
|
|
whiteSpace="nowrap"
|
|
overflow="hidden"
|
|
textOverflow="ellipsis"
|
|
textAlign="center"
|
|
>
|
|
{info}
|
|
</Text>
|
|
</Flex>
|
|
)
|
|
);
|
|
|