flowtext-editor 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,87 @@
+import { JSX } from 'react';
+import { useEffect } from 'react';
+
+/** AI text operations the editor's toolbar can request. */
+export declare type AiTextAction = 'enhance' | 'proofread' | 'expand' | 'shorten' | 'changeTone';
+
+/**
+ * Host-supplied handler that performs the AI transformation and resolves with
+ * the replacement text (or `null` to leave the selection unchanged).
+ *
+ * This is how the library stays backend-agnostic: the consumer wires their own
+ * API/transport here instead of the component hard-coding a request.
+ */
+export declare type AiTextActionHandler = (payload: AiTextActionPayload) => Promise<string | null>;
+
+/** Payload passed to the host-provided AI handler. */
+export declare interface AiTextActionPayload {
+    /** Which operation to run. */
+    action: AiTextAction;
+    /** The currently selected text to transform. */
+    text: string;
+    /** Suggested target word count (used by `expand` / `shorten`), else `null`. */
+    wordCount: number | null;
+    /** Target tone (used by `changeTone`), else `null`. */
+    toneType: AiToneType | null;
+}
+
+/** Tone presets used by the `changeTone` action. */
+export declare type AiToneType = 'friendly' | 'formal';
+
+export declare type ClassValue = string | false | null | undefined;
+
+/**
+ * Tiny, dependency-free className combiner. Filters out falsy values and
+ * joins the rest with a single space.
+ *
+ * @example
+ * cx('toolbar', isActive && 'toolbar--active', undefined); // 'toolbar toolbar--active'
+ */
+export declare const cx: (...values: ClassValue[]) => string;
+
+/**
+ * Escape a string so it can be embedded literally inside a `RegExp`.
+ *
+ * @example
+ * new RegExp(escapeRegExp('a.b')); // matches the literal "a.b", not "aXb"
+ */
+export declare const escapeRegExp: (value: string) => string;
+
+/**
+ * A self-contained rich-text editor rendered inside an isolated iframe, with a
+ * formatting toolbar and optional AI text tools. Content is controlled via
+ * `mailContent` / `setMailContent`.
+ */
+export declare function FlowTextEditor({ mailContent, setMailContent, resetMailContent, showAiTools, modalHeight, spellcheckIgnoreWords, onAiTextAction, }: FlowTextEditorProps): JSX.Element;
+
+export declare interface FlowTextEditorProps {
+    /** Current HTML content of the editor (controlled). */
+    mailContent: RichTextValue;
+    /** Called with the editor's HTML whenever the user edits it. */
+    setMailContent: (content: RichTextValue) => void;
+    /** Toggle to force the editor to re-sync `mailContent` (e.g. on reset). */
+    resetMailContent?: boolean;
+    /** Show the AI toolbar (Enhance, Proofread, …). Requires `onAiTextAction`. */
+    showAiTools?: boolean;
+    /** Height of the editor iframe (any CSS length). Defaults to `650px`. */
+    modalHeight?: string;
+    /** Words wrapped in `spellcheck="false"` spans (e.g. product/brand names). */
+    spellcheckIgnoreWords?: string[];
+    /** Handler invoked by the AI toolbar buttons. Omit to disable AI features. */
+    onAiTextAction?: AiTextActionHandler;
+}
+
+/**
+ * Serialized rich-text content, represented as an HTML string.
+ * This is the value the editor reads on input and emits on change.
+ */
+export declare type RichTextValue = string;
+
+/**
+ * `useLayoutEffect` that gracefully falls back to `useEffect` during
+ * server-side rendering, avoiding React's "useLayoutEffect does nothing on
+ * the server" warning. Behaves exactly like `useLayoutEffect` in the browser.
+ */
+export declare const useIsomorphicLayoutEffect: typeof useEffect;
+
+export { }