import { a as NotionBlock, c as ResolveImageUrlFn, d as ResolvedPageLink, i as HeadingBlockObjectResponse, l as ResolvePageTitleFn, n as BlockComponentProps, o as NotionRendererProps, r as ComponentOverrides, s as PageLinkMap, t as BlockClassNames, u as ResolvePageUrlFn } from "./types-B8b2hjw1.mjs";
import { n as resolveBlockImageUrls, t as CacheImageFn } from "./resolve-image-urls-DkZ4-Q7C.mjs";
import * as React$1 from "react";
import { AnchorHTMLAttributes, ElementType, ImgHTMLAttributes, ReactNode } from "react";
import { Collapsible } from "radix-ui";
import { VariantProps } from "class-variance-authority";
import { AudioBlockObjectResponse, BlockObjectResponse, BookmarkBlockObjectResponse, BulletedListItemBlockObjectResponse, CalloutBlockObjectResponse, ChildDatabaseBlockObjectResponse, ChildPageBlockObjectResponse, CodeBlockObjectResponse, ColumnBlockObjectResponse, ColumnListBlockObjectResponse, EmbedBlockObjectResponse, EquationBlockObjectResponse, FileBlockObjectResponse, Heading1BlockObjectResponse, Heading2BlockObjectResponse, Heading3BlockObjectResponse, Heading4BlockObjectResponse, ImageBlockObjectResponse, LinkPreviewBlockObjectResponse, LinkToPageBlockObjectResponse, NumberedListItemBlockObjectResponse, ParagraphBlockObjectResponse, PdfBlockObjectResponse, QuoteBlockObjectResponse, RichTextItemResponse, SyncedBlockBlockObjectResponse, TableBlockObjectResponse, ToDoBlockObjectResponse, ToggleBlockObjectResponse, VideoBlockObjectResponse } from "@notionhq/client/build/src/api-endpoints.js";

//#region src/BlockSwitch.d.ts
/** {@link BlockSwitch} の props。`block` 1 個を Context 経由で対応コンポーネントに振り分ける。 */
interface BlockSwitchProps {
  block: NotionBlock;
}
/**
 * `block.type` から対応するコンポーネントを Context 経由で引き当てて描画する。
 * カスタムコンポーネントは `NotionRenderer` の `components` props で渡す。
 *
 * @example
 * ```tsx
 * <NotionRenderer
 *   blocks={blocks}
 *   components={{ Code: MyCustomCodeBlock }}
 * />
 * // 内部で <BlockSwitch block={...} /> が MyCustomCodeBlock を引き当てる
 * ```
 *
 * @see {@link NotionRenderer} カスタムコンポーネント注入を含むトップレベル API。
 */
declare function BlockSwitch({
  block
}: BlockSwitchProps): import("react").JSX.Element;
//#endregion
//#region src/blocks/Audio.d.ts
declare function Audio({
  block,
  className
}: BlockComponentProps<AudioBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Bookmark.d.ts
/**
 * bookmark ブロックの既定描画。`block.ogp`（同期時に付与済みの OGP メタデータ）が
 * あればそれを最優先で使う。無ければ `useOgp` がページアクセス時にクライアントから
 * `ogpEndpoint` を叩いて取得する（それも無ければシェルのリンクカードのまま）。
 */
declare function Bookmark({
  block,
  className
}: BlockComponentProps<BookmarkBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Breadcrumb.d.ts
declare function Breadcrumb({
  className
}?: Pick<BlockComponentProps, "className">): import("react").JSX.Element;
//#endregion
//#region src/blocks/BulletedListItem.d.ts
declare function BulletedListItem({
  block,
  className
}: BlockComponentProps<BulletedListItemBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Callout.d.ts
declare function Callout$1({
  block,
  className
}: BlockComponentProps<CalloutBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/ChildDatabase.d.ts
declare function ChildDatabase({
  block,
  className
}: BlockComponentProps<ChildDatabaseBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/ChildPage.d.ts
declare function ChildPage({
  block,
  className
}: BlockComponentProps<ChildPageBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Code.d.ts
/**
 * デフォルトの Code 描画。shadcn docs 風の枠（ヘッダー: ファイル名 + 言語ラベル +
 * コピーボタン、本体: シンタックスハイライト）。
 *
 * - `__cachedHtml`（`@notion-headless-cms/cms` の `createShikiTransform` 等が同期時に
 *   付与する事前ハイライト済み HTML）があればそれを最優先で描画する
 * - 無ければクライアント水和後に `shiki` を動的 import してハイライトする
 *   （Worker の CPU 予算を消費しない既定経路。`shiki` が peer として無ければスキップ）
 * - どちらも使えない場合は行番号付きの素の `<pre>` にフォールバックする
 * - 行数が多いコードは折りたたむ
 *
 * mermaid を SVG として描画したい場合は `@notion-headless-cms/react-renderer/mermaid`
 * の `MermaidCode` を `<NotionRenderer components={{ Code: MermaidCode }} />` で差し込む。
 */
declare function Code({
  block,
  className
}: BlockComponentProps<CodeBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Column.d.ts
declare function Column({
  block,
  className
}: BlockComponentProps<ColumnBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/ColumnList.d.ts
declare function ColumnList({
  block,
  className
}: BlockComponentProps<ColumnListBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Divider.d.ts
declare function Divider({
  className
}?: Pick<BlockComponentProps, "className">): import("react").JSX.Element;
//#endregion
//#region src/blocks/Embed.d.ts
declare function Embed({
  block,
  className
}: BlockComponentProps<EmbedBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Equation.d.ts
/**
 * ブロック equation の既定描画。
 * `notion-katex` enricher が付与した `__cachedHtml` があればそれを使い、無ければ
 * クライアントで `katex` を動的 import して `displayMode: true` で組版する。
 * peer に `katex` が無いか KaTeX が失敗したら原文を `<pre>` で出す。
 */
declare function Equation({
  block,
  className
}: BlockComponentProps<EquationBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/File.d.ts
declare function File({
  block,
  className
}: BlockComponentProps<FileBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Heading.d.ts
type HeadingBlock = Heading1BlockObjectResponse | Heading2BlockObjectResponse | Heading3BlockObjectResponse | Heading4BlockObjectResponse;
declare function Heading({
  block,
  className: extra
}: BlockComponentProps<HeadingBlock>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Image.d.ts
declare function Image({
  block,
  className
}: BlockComponentProps<ImageBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/LinkPreview.d.ts
/**
 * link_preview ブロックの既定描画。`block.ogp`（同期時付与）優先、無ければ `useOgp`
 * がページアクセス時にクライアントから取得する。それも無ければリンクのみの
 * HoverCard にフォールバックする。
 */
declare function LinkPreview({
  block,
  className
}: BlockComponentProps<LinkPreviewBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/LinkToPage.d.ts
declare function LinkToPage({
  block,
  className
}: BlockComponentProps<LinkToPageBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/NumberedListItem.d.ts
declare function NumberedListItem({
  block,
  className
}: BlockComponentProps<NumberedListItemBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Paragraph.d.ts
declare function Paragraph({
  block,
  className
}: BlockComponentProps<ParagraphBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Pdf.d.ts
declare function Pdf({
  block,
  className
}: BlockComponentProps<PdfBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Quote.d.ts
declare function Quote({
  block,
  className
}: BlockComponentProps<QuoteBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/SyncedBlock.d.ts
declare function SyncedBlock({
  block
}: BlockComponentProps<SyncedBlockBlockObjectResponse>): import("react").JSX.Element | null;
//#endregion
//#region src/blocks/Table.d.ts
declare function Table({
  block,
  className
}: BlockComponentProps<TableBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/TableOfContents.d.ts
/**
 * ページ内の heading_1..4 をリンクリストとして描画する。
 * 見出しは NotionRenderer が抽出して Context に流すため、ここでは読み取るだけ。
 *
 * ScrollArea を使わずに `overflow-y-auto` 直書きにしているのは、Radix の
 * 内部ラッパが `display:table` を被せるため `truncate` が機能しなくなり、
 * 長い見出しテキストが横に溢れて視覚的に重なるのを避けるため。
 */
declare function TableOfContents({
  className
}?: Pick<BlockComponentProps, "className">): import("react").JSX.Element | null;
//#endregion
//#region src/blocks/ToDo.d.ts
declare function ToDo({
  block,
  className
}: BlockComponentProps<ToDoBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Toggle.d.ts
declare function Toggle({
  block,
  className
}: BlockComponentProps<ToggleBlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Unsupported.d.ts
declare function Unsupported({
  block,
  className
}: BlockComponentProps<BlockObjectResponse>): import("react").JSX.Element;
//#endregion
//#region src/blocks/Video.d.ts
declare function Video({
  block,
  className
}: BlockComponentProps<VideoBlockObjectResponse>): import("react").JSX.Element;
declare namespace index_d_exports {
  export { Audio, Bookmark, Breadcrumb, BulletedListItem, Callout$1 as Callout, ChildDatabase, ChildPage, Code, Column, ColumnList, Divider, Embed, Equation, File, Heading, Image, LinkPreview, LinkToPage, NumberedListItem, Paragraph, Pdf, Quote, SyncedBlock, Table, TableOfContents, ToDo, Toggle, Unsupported, Video };
}
//#endregion
//#region src/components/ui/alert.d.ts
declare const alertVariants: (props?: ({
  variant?: "default" | "destructive" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
declare function Alert({
  className,
  variant,
  ...props
}: React$1.ComponentProps<"div"> & VariantProps<typeof alertVariants>): React$1.JSX.Element;
//#endregion
//#region src/components/callout.d.ts
/**
 * shadcn 公式 docs の `callout` 相当。`Alert` を docs 風の surface トーンで包む
 * プレゼンテーション専用コンポーネント。Notion の callout ブロックは
 * `blocks/Callout.tsx` がこれをラップして描画する。
 */
declare function Callout({
  title,
  children,
  icon,
  className,
  variant,
  ...props
}: Omit<React$1.ComponentProps<typeof Alert>, "variant"> & {
  icon?: React$1.ReactNode;
  variant?: "default" | "info" | "warning";
}): React$1.JSX.Element;
//#endregion
//#region src/components/ui/collapsible.d.ts
declare function Collapsible$1({
  ...props
}: React.ComponentProps<typeof Collapsible.Root>): import("react").JSX.Element;
//#endregion
//#region src/components/code-collapsible-wrapper.d.ts
/**
 * shadcn 公式 docs の `code-collapsible-wrapper` 相当。長いコードブロックを
 * 折りたたみ、グラデーション付きのトリガーで開閉する。
 */
declare function CodeCollapsibleWrapper({
  className,
  children,
  ...props
}: React$1.ComponentProps<typeof Collapsible$1>): React$1.JSX.Element;
//#endregion
//#region src/components/ui/button.d.ts
declare const buttonVariants: (props?: ({
  variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
  size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
declare function Button({
  className,
  variant,
  size,
  asChild,
  ...props
}: React$1.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
  asChild?: boolean;
}): React$1.JSX.Element;
//#endregion
//#region src/components/copy-button.d.ts
/**
 * クリップボードへコピーするボタン。コピー後 2 秒だけチェックアイコンに切り替わる。
 * shadcn 公式 docs の `copy-button` 相当（アイコンは lucide-react）。
 *
 * @param value コピーする文字列
 */
declare function CopyButton({
  value,
  className,
  variant,
  ...props
}: React$1.ComponentProps<typeof Button> & {
  value: string;
}): React$1.JSX.Element;
//#endregion
//#region src/lib/extract-headings.d.ts
interface ExtractedHeading {
  id: string;
  level: 1 | 2 | 3 | 4;
  text: string;
}
//#endregion
//#region src/context.d.ts
/**
 * レスポンシブ画像生成に使う幅 (px) のリスト。
 * `Image` ブロックが proxy URL を受け取った場合、`?w={width}` を付けた `srcSet` を生成する。
 */
type ImageSizes = readonly number[];
/**
 * `NotionRenderer` がツリー全体に提供する Context の値。
 * カスタムブロックコンポーネントから `useNotionContext()` で参照する。
 *
 * @see {@link useNotionContext}
 */
interface NotionRendererContextValue {
  components: ComponentOverrides;
  classNames?: BlockClassNames;
  resolveImageUrl?: ResolveImageUrlFn;
  /** Notion 内部リンクの解決マップ（`buildPageLinkMap` の戻り値）。 */
  pageLinks?: PageLinkMap;
  resolvePageUrl?: ResolvePageUrlFn;
  resolvePageTitle?: ResolvePageTitleFn;
  Image?: ElementType<ImgHTMLAttributes<HTMLImageElement>>;
  Link?: ElementType<AnchorHTMLAttributes<HTMLAnchorElement>>;
  /** ページ全体の見出し一覧（TOC 用、`NotionRenderer` が自動抽出）。 */
  headings?: ExtractedHeading[];
  /** numbered_list の入れ子深さ。`<ol>` の list-style ローテーションに使う。 */
  listDepth?: number;
  /**
   * `srcSet` 生成に使う幅 (px) のリスト。指定すると `Image` ブロックは
   * `?w={width}` クエリ付きの URL を `srcSet` として出力する。
   */
  imageSizes?: ImageSizes;
  /** `Image` ブロックに渡す `sizes` 属性 (`srcSet` と組合せて使う)。 */
  imageSizesAttr?: string;
  /** OGP カードのページアクセス時取得エンドポイント。`useOgp` が参照する。 */
  ogpEndpoint?: string;
}
/**
 * `NotionRenderer` の Context にアクセスする hook。
 * カスタムブロックコンポーネントから `components` / `classNames` / `resolveImageUrl` などを取得する。
 *
 * @example
 * ```tsx
 * function MyCodeBlock({ block, className }: BlockComponentProps) {
 *   const { Link } = useNotionContext();
 *   return <pre className={className}><code>...</code></pre>;
 * }
 * ```
 *
 * @see {@link NotionRendererContextValue}
 */
declare const useNotionContext: () => NotionRendererContextValue;
//#endregion
//#region src/embeds/OgCard.d.ts
/**
 * notion-orm が embed/bookmark ブロックに付与する `ogp` フィールドと同形状の型。
 * react-renderer は notion-orm に直接依存しないため、構造的に互換な型を独自に持つ。
 */
interface OgCardData {
  title?: string;
  description?: string;
  image?: string;
  siteName?: string;
}
interface OgCardProps {
  url: string;
  ogp?: OgCardData;
}
/**
 * Notion 本家のブックマークカード風レイアウト。
 * 左側にタイトル/説明/サイト名+URL、右側に OG 画像。
 * ogp 未指定または空でもホスト名 + URL のリンクカードとして崩れずに描画する。
 *
 * shadcn の CardHeader / CardTitle / CardDescription を挟まないのは、
 * これらが grid layout を被せて画像コンテナの flex 伸縮が崩れ、サムネが
 * 見切れる挙動になるため。Card 直下の生 div でレイアウトを完全に手で組む。
 */
declare function OgCard({
  url,
  ogp
}: OgCardProps): import("react").JSX.Element;
//#endregion
//#region src/embeds/useOgp.d.ts
/**
 * ページアクセス時に `{ogpEndpoint}?url=...` から OGP メタデータを取得する。
 * `ogpEndpoint` が Context に無い場合・`url` が falsy（`block.ogp` を既に持つ場合に
 * 呼び出し側が渡す）な場合は何もしない。
 *
 * `@notion-headless-cms/cms` の `createOgpHandler()` が返す
 * `{ ok: boolean, ogp?: OgCardData }` 形式のレスポンスを期待する。
 */
declare function useOgp(url: string | null | undefined): OgCardData | undefined;
declare namespace index_d_exports$1 {
  export { OgCard, OgCardData, OgCardProps, useOgp };
}
//#endregion
//#region src/NotionBlocks.d.ts
/**
 * ブロック配列を描画する。連続する `bulleted_list_item` / `numbered_list_item` は
 * 1 つの `<ul>` / `<ol>` にまとめてから子要素を `BlockSwitch` で描画する。
 * `<ol>` の list-style は `listDepth` でローテートさせ、ネスト時に
 * `decimal → lower-alpha → lower-roman` を循環する（Notion 本家挙動）。
 *
 * `NotionRenderer` の内側、既に `NotionContext` が確立された状態で使う。
 * トップレベルでは {@link NotionRenderer} を使う。
 *
 * @example
 * ```tsx
 * function Toggle({ children }: { children: NotionBlock[] }) {
 *   return <details><NotionBlocks blocks={children} /></details>;
 * }
 * ```
 *
 * @see {@link NotionRenderer} Context を確立するトップレベルエントリ。
 */
declare function NotionBlocks({
  blocks
}: {
  blocks: NotionBlock[];
}): ReactNode;
//#endregion
//#region src/NotionRenderer.d.ts
/**
 * Notion ブロック木 (`NotionBlockTreeNode[]`) を React で描画するエントリ。
 * `components` / `classNames` を Context に注入して各ブロックコンポーネントへ伝搬する。
 * TOC のために heading_1..4 を抽出して Context へ流す。
 *
 * @example
 * ```tsx
 * import { NotionRenderer } from "@notion-headless-cms/react-renderer";
 *
 * export function Article({ blocks }: { blocks: NotionBlock[] }) {
 *   return (
 *     <NotionRenderer
 *       blocks={blocks}
 *       className="prose dark:prose-invert"
 *       imageSizes={[400, 800, 1200]}
 *     />
 *   );
 * }
 * ```
 *
 * @see {@link NotionThemeProvider} ダークモード切替を組み合わせる場合。
 * @see {@link NotionBlocks} 既に Context が確立されている子ツリー描画用。
 */
declare function NotionRenderer({
  blocks,
  components,
  extensions,
  className,
  classNames,
  resolveImageUrl,
  pageLinks,
  resolvePageUrl,
  resolvePageTitle,
  Image: ImageSlot,
  Link: LinkSlot,
  imageSizes,
  imageSizesAttr,
  ogpEndpoint
}: NotionRendererProps): import("react").JSX.Element;
//#endregion
//#region src/NotionThemeProvider.d.ts
/**
 * テーマ識別子。
 * - `"light"` / `"dark"` は明示モード
 * - `"system"` は `prefers-color-scheme: dark` に追従 (SSR 中は light)
 */
type NotionTheme = "light" | "dark" | "system";
interface NotionThemeProviderProps {
  /** 既定 `"system"`。 */
  theme?: NotionTheme;
  /**
   * `theme === "dark"` または `theme === "system"` でダークが選ばれているとき、
   * ルート div に付与するクラス名。Tailwind v4 のデフォルトは `"dark"`。
   */
  darkClassName?: string;
  /**
   * `light` テーマ時にルート div に付与するクラス名。指定しない場合はクラスを足さない。
   * 例: `"light"` を指定すれば `[data-theme=light]` セレクタを使うサイトとも互換になる。
   */
  lightClassName?: string;
  /** 追加で付けたい className。 */
  className?: string;
  children?: ReactNode;
}
/**
 * Notion ブロックを描画するルート要素に theme クラスを付与する Provider。
 * `<NotionRenderer>` をこの中に置くと、`prose dark:prose-invert` のような
 * Tailwind v4 のダークモードクラスが効くようになる。
 *
 * SSR 中は `system` でも light として描画し、hydration 後に `prefers-color-scheme`
 * を見て切り替える。チラつきを完全に避けたい場合は `next-themes` などのライブラリと
 * 併用して、`theme` props で明示的に渡すこと。
 *
 * @example
 * <NotionThemeProvider theme="system">
 *   <NotionRenderer blocks={blocks} className="prose dark:prose-invert" />
 * </NotionThemeProvider>
 */
declare function NotionThemeProvider({
  theme,
  darkClassName,
  lightClassName,
  className,
  children
}: NotionThemeProviderProps): import("react").JSX.Element;
//#endregion
//#region src/rich-text/Caption.d.ts
/** {@link Caption} の props。`variant` で figure / block 配下のスタイルを切り替える。 */
interface CaptionProps {
  value: ReadonlyArray<RichTextItemResponse>;
  /** figure 配下なら "figure" (中央寄せ figcaption)、card 等の文字下なら "block"。 */
  variant?: "figure" | "block";
}
/**
 * caption 配列を一貫したスタイルで描画する。空配列なら何も出さない。
 * Image / Video / Audio / File / Pdf / Bookmark / Embed の caption が共通で使う。
 *
 * @example
 * ```tsx
 * <figure>
 *   <img src={url} alt="" />
 *   <Caption value={block.image.caption} variant="figure" />
 * </figure>
 * ```
 *
 * @see {@link RichText} caption 内の rich_text 配列を描画する下位コンポーネント。
 */
declare function Caption({
  value,
  variant
}: CaptionProps): import("react").JSX.Element | null;
//#endregion
//#region src/rich-text/RichText.d.ts
/** {@link RichText} の props。Notion `rich_text` 配列 (annotations 含む) を受け取る。 */
interface RichTextProps {
  value: ReadonlyArray<RichTextItemResponse>;
}
/**
 * Notion `rich_text` 配列を React のインライン要素として描画する。
 * bold / italic / strikethrough / underline / color / equation / mention を扱う。
 * カスタムブロックコンポーネント内で段落以外の rich_text を描画する際に利用する。
 *
 * @example
 * ```tsx
 * function CustomCallout({ block }: BlockComponentProps<CalloutBlockObjectResponse>) {
 *   return <aside><RichText value={block.callout.rich_text} /></aside>;
 * }
 * ```
 */
declare function RichText({
  value
}: RichTextProps): import("react").JSX.Element;
//#endregion
export { type BlockClassNames, type BlockComponentProps, BlockSwitch, type BlockSwitchProps, index_d_exports as Blocks, type CacheImageFn, Callout, Caption, CodeCollapsibleWrapper, type ComponentOverrides, CopyButton, index_d_exports$1 as Embeds, type HeadingBlockObjectResponse, type NotionBlock, NotionBlocks, NotionRenderer, type NotionRendererContextValue, type NotionRendererProps, type NotionTheme, NotionThemeProvider, type NotionThemeProviderProps, type PageLinkMap, type ResolvedPageLink, RichText, resolveBlockImageUrls, useNotionContext };
//# sourceMappingURL=index.d.mts.map