editor-js / code Goto Github PK

Don't wrap long lines: use overflow-x instead

white-space: pre;
overflow-x: auto;
word-wrap: normal;

In v2.4.1, reserved HTML characters like <>& are replaced by HTML entities on saving data.

Here's a code sandbox to quickly reproduce the issue: https://codesandbox.io/s/peaceful-dhawan-wz02y?file=/index.js

Steps to reproduce:

1. Create code block
2. Type reserved HTML characters like "<>&"
3. Click on "Save and load"

The code block's content changes and displays the HTML entities of the characters.

Ex: php, css, js, ...

The minimum height is set here

some library like stdio.h is not showing

#include <stdio.h>

becomes

#include 

The code block can be better looking
and a Tab feature must me there

Problem

1. This tool was built in JavaScript to be a simplest example of Editor.js Tools API usage. Right now further enhancements requires more modern stack.
2. Importing this package in TS project leads a TS error: codex-team/editor.js#2143

Task

We need to migrate this project to TypeScript and provide type declarations. Make sure types for the plugin are available when using it in Typescript project with Editor.js

When you load already saved data into the editor and there is a code-block, you cannot delete characters with backspace (with del you can), neither can you navigate with the arrow-keys inside the code-block. It simply jumps to the block above instantly (in my example a header block).

Example:

const editor = new EditorJS({  
        data: {  
        "time":1700475383740,
        "blocks":[
            {"id":"aRMoZePSTD","type":"header","data":{"text":"My title","level":2}},
            {"id":"fcG8CCR5F8","type":"code","data":{"code":"here is some code"}}
        ],
        "version":"2.28.2"
    },
    tools: {
        code: CodeTool,
        header: Header
    }
});

Versions:

• editorjs: 2.28.2
• code: 2.9.0
• header: 2.8.1
• esbuild: 0.19.6
• Firefox: 119.0.1

Bundled with: esbuild, like this: ./node_modules/.bin/esbuild src/index.js --bundle --outfile=dist/index.js
Browser: Latest Firefox, it works in Chrome

Most times, spell check isn't required in code. Adding spellcheck="false" to the textarea should disable spell check.

For a valid code block, can the code property under any circumstances (now or in the future) be null or omitted? Or is it guaranteed to always be present and non-null for this block to be valid?

Context: I'm a back-end .NET developer needing to parse Editor.js documents. The readme does not explicitly guarantee that code will always be present and non-null. Back-end deserialization/parsing in strongly typed languages would be easier with some guarantees about which properties can and can not be null/omitted. (Ideally, any such guarantees should be added to the readme to ensure they are formalized and kept in the future.)

In class CodeTool:

Current Behaviour:
In getters and setters functions we use this._data.
Whereas in other parts like onPaste function, constructor, drawView , we are using this.data to access the data variable.

Proposed Fix:
Change this.data to this._data everywhere.

Why is this needed?
If we dont do this then when migrating to typescript we get a naming conflict error. As data() getter and data variable are of same name.

Hi, im getting some error..
bundle.js:10:5220: Unexpected token (10:5220)

bundler : parceljs

Pretty useless having a code block without the ability to enter tabs. :)

Due to issue #10, could you bump the version of the plugin?

for a better ux

When editing the code block, editor-js onChange function is never fired