diff --git a/types/react-email-editor/index.d.ts b/types/react-email-editor/index.d.ts index 7daa8508e9..95b2264cb2 100644 --- a/types/react-email-editor/index.d.ts +++ b/types/react-email-editor/index.d.ts @@ -1,6 +1,7 @@ -// Type definitions for react-email-editor 0.9 +// Type definitions for react-email-editor 1.0 // Project: https://github.com/unlayer/react-email-editor // Definitions by: Nikita Granko +// Vladimir Penyazkov // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.8 @@ -23,11 +24,30 @@ export interface User { readonly email?: string; } -export interface MergeTag { +export interface GroupedMergeTag { + readonly name: string; + readonly mergeTags: Array; +} + +export interface SimpleMergeTag { readonly name: string; readonly value: string; } +export interface ConditionalMergeTagRule { + readonly name: string; + readonly before: string; + readonly after: string; +} + +export interface ConditionalMergeTag { + readonly name: string; + readonly rules: ConditionalMergeTagRule[]; + readonly mergeTags?: SimpleMergeTag[]; +} + +export type MergeTag = SimpleMergeTag | ConditionalMergeTag | GroupedMergeTag; + export interface DesignTagConfig { readonly delimeter: [string, string]; } diff --git a/types/react-email-editor/react-email-editor-tests.tsx b/types/react-email-editor/react-email-editor-tests.tsx index 7c48b7247b..ace06cad34 100644 --- a/types/react-email-editor/react-email-editor-tests.tsx +++ b/types/react-email-editor/react-email-editor-tests.tsx @@ -4,6 +4,9 @@ import EmailEditor, { FileInfo, FileUploadDoneCallback, HtmlExport, + SimpleMergeTag, + GroupedMergeTag, + ConditionalMergeTag } from 'react-email-editor'; const TOOLS_CONFIG = { @@ -16,6 +19,27 @@ const TOOLS_CONFIG = { }, }; +const simpleMergeTag: SimpleMergeTag = { value: '{{simple_merge_tag}}', name: 'Simple Merge Tag' }; +const groupedMergeTag: GroupedMergeTag = { + name: 'Grouped Merge Tag', + mergeTags: [ + { name: 'Tag 1', value: '{tag_1}' }, + { + name: 'Tag 2', + mergeTags: [{ name: 'Tag 4', value: '{tag_4}' }] + } + ], +}; +const conditionalMergeTag: ConditionalMergeTag = { + name: 'Conditional', + rules: [{ + name: 'Rule 1', + before: '{{#if}}', + after: '{{/if}}' + }], + mergeTags: [{ name: 'Tag 1', value: '{tag_1}' }] +}; + class App extends React.Component { private readonly editorRef = React.createRef(); @@ -34,7 +58,9 @@ class App extends React.Component { }), ); this.editorRef.current.setMergeTags([ - { name: '{{newTestTag}}', value: 'New Test Tag Value' }, + simpleMergeTag, + groupedMergeTag, + conditionalMergeTag ]); } } @@ -75,7 +101,7 @@ class App extends React.Component { name: 'John Doe', email: 'john.doe@acme.com', }, - mergeTags: [{ name: '{{testTag}}', value: 'Test Tag Value' }], + mergeTags: [simpleMergeTag, groupedMergeTag, conditionalMergeTag], designTags: { current_user_name: 'John Doe', },