@wordpress/components
Version:
UI components for WordPress.
52 lines (47 loc) • 1.41 kB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
import { cx as _cx } from "emotion";
import { createElement } from "@wordpress/element";
/**
* WordPress dependencies
*/
import { useMemo } from '@wordpress/element';
/**
* Internal dependencies
*/
import { contextConnect, useContextSystem } from '../context';
import { Flex } from '../../flex';
import * as styles from './styles';
/**
* @param {import('../context').ViewOwnProps<import('./types').CardFooterProps, 'div'>} props
* @param {import('react').Ref<any>} forwardedRef
*/
function CardFooter(props, forwardedRef) {
const {
className,
justify = 'flex-end',
size = 'medium',
...otherProps
} = useContextSystem(props, 'CardFooter');
const classes = useMemo(() => _cx(styles.borderRadius, styles.headerFooter, styles[size], className), [className, size]);
return createElement(Flex, _extends({}, otherProps, {
className: classes,
justify: justify,
ref: forwardedRef
}));
}
/**
* `CardFooter` is a layout component, rendering the footer content of a `Card`.
*
* @example
* ```jsx
* import { Card, CardBody, CardFooter } from `@wordpress/components/ui`;
*
* <Card>
* <CardBody>...</CardBody>
* <CardFooter>...</CardFooter>
* </Card>
* ```
*/
const ConnectedCardFooter = contextConnect(CardFooter, 'CardFooter');
export default ConnectedCardFooter;
//# sourceMappingURL=footer.js.map