oneuxi-editor 1.0.0

package/dist/index.d.ts

@@ -0,0 +1,382 @@
+import React$1, { ComponentType } from 'react';
+import { LexicalEditor } from 'lexical';
+
+type EditorOutput = "html" | "json" | "text";
+interface EditorJSON {
+    root: Record<string, unknown>;
+}
+interface EditorUpdate {
+    html: string;
+    text: string;
+    json: EditorJSON;
+    isEmpty: boolean;
+}
+type ThemeMode = "light" | "dark" | "system";
+interface EditorThemeObject {
+    mode?: ThemeMode;
+    primary?: string;
+    primaryForeground?: string;
+    background?: string;
+    surface?: string;
+    text?: string;
+    textMuted?: string;
+    border?: string;
+    hover?: string;
+    active?: string;
+    selection?: string;
+    codeBg?: string;
+    toolbarBg?: string;
+    toolbarBorder?: string;
+    popupBg?: string;
+    radius?: string;
+    shadow?: string;
+    fontFamily?: string;
+    fontSize?: string;
+}
+type EditorTheme = ThemeMode | EditorThemeObject;
+interface EditorRef {
+    focus(): void;
+    blur(): void;
+    clear(): void;
+    getHTML(): string;
+    setHTML(html: string): void;
+    getText(): string;
+    getJSON(): EditorJSON;
+    setJSON(json: EditorJSON): void;
+    isEmpty(): boolean;
+    isDirty(): boolean;
+    markClean(): void;
+    undo(): void;
+    redo(): void;
+}
+type BuiltInToolbarItem = "undo" | "redo" | "|" | "heading" | "bold" | "italic" | "underline" | "strike" | "code" | "subscript" | "superscript" | "clearFormatting" | "align" | "bulletList" | "orderedList" | "checkList" | "indent" | "outdent" | "link" | "image" | "table" | "media" | "file" | "codeBlock" | "blockquote" | "hr" | "sourceMode" | "findReplace" | "fullscreen";
+type ToolbarItem = BuiltInToolbarItem | ComponentType;
+type ToolbarConfig = ToolbarItem[] | false;
+interface CustomIconMap {
+    bold?: ComponentType;
+    italic?: ComponentType;
+    underline?: ComponentType;
+    strike?: ComponentType;
+    code?: ComponentType;
+    subscript?: ComponentType;
+    superscript?: ComponentType;
+    clearFormatting?: ComponentType;
+    heading?: ComponentType;
+    paragraph?: ComponentType;
+    bulletList?: ComponentType;
+    orderedList?: ComponentType;
+    checkList?: ComponentType;
+    indent?: ComponentType;
+    outdent?: ComponentType;
+    alignLeft?: ComponentType;
+    alignCenter?: ComponentType;
+    alignRight?: ComponentType;
+    alignJustify?: ComponentType;
+    link?: ComponentType;
+    image?: ComponentType;
+    table?: ComponentType;
+    media?: ComponentType;
+    file?: ComponentType;
+    codeBlock?: ComponentType;
+    blockquote?: ComponentType;
+    hr?: ComponentType;
+    undo?: ComponentType;
+    redo?: ComponentType;
+    sourceMode?: ComponentType;
+    findReplace?: ComponentType;
+    fullscreen?: ComponentType;
+}
+interface HTMLPolicy {
+    allowedTags?: string[];
+    allowedAttributes?: Record<string, string[]>;
+}
+interface AutosaveConfig {
+    delay?: number;
+    onSave: (data: {
+        html: string;
+        json: EditorJSON;
+        text: string;
+    }) => Promise<void> | void;
+}
+interface ImageUploadResult {
+    src: string;
+    alt?: string;
+    width?: number;
+    height?: number;
+}
+type ImageUploadHandler = (file: File) => Promise<ImageUploadResult>;
+interface FileUploadResult {
+    url: string;
+    name: string;
+    size?: number;
+}
+type FileUploadHandler = (file: File) => Promise<FileUploadResult>;
+interface EditorExtension {
+    name: string;
+    nodes?: Array<unknown>;
+    plugins?: Array<ComponentType>;
+    commands?: Array<{
+        name: string;
+        action: (editor: unknown) => void;
+    }>;
+    toolbarItems?: ToolbarItem[];
+    options?: Record<string, any>;
+}
+interface EditorProps {
+    id?: string;
+    className?: string;
+    style?: React.CSSProperties;
+    "data-testid"?: string;
+    value?: string;
+    defaultValue?: string;
+    output?: EditorOutput;
+    placeholder?: string;
+    readOnly?: boolean;
+    disabled?: boolean;
+    theme?: EditorTheme;
+    toolbar?: ToolbarConfig;
+    bubbleToolbar?: ToolbarConfig;
+    icons?: CustomIconMap;
+    extensions?: EditorExtension[];
+    preset?: "basic" | "full";
+    sourceMode?: boolean;
+    fullscreen?: boolean;
+    characterCount?: boolean;
+    wordCount?: boolean;
+    maxLength?: number;
+    html?: HTMLPolicy;
+    autosave?: AutosaveConfig;
+    onChange?: (output: string) => void;
+    onUpdate?: (update: EditorUpdate) => void;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    onReady?: () => void;
+    onError?: (error: Error) => void;
+    onDirtyChange?: (isDirty: boolean) => void;
+    onCharacterCountChange?: (count: number) => void;
+    onUploadStart?: () => void;
+    onUploadSuccess?: (result: ImageUploadResult | FileUploadResult) => void;
+    onUploadError?: (error: Error) => void;
+}
+interface SlashCommandItem {
+    id: string;
+    title: string;
+    description?: string;
+    icon?: ComponentType;
+    action: (editor: any) => void;
+}
+interface MentionUser {
+    id: string;
+    name: string;
+    username?: string;
+    avatar?: string;
+}
+
+declare const Editor: React$1.ForwardRefExoticComponent<EditorProps & React$1.RefAttributes<EditorRef>>;
+
+interface EditorActiveStates {
+    isBold: boolean;
+    isItalic: boolean;
+    isUnderline: boolean;
+    isStrikethrough: boolean;
+    isCode: boolean;
+    isSubscript: boolean;
+    isSuperscript: boolean;
+    isLink: boolean;
+    isH1: boolean;
+    isH2: boolean;
+    isH3: boolean;
+    isH4: boolean;
+    isH5: boolean;
+    isH6: boolean;
+    isParagraph: boolean;
+    isBulletList: boolean;
+    isOrderedList: boolean;
+    isCheckList: boolean;
+    isBlockquote: boolean;
+    isCodeBlock: boolean;
+    isAlignLeft: boolean;
+    isAlignCenter: boolean;
+    isAlignRight: boolean;
+    isAlignJustify: boolean;
+    canUndo: boolean;
+    canRedo: boolean;
+}
+interface EditorContextValue {
+    editor: LexicalEditor | null;
+    activeStates: EditorActiveStates;
+    icons?: CustomIconMap;
+    toggleBold: () => void;
+    toggleItalic: () => void;
+    toggleUnderline: () => void;
+    toggleStrikethrough: () => void;
+    toggleCode: () => void;
+    toggleSubscript: () => void;
+    toggleSuperscript: () => void;
+    clearFormatting: () => void;
+    setHeading: (heading: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p") => void;
+    toggleBlockquote: () => void;
+    insertHR: () => void;
+    toggleBulletList: () => void;
+    toggleOrderedList: () => void;
+    toggleCheckList: () => void;
+    indent: () => void;
+    outdent: () => void;
+    setAlignment: (align: "left" | "center" | "right" | "justify") => void;
+    insertLink: (url: string, target?: string, title?: string) => void;
+    removeLink: () => void;
+    insertTable: (rows?: number, cols?: number) => void;
+    insertImage: (src: string, alt?: string, width?: number, height?: number) => void;
+    insertCodeBlock: (language?: string) => void;
+    undo: () => void;
+    redo: () => void;
+    focus: () => void;
+    blur: () => void;
+    clear: () => void;
+    getHTML: () => string;
+    setHTML: (html: string) => void;
+    getText: () => string;
+    getJSON: () => EditorJSON;
+    setJSON: (json: EditorJSON) => void;
+    isEmpty: () => boolean;
+    isDirty: () => boolean;
+    markClean: () => void;
+    isFullscreen: boolean;
+    toggleFullscreen: () => void;
+    isSourceMode: boolean;
+    toggleSourceMode: () => void;
+}
+declare function useEditor(): EditorContextValue;
+
+interface ExtensionConfig<Options = Record<string, unknown>> {
+    name: string;
+    nodes?: Array<unknown>;
+    plugins?: Array<ComponentType>;
+    commands?: Array<{
+        name: string;
+        action: (editor: unknown) => void;
+    }>;
+    toolbarItems?: ToolbarItem[];
+    configure?: (options?: Options) => EditorExtension;
+}
+declare function createExtension<Options = Record<string, unknown>>(config: ExtensionConfig<Options>): EditorExtension & {
+    configure: (options?: Options) => EditorExtension;
+};
+
+interface ToolbarProps {
+    config?: ToolbarConfig;
+    imageUploader?: ImageUploadHandler;
+}
+declare function Toolbar({ config, imageUploader }: ToolbarProps): React$1.JSX.Element | null;
+
+interface BubbleToolbarProps {
+    config?: ToolbarConfig;
+}
+declare function BubbleToolbar({ config }: BubbleToolbarProps): React$1.JSX.Element | null;
+
+declare const DefaultIcons: {
+    bold: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    italic: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    underline: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    strike: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    code: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    subscript: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    superscript: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    clearFormatting: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    heading: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    paragraph: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    bulletList: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    orderedList: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    checkList: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    indent: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    outdent: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    alignLeft: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    alignCenter: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    alignRight: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    alignJustify: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    link: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    image: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    table: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    media: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    file: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    codeBlock: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    blockquote: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    hr: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    undo: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    redo: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    sourceMode: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    findReplace: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+    fullscreen: (props: React$1.SVGProps<SVGSVGElement>) => React$1.JSX.Element;
+};
+
+interface ImageExtensionOptions {
+    upload?: ImageUploadHandler;
+    maxSize?: number;
+    allowedTypes?: string[];
+}
+declare const ImageExtension: EditorExtension & {
+    configure: (options?: ImageExtensionOptions | undefined) => EditorExtension;
+};
+
+declare const TableExtension: EditorExtension & {
+    configure: (options?: Record<string, unknown> | undefined) => EditorExtension;
+};
+
+declare const CodeExtension: EditorExtension & {
+    configure: (options?: Record<string, unknown> | undefined) => EditorExtension;
+};
+
+interface MediaExtensionOptions {
+    youtube?: boolean;
+    allowedDomains?: string[];
+}
+declare const MediaExtension: EditorExtension & {
+    configure: (options?: MediaExtensionOptions | undefined) => EditorExtension;
+};
+
+interface FileExtensionOptions {
+    upload?: FileUploadHandler;
+}
+declare const FileExtension: EditorExtension & {
+    configure: (options?: FileExtensionOptions | undefined) => EditorExtension;
+};
+
+interface MentionExtensionOptions {
+    trigger?: string;
+    search?: (query: string) => Promise<MentionUser[]> | MentionUser[];
+}
+declare const MentionExtension: EditorExtension & {
+    configure: (options?: MentionExtensionOptions | undefined) => EditorExtension;
+};
+
+declare const EmojiExtension: EditorExtension & {
+    configure: (options?: Record<string, unknown> | undefined) => EditorExtension;
+};
+
+interface SlashCommandExtensionOptions {
+    commands?: SlashCommandItem[];
+}
+declare const SlashCommandExtension: EditorExtension & {
+    configure: (options?: SlashCommandExtensionOptions | undefined) => EditorExtension;
+};
+
+declare const basicPreset: never[];
+declare const fullPreset: ((EditorExtension & {
+    configure: (options?: ImageExtensionOptions | undefined) => EditorExtension;
+}) | (EditorExtension & {
+    configure: (options?: Record<string, unknown> | undefined) => EditorExtension;
+}) | (EditorExtension & {
+    configure: (options?: MediaExtensionOptions | undefined) => EditorExtension;
+}) | (EditorExtension & {
+    configure: (options?: FileExtensionOptions | undefined) => EditorExtension;
+}) | (EditorExtension & {
+    configure: (options?: MentionExtensionOptions | undefined) => EditorExtension;
+}) | (EditorExtension & {
+    configure: (options?: SlashCommandExtensionOptions | undefined) => EditorExtension;
+}))[];
+
+declare function sanitizeHTML(html: string, policy?: HTMLPolicy): string;
+
+declare function cleanPastedHTML(rawHtml: string): string;
+
+export { type AutosaveConfig, BubbleToolbar, CodeExtension, type CustomIconMap, DefaultIcons, Editor, type EditorExtension, type EditorJSON, type EditorOutput, type EditorProps, type EditorRef, type EditorTheme, type EditorThemeObject, type EditorUpdate, EmojiExtension, FileExtension, type FileUploadHandler, type FileUploadResult, type HTMLPolicy, ImageExtension, type ImageUploadHandler, type ImageUploadResult, MediaExtension, MentionExtension, type MentionUser, SlashCommandExtension, type SlashCommandItem, TableExtension, type ThemeMode, Toolbar, type ToolbarConfig, type ToolbarItem, basicPreset, cleanPastedHTML, createExtension, fullPreset, sanitizeHTML, useEditor };