Skip to content

Question: Text aligin - how to convert HTML tags into raw with markdownToDraft? #166

Open
@Pawelh133

Description

@Pawelh133

Thanks a lot for wonderful library!
Am I doing something wrong and Im not sure Im misunderstand something?

As I know text-align is not available in markdowns, so I created just html styles and added it as option into draftDataToMarkdown method. Here is example of this configuration:

const draftToMarkdownOptions = (): DraftToMarkdownOptions => ({
  styleItems: {
    center: {
      open() {
        return '<p style="text-align: center;">';
      },
      close() {
        return '</p>';
      },
    },
    left: {
      open() {
        return '<p style="text-align: left;">';
      },
      close() {
        return '</p>';
      },
    },
    right: {
      open() {
        return '<p style="text-align: right;">';
      },
      close() {
        return '</p>';
      },
    },
  },
});

It works fine on online editor. But when I editing document i have to do the reverse operation. I mean I have those tags change into center, left, right elements of RawDraftContentState. I was trying (for center):

const markdownToDraftOptions = (): MarkdownToDraftOptions => ({
  blockTypes: {
    center: item => {
      return {
        type: 'p',
        mutability: 'IMMUTABLE',
        text: 'style="text-align: center;"',
        data: {
          tag: 'style="text-align: center;"',
        },
      }
    },
  },
});

What am I doing wrong? Or there is no possiblity to do this for now? Thanks in advice!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions