@opentiny/fluent-editor 4.0.0-alpha.0 → 4.0.0-alpha.2

package/types/modules/custom-image/Options.d.ts

@@ -1,3 +1,6 @@
+import { ImageToolbar, ImageToolbarButtons } from './actions';
+import { BlotSpec } from './specs';
+
 export interface OverlayOptions {
     className: string;
     style: Record<string, string>;
@@ -6,31 +9,39 @@ export interface ResizeOptions {
     handleClassName: string;
     handleStyle: Record<string, string>;
 }
-export interface AlignOptions {
-    attribute: string;
-    aligner: {
-        applyStyle: boolean;
-    };
-    icons: {
-        left: string;
-        center: string;
-        right: string;
-    };
-    toolbar: {
-        allowDeselect: boolean;
-        mainClassName: string;
-        mainStyle: any;
-        buttonClassName: string;
-        addButtonSelectStyle: boolean;
-        buttonStyle: any;
-        svgStyle: any;
-    };
+export interface ToolButtonOption {
+    name: string;
+    icon: string;
+    isActive?: (el: HTMLElement) => boolean;
+    apply: (this: ImageToolbar, el: HTMLImageElement, toolbarButtons: ImageToolbarButtons) => void;
 }
-export interface Options {
-    specs: any;
+export interface ToolbarButtonOptions {
+    buttons: Record<string, ToolButtonOption | boolean>;
+}
+export interface ToolbarOptions extends ToolbarButtonOptions {
+    mainClassName: string;
+    mainStyle: Record<string, unknown>;
+    buttonClassName: string;
+    addButtonSelectStyle: boolean;
+    buttonStyle: Record<string, unknown>;
+    svgStyle: Record<string, unknown>;
+}
+export interface BlotFormatterOptionsInput {
+    specs: typeof BlotSpec[];
+    overlay: Partial<OverlayOptions>;
+    resize: Partial<ResizeOptions>;
+    toolbar: Partial<ToolbarOptions>;
+}
+export interface BlotFormatterOptions {
+    specs: typeof BlotSpec[];
     overlay: OverlayOptions;
-    align: AlignOptions;
     resize: ResizeOptions;
+    toolbar: ToolbarOptions;
 }
-declare const DefaultOptions: Options;
+export declare const LEFT_ALIGN = "align-left";
+export declare const CENTER_ALIGN = "align-center";
+export declare const RIGHT_ALIGN = "align-right";
+export declare const COPY = "copy";
+export declare const DOWNLOAD = "download";
+declare const DefaultOptions: BlotFormatterOptions;
 export default DefaultOptions;

package/types/modules/custom-image/actions/Action.d.ts

@@ -1,6 +1,8 @@
-export default class Action {
-    formatter: any;
-    constructor(formatter: any);
+import { BlotFormatter } from '../blot-formatter';
+
+export declare class Action {
+    formatter: BlotFormatter;
+    constructor(formatter: BlotFormatter);
     onCreate(): void;
     onDestroy(): void;
     onUpdate(): void;

package/types/modules/custom-image/actions/custom-resize-action.d.ts

@@ -0,0 +1,24 @@
+import { Action } from './action';
+
+export declare class CustomResizeAction extends Action {
+    topLeftHandle: HTMLElement;
+    topRightHandle: HTMLElement;
+    bottomRightHandle: HTMLElement;
+    bottomLeftHandle: HTMLElement;
+    dragHandle: HTMLElement;
+    dragStartX: number;
+    preDragWidth: number;
+    targetRatio: number;
+    maxWidth: number;
+    minWidth: number;
+    constructor(formatter: any);
+    onCreate(): void;
+    onDestroy(): void;
+    createHandle(position: string, cursor: string): HTMLElement;
+    repositionHandles(handleStyle: any): void;
+    setCursor(value: string): void;
+    onMouseDown: (event: MouseEvent) => void;
+    findTd: (node: HTMLElement, level: number) => any;
+    onDrag: (event: MouseEvent) => void;
+    onMouseUp: () => void;
+}

package/types/modules/custom-image/actions/delete-action.d.ts

@@ -0,0 +1,7 @@
+import { Action } from './action';
+
+export declare class DeleteAction extends Action {
+    onCreate(): void;
+    onDestroy(): void;
+    onKeyUp: (event: any) => void;
+}

package/types/modules/custom-image/actions/image-toolbar-buttons.d.ts

@@ -0,0 +1,17 @@
+import { ToolbarButtonOptions, ToolButtonOption } from '../options';
+
+export declare const ALIGN_ATTR = "data-align";
+export declare function setAlignStyle(el: HTMLElement, display: string | null, float: string | null, margin: string | null): void;
+export declare const alignmentHandler: {
+    left: (el: HTMLElement, toolbarButtons: ImageToolbarButtons) => void;
+    center: (el: HTMLElement, toolbarButtons: ImageToolbarButtons) => void;
+    right: (el: HTMLElement, toolbarButtons: ImageToolbarButtons) => void;
+    download: (el: HTMLImageElement, toolbarButtons: ImageToolbarButtons) => void;
+    copy: (el: HTMLImageElement, toolbarButtons: ImageToolbarButtons) => Promise<void>;
+};
+export declare class ImageToolbarButtons {
+    buttons: Record<string, ToolButtonOption>;
+    constructor(options: ToolbarButtonOptions);
+    getItems(): ToolButtonOption[];
+    clear(el: HTMLElement): void;
+}

package/types/modules/custom-image/actions/index.d.ts

@@ -0,0 +1,6 @@
+export * from './action';
+export * from './custom-resize-action';
+export * from './delete-action';
+export * from './image-toolbar-buttons';
+export * from './toolbar';
+export * from './toolbar-action';

package/types/modules/custom-image/actions/toolbar-action.d.ts

@@ -0,0 +1,12 @@
+import { BlotFormatter } from '../blot-formatter';
+import { Action } from './action';
+import { ImageToolbarButtons } from './image-toolbar-buttons';
+import { ImageToolbar } from './toolbar';
+
+export declare class ImageToolbarAction extends Action {
+    toolbar: ImageToolbar;
+    buttons: ImageToolbarButtons;
+    constructor(formatter: BlotFormatter);
+    onCreate(): void;
+    onDestroy(): void;
+}

package/types/modules/custom-image/actions/toolbar.d.ts

@@ -0,0 +1,20 @@
+import { BlotFormatter } from '../blot-formatter';
+import { ToolButtonOption } from '../options';
+import { ImageToolbarButtons } from './image-toolbar-buttons';
+
+export declare class ImageToolbar {
+    toolbar?: HTMLElement;
+    buttons: HTMLElement[];
+    constructor();
+    create(formatter: BlotFormatter, toolButton: ImageToolbarButtons): HTMLElement;
+    destroy(): void;
+    getElement(): HTMLElement;
+    addToolbarStyle(formatter: BlotFormatter, toolbar: HTMLElement): void;
+    addButtonStyle(button: HTMLElement, index: number, formatter: BlotFormatter): void;
+    addButtons(formatter: BlotFormatter, toolbar: HTMLElement, toolButton: ImageToolbarButtons): void;
+    preselectButton(button: HTMLElement, toolButtonOption: ToolButtonOption, formatter: BlotFormatter, toolButton: ImageToolbarButtons): void;
+    onButtonClick(button: HTMLElement, formatter: BlotFormatter, toolButtonOption: ToolButtonOption, toolButton: ImageToolbarButtons): void;
+    clickButton(button: HTMLElement, target: HTMLImageElement, formatter: BlotFormatter, toolButtonOption: ToolButtonOption, toolButton: ImageToolbarButtons): void;
+    selectButton(formatter: BlotFormatter, button: HTMLElement): void;
+    deselectButton(formatter: BlotFormatter, button: HTMLElement): void;
+}

package/types/modules/custom-image/blot-formatter.d.ts

@@ -0,0 +1,24 @@
+import { default as FluentEditor } from '../../core/fluent-editor';
+import { Action } from './actions';
+import { BlotFormatterOptions } from './options';
+import { BlotSpec } from './specs';
+
+export declare class BlotFormatter {
+    quill: FluentEditor;
+    options: BlotFormatterOptions;
+    currentSpec: BlotSpec;
+    specs: BlotSpec[];
+    overlay: HTMLElement;
+    actions: Action[];
+    observer: MutationObserver;
+    static register(): void;
+    constructor(quill: FluentEditor, options?: Partial<BlotFormatterOptions>);
+    show(spec: BlotSpec): void;
+    hide(): void;
+    update(): void;
+    createActions(spec: BlotSpec): void;
+    destroyActions(): void;
+    repositionOverlay(): void;
+    setUserSelect(value: string): void;
+    onClick: () => void;
+}

package/types/modules/custom-image/image-bar.d.ts

@@ -1,15 +1,17 @@
-import { default as Quill } from 'quill';
+import { default as FluentEditor } from '../../core/fluent-editor';
+import { Range } from 'quill';
 
-export default class ImageBar {
-    quill: Quill;
+export type ImageOperateType = 'download' | 'copy' | 'delete';
+export declare class ImageBar {
+    quill: FluentEditor;
     image: HTMLImageElement;
     domNode: HTMLElement;
-    imageRange: any;
+    imageRange: Range;
     template: string;
-    constructor(quill: any, target: any);
+    constructor(quill: FluentEditor, target: HTMLImageElement);
     createImageBar(): void;
     destroy(): void;
-    operateImage(event: any, operate: any): Promise<void>;
+    operateImage(event: Event, operate: ImageOperateType): Promise<void>;
     setPosition(): void;
-    css(domNode: any, rules: any): void;
+    css(domNode: HTMLElement, rules: Record<string, string | string[]>): void;
 }

package/types/modules/custom-image/image.d.ts

@@ -1,28 +1,27 @@
-declare const Embed: unknown;
-declare const Inline: unknown;
-declare class CustomImage extends Embed {
-    static ID_SEED: number;
+import { Parchment as TypeParchment } from 'quill';
+import { default as TypeEmbed } from 'quill/blots/embed';
+
+declare const Embed: typeof TypeEmbed;
+export type ImageValue = string | {
+    src: string;
+    align?: string;
+    height?: number;
+    width?: number;
+};
+export declare class CustomImage extends Embed {
     static blotName: string;
     static tagName: string;
-    domNode: any;
-    parent: any;
-    scroll: any;
-    next: any;
-    static create(value: any): any;
-    static formats(domNode: any): {};
-    static match(url: any): boolean;
+    static ID_SEED: number;
+    domNode: HTMLElement;
+    static create(value: ImageValue): HTMLElement;
+    static formats(domNode: HTMLElement): {};
+    static match(url: string): boolean;
     static register(): void;
-    static sanitize(url: any): any;
-    static value(domNode: any): any;
-    format(name: any, value: any): void;
+    static sanitize(url: string): string;
+    static value(domNode: HTMLElement): any;
+    format(name: string, value: any): void;
     unWrap(): void;
-    wrap(name: any, value: any): any;
-}
-declare class CustomImageContainer extends Inline {
-    static tagName: string;
-    static className: string;
-    static blotName: string;
-    static allowedChildren: typeof CustomImage[];
-    constructor(scroll: any, domNode: any);
+    wrap(name: string, value?: any): TypeParchment.Parent;
+    wrap(wrapper: TypeParchment.Parent): TypeParchment.Parent;
 }
-export { CustomImage as default, CustomImageContainer as ImageContainerBlot };
+export {};

package/types/modules/custom-image/index.d.ts

@@ -0,0 +1,4 @@
+export * from './actions';
+export * from './blot-formatter';
+export * from './image';
+export * from './specs';

package/types/modules/custom-image/specs/blot-spec.d.ts

@@ -0,0 +1,13 @@
+import { BlotFormatter } from '../blot-formatter';
+import { CustomResizeAction, DeleteAction, ImageToolbarAction } from '../actions';
+
+export declare class BlotSpec {
+    formatter: BlotFormatter;
+    constructor(formatter: BlotFormatter);
+    init(): void;
+    getActions(): (typeof ImageToolbarAction | typeof CustomResizeAction | typeof DeleteAction)[];
+    getTargetElement(): HTMLElement | null;
+    getOverlayElement(): HTMLElement;
+    setSelection(): void;
+    onHide(): void;
+}

package/types/modules/custom-image/specs/custom-image-spec.d.ts

@@ -0,0 +1,18 @@
+import { BlotFormatter } from '../blot-formatter';
+import { ImageSpec } from './image-spec';
+
+export declare class CustomImageSpec extends ImageSpec {
+    editorElem: HTMLElement | undefined;
+    observer: any;
+    oldRootScrollTop: number;
+    constructor(formatter: BlotFormatter);
+    handleQuillRootScroll(): void;
+    init(): void;
+    imageMouseOver(event: any): void;
+    imageMouseout: (event: any) => void;
+    addImagePreviewOverlay(event: any): void;
+    removeImagePreviewOverlay(): void;
+    onHide(): void;
+    resetOverlayMarginTop(): void;
+    onClick: (event: MouseEvent) => void;
+}

package/types/modules/custom-image/specs/image-spec.d.ts

@@ -0,0 +1,9 @@
+import { BlotSpec } from './blot-spec';
+
+export declare class ImageSpec extends BlotSpec {
+    img: HTMLImageElement | null;
+    init(): void;
+    getTargetElement(): HTMLImageElement;
+    onHide(): void;
+    onClick: (event: MouseEvent) => void;
+}

package/types/modules/custom-image/specs/index.d.ts

@@ -0,0 +1,3 @@
+export * from './blot-spec';
+export * from './custom-image-spec';
+export * from './image-spec';

package/types/modules/custom-uploader.d.ts

@@ -1,31 +1,41 @@
-import { Range } from 'quill/core/quill';
+import { Range, default as Quill } from 'quill';
+import { default as TypeUploader } from 'quill/modules/uploader';
+import { default as FluentEditor } from '../core/fluent-editor';
 
-interface InsertFileData {
-    code: number;
-    message?: string;
-    data: {
-        title: string;
-        size: number;
-        src: string;
-    };
+declare const Uploader: typeof TypeUploader;
+interface UploaderOptions {
+    mimetypes: string[];
+    handler: (this: {
+        quill: Quill;
+    }, range: Range, files: File[]) => void;
 }
-declare const Uploader: unknown;
-declare class CustomUploader extends Uploader {
-    quill: any;
-    options: any;
-    upload(range: any, files: any, isFile?: any): void;
-    isAllowedFileSize: (maxSize: number, file: File) => boolean;
-    isAllowedFileType: (accept: Array<string> | string, file: File) => boolean;
-    handleUploadFile(range: any, files: any, _hasRejectedFile: any): void;
-    insertFileToEditor(range: Range, file: File, { code, message, data }: InsertFileData): void;
-    insertImageToEditor(range: any, { code, message, data }: {
-        code: any;
-        message: any;
-        data: any;
-    }): void;
-    handleUploadImage(range: any, { file, files }: {
-        file: any;
-        files: any;
-    }, hasRejectedImage: any): void;
+export interface FileUploaderOptions {
+    mimetypes: string[];
+    maxSize: number;
+    handler: (this: {
+        quill: FluentEditor;
+    }, range: Range, files: File[]) => Promise<(string | false)[]> | (string | false)[];
+    success: (this: {
+        quill: FluentEditor;
+    }, file: File, range: Range) => void;
+    fail: (this: {
+        quill: FluentEditor;
+    }, file: File, range: Range) => void;
 }
-export default CustomUploader;
+export declare class FileUploader extends Uploader {
+    quill: FluentEditor;
+    static DEFAULTS: any;
+    options: Partial<UploaderOptions> & FileUploaderOptions;
+    constructor(quill: FluentEditor, options: Partial<FileUploaderOptions>);
+    resolveOptions(options?: Partial<FileUploaderOptions>): {
+        mimetypes: string[];
+        maxSize: number;
+        handler(range: Range, files: File[]): string[];
+        success(): void;
+        fail(): void;
+    } & Partial<FileUploaderOptions>;
+    validateFile(file: File): boolean;
+    getFileUrls(files: File[], range: Range): Promise<(string | false)[]>;
+    upload(range: Range, files: FileList | File[]): Promise<void>;
+}
+export {};

package/types/modules/divider.d.ts

@@ -1,7 +1,9 @@
-declare const BlockEmbed: unknown;
-declare class DividerBlot extends BlockEmbed {
+import { BlockEmbed as TypeBlockEmbed } from 'quill/blots/block';
+
+declare const BlockEmbed: typeof TypeBlockEmbed;
+export declare class DividerBlot extends BlockEmbed {
     static blotName: string;
     static tagName: string;
-    static create(): any;
+    static create(): HTMLElement;
 }
-export default DividerBlot;
+export {};

package/types/modules/emoji/formats/emoji-blot.d.ts

@@ -1,13 +1,15 @@
-declare const Embed: unknown;
-declare class EmojiBlot extends Embed {
-    static emojiClass: string;
-    static emojiPrefix: any;
-    static tagName: string;
+import { default as TypeEmbed } from 'quill/blots/embed';
+
+declare const Embed: typeof TypeEmbed;
+export declare class EmojiBlot extends Embed {
     static blotName: string;
     static className: string;
-    static create(value: any): any;
+    static tagName: string;
+    static emojiClass: string;
+    static emojiPrefix: string;
+    static create(value: any): HTMLElement;
     static value(node: any): any;
     static buildSpan(value: any, node: any): void;
     static parseUnicode(string: any): any;
 }
-export default EmojiBlot;
+export {};

package/types/modules/emoji/index.d.ts

@@ -1,10 +1,3 @@
-import { default as EmojiBlot } from './formats/emoji-blot';
-import { default as ShortNameEmoji } from './modules/emoji';
-import { default as ToolbarEmoji } from './modules/toolbar-emoji';
-
-declare const _default: {
-    EmojiBlot: typeof EmojiBlot;
-    ShortNameEmoji: typeof ShortNameEmoji;
-    ToolbarEmoji: typeof ToolbarEmoji;
-};
-export default _default;
+export * from './formats/emoji-blot';
+export * from './modules/emoji';
+export * from './modules/toolbar-emoji';

package/types/modules/emoji/modules/emoji.d.ts

@@ -1,5 +1,8 @@
-declare const Module: unknown;
-declare class ShortNameEmoji extends Module {
+import { default as FluentEditor } from '../../../core/fluent-editor';
+
+export declare class ShortNameEmoji {
+    quill: FluentEditor;
+    options: any;
     static DEFAULTS: {
         emojiList: any[];
         fuse: {
@@ -13,7 +16,6 @@ declare class ShortNameEmoji extends Module {
         };
     };
     emojiList: any;
-    quill: any;
     fuse: any;
     onOpen: any;
     onClose: any;
@@ -26,8 +28,7 @@ declare class ShortNameEmoji extends Module {
     isWhiteSpace: (ch: any) => boolean;
     query: any;
     buttons: any;
-    options: any;
-    constructor(quill: any, options: any);
+    constructor(quill: FluentEditor, options: any);
     triggerPicker(range: any, _context: any): boolean;
     handleArrow(): boolean;
     update(event: any): void;
@@ -35,4 +36,3 @@ declare class ShortNameEmoji extends Module {
     renderCompletions(emojis: any, evt: any): void;
     close(value: any, trailingDelete?: number): void;
 }
-export default ShortNameEmoji;

package/types/modules/emoji/modules/toolbar-emoji.d.ts

@@ -1,8 +1,9 @@
-declare const Module: unknown;
-declare class ToolbarEmoji extends Module {
-    quill: any;
-    toolbar: any;
-    constructor(quill: any, options: any);
+import { default as TypeToolbar } from 'quill/modules/toolbar';
+import { default as FluentEditor } from '../../../core/fluent-editor';
+
+export declare class ToolbarEmoji {
+    quill: FluentEditor;
+    toolbar: TypeToolbar;
+    constructor(quill: FluentEditor);
     checkPalatteExist(): void;
 }
-export default ToolbarEmoji;

package/types/modules/emoji.d.ts

@@ -0,0 +1,35 @@
+import { default as FluentEditor } from '../fluent-editor';
+
+export interface EmojiModuleOptions {
+    theme?: string;
+    locale?: string;
+    set?: string;
+    skinTonePosition?: string;
+    previewPosition?: string;
+    searchPosition?: string;
+    categories?: string[];
+    maxFrequentRows?: number;
+    perLine?: number;
+    navPosition?: string;
+    noCountryFlags?: boolean;
+    dynamicWidth?: boolean;
+}
+declare class EmojiModule {
+    private readonly quill;
+    private readonly options;
+    private picker;
+    private isPickerVisible;
+    private cleanupResizeObserver;
+    constructor(quill: FluentEditor, options?: EmojiModuleOptions);
+    private getEmojiButton;
+    private updatePickerPosition;
+    private setupContainerResizeObserver;
+    private createPicker;
+    openDialog(): void;
+    closeDialog(): void;
+    private handleEmojiSelect;
+    private setSelectionAfterEmoji;
+    private handleClickOutside;
+    destroy(): void;
+}
+export { EmojiModule };

package/types/modules/file/formats/file.d.ts

@@ -1,15 +1,19 @@
-declare const Embed: unknown;
-declare class File extends Embed {
+import { default as TypeEmbed } from 'quill/blots/embed';
+
+declare const Embed: typeof TypeEmbed;
+export interface FileValue {
+    size: number;
+    src: string;
+    title: string;
+}
+export declare class File extends Embed {
     static blotName: string;
     static tagName: string;
     static className: string;
     static PROTOCOL_WHITELIST: string[];
-    statics: any;
-    domNode: any;
-    static create(value: any): any;
-    static value(domNode: any): any;
-    static formats(domNode: any): any;
-    static getFormats(domNode: any): any;
-    static sanitize(url: any): any;
+    static create(value: FileValue): HTMLAnchorElement;
+    static value(domNode: HTMLAnchorElement): Record<string, string>;
+    static getFormats(domNode: HTMLAnchorElement): Record<string, string>;
+    static sanitize(url: string): string;
 }
-export default File;
+export {};

package/types/modules/file/index.d.ts

@@ -1,11 +1,3 @@
-import { default as FileBar } from './modules/file-bar';
-
-declare const Module: unknown;
-declare class FileModule extends Module {
-    quill: any;
-    fileBar: FileBar;
-    static register(): void;
-    constructor(quill: any, options: any);
-    clickEvent(event: any): void;
-}
-export default FileModule;
+export * from './formats/file';
+export * from './modules/file-bar';
+export * from './modules/file-module';

package/types/modules/file/modules/file-bar.d.ts

@@ -1,4 +1,4 @@
-export default class FileBar {
+export declare class FileBar {
     quill: any;
     file: any;
     domNode: HTMLElement;

package/types/modules/file/modules/file-module.d.ts

@@ -0,0 +1,10 @@
+import { default as FluentEditor } from '../../../core/fluent-editor';
+import { FileBar } from './file-bar';
+
+export declare class FileModule {
+    quill: FluentEditor;
+    fileBar: FileBar;
+    static register(): void;
+    constructor(quill: FluentEditor);
+    clickEvent(event: MouseEvent): void;
+}

package/types/modules/i18n.d.ts

@@ -1,16 +1,15 @@
 import { default as FluentEditor } from '../fluent-editor';
 
-interface I18NOptions {
+export interface I18NOptions {
     lang: string;
-    langText: Record<string, string>;
 }
-declare class I18N {
+export declare class I18N {
     quill: FluentEditor;
-    isFullscreen: boolean;
+    static register(inputLangs: Record<string, Record<string, string>>, isCover?: boolean): void;
+    static parserText(text: string, lang: string): string;
     options: I18NOptions;
     constructor(quill: FluentEditor, options: Partial<I18NOptions>);
     resolveLanguageOption(options: Partial<I18NOptions>): I18NOptions;
     changeLanguage(options: Partial<I18NOptions>, force?: boolean): void;
 }
-export { I18NOptions };
 export default I18N;

package/types/modules/index.d.ts

@@ -0,0 +1,15 @@
+export * from './counter';
+export * from './custom-clipboard';
+export * from './custom-image';
+export * from './custom-uploader';
+export * from './divider';
+export * from './emoji';
+export * from './file';
+export * from './i18n';
+export * from './link';
+export * from './mathlive';
+export * from './mention';
+export * from './shortcut-key';
+export * from './syntax';
+export * from './table-up';
+export * from './toolbar';