@twelvemonday/blog-editor 1.0.3

package/dist/index.d.ts

@@ -0,0 +1,143 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { CSSProperties } from 'react';
+
+interface EditorDocument {
+    id: string;
+    slug: string;
+    title: string;
+    excerpt: string;
+    content: string;
+    featuredImage: string;
+    author: string;
+    publishedAt: string;
+    tags: string[];
+    status: 'draft' | 'published';
+    metaTitle?: string;
+    metaDescription?: string;
+    focusKeyword?: string;
+}
+type OnUploadImage = (file: File) => Promise<string>;
+interface EditorTheme {
+    primary: string;
+    primaryHover: string;
+    primaryMuted: string;
+    primaryBorder: string;
+    background: string;
+    surface: string;
+    successText: string;
+}
+interface BlogEditorProps {
+    initial: EditorDocument;
+    originalSlug?: string;
+    /** Called when user saves or publishes. Return optional slug if it changed. */
+    onSave: (document: EditorDocument, options: {
+        publish?: boolean;
+        contentHtml: string;
+    }) => Promise<{
+        slug?: string;
+    } | void>;
+    /** Fired after a successful save (e.g. for client-side navigation). */
+    onNavigate?: (path: string) => void;
+    backHref?: string;
+    previewUrl?: (slug: string) => string;
+    /**
+     * Handle image uploads (featured image + image blocks).
+     * You receive the `File` — upload anywhere (S3, Cloudinary, your API) and return the public URL string.
+     *
+     * @example
+     * onUploadImage={async (file) => {
+     *   const form = new FormData();
+     *   form.append('file', file);
+     *   const res = await fetch('/api/upload', { method: 'POST', body: form });
+     *   const { url } = await res.json();
+     *   return url;
+     * }}
+     */
+    onUploadImage?: OnUploadImage;
+    /** @deprecated Use `onUploadImage` instead */
+    uploadFile?: OnUploadImage;
+    siteName?: string;
+    baseUrl?: string;
+    theme?: Partial<EditorTheme>;
+    newPostSlug?: string;
+    className?: string;
+}
+type SaveResult = {
+    slug?: string;
+} | void;
+
+declare function BlogEditor({ theme, onUploadImage, uploadFile, siteName, baseUrl, ...props }: BlogEditorProps): react_jsx_runtime.JSX.Element;
+
+interface EditorContextValue {
+    onUploadImage?: OnUploadImage;
+    theme: EditorTheme;
+    siteName: string;
+    baseUrl: string;
+}
+declare function EditorProvider({ children, onUploadImage, theme, siteName, baseUrl, }: {
+    children: React.ReactNode;
+    onUploadImage?: OnUploadImage;
+    theme?: Partial<EditorTheme>;
+    siteName?: string;
+    baseUrl?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function useEditorContext(): EditorContextValue;
+
+declare const defaultTheme: EditorTheme;
+declare function resolveTheme(partial?: Partial<EditorTheme>): EditorTheme;
+declare function themeToCssVars(theme: EditorTheme): CSSProperties;
+
+type BlogBlockType = 'paragraph' | 'heading' | 'list' | 'quote' | 'image' | 'embed' | 'html' | 'code' | 'separator';
+type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+interface BlogBlock {
+    id: string;
+    type: BlogBlockType;
+    html?: string;
+    level?: HeadingLevel;
+    items?: string[];
+    ordered?: boolean;
+    src?: string;
+    alt?: string;
+    caption?: string;
+    imageWidth?: number;
+    imageHeight?: number;
+    imageWidthPercent?: number;
+    embedUrl?: string;
+    embedHeight?: number;
+    rawHtml?: string;
+}
+declare const BLOCK_LABELS: Record<BlogBlockType, string>;
+declare const HEADING_LABELS: Record<HeadingLevel, string>;
+declare function createBlock(type: BlogBlockType): BlogBlock;
+declare function htmlToBlocks(html: string): BlogBlock[];
+declare function blocksToHtml(blocks: BlogBlock[]): string;
+declare function slugifyTitle(title: string): string;
+declare const HEADING_CLASSES: Record<HeadingLevel, string>;
+
+/** Strip Word/Google Docs junk and keep semantic formatting. */
+declare function cleanPastedHtml(raw: string): string;
+declare function insertHtmlAtCursor(html: string): void;
+declare function pastedHtmlToBlocks(raw: string): BlogBlock[];
+declare function isMultiBlockPaste(blocks: BlogBlock[]): boolean;
+declare function inlineHtmlFromBlocks(blocks: BlogBlock[]): string;
+
+interface SeoCheck {
+    id: string;
+    label: string;
+    passed: boolean;
+}
+interface SeoScore {
+    score: number;
+    checks: SeoCheck[];
+}
+declare function getSeoPreview(post: EditorDocument, siteName?: string, baseUrl?: string): {
+    title: string;
+    description: string;
+    url: string;
+    siteName: string;
+};
+declare function computeSeoScore(post: EditorDocument, contentHtml?: string): SeoScore;
+declare function titleLengthColor(len: number): "bg-gray-200" | "bg-amber-400" | "bg-green-500";
+declare function descriptionLengthColor(len: number): "bg-gray-200" | "bg-amber-400" | "bg-green-500";
+
+export { BLOCK_LABELS, type BlogEditorProps as BlockEditorProps, type BlogBlock, type BlogBlockType, BlogEditor, type BlogEditorProps, type EditorDocument, EditorProvider, type EditorTheme, HEADING_CLASSES, HEADING_LABELS, type HeadingLevel, type OnUploadImage, type SaveResult, type SeoCheck, type SeoScore, blocksToHtml, cleanPastedHtml, computeSeoScore, createBlock, defaultTheme, descriptionLengthColor, getSeoPreview, htmlToBlocks, inlineHtmlFromBlocks, insertHtmlAtCursor, isMultiBlockPaste, pastedHtmlToBlocks, resolveTheme, slugifyTitle, themeToCssVars, titleLengthColor, useEditorContext };