API Reference

The complete reference for everything exported by Blog Kit. For tutorials and usage examples, see Getting Started and Guides.

---

Core Package (@haroonwaves/blog-kit-core)

All core functions require Node.js (fs module) and only work in server environments (Next.js SSR/SSG, Node.js scripts, etc.).

getAllContentMeta(config: ContentConfig): ContentMeta[]

Returns an array of all content metadata sorted by date (newest first).

Parameters:

• config.contentDirectory (string): Path to your content directory
• config.contentSubdirectory (string, optional): Subdirectory for content files (defaults to 'blog')

Returns: Array of ContentMeta objects

import { getAllContentMeta } from '@haroonwaves/blog-kit-core';

const docsMeta = getAllContentMeta({
	contentDirectory: process.cwd(),
	contentSubdirectory: 'content/docs',
});

docsMeta.forEach((meta) => {
	console.log(meta.title, meta.slug, meta.readingTime);
});

getContent(slug: string, config: ContentConfig): Content | null

Returns the full content data (metadata + body) for a specific slug.

Parameters:

• slug (string): The content slug (filename without .md)
• config.contentDirectory (string): Path to your content directory
• config.contentSubdirectory (string, optional): Subdirectory for content files (defaults to 'blog')

Returns: Content object or null if not found

import { getContent } from '@haroonwaves/blog-kit-core';

const doc = getContent('getting-started', {
	contentDirectory: process.cwd(),
	contentSubdirectory: 'content/docs',
});

if (doc) {
	console.log(doc.metadata.title);
	console.log(doc.metadata.readingTime);
	console.log(doc.body);
}

---

React Package (@haroonwaves/blog-kit-react)

Components

ContentList

A stateless component that renders a list of content cards. Works with both server-side and client-side rendering.

---

ContentCard

Renders a single content item card with category badges, reading time, and date.

---

ContentRenderer

Renders markdown content with syntax highlighting (Prism), GFM support, heading anchor links, and styled typography. Supports custom component overrides.

Overridable elements: h1–h6, p, a, blockquote, code, pre, img, table, thead, tbody, tr, th, td, ul, ol, li, strong, em, del, hr, br, input

---

Filter

A client component for searching and category filtering.

classNames keys: input, categoryContainer, pill, activePill, inactivePill, contentCount

---

ContentPlaceholder

Renders animated skeleton loading cards.

---

Hooks

useContent(allContentMeta: ContentMeta[])

A client-side hook that provides search and category filter state management with debounced search (500ms).

Parameters:

• allContentMeta (ContentMeta[]): Array of content metadata to filter

Returns:

---

Utility Functions

filterContent(items: ContentMeta[], searchTerm?: string, selectedCategory?: string | null): ContentMeta[]

Pure utility to filter content by search term (matches title and description) and/or category. Useful for server-side filtering or custom implementations outside of useContent.

getAvailableCategories(items: ContentMeta[]): string[]

Returns a deduplicated array of all categories across the provided content metadata.

---

Types

All types are exported from both @haroonwaves/blog-kit-core and @haroonwaves/blog-kit-react.

interface ContentMeta {
	title: string;
	description: string;
	date: string;
	categories?: string[];
	slug: string;
	readingTime: string;
}

interface Content {
	metadata: ContentMeta;
	body: string;
}

interface ContentConfig {
	contentDirectory: string;
	contentSubdirectory?: string; // defaults to 'blog'
}