aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/MetaItems/MetaItem/MetaItem.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/MetaItems/MetaItem/MetaItem.tsx')
-rw-r--r--src/components/MetaItems/MetaItem/MetaItem.tsx36
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;