import Image$1 from '../../image/Image.mjs';
import { clsx } from 'clsx';
import { useListItemMedia } from '../useListItemMedia.mjs';
import { jsx } from 'react/jsx-runtime';

const Image = ({
  alt = '',
  size = 48,
  className,
  ...props
}) => {
  useListItemMedia(size);
  return /*#__PURE__*/jsx("div", {
    className: clsx('wds-list-item-media-image-wrapper'),
    style: {
      '--wds-list-item-media-size': `${size}px`
    },
    children: /*#__PURE__*/jsx(Image$1, {
      ...props,
      className: clsx(className, 'wds-list-item-media-image'),
      alt: alt,
      role: alt ? undefined : 'presentation'
    })
  });
};
Image.displayName = 'ListItem.Image';

export { Image };
//# sourceMappingURL=ListItemImage.mjs.map
