Skip to content

Problem with Setting Language to English and Text Direction in Trumbowyg Editor #29

@ashiwanikumar

Description

@ashiwanikumar

I am currently using the Trumbowyg editor in my React application and encountering an issue with setting the language to English and ensuring the text direction is left-to-right (LTR). Despite modifying the language configuration and setting the _dir property to "ltr", the text still behaves as if it's in a right-to-left (RTL) language like Arabic.

<Trumbowyg
                  id="react-trumbowyg"
                  buttons={buttons}
                  data={values.content} // Bind the editor content to the state
                  placeholder="Type your text!"
                  onChange={(e) => {
                    setValues({ ...values, content: e.target.innerHTML }); // Update the content field in the state
                  }}
                  toolbar={{
                    inline: { inDropdown: true },
                    fontFamily: {
                      options: ["Arial"],
                      className: undefined,
                      component: undefined,
                      dropdownClassName: undefined,
                    },
                    list: { inDropdown: true },
                    textAlign: { inDropdown: true },
                    link: { inDropdown: true },
                    history: { inDropdown: true },
                    image: {
                      uploadCallback: uploadImageCallBack,
                      previewImage: true,
                      inputAccept:
                        "image/gif,image/jpeg,image/jpg,image/png,image/svg",
                      alt: { present: false, mandatory: false },
                      defaultSize: {
                        height: "auto",
                        width: "auto",
                      },
                    },
                  }}
                />

I have tried modifying the language configuration by setting Trumbowyg.langs.en and including _dir: "ltr", but it doesn't seem to have an effect. How can I correctly set the language to English and ensure the text direction is left-to-right? Any assistance or guidance on this issue would be greatly appreciated.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions