Article Meta

1import { memo } from "react";
2import { cn } from "@/lib/utils";
3import { MetaItem } from "./parts/meta-item";
4import type { ArticleMetaProps } from "./types";
5 
6const ALIGN_CLASS = {
7  start: "justify-start",
8  center: "justify-center",
9  end: "justify-end",
10} as const;
11 
12function ArticleMetaInner(props: ArticleMetaProps) {
13  const {
14    items,
15    linkComponent = "a",
16    divider = false,
17    align = "start",
18    gapClass = "gap-6",
19    className,
20    itemClassName,
21    iconClassName,
22  } = props;
23 
24  return (
25    <ul
26      role="list"
27      className={cn(
28        "flex flex-wrap items-center text-muted-foreground list-none",
29        gapClass,
30        ALIGN_CLASS[align],
31        divider && "pb-8 border-b border-border",
32        className
33      )}
34    >
35      {items.map((item) => (
36        <MetaItem
37          key={item.id}
38          item={item}
39          linkComponent={linkComponent}
40          itemClassName={itemClassName}
41          iconClassName={iconClassName}
42        />
43      ))}
44    </ul>
45  );
46}
47 
48export const ArticleMeta = memo(ArticleMetaInner);
49ArticleMeta.displayName = "ArticleMeta";