@scribe-atp/react

Components

ScribeContent

function ScribeContent(props: ScribeContentProps): JSX.Element

type ScribeContentProps = Omit<HTMLAttributes<HTMLDivElement>, "dangerouslySetInnerHTML"> & {
  html: string;
};

A thin <div> wrapper that renders serialised article HTML. Adds the scribe-content class automatically so styles from @scribe-atp/styles are applied. Accepts all standard div HTML attributes — className is merged with scribe-content, not replaced.

import { ScribeContent } from "@scribe-atp/react";
import "@scribe-atp/styles";

<ScribeContent html={article.content} />

// With an extra class
<ScribeContent html={article.content} className={styles.articleBody} />

See the @scribe-atp/styles reference for theming and the full list of styled elements.

---

Hooks

useSite

function useSite(author: string, publicationUrl: string): UseSiteResult

interface UseSiteResult {
  site: Site | null;
  loading: boolean;
  error: Error | null;
}

Fetches a site on mount and re-fetches whenever author or publicationUrl changes. Aborts the in-flight request on unmount and on parameter change.

Parameter	Type	Description
author	string	Author handle or DID
publicationUrl	string	The site’s canonical HTTPS URL, e.g. "https://alice.bsky.social"

While loading, site is null and loading is true. On error, site remains null and error is set. AbortError is swallowed and does not set error.

---

useArticle

function useArticle(author: string, articleSlug: string): UseArticleResult

interface UseArticleResult {
  article: Article | null;
  loading: boolean;
  error: Error | null;
}

Fetches an article on mount and re-fetches whenever author or articleSlug changes. Aborts on unmount and on parameter change.

Parameter	Type	Description
author	string	Author handle or DID
articleSlug	string	Article rkey / slug

---

Utilities

toSlug is re-exported for convenience:

import { toSlug } from '@scribe-atp/react';

See toSlug in the core reference for details.

Note: toSlug is no longer needed when calling useSite — pass the canonical HTTPS URL directly as the second argument.

---

Types

All types from @scribe-atp/core are re-exported:

import type { Site, Article, ArticleRef, SiteGroup } from '@scribe-atp/react';

See the core reference for type definitions.