@wordpress/components
Version:
UI components for WordPress.
44 lines (42 loc) • 1.17 kB
JavaScript
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
import { useMemo } from '@wordpress/element';
/**
* Internal dependencies
*/
import { useContextSystem } from '../../ui/context';
import * as styles from '../styles';
import { useItemGroupContext } from '../context';
import { useCx } from '../../utils/hooks/use-cx';
export function useItem(props) {
const {
as: asProp,
className,
onClick,
role = 'listitem',
size: sizeProp,
...otherProps
} = useContextSystem(props, 'Item');
const {
spacedAround,
size: contextSize
} = useItemGroupContext();
const size = sizeProp || contextSize;
const as = asProp || (typeof onClick !== 'undefined' ? 'button' : 'div');
const cx = useCx();
const classes = useMemo(() => cx(as === 'button' && styles.unstyledButton, styles.itemSizes[size] || styles.itemSizes.medium, styles.item, spacedAround && styles.spacedAround, className), [as, className, cx, size, spacedAround]);
const wrapperClassName = cx(styles.itemWrapper);
return {
as,
className: classes,
onClick,
wrapperClassName,
role,
...otherProps
};
}
//# sourceMappingURL=hook.js.map