diff options
Diffstat (limited to 'src/components/MetaItems/MetaItem/MetaItem.tsx')
| -rw-r--r-- | src/components/MetaItems/MetaItem/MetaItem.tsx | 36 |
1 files changed, 36 insertions, 0 deletions
diff --git a/src/components/MetaItems/MetaItem/MetaItem.tsx b/src/components/MetaItems/MetaItem/MetaItem.tsx new file mode 100644 index 0000000..5c51283 --- /dev/null +++ b/src/components/MetaItems/MetaItem/MetaItem.tsx @@ -0,0 +1,36 @@ +import { MetaKind } from '@ts/types/app'; +import { ReactElement } from 'react'; +import styles from './MetaItem.module.scss'; + +const MetaItem = ({ + title, + value, + values, + info, + kind = 'list', +}: { + title: string; + value?: ReactElement | string; + values?: ReactElement[] | string[]; + info?: string; + kind: MetaKind; +}) => { + return ( + <div className={styles[`wrapper--${kind}`]}> + <dt className={styles[`title--${kind}`]}>{title}</dt> + {value && ( + <dd className={styles[`body--${kind}`]} title={info}> + {value} + </dd> + )} + {values && + values.map((currentValue, index) => ( + <dd key={index} className={styles[`body--${kind}`]} title={info}> + {currentValue} + </dd> + ))} + </div> + ); +}; + +export default MetaItem; |
