@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.

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.

---

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.