From 4807ff03ef135a6f496165eb2def5aabc46a9c6c Mon Sep 17 00:00:00 2001 From: Vadym Borodin Date: Thu, 12 Jan 2023 14:47:23 +0200 Subject: [PATCH 1/5] Expose the `options` field type --- types/easymde.d.ts | 61 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 61 insertions(+) diff --git a/types/easymde.d.ts b/types/easymde.d.ts index c8ca578..3db178a 100644 --- a/types/easymde.d.ts +++ b/types/easymde.d.ts @@ -245,6 +245,67 @@ declare class EasyMDE { value(val: string): void; codemirror: CodeMirror.Editor; + options: { + autoDownloadFontAwesome?: boolean; + autofocus?: boolean; + autosave?: EasyMDE.AutoSaveOptions; + autoRefresh?: boolean | { delay: number; }; + blockStyles?: EasyMDE.BlockStyleOptions; + element?: HTMLElement; + forceSync?: boolean; + hideIcons?: ReadonlyArray; + indentWithTabs?: boolean; + initialValue?: string; + insertTexts?: EasyMDE.InsertTextOptions; + lineNumbers?: boolean; + lineWrapping?: boolean; + minHeight?: string; + maxHeight?: string; + parsingConfig?: EasyMDE.ParsingOptions; + placeholder?: string; + previewClass?: string | ReadonlyArray; + previewImagesInEditor?: boolean; + imagesPreviewHandler?: (src: string) => string, + previewRender?: (markdownPlaintext: string, previewElement: HTMLElement) => string | null; + promptURLs?: boolean; + renderingConfig?: EasyMDE.RenderingOptions; + shortcuts?: EasyMDE.Shortcuts; + showIcons?: ReadonlyArray; + spellChecker?: boolean | ((options: EasyMDE.SpellCheckerOptions) => void); + inputStyle?: 'textarea' | 'contenteditable'; + nativeSpellcheck?: boolean; + sideBySideFullscreen?: boolean; + status?: boolean | ReadonlyArray; + styleSelectedText?: boolean; + tabSize?: number; + toolbar?: boolean | ReadonlyArray<'|' | ToolbarButton | EasyMDE.ToolbarIcon | EasyMDE.ToolbarDropdownIcon>; + toolbarTips?: boolean; + toolbarButtonClassPrefix?: string; + onToggleFullScreen?: (goingIntoFullScreen: boolean) => void; + theme?: string; + scrollbarStyle?: string; + unorderedListStyle?: '*' | '-' | '+'; + + uploadImage?: boolean; + imageMaxSize?: number; + imageAccept?: string; + imageUploadFunction?: (file: File, onSuccess: (url: string) => void, onError: (error: string) => void) => void; + imageUploadEndpoint?: string; + imagePathAbsolute?: boolean; + imageCSRFToken?: string; + imageCSRFName?: string; + imageCSRFHeader?: boolean; + imageTexts?: EasyMDE.ImageTextsOptions; + errorMessages?: EasyMDE.ImageErrorTextsOptions; + errorCallback?: (errorMessage: string) => void; + + promptTexts?: EasyMDE.PromptTexts; + syncSideBySidePreviewScroll?: boolean; + + overlayMode?: EasyMDE.OverlayModeOptions; + + direction?: 'ltr' | 'rtl'; + } cleanup(): void; From abf0eb983d890446694b00cecd82625aa4138cf7 Mon Sep 17 00:00:00 2001 From: Vadym Borodin Date: Thu, 12 Jan 2023 14:55:11 +0200 Subject: [PATCH 2/5] Mark the properties that are guaranteed to be present --- types/easymde.d.ts | 88 ++++++++++++++-------------------------------- 1 file changed, 27 insertions(+), 61 deletions(-) diff --git a/types/easymde.d.ts b/types/easymde.d.ts index 3db178a..361b7e8 100644 --- a/types/easymde.d.ts +++ b/types/easymde.d.ts @@ -53,6 +53,32 @@ type ToolbarButton = | 'fullscreen' | 'guide'; +interface InstanceOptions extends EasyMDE { + blockStyles: EasyMDE.BlockStyleOptions; + insertTexts: EasyMDE.InsertTextOptions; + minHeight: string; + parsingConfig: EasyMDE.ParsingOptions; + previewClass: string | ReadonlyArray; + previewRender: (markdownPlaintext: string, previewElement: HTMLElement) => string | null; + shortcuts: EasyMDE.Shortcuts; + status: boolean | ReadonlyArray; + toolbar: boolean | ReadonlyArray<'|' | ToolbarButton | EasyMDE.ToolbarIcon | EasyMDE.ToolbarDropdownIcon>; + + uploadImage: boolean; + imageMaxSize: number; + imageAccept: string; + imagePathAbsolute: boolean; + imageCSRFName: string; + imageCSRFHeader: boolean; + imageTexts: EasyMDE.ImageTextsOptions; + errorMessages: EasyMDE.ImageErrorTextsOptions; + errorCallback: (errorMessage: string) => void; + + promptTexts: EasyMDE.PromptTexts; + + direction: 'ltr' | 'rtl'; +} + declare namespace EasyMDE { interface TimeFormatOptions { @@ -245,67 +271,7 @@ declare class EasyMDE { value(val: string): void; codemirror: CodeMirror.Editor; - options: { - autoDownloadFontAwesome?: boolean; - autofocus?: boolean; - autosave?: EasyMDE.AutoSaveOptions; - autoRefresh?: boolean | { delay: number; }; - blockStyles?: EasyMDE.BlockStyleOptions; - element?: HTMLElement; - forceSync?: boolean; - hideIcons?: ReadonlyArray; - indentWithTabs?: boolean; - initialValue?: string; - insertTexts?: EasyMDE.InsertTextOptions; - lineNumbers?: boolean; - lineWrapping?: boolean; - minHeight?: string; - maxHeight?: string; - parsingConfig?: EasyMDE.ParsingOptions; - placeholder?: string; - previewClass?: string | ReadonlyArray; - previewImagesInEditor?: boolean; - imagesPreviewHandler?: (src: string) => string, - previewRender?: (markdownPlaintext: string, previewElement: HTMLElement) => string | null; - promptURLs?: boolean; - renderingConfig?: EasyMDE.RenderingOptions; - shortcuts?: EasyMDE.Shortcuts; - showIcons?: ReadonlyArray; - spellChecker?: boolean | ((options: EasyMDE.SpellCheckerOptions) => void); - inputStyle?: 'textarea' | 'contenteditable'; - nativeSpellcheck?: boolean; - sideBySideFullscreen?: boolean; - status?: boolean | ReadonlyArray; - styleSelectedText?: boolean; - tabSize?: number; - toolbar?: boolean | ReadonlyArray<'|' | ToolbarButton | EasyMDE.ToolbarIcon | EasyMDE.ToolbarDropdownIcon>; - toolbarTips?: boolean; - toolbarButtonClassPrefix?: string; - onToggleFullScreen?: (goingIntoFullScreen: boolean) => void; - theme?: string; - scrollbarStyle?: string; - unorderedListStyle?: '*' | '-' | '+'; - - uploadImage?: boolean; - imageMaxSize?: number; - imageAccept?: string; - imageUploadFunction?: (file: File, onSuccess: (url: string) => void, onError: (error: string) => void) => void; - imageUploadEndpoint?: string; - imagePathAbsolute?: boolean; - imageCSRFToken?: string; - imageCSRFName?: string; - imageCSRFHeader?: boolean; - imageTexts?: EasyMDE.ImageTextsOptions; - errorMessages?: EasyMDE.ImageErrorTextsOptions; - errorCallback?: (errorMessage: string) => void; - - promptTexts?: EasyMDE.PromptTexts; - syncSideBySidePreviewScroll?: boolean; - - overlayMode?: EasyMDE.OverlayModeOptions; - - direction?: 'ltr' | 'rtl'; - } + options: InstanceOptions; cleanup(): void; From acf32aeffc61775d54b56f22ae2f468a8f389835 Mon Sep 17 00:00:00 2001 From: Vadym Borodin Date: Thu, 12 Jan 2023 14:58:16 +0200 Subject: [PATCH 3/5] Mark the sub-properties that are guaranteed to be present --- types/easymde.d.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/types/easymde.d.ts b/types/easymde.d.ts index 361b7e8..609c418 100644 --- a/types/easymde.d.ts +++ b/types/easymde.d.ts @@ -54,13 +54,13 @@ type ToolbarButton = | 'guide'; interface InstanceOptions extends EasyMDE { - blockStyles: EasyMDE.BlockStyleOptions; - insertTexts: EasyMDE.InsertTextOptions; + blockStyles: Required; + insertTexts: Required; minHeight: string; parsingConfig: EasyMDE.ParsingOptions; previewClass: string | ReadonlyArray; previewRender: (markdownPlaintext: string, previewElement: HTMLElement) => string | null; - shortcuts: EasyMDE.Shortcuts; + shortcuts: Required; status: boolean | ReadonlyArray; toolbar: boolean | ReadonlyArray<'|' | ToolbarButton | EasyMDE.ToolbarIcon | EasyMDE.ToolbarDropdownIcon>; @@ -70,11 +70,11 @@ interface InstanceOptions extends EasyMDE { imagePathAbsolute: boolean; imageCSRFName: string; imageCSRFHeader: boolean; - imageTexts: EasyMDE.ImageTextsOptions; - errorMessages: EasyMDE.ImageErrorTextsOptions; + imageTexts: Required; + errorMessages: Required; errorCallback: (errorMessage: string) => void; - promptTexts: EasyMDE.PromptTexts; + promptTexts: Required; direction: 'ltr' | 'rtl'; } From cea2234b58dbce5be0748b86df6c9c7fe50ce65c Mon Sep 17 00:00:00 2001 From: Vadym Borodin Date: Thu, 12 Jan 2023 15:05:49 +0200 Subject: [PATCH 4/5] Shorten the code --- types/easymde.d.ts | 34 +++++++++++++++++----------------- 1 file changed, 17 insertions(+), 17 deletions(-) diff --git a/types/easymde.d.ts b/types/easymde.d.ts index 609c418..76cb988 100644 --- a/types/easymde.d.ts +++ b/types/easymde.d.ts @@ -27,6 +27,8 @@ interface ArrayOneOrMore extends Array { 0: T; } +type SetRequired = Omit & Required>; + type ToolbarButton = 'bold' | 'italic' @@ -53,30 +55,28 @@ type ToolbarButton = | 'fullscreen' | 'guide'; -interface InstanceOptions extends EasyMDE { +interface InstanceOptions extends SetRequired { blockStyles: Required; insertTexts: Required; - minHeight: string; - parsingConfig: EasyMDE.ParsingOptions; - previewClass: string | ReadonlyArray; - previewRender: (markdownPlaintext: string, previewElement: HTMLElement) => string | null; shortcuts: Required; - status: boolean | ReadonlyArray; - toolbar: boolean | ReadonlyArray<'|' | ToolbarButton | EasyMDE.ToolbarIcon | EasyMDE.ToolbarDropdownIcon>; - - uploadImage: boolean; - imageMaxSize: number; - imageAccept: string; - imagePathAbsolute: boolean; - imageCSRFName: string; - imageCSRFHeader: boolean; + imageTexts: Required; errorMessages: Required; - errorCallback: (errorMessage: string) => void; promptTexts: Required; - - direction: 'ltr' | 'rtl'; } declare namespace EasyMDE { From a50d716e9356e0b0ab3736fc30828bfed9bfba42 Mon Sep 17 00:00:00 2001 From: Vadym Borodin Date: Thu, 12 Jan 2023 15:13:20 +0200 Subject: [PATCH 5/5] Add tests --- types/easymde-test.ts | 24 ++++++++++++++++++++++++ types/easymde.d.ts | 4 +++- 2 files changed, 27 insertions(+), 1 deletion(-) diff --git a/types/easymde-test.ts b/types/easymde-test.ts index 1564674..9ff4b1a 100644 --- a/types/easymde-test.ts +++ b/types/easymde-test.ts @@ -34,6 +34,30 @@ EasyMDE.toggleItalic = (editor: EasyMDE) => { console.log('SomeButtonOverride'); }; +console.log(editor.options.blockStyles.bold); +console.log(editor.options.insertTexts.horizontalRule[0]); +console.log(editor.options.minHeight); +console.log(editor.options.parsingConfig.allowAtxHeaderWithoutSpace); +console.log(editor.options.previewClass); +console.log(editor.options.previewRender('Hello', document.body)); +console.log(editor.options.shortcuts.cleanBlock); +console.log(editor.options.status); +console.log(editor.options.toolbar); + +console.log(editor.options.uploadImage); +console.log(editor.options.imageMaxSize); +console.log(editor.options.imageAccept); +console.log(editor.options.imagePathAbsolute); +console.log(editor.options.imageCSRFName); +console.log(editor.options.imageCSRFHeader); +console.log(editor.options.imageTexts.sbInit); +console.log(editor.options.errorMessages.fileTooLarge); +console.log(editor.options.errorCallback('Something went oops!')); + +console.log(editor.options.promptTexts.image); + +console.log(editor.options.direction); + const editor2 = new EasyMDE({ autoDownloadFontAwesome: undefined, previewClass: ['my-custom-class', 'some-other-class'], diff --git a/types/easymde.d.ts b/types/easymde.d.ts index 76cb988..c7fe9c3 100644 --- a/types/easymde.d.ts +++ b/types/easymde.d.ts @@ -71,7 +71,9 @@ interface InstanceOptions extends SetRequired { blockStyles: Required; insertTexts: Required; - shortcuts: Required; + shortcuts: { + [P in keyof EasyMDE.Shortcuts]-?: NonNullable; + }; imageTexts: Required; errorMessages: Required;