⬅️ Back to Table of Contents

📄 Title

📊 Analysis Summary

Metric	Count
🔧 Functions	1
📦 Imports	7
💠 JSX Elements	3

📚 Table of Contents

• Imports
• JSX Elements
• Functions

🛠️ File Location:

📂 packages/website/src/theme/BlogPostItem/Header/Title/index.tsx

📦 Imports

Name	Source
Props	@theme/BlogPostItem/Header/Title
Link	@docusaurus/Link
useBlogPost	@docusaurus/plugin-content-blog/client
clsx	clsx
React	react
Markdown	react-markdown
styles	./styles.module.css

---

JSX Elements

Component	Type	Props	Children
Markdown	component	none	{titleRaw}
TitleHeading	component	className={clsx(styles.title, className)}	{isBlogPostPage ? title : {title}}
Link	component	to={permalink}	{title}

---

Functions

BlogPostItemHeaderTitle({ className, }: Props): React.JSX.Element

Parameters:

• { className, } Props

Returns: React.JSX.Element

Calls:

• useBlogPost (from @docusaurus/plugin-content-blog/client)
• clsx (from clsx)

Code

export default function BlogPostItemHeaderTitle({
  className,
}: Props): React.JSX.Element {
  const { isBlogPostPage, metadata } = useBlogPost();
  const { permalink, title: titleRaw } = metadata;
  const TitleHeading = isBlogPostPage ? 'h1' : 'h2';
  const title = <Markdown>{titleRaw}</Markdown>;
  return (
    <TitleHeading className={clsx(styles.title, className)}>
      {isBlogPostPage ? title : <Link to={permalink}>{title}</Link>}
    </TitleHeading>
  );
}

---

Generated by Syntax Scribe