@payfit/unity-components
Version:
60 lines (59 loc) • 2.02 kB
TypeScript
import { VariantProps } from '@payfit/unity-themes';
import { PropsWithChildren } from 'react';
declare const cardContent: import('tailwind-variants').TVReturnType<{
contentSizing: {
fit: "uy:flex-none";
fill: "uy:flex-1 uy:min-h-0";
};
}, undefined, "uy:block", {
contentSizing: {
fit: "uy:flex-none";
fill: "uy:flex-1 uy:min-h-0";
};
}, undefined, import('tailwind-variants').TVReturnTypeLike<{
contentSizing: {
fit: "uy:flex-none";
fill: "uy:flex-1 uy:min-h-0";
};
}, undefined>>;
export interface CardContentProps extends PropsWithChildren {
/** Additional CSS classes to apply to the content container */
className?: string;
/**
* Controls how the content is sized within its Card.
* @default 'fit'
*/
contentSizing?: VariantProps<typeof cardContent>['contentSizing'];
}
/**
* The `CardContent` component provides a container for the main content within a Card.
* It ensures consistent spacing and layout for card content.
*
* Use CardContent to wrap the main body of your card content. This is optional but provides
* better semantic structure and consistent styling.
* @param {CardContentProps} props - The props for the `CardContent` component
* @example
* ```tsx
* import { Card, CardTitle, CardContent } from '@payfit/unity-components'
*
* function Example() {
* return (
* <Card>
* <CardTitle>My Card</CardTitle>
* <CardContent>
* <p>This is the main content of the card.</p>
* </CardContent>
* </Card>
* )
* }
* ```
* @see {@link CardContentProps} for all available props
* @remarks
* - CardContent is optional but recommended for better structure
* - You can also place content directly in the Card without CardContent
*/
declare function CardContent({ children, className, contentSizing }: CardContentProps): import("react/jsx-runtime").JSX.Element;
declare namespace CardContent {
var displayName: string;
}
export { CardContent };