2024-02-03 11:56:49 +03:00
|
|
|
import Image from 'next/image';
|
2024-02-03 01:05:53 +03:00
|
|
|
import React, { forwardRef } from 'react';
|
|
|
|
import { CardMediaProps, CardMediaType } from './card.types';
|
2024-02-03 00:34:54 +03:00
|
|
|
|
2024-02-03 01:05:53 +03:00
|
|
|
export const CardMedia = forwardRef<CardMediaType, CardMediaProps>(
|
|
|
|
(
|
2024-02-03 11:56:49 +03:00
|
|
|
{
|
|
|
|
alt,
|
|
|
|
src,
|
|
|
|
type,
|
|
|
|
quality = 80,
|
|
|
|
rounded = true,
|
|
|
|
preview = true,
|
|
|
|
className = '',
|
|
|
|
...props
|
|
|
|
},
|
2024-02-03 01:05:53 +03:00
|
|
|
ref,
|
|
|
|
) => {
|
|
|
|
const classes =
|
|
|
|
`m3 m3-card-media${rounded ? ' m3-rounded' : ''}${preview ? ' m3-preview' : ''} ${className}`.trimEnd();
|
2024-02-03 11:56:49 +03:00
|
|
|
|
|
|
|
switch (type) {
|
|
|
|
case 'img':
|
|
|
|
return <Image alt={alt} quality={quality} src={src} />;
|
|
|
|
default:
|
|
|
|
return React.createElement(type, {
|
|
|
|
...props,
|
|
|
|
className: classes,
|
|
|
|
ref: ref,
|
|
|
|
});
|
|
|
|
}
|
2024-02-03 01:05:53 +03:00
|
|
|
},
|
|
|
|
);
|