Changelog
Tags:
- :boom: [Breaking Change]
- :rocket: [New Feature]
- :bug: [Bug Fix]
- :memo: [Documentation]
- :house: [Internal]
- :nail_care: [Polish]
4.3.1
:boom: Breaking Change
- Added the
popupRoot
option for all IViewBased
classes (Dialog
, Jodit
, FileBrowser
). Allows you to specify the parental element of dialogs and popup windows.
- If the option is not specified, then when creating a dialogue, there is a bypass of a tree, starting with the editor. If an element is found
dialog
or eny element with position: fixed
or position: absolute
, then it is used as a parent.
- Also,
shadowRoot
can be used as a popupRoot
Those. Parent search priorities:
popupRoot
option
shadowRoot
option
- The closest element
dialog
or with style position: fixed
or position: absolute
- document.body
This is necessary in cases where Jodit is displayed inside the dialog windows with a focus interception.
For example, when inserting in [mui dialog] (https://mui.com/material-ui/react-dialog/)
If this is your situation, then in most cases you won't need to do anything, as Jodit will find the correct parent element on its own.
But if your code logic was configured specifically to insert into document.body
, then you will need to explicitly specify popupRoot: document.body
const editor = Jodit.make('#editor', {
popupRoot: document.body
});
4.2.48
:bug: Bug Fix
:house: Internal
- Use typings for
options
in Jodti.make(element, options)
method
Before:
class Jodit {
static make(element: HTMLElement | string, options?: object): Jodit {
}
}
After:
class Jodit {
static make(
element: HTMLElement | string,
options?: DeepPartial<Config>
): Jodit {
}
}
4.2.45
- Fixed bug with RTL mode when all dialogs were opened without RTL mode
4.2.44
:rocket: New Feature
- Added method
Jodit.modules.Helpers.ConfigDeepFlatten
it allows make plain object from prototype chain object.
const editor = Jodit.make('#editor', {
image: {
dialogWidth: 500
}
});
console.log(editor.o.image.openOnDblClick);
console.log(JSON.stringify(editor.o.image));
const plain = Jodit.modules.Helpers.ConfigDeepFlatten(editor.o.image);
console.log(JSON.stringify(plain));
:house: Internal
@eslint/compat ^1.2.2 → ^1.2.3
@eslint/eslintrc ^3.1.0 → ^3.2.0
@eslint/js ^9.14.0 → ^9.16.0
@playwright/test ^1.48.2 → ^1.49.0
@types/mocha ^10.0.9 → ^10.0.10
@types/node ^22.8.7 → ^22.10.1
@typescript-eslint/eslint-plugin ^8.12.2 → ^8.16.0
@typescript-eslint/parser ^8.12.2 → ^8.16.0
axios ^1.7.7 → ^1.7.8
eslint ^9.14.0 → ^9.16.0
eslint-plugin-tsdoc ^0.3.0 → ^0.4.0
globals ^15.11.0 → ^15.12.0
less ^4.2.0 → ^4.2.1
postcss >=8.4.47 → >=8.4.49
prettier ^3.3.3 → ^3.4.1
stylelint ^16.10.0 → ^16.11.0
typescript ^5.6.3 → ^5.7.2
4.2.42
:rocket: New Feature
:bug: Bug Fix
4.2.41
:rocket: New Feature
Related issue: The video plugin only support content from youtube and vimeo #1170
Added options video.defaultWidth
, video.defaultHeight
, and video.parseUrlToVideoEmbed
to the video plugin. The parseUrlToVideoEmbed
option allows you to add your own video parser.
Jodit.make('#editor', {
buttons: 'video',
video: {
defaultWidth: 560,
defaultHeight: 315,
parseUrlToVideoEmbed: (url, size) => {
if (/https:\/\/sitename\.com/.test(url)) {
return `<iframe width="${size.width}" height="${size.height}" src="${url}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>`;
}
return Jodit.modules.Helpers.convertMediaUrlToVideoEmbed(
url,
size
);
}
},
controls: {
video: {
tooltip: 'Insert video'
}
}
});
4.2.40
:bug: Bug Fix
4.2.39
:house: Internal
Chai.js switched to ESM from version 5.0.0, which led to problems with tests inside browser.
To solve the problem, we abandoned node_modules version and switched to jsdelivr+esm
We are not removing the dependency yet, see ./test/tests/chai-loader.js
Update dependencies
@eslint/compat ^1.2.0 → ^1.2.2
@eslint/js ^9.12.0 → ^9.14.0
@playwright/test ^1.48.0 → ^1.48.2
@types/karma ^6.3.8 → ^6.3.9
@types/node ^20.16.11 → ^22.8.7
@typescript-eslint/eslint-plugin ^8.8.1 → ^8.12.2
@typescript-eslint/parser ^8.8.1 → ^8.12.2
compression ^1.7.4 → ^1.7.5
core-js ^3.38.1 → ^3.39.0
eslint ^9.12.0 → ^9.14.0
mini-css-extract-plugin ^2.9.1 → ^2.9.2
mocha ^10.7.3 → ^10.8.2
tslib ^2.7.0 → ^2.8.1
tsx ^4.19.1 → ^4.19.2
webpack 5.95.0 → 5.96.1
4.2.38
:bug: Bug Fix
- Fixed behavior of form submit with its own validation
4.2.37
:bug: Bug Fix
4.2.35
:bug: Bug Fix
4.2.34
:bug: Bug Fix
4.2.33
:bug: Bug Fix
- Fixed bug inside Search plugin with Highlight API. When selection was not cleared
4.2.32
:rocket: New Feature
Jodit.make('#editor', {
iframe: true,
iframeSandbox: 'allow-scripts allow-same-origin'
});
:house: Internal
- Move to ESLint 9
- Update dependencies
@playwright/test ^1.45.0 → ^1.48.0
@types/mocha ^10.0.7 → ^10.0.9
@types/node ^20.14.9 → ^22.7.5
@types/yargs ^17.0.32 → ^17.0.33
@typescript-eslint/eslint-plugin ^7.14.1 → ^8.8.1
@typescript-eslint/parser ^7.14.1 → ^8.8.1
autoprefixer ^10.4.19 → ^10.4.20
axios ^1.7.2 → ^1.7.7
core-js ^3.37.1 → ^3.38.1
cssnano-preset-advanced ^7.0.3 → ^7.0.6
eslint ^8.57.0 → ^9.12.0
eslint-plugin-import ^2.29.1 → ^2.31.0
eslint-plugin-mocha ^10.4.3 → ^10.5.0
eslint-plugin-prettier ^5.1.3 → ^5.2.1
eslint-plugin-simple-import-sort ^12.1.0 → ^12.1.1
glob ^10.4.2 → ^11.0.0
karma ^6.4.3 → ^6.4.4
mini-css-extract-plugin ^2.9.0 → ^2.9.1
mocha ^10.5.1 → ^10.7.3
node-jq ^4.4.0 → ^6.0.1
postcss >=8.4.38 → >=8.4.47
prettier ^3.3.2 → ^3.3.3
stylelint ^16.6.1 → ^16.10.0
stylelint-prettier ^5.0.0 → ^5.0.2
tslib ^2.6.3 → ^2.7.0
typescript ^5.5.2 → ^5.6.3
webpack 5.92.1 → 5.95.0
webpack-dev-middleware ^7.2.1 → ^7.4.2
webpack-dev-server ^5.0.4 → ^5.1.0
4.2.28
:rocket: New Feature
Jodit.make('#editor', {
countTextSpaces: true
});
:bug: Bug Fix
:house: Internal
- Use node 20 for build
- Update dependencies
@playwright/test ^1.43.1 → ^1.45.0
@types/mocha ^10.0.6 → ^10.0.7
@types/node ^20.12.5 → ^20.14.9
@typescript-eslint/eslint-plugin ^7.5.0 → ^7.14.1
@typescript-eslint/parser ^7.5.0 → ^7.14.1
axios ^1.6.8 → ^1.7.2
core-js ^3.36.1 → ^3.37.1
css-loader ^7.0.0 → ^7.1.2
css-minimizer-webpack-plugin ^6.0.0 → ^7.0.0
cssnano-preset-advanced ^6.1.2 → ^7.0.3
eslint-plugin-mocha ^10.4.1 → ^10.4.3
eslint-plugin-simple-import-sort ^12.0.0 → ^12.1.0
eslint-plugin-tsdoc ^0.2.17 → ^0.3.0
glob ^10.3.12 → ^10.4.2
mini-css-extract-plugin ^2.8.1 → ^2.9.0
mocha ^10.4.0 → ^10.5.1
node-jq ^4.3.1 → ^4.4.0
prettier ^3.2.5 → ^3.3.2
style-loader ^3.3.4 → ^4.0.0
stylelint ^16.3.1 → ^16.6.1
stylelint-config-standard ^36.0.0 → ^36.0.1
tslib ^2.6.2 → ^2.6.3
typescript ^5.4.5 → ^5.5.2
webpack 5.91.0 → 5.92.1
4.2.26
:bug: Bug Fix
4.2.25
:rocket: New Feature
4.2.22
:bug: Bug Fix
4.2.21
:house: Internal
- Improved appearance of tabs
- Fixed a bug when hovering over a button. The tooltip sometimes did not disappear
4.2.19
- Fixed the lag between setting the activity to a list item when opening it.
4.2.18
:house: Internal
4.2.17
:house: Internal
Removed conversion of list arrays into objects when creating a button in the toolbar. Previously the code looked like:
Jodit.make('#editor', {
constrols: {
lineHeight: {
list: [1, 1.1, 1.2, 1.3, 1.4, 1.5, 2]
}
}
});
was implicitly transformed into an object of the form:
Jodit.make('#editor', {
constrols: {
lineHeight: {
list: {
1: '1',
2: '2',
1.1: '1.1',
1.2: '1.2',
1.3: '1.3',
1.4: '1.4',
1.5: '1.5'
}
}
}
});
Thus, due to the nature of integer keys, the order of the elements was lost. Now such a transformation does not occur.
In your code you clearly need to check what came into list
and if it is an array, then use it as is.
Jodit.make('#editor', {
constrols: {
lineHeight: {
list: [1, 1.1, 1.2, 1.3, 1.4, 1.5, 2],
update(editor: IJodit, button): boolean {
if (Array.isArray(button.control)) {
}
}
}
}
});
:bug: Bug Fix
4.2.13
:bug: Bug Fix
4.2.8
:rocket: New Feature
- Controls have a new field
isVisible(editor: IJodit): boolean
, which allows you to completely hide the button in some situations.
Jodit.make('#editor', {
controls: {
undo: {
isVisible(editor: IJodit): boolean {
return editor.history.canUndo();
}
}
}
});
4.2.1
:bug: Bug Fix
4.1.12
:boom: Breaking Change
- Removed the default export from the watch decorator. We refrain from using default exports in this project (refer to CONTRIBUTING.md for more details).
Before:
import watch, { watch as watch2 } from 'jodit/core/decorators/watch/watch';
Now only:
import { watch } from 'jodit/core/decorators/watch/watch';
:bug: Bug Fix
4.1.11
- Fixed a bug within the FileBrowser module. The issue was due to the import order; the Ajax configuration was applied after the module had been initialized.
4.1.9
- Added
AbortError
to the Jodit.modules
namespace. This is a custom error that is thrown when the user cancels the operation.
const jodit = Jodit.make('#editor');
jodit.async
.promise((res, rej) => fetch('./test.php').then(res).catch(rej))
.catch(error => {
if (Jodit.modules.Helpers.isAbortError(error)) {
console.log('Operation was aborted');
}
});
jodit.destruct();
4.1.7
4.1.1
:house: Internal
@tsconfig/node18 ^18.2.2 → ^18.2.4
@types/node ^20.11.25 → ^20.12.2
@typescript-eslint/eslint-plugin ^7.1.1 → ^7.5.0
@typescript-eslint/parser ^7.1.1 → ^7.5.0
autoprefixer ^10.4.18 → ^10.4.19
axios ^1.6.7 → ^1.6.8
core-js ^3.36.0 → ^3.36.1
cssnano-preset-advanced ^6.1.0 → ^6.1.2
eslint-plugin-mocha ^10.4.0 → ^10.4.1
glob ^10.3.10 → ^10.3.12
mocha ^10.3.0 → ^10.4.0
open ^10.0.4 → ^10.1.0
postcss >=8.4.35 → >=8.4.38
stylelint ^16.2.1 → ^16.3.1
typescript ^5.4.2 → ^5.4.3
webpack 5.90.3 → 5.91.0
webpack-dev-middleware ^7.0.0 → ^7.2.0
webpack-dev-server ^5.0.2 → ^5.0.4
@types/node ^20.10.7 → ^20.11.25
@typescript-eslint/eslint-plugin ^6.18.0 → ^7.1.1
@typescript-eslint/parser ^6.18.0 → ^7.1.1
autoprefixer ^10.4.16 → ^10.4.18
axios ^1.6.5 → ^1.6.7
core-js ^3.35.0 → ^3.36.0
css-loader ^6.8.1 → ^6.10.0
css-minimizer-webpack-plugin ^5.0.1 → ^6.0.0
cssnano-preset-advanced ^6.0.3 → ^6.1.0
eslint ^8.56.0 → ^8.57.0
eslint-plugin-mocha ^10.2.0 → ^10.4.0
eslint-plugin-prettier ^5.1.2 → ^5.1.3
karma ^6.4.2 → ^6.4.3
karma-firefox-launcher ^2.1.2 → ^2.1.3
less-loader ^11.1.4 → ^12.2.0
mini-css-extract-plugin ^2.7.6 → ^2.8.1
mocha ^10.2.0 → ^10.3.0
node-jq ^4.2.2 → ^4.3.1
open ^10.0.3 → ^10.0.4
postcss >=8.4.33 → >=8.4.35
postcss-loader ^7.3.4 → ^8.1.1
prettier ^3.1.1 → ^3.2.5
style-loader ^3.3.3 → ^3.3.4
stylelint ^16.1.0 → ^16.2.1
typescript ^5.3.3 → ^5.4.2
webpack 5.89.0 → 5.90.3
webpack-dev-server ^4.15.1 → ^5.0.2
webpack-hot-middleware ^2.26.0 → ^2.26.1
4.0.15
- Fixed bug in
beforeInit
hook. If the hook returned a promise, and the editor was destroyed after that,
then after resolving the promise, the editor continued the initialization procedure
4.0.8
- Fixed a bug in the plugins module when extra plugins did not cause the editor to be redrawn after initialization
4.0.7
4.0.2
4.0.1
4.0.0-beta.121
:boom: Breaking Change
All static methods of the Jodit.modules.Table
module have been removed and replaced with methods of an instance of the Table
class with the same name.
const jodit = Jodit.make('#editor');
Jodit.modules.Table.mergeSelected(jodit.editor.firstChild, jodit);
jodit.getInstance('Table').mergeSelected(jodit.editor.firstChild);
.jodit-filebrowser
class prefix was renamed to .jodit-file-browser
- CSS key
--color-background-filebrowser-folders
was removed from global scope.
:bug: Bug Fix
:house: Internal
:rocket: New Feature
The Jodit.getInstance
method can accept a module constructor instead of its name:
const jodit = Jodit.make('#editor');
const table = jodit.getInstance(Jodit.modules.Table);
const table2 = jodit.getInstance('Table');
console.log(table === table2);
4.0.0-beta.119
4.0.0-beta.118
:bug: Bug Fix
:house: Internal
- Fixed colors for selected toolbar elements in the dark theme
4.0.0-beta.117
:bug: Bug Fix
4.0.0-beta.108
:bug: Bug Fix
:house: Internal
@types/ace ^0.0.50 → ^0.0.52
@types/fs-extra ^11.0.3 → ^11.0.4
@types/karma ^6.3.6 → ^6.3.8
@types/node ^20.8.7 → ^20.10.3
@types/postcss-css-variables ^0.18.2 → ^0.18.3
@types/yargs ^17.0.29 → ^17.0.32
@typescript-eslint/eslint-plugin ^6.8.0 → ^6.13.2
@typescript-eslint/parser ^6.8.0 → ^6.13.2
axios ^1.5.1 → ^1.6.2
core-js ^3.33.1 → ^3.34.0
eslint ^8.52.0 → ^8.55.0
eslint-config-prettier ^9.0.0 → ^9.1.0
eslint-plugin-import ^2.28.1 → ^2.29.0
node-jq ^4.0.1 → ^4.2.2
postcss >=8.4.31 → >=8.4.32
prettier ^3.0.3 → ^3.1.0
stylelint-prettier ^4.0.2 → ^4.1.0
ts-loader ^9.5.0 → ^9.5.1
typescript ^5.2.2 → ^5.3.2
4.0.0-beta.108
- Fixed a bug in the UITextArea UI component. Instead of adding a textarea element, it was incorrectly adding an input element.
4.0.0-beta.107
:rocket: New Feature
4.0.0-beta.97
:house: Internal
- Calls to setTimout without the async module have been removed from autotests, and most of the asynchronous tests have been rewritten from done to async/await
4.0.0-beta.96
:boom: Breaking Change
- Removed
Jodit.modules.Helpers.val
method
4.0.0-beta.95
:bug: Bug Fix
- Fixed the logic of the file upload module. When HTTP errors were simply ignored.
4.0.0-beta.93
:bug: Bug Fix
- Fixed a bug with the
editor.selection.setCursorIn(box)
method, which could set the cursor inside a
.
4.0.0-beta.91
:bug: Bug Fix
@types/ace ^0.0.49 → ^0.0.50
@types/fs-extra ^11.0.2 → ^11.0.3
@types/karma ^6.3.5 → ^6.3.6
@types/node ^20.8.3 → ^20.8.7
@types/postcss-css-variables ^0.18.1 → ^0.18.2
@types/yargs ^17.0.28 → ^17.0.29
@typescript-eslint/eslint-plugin ^6.7.4 → ^6.8.0
@typescript-eslint/parser ^6.7.4 → ^6.8.0
core-js ^3.33.0 → ^3.33.1
eslint ^8.51.0 → ^8.52.0
eslint-plugin-prettier ^5.0.0 → ^5.0.1
lint-staged ^14.0.1 → ^15.0.2
stylelint ^15.10.3 → ^15.11.0
webpack 5.88.2 → 5.89.0
4.0.0-beta.89
:rocket: New Feature
- Improved UX of dialog boxes. Added two options
closeOnEsc
defaulting to true
and closeOnClickOverlay
defaulting to false
. Jodit.make('#editor', {
dialog: {
closeOnEsc: true,
closeOnClickOverlay: false
}
});
const editor = Jodit.make('#editor');
editor.alert('Hello world');
editor
.dlg({
closeOnEsc: false,
closeOnClickOverlay: true
})
.open();
4.0.0-beta.88
:bug: Bug Fix
4.0.0-beta.78
@types/ace ^0.0.48 → ^0.0.49
@types/fs-extra ^11.0.1 → ^11.0.2
@types/karma ^6.3.4 → ^6.3.5
@types/node ^20.5.7 → ^20.8.3
@types/postcss-css-variables ^0.18.0 → ^0.18.1
@types/yargs ^17.0.24 → ^17.0.28
@typescript-eslint/eslint-plugin ^6.5.0 → ^6.7.4
@typescript-eslint/parser ^6.5.0 → ^6.7.4
autoprefixer ^10.4.15 → ^10.4.16
axios ^1.5.0 → ^1.5.1
chai ^4.3.8 → ^4.3.10
core-js ^3.32.1 → ^3.33.0
eslint ^8.48.0 → ^8.51.0
eslint-plugin-mocha ^10.1.0 → ^10.2.0
glob ^10.3.3 → ^10.3.10
postcss >=8.4.28 → >=8.4.31
prettier ^3.0.2 → ^3.0.3
ts-loader ^9.4.4 → ^9.5.0
4.0.0-beta.78
@types/karma ^6.3.3 → ^6.3.4
@types/node ^20.1.0 → ^20.5.0
@typescript-eslint/eslint-plugin ^5.59.2 → ^6.4.0
@typescript-eslint/parser ^5.59.2 → ^6.4.0
autoprefixer ^10.4.14 → ^10.4.15
core-js ^3.30.2 → ^3.32.0
css-loader ^6.7.3 → ^6.8.1
css-minimizer-webpack-plugin ^5.0.0 → ^5.0.1
eslint ^8.40.0 → ^8.47.0
eslint-config-prettier ^8.8.0 → ^9.0.0
eslint-plugin-import ^2.27.5 → ^2.28.0
eslint-plugin-prettier ^4.2.1 → ^5.0.0
glob ^10.2.2 → ^10.3.3
less ^4.1.3 → ^4.2.0
less-loader ^11.1.0 → ^11.1.3
lint-staged ^13.2.2 → ^14.0.0
mini-css-extract-plugin ^2.7.5 → ^2.7.6
node-jq ^2.3.5 → ^4.0.1
postcss >=8.4.23 → >=8.4.27
postcss-loader ^7.3.0 → ^7.3.3
prettier ^2.8.8 → ^3.0.1
style-loader ^3.3.2 → ^3.3.3
stylelint ^15.6.1 → ^15.10.2
stylelint-config-standard ^33.0.0 → ^34.0.0
stylelint-prettier ^3.0.0 → ^4.0.2
synchronous-promise 2.0.15 → 2.0.17
terser-webpack-plugin ^5.3.8 → ^5.3.9
ts-loader ^9.4.2 → ^9.4.4
tslib ^2.5.0 → ^2.6.1
typescript ^5.0.4 → ^5.1.6
webpack 5.82.0 → 5.88.2
webpack-cli ^5.1.0 → ^5.1.4
webpack-dev-middleware ^6.1.0 → ^6.1.1
webpack-dev-server ^4.15.0 → ^4.15.1
webpack-hot-middleware ^2.25.3 → ^2.25.4
4.0.0-beta.77
:bug: Bug Fix
:rocket: New Feature
4.0.0-beta.52
:boom: Breaking Change
- Removed deprecated selection.applyStyle method
- Change Creates. Sandbox signature to return body,iframe tuple
- In the plugin system, the requirement field has been removed from instances,
only the field in the constructor has been left
class somePlugin extends Jodit.modulules.Plugin {
static requires = ['hotkeys'];
requires = ['hotkeys'];
}
Deprecated were removed
Dom.isTag
does not support array
Select.applyStyle
method was removed
history.observer
was removed
editorCssClass
removed
wrapNodes.exclude
changed from array to set
allowResizeTags
changed from array to set
resizer.useAspectRatio
changed from array to set
All css variables renamed to kebab-case
4.0.0-beta.42
- Remove all languages from lang/index.js for ESM build
- Only base plugins list in plugins/index.js for ESM build
- Remove polyfills from ESM build
- Remove
composer.json
4.0.0-beta.10
@types/node ^18.15.12 → ^20.1.0
@typescript-eslint/eslint-plugin ^5.59.0 → ^5.59.2
@typescript-eslint/parser ^5.59.0 → ^5.59.2
axios ^1.3.6 → ^1.4.0
core-js ^3.30.1 → ^3.30.2
cssnano-preset-advanced ^6.0.0 → ^6.0.1
eslint ^8.38.0 → ^8.40.0
glob ^10.2.1 → ^10.2.2
karma ^6.4.1 → ^6.4.2
lint-staged ^13.2.1 → ^13.2.2
open ^8.4.2 → ^9.1.0
postcss-loader ^7.2.4 → ^7.3.0
prettier ^2.8.7 → ^2.8.8
puppeteer ^19.10.0 → ^20.1.1
stylelint ^15.5.0 → ^15.6.1
terser-webpack-plugin ^5.3.7 → ^5.3.8
webpack 5.80.0 → 5.82.0
webpack-cli ^5.0.1 → ^5.1.0
webpack-dev-middleware ^6.0.2 → ^6.1.0
webpack-dev-server ^4.13.3 → ^4.15.0
yargs ^17.7.1 → ^17.7.2
4.0.0.beta-0
:boom: Breaking Change
- !!! Build files removed from repository and only available in npm package !!!
- !!! bowers.json was removed !!!
- server.js was removed
- All build js files was rewritten to typescript
build-system
was renamed as tools
- Removed
exludeLangs
build option. Instead use --includeLanguages=en
option.
- Default target for build was changed to es2015
- Build in es2018 target was removed, instead es2021 was added
- Event
getIcon
was removed. Use option getIcon
instead
Jodit.make('#editor', {
getIcon: (name: string, clearName: string) => {
if (name === 'bold') {
return '<svg>...</svg>';
}
return null;
}
});
:rocket: New Feature
- Added
Jodit.modules.Dom.isList
method
- Added
Jodit.modules.Dom.isLeaf
method
- Added plugin
delete
for correct delete content with command delete
:house: Internal
@types/node ^18.13.0 → ^18.15.12
@typescript-eslint/eslint-plugin ^5.50.0 → ^5.59.0
@typescript-eslint/parser ^5.50.0 → ^5.59.0
autoprefixer ^10.4.13 → ^10.4.14
axios ^1.3.3 → ^1.3.6
core-js ^3.28.0 → ^3.30.1
css-minimizer-webpack-plugin ^4.2.2 → ^5.0.0
cssnano-preset-advanced ^5.3.9 → ^6.0.0
eslint ^8.34.0 → ^8.38.0
eslint-config-prettier ^8.6.0 → ^8.8.0
expect-mocha-image-snapshot ^3.0.1 → ^3.0.13
glob ^8.1.0 → ^10.2.1
karma-chrome-launcher ^3.1.1 → ^3.2.0
lint-staged ^13.1.2 → ^13.2.1
mini-css-extract-plugin ^2.7.2 → ^2.7.5
postcss >=8.4.21 → >=8.4.23
postcss-css-variables ^0.18.0 → ^0.19.0
postcss-loader ^7.0.2 → ^7.2.4
prettier ^2.8.4 → ^2.8.7
puppeteer ^19.7.0 → ^19.10.0
style-loader ^3.3.1 → ^3.3.2
stylelint ^15.1.0 → ^15.5.0
stylelint-config-standard ^30.0.1 → ^33.0.0
stylelint-prettier ^2.0.0 → ^3.0.0
terser-webpack-plugin ^5.3.6 → ^5.3.7
tsc-alias ^1.8.2 → ^1.8.5
typescript ^4.9.5 → ^5.0.4
webpack 5.76.0 → 5.80.0
webpack-dev-middleware ^6.0.1 → ^6.0.2
webpack-dev-server ^4.11.1 → ^4.13.3
yargs ^17.6.2 → ^17.7.1
3.24.6
:house: Internal
Jodit.modules.Helpers.htmlspecialchars
marked as deprecated. Instead use Jodit.modules.Helpers.stripTags
Jodit.modules.Helpers.stripTags
added third argument for excluding tags
Jodit.modules.Helpers.stripTags(
'<p>test <strong>po<br/>p</strong><br/>stop <em>lop</em><br/></p>',
document,
new Set(['p', 'br'])
);
- Inside
safeMode
will init only safePluginsList
plugins. It used to init extraPlugins
too.
size
plugin was added in default safePluginsList
const editor = Jodit.make('#editor', {
safeMode: true,
safePluginsList: ['enter', 'backspace']
});
console.log(editor.__plugins);
3.24.5
:bug: Bug Fix
:house: Internal
core-js ^3.27.2 → ^3.28.0
@types/node ^18.11.19 → ^18.13.0
axios ^1.3.2 → ^1.3.3
eslint ^8.33.0 → ^8.34.0
karma-sourcemap-loader ^0.3.8 → ^0.4.0
lint-staged ^13.1.0 → ^13.1.2
open ^8.4.0 → ^8.4.1
prettier ^2.8.3 → ^2.8.4
puppeteer ^19.6.3 → ^19.7.0
stylelint ^14.16.1 → ^15.1.0
stylelint-config-prettier ^9.0.4 → ^9.0.5
stylelint-config-standard ^29.0.0 → ^30.0.1
synchronous-promise 2.0.15 → 2.0.17
3.24.4
:boom: Breaking Change
- Options to hide the functionality of editing directories and files
filebrowser.createNewFolder
, filebrowser.editImage
,
filebrowser.deleteFolder
,filebrowser.renameFolder
,filebrowser.moveFolder
,filebrowser.moveFile
were marked as deprecated.
- Instead added
filebrowser.permissionsPresets: Partial<IPermissions>
option.
Before:
Jodit.make('#editor', {
filebrowser: {
createNewFolder: false,
deleteFolder: false,
renameFolder: false,
moveFolder: false,
moveFile: false,
editImage: false,
ajax: {
url: 'https://xdsoft.net/jodit/finder/'
}
}
});
Now
Jodit.make('#editor', {
filebrowser: {
permissionsPresets: {
allowFiles: false,
allowFileMove: false,
allowFileUpload: false,
allowFileUploadRemote: false,
allowFileRemove: false,
allowFileRename: false,
allowFolders: false,
allowFolderCreate: false,
allowFolderMove: false,
allowFolderRemove: false,
allowFolderRename: false,
allowImageResize: false,
allowImageCrop: false
},
ajax: {
url: 'https://xdsoft.net/jodit/finder/'
}
}
});
3.24.3
:house: Internal
core-js ^3.26.1 → ^3.27.2
@types/node ^18.11.9 → ^18.11.19
@typescript-eslint/eslint-plugin ^5.45.0 → ^5.50.0
@typescript-eslint/parser ^5.45.0 → ^5.50.0
axios ^1.2.0 → ^1.3.2
css-loader ^6.7.2 → ^6.7.3
eslint ^8.28.0 → ^8.33.0
eslint-config-prettier ^8.5.0 → ^8.6.0
eslint-plugin-import ^2.26.0 → ^2.27.5
expect-mocha-image-snapshot ^2.0.14 → ^3.0.1
glob ^8.0.3 → ^8.1.0
husky ^8.0.2 → ^8.0.3
lint-staged ^13.0.4 → ^13.1.0
mini-css-extract-plugin ^2.7.0 → ^2.7.2
mocha ^10.1.0 → ^10.2.0
nock ^13.2.9 → ^13.3.0
postcss >=8.4.19 → >=8.4.21
postcss-loader ^7.0.1 → ^7.0.2
prettier ^2.8.0 → ^2.8.3
puppeteer ^19.3.0 → ^19.6.3
stylelint ^14.15.0 → ^14.16.1
synchronous-promise 2.0.15 → 2.0.17
ts-loader ^9.4.1 → ^9.4.2
tsc-alias ^1.7.1 → ^1.8.2
tslib ^2.4.1 → ^2.5.0
typescript ^4.9.3 → ^4.9.5
webpack-cli ^5.0.0 → ^5.0.1
3.24.2
:rocket: New Feature
3.24.1
:boom: Breaking Change
- Constant array
MAY_BE_REMOVED_WITH_KEY
was replaced on set INSEPARABLE_TAGS
:rocket: New Feature
- Method
Select.applyStyle
marked as deprecated. Use Select.commitStyle
instead.
Before:
jodit.select.applyStyle(
{ color: red },
{
element: 'strong'
}
);
Now:
jodit.s.commitStyle({
element: 'strong',
attributes: {
style: {
color: 'red'
}
}
});
- In the options of the
Select
.commitStyle
method, the attributes
property has been added, which allows you to
also set attributes when applying a style.
jodit.s.commitStyle({
element: 'a',
attributes: {
href: 'https://stename.ru'
}
});
Wraps the selected text into a link with the specified address.
When inserting a url, if the text is selected, it will automatically be replaced with a link
In Tab plugin allow use shift+tab for lists
:bug: Bug Fix
:house: Internal
- Fixed deletion of the asserts function from the production code, instead of regular expressions, transformers are used****
3.23.3
:rocket: New Feature
- Added option
IControlType.childExec
Allows you to set a separate handler for list items
Jodit.make('.editor', {
buttons: [
{
name: 'add-date',
iconURL: 'stuf/dummy.png',
list: {
options: 'Open options'
},
exec(editor, current, control) {
editor.s.insertHTML(new Date().toString());
},
childExec(editor, current, control) {
if (control.args[0] === 'options') {
editor.alert('Options');
}
}
}
]
});
3.23.2
:bug: Bug Fix
:house: Internal
- Deleted ajax.dataType option, because it was not used
3.23.1
:boom: Breaking Change
- Remove
IJodit
from first argument of Ajax
constructor.
:rocket: New Feature
- The focus method and the isFocused property have been added to the
IJodit
interface.
These are just aliases for the same methods and properties of the Select
module.
const editor = Jodit.make('#editor');
editor.focus();
- The
IJodit.fetch
method has been added to the IJodit
interface,
which is similar in signature to the fetch
method in the browser
const editor = Jodit.make('#editor');
const data = await editor.fetch('https://somesite.com?type=json');
:bug: Bug Fix
- Fixed error when using
superscript
and subscript
commands. If the cursor was inside sub or sup tags, then nothing happened.
- Fixed a bug in the placeholder plugin when indent styles were set for the edit area,
they were not taken into account in the positioning of the placeholder. As a result, it was shifted relative to the focus.
3.22.1
:boom: Breaking Change
ISnapshot.isBlocked
- is readonly now
IHistory.snapshot
- is readonly now
IHistory.processChanges
and IHistory.upTick
were removed.
- Instead of
IHistory.snapshot.isBlocked=true...IHistory.snapshot.isBlocked=false
should be used IHistory.snapshot.transaction(() => {...})
IJodit.registerCommand<C extends string>
- is generic now
IJodit.getNativeEditorValue
- marked as internal, please do not use it in your code
- To class
.jodit-container
was added background-color: var(--color-background-light-gray);
- To class
.jodit-workplace
was added background-color: var(--color-background-default);
- Selection markers now are marked as temporary with
Dom.markTemporary
- Search plugin move selection to the next found element after replacing. See bug fix section
- WrapNodes plugin added
emptyBlockAfterInit=true
option. After the editor is initialized, if it is empty, an empty block will be added to it.
:bug: Bug Fix
:house: Internal
core-js ^3.25.5 → ^3.26.0
@types/node ^18.11.0 → ^18.11.9
@typescript-eslint/eslint-plugin ^5.40.0 → ^5.42.0
@typescript-eslint/parser ^5.40.0 → ^5.42.0
autoprefixer ^10.4.12 → ^10.4.13
cssnano-preset-advanced ^5.3.8 → ^5.3.9
eslint ^8.25.0 → ^8.26.0
puppeteer ^19.0.0 → ^19.2.1
replace ^1.2.1 → ^1.2.2
tslib ^2.4.0 → ^2.4.1
yargs ^17.6.0 → ^17.6.1
3.21.5
3.21.4
:bug: Bug Fix
:house: Internal
@types/node ^18.8.3 → ^18.11.0
axios ^1.1.2 → ^1.1.3
css-minimizer-webpack-plugin ^4.2.1 → ^4.2.2
mocha ^10.0.0 → ^10.1.0
postcss >=8.4.17 → >=8.4.18
puppeteer ^18.2.1 → ^19.0.0
stylelint ^14.13.0 → ^14.14.0
stylelint-config-standard ^28.0.0 → ^29.0.0
3.21.1
:boom: Breaking Change
- Filebrowser adds a timestamp to the image preview url, now it will be the same as the server returned the
changed
field in the response.
This is necessary for better caching in the browser.
cleanHTML.denyTags
default equal script
Those. script tags are disabled by default. If you need them then turn off this rule:
Jodit.make('#editor', {
cleanHTML: {
denyTags: false
}
});
- The order of the hotkeys plugin keys has been changed to a more popular one.
It used to be:
b+meta
, b+ctrl
Now: meta+b
, ctrl+b
This is expressed in the installation of handlers for keyboard shortcuts:
Jodit.make('#editor', { disablePlugins: ['bold'] }).e.on('meta+b', () => {
alert('Do smth with text');
return false;
});
:house: Internal
- Remove
assert
calls from production build.
- Update deps
core-js ^3.24.1 → ^3.25.5
@types/node ^18.7.3 → ^18.8.3
@typescript-eslint/eslint-plugin ^5.33.0 → ^5.39.0
@typescript-eslint/parser ^5.33.0 → ^5.39.0
autoprefixer ^10.4.8 → ^10.4.12
axios ^0.27.2 → ^1.1.2
css-minimizer-webpack-plugin ^4.0.0 → ^4.2.1
eslint ^8.22.0 → ^8.25.0
eslint-plugin-tsdoc ^0.2.16 → ^0.2.17
express ^4.18.1 → ^4.18.2
karma ^6.4.0 → ^6.4.1
less-loader ^11.0.0 → ^11.1.0
postcss >=8.4.16 → >=8.4.17
puppeteer ^17.0.0 → ^18.2.1
stylelint ^14.10.0 → ^14.13.0
stylelint-config-idiomatic-order v8.1.0 → v9.0.0
stylelint-config-standard ^27.0.0 → ^28.0.0
synchronous-promise ^2.0.15 → ^2.0.16
terser-webpack-plugin ^5.3.4 → ^5.3.6
ts-loader ^9.3.1 → ^9.4.1
typescript ^4.8.2 → ^4.8.4
webpack 5.73.0 → 5.74.0
webpack-dev-server ^4.9.3 → ^4.11.1
webpack-hot-middleware ^2.25.1 → ^2.25.2
yargs ^17.5.1 → ^17.6.0
3.20.4
:house: Internal
- Move
error-messages
functionality to messages
module.
- Improved appearance of popup messages in the messages module.
:bug: Bug Fix
- Fixed a bug in the limit plugin. When the limit was reached, he checked the limits strictly,
when entering from the keyboard. Therefore, every time I change the input focus.
- Events are added to the same plugin when limits are reached.
More details can be found in the documentation limit
3.20.3
:house: Internal
- En lang is loaded as is
- Fix types generation:
- Remove styles
- Replace aliases
:bug: Bug Fix
3.20.2
:house: Internal
- Tooltip plugin functionality moved to
ui/button/tooltip
so that it can be used not only with the editor
:bug: Bug Fix
- Fixed bug in add-new-line in iframe-mode
3.20.1
:rocket: New Feature
- Removed Panel and IPanel
- Made IDlgs and Dlgs traits
- Added @derive decorator
- Mods/Elms/Dlgs traits now uses with @derive
- Added
dtd
plugin. Read more
:house: Internal
:bug: Bug Fix
3.19.5
:rocket: New Feature
:bug: Bug Fix
3.19.4
:rocket: New Feature
Jodit.make('#editor', {
uploader: {
url: 'https://sitename.net/jodit/connector/index.php?action=fileUpload',
getDisplayName: (_, name) => 'File:' + name
}
});
- Added
cleanHTML.useIframeSandbox
:boolean
option(default: false). Use iframe[sandbox] to paste HTML code into the editor to check it for safety.
Allows you not to run scripts and handlers, but it works much slower
:bug: Bug Fix
3.19.3
:bug: Bug Fix
- Quick fix bug with webpack output.clean=true.
3.19.2
:bug: Bug Fix
- Big bugfix in es2021 version, sideEffect cut all styles and configs
3.19.1
:house: Internal
3.18.7
:rocket: New Feature
:bug: Bug Fix
3.18.6
:rocket: New Feature
3.18.5
:boom: Breaking Change
- Added default table style to
createAttributes
option:
Jodit.defaultOptions.createAttributes = {
table: {
style: 'border-collapse:collapse;width: 100%;'
}
};
:bug: Bug Fix
3.18.4
:rocket: New Feature
- Added option
uploader.processFileName
- The method can be used to change the name of the uploaded file
Jodit.make('#editor', {
uploader: {
url: 'some-connector.php',
processFileName: (key, file, name) => {
return [key, file, 'some-prefix_' + name];
}
}
});
- Fixed file naming error when uploading to server
3.18.3
:bug: Bug Fix
- Fixed a bug where pressing
Esc
did not close the dialog
3.18.2
:boom: Breaking Change
The on/one/off methods of the Jodit Event System have been greatly simplified:
instead:
editor.e.on(
'click',
() => {
alert('Clicked!');
},
undefined,
true
);
Now:
editor.e.on(
'click',
() => {
alert('Clicked!');
},
{
top: true
}
);
Also, the methods now support an array of events:
editor.e.on('click mousedown mouseup', () => {
alert('Some event!');
});
editor.e.on(['click', 'mousedown', 'mouseup'], () => {
alert('Some event!');
});
:rocket: New Feature
:bug: Bug Fix
:house: Internal
3.17.1
:boom: Breaking Change
Some minifier configurations do not correctly handle inheritance in the component
decorator,
we added some helper code earlier to make this work correctly.
We tried to determine belonging by the name of the component and not by its constructor or prototype.
Because in some build system(ex. create-react-app):
@component
class A extends Component {
className() {
return 'A';
}
}
const a = new A();
a instanceof Component;
elm.className() === A.prototype.className();
In most cases, this entailed new bugs, so in 3.17 we decided to remove this heuristic.
If something broke in your assembly, please create an issue on github.
:bug: Bug Fix
const editor = Jodit.make('#editor');
editor.s.insertHTML('test', false);
:house: Internal
@typescript-eslint/eslint-plugin ^5.16.0 → ^5.19.0
@typescript-eslint/parser ^5.16.0 → ^5.19.0
cssnano-preset-advanced ^5.3.1 → ^5.3.3
eslint ^8.12.0 → ^8.13.0
eslint-plugin-tsdoc ^0.2.14 → ^0.2.16
prettier ^2.6.1 → ^2.6.2
webpack ^5.70.0 → ^5.72.0
webpack-dev-server ^4.7.4 → ^4.8.1
yargs ^17.4.0 → ^17.4.1
3.16.6
:bug: Bug Fix
3.16.5
:rocket: New Feature
- imageProcessor.replaceDataURIToBlobIdInView
The
imageProcessor
plugin has added the functionality of replacing data-uri objects in the src
of images with blob-url
.
This allows you to more conveniently work with an HTML document without loading the processor.
Checks if the imageProcessor.replaceDataURIToBlobIdInView
option is enabled then converts image src which has data:base64
to blob-object-uri
In this case, Jodit.value
returns images with data-uri
. And original textarea
itself does the reverse replacement take place.
const editor = Jodit.make('#editor', {
imageProcessor: {
replaceDataURIToBlobIdInView: true
}
});
editor.value =
'<p><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVQYV2NgYAAAAAMAAWgmWQ0AAAAASUVORK5CYII="/></p>';
console.log(editor.value);
console.log(editor.getElementValue());
console.log(editor.getNativeEditorValue());
- Method
Jodit.setElementValue
marked us deprecated and will be removed in next major release.
:house: Internal
@types/node ^17.0.21 → ^17.0.23
@typescript-eslint/eslint-plugin ^5.14.0 → ^5.16.0
@typescript-eslint/parser ^5.14.0 → ^5.16.0
autoprefixer ^10.4.2 → ^10.4.4
cssnano-preset-advanced ^5.2.4 → ^5.3.1
eslint ^8.11.0 → ^8.12.0
lint-staged ^12.3.5 → ^12.3.7
postcss >=8.4.8 → >=8.4.12
prettier ^2.5.1 → ^2.6.1
stylelint ^14.5.3 → ^14.6.1
typescript ^4.6.2 → ^4.6.3
yargs ^17.3.1 → ^17.4.0
3.16.4
:bug: Bug Fix
3.16.3
- Fixed composition
wait
and debounce
decorators
3.16.2
:bug: Bug Fix
3.16.1
:rocket: New Feature
- Added
spellcheck
plugin.
- Added
Config.pasteHTMLActionList
and Config.pasteFromWordActionList
options https://github.com/xdan/jodit/issues/802.
- Added
Jodit.synchronizeValues()
method. The method synchronizes the WYSIWYG values of the editor
- and the original input field. The method works through
Async.throttle
.
- Added a new class for working with DOM without blocking the main thread
LazyWalker
- Search engine replace on
LazyWalker
- CleanHTML plugin engine replace on
LazyWalker
- Search plugin now highlights all found options https://github.com/xdan/jodit/issues/798
- Added
Jodit.constants
https://github.com/xdan/jodit/issues/806
:boom: Breaking Change
- Renamed
wrap-text-nodes
plugin to wrap-nodes
- Option
spellcheck
= false by default. This is due to the fact that the built-in spell check slows down the editor very much on large tests.
- Enabled
@typescript-eslint/explicit-function-return-type
in eslint
:bug: Bug Fix
:house: Internal
clean-html
plugin now works via requestIdleCallback
and doesn't slow down the browser
3.15.3
:boom: Breaking Change
Observer
module renamed to History
, accessed via Jodit.history
Jodit.observer
field deprecated and will be removed in future releases
- Changed to
history
in observer
settings. The observer
field has been deprecated.
- Removed
stack
field from History
class (former Observer
).
- Separated default editor timeout and
history.timeout
. Now the second setting is just for history.
Timeouts for all asynchronous operations in Jodit now apply the defaultTimeout
setting
Before:
const editor = Jodit.make({
observer: {
timeout: 122,
maxHistoryLength: 100
}
});
console.log(editor.defaultTimeout);
editor.observer.stack.clear();
Now:
const editor = Jodit.make({
defaultTimeout: 122,
history: {
timeout: 1000,
maxHistoryLength: 100
}
});
console.log(editor.defaultTimeout);
editor.history.clear();
:bug: Bug Fix
3.15.2
3.15.1
:rocket: New Feature
:house: Internal
- The [[Dom.isNode]] method now uses Duck Typing instead of inctanceof, this seems to be enough
- Update
@types/node ^17.0.18 → ^17.0.21
@typescript-eslint/eslint-plugin ^5.12.0 → ^5.13.0
@typescript-eslint/parser ^5.12.0 → ^5.13.0
cssnano-preset-advanced ^5.1.12 → ^5.2.1
eslint ^8.9.0 → ^8.10.0
eslint-config-prettier ^8.4.0 → ^8.5.0
karma ^6.3.16 → ^6.3.17
mini-css-extract-plugin ^2.5.3 → ^2.6.0
postcss >=8.4.6 → >=8.4.7
stylelint ^14.5.1 → ^14.5.3
ts-loader ^9.2.6 → ^9.2.7
typescript ^4.5.5 → ^4.6.2
webpack ^5.69.1 → ^5.70.0
3.14.2
:rocket: New Feature
- Added an experimental module for working with VDom<->Dom, an attempt to switch to this technology in the editor
:house: Internal
- @types/node ^17.0.15 → ^17.0.18
- @typescript-eslint/eslint-plugin ^5.10.2 → ^5.12.0
- @typescript-eslint/parser ^5.10.2 → ^5.12.0
- axios ^0.25.0 → ^0.26.0
- cssnano-preset-advanced ^5.1.11 → ^5.1.12
- eslint ^8.8.0 → ^8.9.0
- eslint-config-prettier ^8.3.0 → ^8.4.0
- express ^4.17.2 → ^4.17.3
- karma ^6.3.15 → ^6.3.16
- lint-staged ^12.3.3 → ^12.3.4
- mocha ^9.2.0 → ^9.2.1
- stylelint ^14.3.0 → ^14.5.1
- stylelint-config-standard ^24.0.0 → ^25.0.0
- webpack ^5.68.0 → ^5.69.1
- core-js ^3.21.0 → ^3.21.1
3.14.1
:house: Internal
:boom: Breaking Change
- Changed the positions of some buttons on different resolutions for greater density
- Disabled the ability to drag and drop elements on mobile devices as it affected page scrollability
:bug: Bug Fix
3.13.5
:bug: Bug Fix
3.13.4
:rocket: New Feature
- Plugin for setting line spacing
:bug: Bug Fix
3.13.2
:rocket: New Feature
- Added a plugin to handle pressing the Tab key, it added the functionality of processing a keystroke inside the UL/li
element and allows you to add tree-like lists.
- Added static
Jodit.isJoditAssigned
method: Checks if the element has already been initialized when for Jodit
const area = document.getElementById('editor');
(Jodit.make(area) === Jodit.make(area)) === Jodit.make(area);
console.log(Jodit.isJoditAssigned(area));
const editor = Jodit.make(area);
editor.destruct();
console.log(Jodit.isJoditAssigned(area));
:bug: Bug Fix
3.13.1
:boom: Breaking Change
ObserveObject
removed
- Added
observable
function which makes object observable. In this case, the function returns the same object.
const obj = {
a: 1,
b: {
c: 5
}
};
const obsObj = Jodit.modules.observable(obj);
console.log(obj === obsObj);
obsObj.on('change', () => {
console.log('Object changed');
});
obsObj.on('change.a', () => {
console.log('Key a changed');
});
obsObj.on('change.b.c', () => {
console.log('Key b.c changed');
});
obj.a = 6;
obj.b = { c: 6 };
obj.b.c = 8;
:bug: Bug Fix
- Fixed autotest in Chrome on Windows
3.12.5
:rocket: New Feature
- Added options
safeMode:boolean
and safePluginsList:string[]
for debugging
Jodit.make('#editor', {
safeMode: true,
safePluginsList: ['about']
});
Only one plugin will be activated. Convenient for debugging and your plugins, you can turn off all the others.
:bug: Bug Fix
- Fixed a bug due to which Jodit did not work in ie11, + added a polyfill for the iterator
3.12.3
:rocket: New Feature
- Added
monospace
button in format list https://github.com/xdan/jodit/issues/767
- In plugin
paste
added memorizeChoiceWhenPasteFragment
option: when the user inserts a piece of HTML, the plugin will ask - How to insert it.
If after that user insert the same fragment again, the previous option will be used without extra question.
memorizeChoiceWhenPasteFragment = false, by default, it is Breaking change
3.12.1
:boom: Breaking Change
ObserveObject
renamed to ObservableObject
const obj = { a: 1, b: 2 };
const observed = Jodit.modules.ObservableObject.create(obj);
observed.on('change', (oldV, newV) => console.log(oldV, newV));
observed.a = 5;
:bug: Bug Fix
:rocket: New Feature
- In addition to the preinstalled editors, the source plugin adds the ability to use its own implementation. You can read more in the documentation
3.11.2
:bug: Bug Fix
- Fixed a bug when resizing images whose size was specified in the style attribute - the size did not change
3.11.1
:boom: Breaking Change
- Plugin
Delete
renamed toBackspace
. And it is highly refractory.
:rocket: New Feature
- Open localhost in browser on
npm start
- Added
Async.prototype.delay
method
await editor.async.delay(1000);
alert('Alert after 1s');
- Added
Ajax.options.responseType
option XMLHttpRequestResponseType
- Added
Response.prototype.blob()
method
const ajax = new Jodit.modules.Ajax({ responseType: 'blob' });
await ajax.send().then(resp => resp.blob());
:bug: Bug Fix
3.10.2
:boom: Breaking Change
- The hotkeys have been castled in the Delete plugin:
Was:
const hotkeys = {
delete: ['delete', 'cmd+backspace'],
deleteWord: ['ctrl+delete', 'cmd+alt+backspace', 'ctrl+alt+backspace'],
backspace: ['backspace'],
backspaceWord: ['ctrl+backspace']
};
But the setting was called incorrectly, when the combination was pressed, not one word was deleted, but a whole sentence.
Now added one more setting:
const hotkeys = {
delete: ['delete', 'cmd+backspace'],
deleteWord: ['ctrl+delete', 'cmd+alt+backspace', 'ctrl+alt+backspace'],
deleteSentence: ['ctrl+shift+delete', 'cmd+shift+delete'],
backspace: ['backspace'],
backspaceWord: ['ctrl+backspace'],
backspaceSentence: ['ctrl+shift+backspace', 'cmd+shift+backspace']
};
:bug: Bug Fix
- fixed sync between WYSIWYG and source editor
3.10.1
:boom: Breaking Change
- Update `TypeScript@4.5.2`
- In
IJodit.getEditorValue
added second argument for using with afterGetValueFromEditor
event.
You can see example in source
plugin.
- In UIButton
state.status
changed to state.variant
beforeClose
event can prevent closing the dialog
const dialog = new Jodit.modules.Dialog();
dialog.setContent('Hello world!').open();
dialog.e.on('beforeClose', () => confirm('Are you sure?'));
:bug: Bug Fix
- fix: Proxy blur event to parent triggered on the ACE editor
3.9.5
:rocket: New Feature
const editor = Jodit.make('#editor', {
preset: 'inline',
popup: {
toolbar: Jodit.atom(['bold', 'italic', 'image'])
}
});
editor.s.focus();
editor.toolbar.showInline();
editor.e.fire('showInlineToolbar');
Also added ToolbarCollection.hide
and ToolbarCollection.show
methods.
const editor = Jodit.make('#editor');
editor.toolbar.hide();
editor.toolbar.show();
- Allow use prototype as component name
console.log(Jodit.modules.UIButton.getFullElName('element'));
console.log(Jodit.modules.UIButton.componentName);
interface IFileBrowserOptions {
saveStateInStorage:
| false
| {
storeLastOpenedFolder?: boolean;
storeView?: boolean;
storeSortBy?: boolean;
};
}
By default:
opt = {
saveStateInStorage: {
storeLastOpenedFolder: true,
storeView: true,
storeSortBy: true
}
};
Disable it:
Jodit.make('#editor', {
filebrowser: {
saveStateInStorage: false
}
});
Jodit.make('#editor', {
filebrowser: {
saveStateInStorage: {
storeLastOpenedFolder: false
}
}
});
- Spacer in Button Toolbar
In addition to the
|
metacharacters and \n
which stand for separator and newline, the ---
metacharacter has
appeared, which allows you to add a spacer element which pushes all buttons behind the spacer to the right side of the
toolbar and creates space in the middle.
Jodit.make('#editor', {
buttons: [
'source',
'bold',
'|',
'---',
'|',
'brush',
'about',
'\n',
'italic'
]
});
3.9.4
:rocket: New Feature
- Changed style resize rectangle for resize image or table
- Added link
POWERED BY JODIT
in statusbar
- Changed icon for resize handle in the bottom right corner
:bug: Bug Fix
3.9.3
:boom: Breaking Change
- The style
table-layout: fixed
has been removed from tables. When inserting a table, the width of the columns is
immediately set for it.
3.9.1
:boom: Breaking Change
- Removed
Travis.CI
👋👋👋
EventsNative
module - renamed to EventEmitter
const editor = Jodit.make('#editor');
console.log(editor.e instanceof Jodit.modules.EventEmitter);
console.log(editor.events instanceof Jodit.modules.EventEmitter);
console.log(editor.events instanceof Jodit.modules.EventsNative);
- BOOM: Move Ajax class into
request
folder.
import { Ajax } from 'jodit/core/request';
- Changed the signature of the send method in the Ajax API and is closer to the fetch () API
const editor = Jodit.make('#editor');
await new Ajax(editor, {
url: 'index.php'
}).send();
await new Ajax(editor, {
url: 'index.php'
})
.send()
.then(resp => resp.json());
- In
.npmignore
added:
- build-system/
- test.html
- .eslintrc.js
- .eslintignore
- .editorconfig
- .gitignore
- .prettierrc.json
- .stylelintrc
- app.css
- composer.json
:rocket: New Feature
In Dom
module added nextGen
and eachGen
methods. These methods return generators:
const editor = Jodit.make('#editor');
editor.value = '<ul><li><img>1</li><li>2</li><li>3</li></ul>';
const gen = Dom.nextGen(editor.editor.querySelector('img'), editor.editor);
let next = gen.next();
while (!next.done) {
console.log(next.value);
next = gen.next();
}
const gen2 = Dom.eachGen(editor.editor);
let next2 = gen2.next();
while (!next2.done) {
console.log(next2.value);
next2 = gen2.next();
}
:bug: Bug Fix
3.8.5
:house: Internal
- The build system is divided into modules and is now located in the 'build-system' folder, the
src/utils
folder has
been moved to it.
:bug: Bug Fix
3.8.4
:rocket: New Feature
- В eventEmitter добавлены методы:
mute(event?: string)
Doesn't start any handler;
isMuted(event?: string)
No handlers are triggered for the event
unmute(event?: string)
Returns event handling
const editor = Jodit.make('#editor');
editor.events.on('change', () => {
console.log(editor.value);
});
editor.value = '1';
editor.events.mute('change');
editor.value = '2';
editor.events.unmute('change');
editor.value = '3';
3.8.3
:boom: Breaking Change
Jodit.make('#editor', {
resizer: {
forImageChangeAttributes: false
}
});
:house: Internal
- The Source button has been moved to the depth of the toolbar as it is not cool for the WYSIWYG editor
:bug: Bug Fix
3.8.1
:boom: Breaking Change
- Rename
Style
to CommitStyle
const editor = Jodit.make('#editor');
const style = new Jodit.ns.CommitStyle({
style: {
color: 'red'
}
});
editor.execCommand('selectall');
style.apply(editor);
Dom
refactoring: from isNode
,isElement
,isHTMLElement
removed Window
argument.
Before
const editor = Jodit.make('#editor', { iframe: true });
Dom.isNode({}, editor.ow);
Dom.isNode(document.body, window);
Dom.isNode(document.body, editor.ow);
Dom.isNode(editor.od.body, editor.ow);
Dom.isNode(editor.ed.body, editor.ow);
Now
const editor = Jodit.make('#editor', { iframe: true });
Dom.isNode({});
Dom.isNode(document.body);
Dom.isNode(document.body);
Dom.isNode(editor.od.body);
Dom.isNode(editor.ed.body);
:rocket: New Feature
- Added
KeyArrowOutside
, allowing to go outside an inline element if there is no other element after that.
- Dictionary of variable values in css, a complete list can be found
here https://github.com/xdan/jodit/blob/main/src/styles/variables.less#L25
const editor = Jodit.make('#editor', {
styleValues: {
'color-icon': '#0f0',
'color-text': 'red',
colorBorder: 'black',
'color-panel': 'blue'
}
});
:bug: Bug Fix
3.7.1
:boom: Breaking Change
- Update Typescript 4.3.2 - and used override keyword.
noImplicitOverride
set true.
- Enable
@typescript-eslint/explicit-module-boundary-types
- Remove
type
helper. Buy jQuery
- it was your last part.
:bug: Bug Fix
:rocket: New Feature
- Added
idle
decorator - allow wrap class method in requestIdleCallback
@component
class UIInput extends UIElement {
@idle()
onSomeEvent() {
console.log('Some data');
}
}
const elm = new UIInput(jodit);
elm.onSomeEvent();
for (let i = 0; i < 5; i += 1) {
console.log(i);
}
Output
1
2
3
4
Some data
3.6.18
:bug: Bug Fix
3.6.17
:rocket: New Feature
- Added
IJodit.waitForReady(): Promise<IJodit>
method.
const jodit = Jodit.make('#editor', {
extraPlugins: ['myPlugin']
});
await jodit.waitForReady();
jodit.e.fire('someAsyncLoadedPluginEvent', test => {
alert(test);
});
3.6.16
:bug: Bug Fix
- Fixed selection restoring after blur and set source mode.
3.6.15
:bug: Bug Fix
- Fixed bug with fixed width and auto height resizing
3.6.13
:bug: Bug Fix
- Hot fix
focus
plugin + Select
.save
deny set focus in another place.
:rocket: New Feature
- Added
Select
.hasMarkers
method.
3.6.12
:rocket: New Feature
Added cursorAfterAutofocus=end
option inside autofocus
plugin. Allow change default autofocus position. Possible
values start
, end
.
autofocus plugin should focus on the end of the text #649
Added saveSelectionOnBlur=true
option inside autofocus
plugin. Allow restore position after editor has focus after
blur.
:house: Internal
- Renamed
autofocus
> focus
plugin.
:boom: Breaking Change
- The
Dom
.wrap
method changed signature - instead IJodit call with ICreate.
- The
Select
.restore
method is called with no arguments. It finds the range using the data attribute selector. In
the Select
.save
method added silent=false
argument.
Earlier
const editor = Jodit.make('#editor');
const info = editor.s.save();
editor.s.restore(info);
Now
const editor = Jodit.make('#editor');
editor.s.save(true);
editor.s.restore();
:bug: Bug Fix
3.6.10
:rocket: New Feature
<textarea id="editor" cols="30" rows="10"></textarea>
<script>
Jodit.make('#editor');
console.log(document.getElementById('editor').component.value);
document.getElementById('editor').component.filebrowser.open();
</script>
:bug: Bug Fix
3.6.7
:bug: Bug Fix
- When deleting a file via the context menu - the list of files was not updated.
:rocket: New Feature
- Added the ability to open a file browser and any dialog in a new window. To do this, you need to define
the
ownerWindow
field. For example, this can be done so that the file browser opens in a separate popup window.
const editor = Jodit.make('#editor', {
uploader: {
url: 'https://xdsoft.net/jodit/connector/index.php?action=fileUpload'
},
filebrowser: {
ajax: {
url: 'https://xdsoft.net/jodit/connector/index.php'
}
}
});
editor.e.on('getInstanceFileBrowser', options => {
const win = window.open(
'about:blank',
'File Browser',
'location=0,menubar=0,status=0,toolbar=0,titlebar=0,width=700,height=500'
);
win.document.open();
win.document.write(
'<html><head><title>File Browser!</title><link rel="stylesheet" type="text/css" href="./build/es2015/jodit.min.css"></head><body></body></html>'
);
win.document.close();
const browser = new Jodit.modules.FileBrowser({
ownerWindow: win,
headerButtons: [],
fullsize: true,
events: {
beforeOpen: () => {
win.focus();
},
afterClose: () => {
win.close();
}
},
ajax: options.ajax
});
browser.noCache = true;
return browser;
});
3.6.5
:boom: Breaking Change
- Removed options:
useIframeResizer
, useImgResizer
, useTableResizer
from resizer
plugin. Instead,
added allowResizeTags
.
Config.prototype.allowResizeTags = ['img', 'iframe', 'table', 'jodit'];
3.6.2
:bug: Bug Fix
3.6.1
:bug: Bug Fix
:rocket: New Feature
const editor = new Jodit('#editor', {
controls: {
classSpan: {
list: {
class1: 'Classe 1',
class2: 'Classe 2',
class3: 'Classe 3',
class4: 'Classe 4',
class5: 'Classe 5'
}
}
}
});
- Added
UIFileInput
element.
- Added
UIButtonGroup
element.
const group = new UIButtonGroup(jodit, {
label: 'Theme',
name: 'theme',
value: this.state.theme,
radio: true,
options: [
{ value: 'default', text: 'Light' },
{ value: 'dark', text: 'Dark' }
],
onChange: values => {
this.state.theme = values[0].value as string;
}
});
:house: Internal
- Enabled
"importsNotUsedAsValues": "error"
in tsconfig
- Refactoring
Filebrowser
module
- Refactoring
Dialog
module
- Added "stylelint-config-idiomatic-order" in style linter
- Added "en" bundle without another languages.
- Replaced
Config
system. You can change default setting in you extensions.
const a = new Jodit();
a.options.allowResizeY;
Jodit.defaultOptions.allowResizeY = false;
a.options.allowResizeY;
const a = new Jodit();
a.options.allowResizeY;
Jodit.defaultOptions.allowResizeY = false;
a.options.allowResizeY;
- Added
promisify
mode in debounce
and throttle
decorators.
- Removed
src/core/ui/form/validators/key-validator.ts
.
- Added
Async
.requestIdlePromise
method.
- Removed
Helpers
.extend
method.
- Added
Helpers
.loadImage
method.
- Changed
render
method in state/ui system.
@component
class UIBtn extends UIElement {
className() {
return 'UIBtn';
}
createContainer() {
const button = this.j.c.element('button');
button.style.color = 'red';
button.classList.add(this.getFullElName('button'));
this.j.e.on('click', button, this.onClick);
return button;
}
@autobind onClick() {
alert('click');
}
}
@component
class UIBtn extends UIElement {
className() {
return 'UIBtn';
}
render() {
return `<button class="&__button" style="color:red"></button>`;
}
@watch('container:click') onClick() {
alert('click');
}
}
and styles
.jodit-ui-btn__button {
border: 1px solid #ccc;
}
3.5.4
:bug: Bug Fix
3.5.3
:bug: Bug Fix
3.5.2
:house: Internal
:bug: Bug Fix
:rocket: New Feature
New option link.hotkeys: string[] = ['ctrl+k', 'cmd+k']
Execute new command openLinkDialog
. Related: https://github.com/xdan/jodit/issues/576
3.5.1
:house: Internal
import { component, persistent } from './src/core/decorators';
@component
class Item extends UIElement {
@persistent
options = {
some: true
};
}
const item = new Item(jodit);
console.log(item.options);
item.options = {
some: false
};
const item2 = new Item(jodit);
console.log(item.options);
- In
UIInput
added autocomplete
, clearButton
, icon
options.
:bug: Bug Fix
:rocket: New Feature
Jodit.atom
Jodit.Array
and Jodit.Object
marked as deprecated. In 3.5
they will be removed. Instead, use Jodit.atom
.
const editor = Jodit.make('#editor', {
buttons: Jodit.atom(['bold', 'italic']),
popup: {
img: Jodit.atom({
})
}
});
New option observer.maxHistoryLength: number = Infinity
Related with https://github.com/xdan/jodit/issues/574. In some cases need to limit size of undo history.
New options in link.plugin
- @property {"input"|"select"|""} link.modeClassName="input" Use an input text to ask the classname or a select or not
ask
- @property {boolean} link.selectMultipleClassName=true Allow multiple choises (to use with modeClassName="select")
- @property {number} link.selectSizeClassName=3 The size of the select (to use with modeClassName="select")
- @property {IUIOption[]} link.selectOptionsClassName=[] The list of the option for the select (to use with
modeClassName="select")
- ex: [
- { value: "", text: "" },
- { value: "val1", text: "text1" },
- { value: "val2", text: "text2" },
- { value: "val3", text: "text3" }
- ]
PR: https://github.com/xdan/jodit/pull/577 Thanks @s-renier-taonix-fr
New option statusbar: boolean = true
Issue https://github.com/xdan/jodit/issues/535
const editor = Jodit.make('#editor', {
statusbar: false
});
console.log(editor.statusbar.isShown);
editor.statusbar.show();
console.log(editor.statusbar.isShown);
The buttons
option can contain named groups of buttons. Each plugin decides which button belongs to which group. Thus,
if you turn off the plugin, then its buttons will not be shown either. Available
groups: ["source", "font-style", "script", "list", "indent", "font", "color", "media", "state", "clipboard", "insert", "history", "search", "other", "info"]
;
const editor = Jodit.make('#editor', {
buttons: [
{
group: 'custom',
buttons: []
},
'bold'
]
});
Jodit.defaultOptions.controls.someButton = {
icon: 'pencil',
command: 'selectall'
};
Jodit.plugins.add('somePlugin', function (editor) {
editor.registerButton({
name: 'someButton',
group: 'custom'
});
});
Hotkeys for BackSpace and Delete and remove part of text
Added hotkey settings for Delete and Backspace buttons. And added hotkey ctrl+backspace
for removing left part of
text. Issue: https://github.com/xdan/jodit/issues/532
Jodit.make('#editor', {
delete: Jodit.atom({
hotkeys: {
delete: ['delete', 'cmd+backspace'],
deleteWord: [
'ctrl+delete',
'cmd+alt+backspace',
'ctrl+alt+backspace'
],
backspace: ['backspace'],
backspaceWord: ['ctrl+backspace']
}
})
});
Added one
method in event system
const editor = Jodit.make('#editor');
editor.events
.one('keydown', () => {
console.log('Fire only one time');
})
.on('keydown', () => {
console.log('Fire everytime');
});
3.4.28
:bug: Bug Fix
:rocket: New Feature
Added extraIcons
option. By default, you can only install an icon from the Jodit suite. You can add your icon to the
set using the Jodit.modules.Icon.set (name, svg Code)
method. But for a declarative declaration, you can use this
option.
Jodit.modules.Icon.set('someIcon', '<svg><path.../></svg>');
const editor = Jodit.make({
extraButtons: [
{
name: 'someButton',
icon: 'someIcon'
}
]
});
const editor = Jodit.make({
extraIcons: {
someIcon: '<svg><path.../></svg>'
},
extraButtons: [
{
name: 'someButton',
icon: 'someIcon'
}
]
});
const editor = Jodit.make({
extraButtons: [
{
name: 'someButton',
icon: '<svg><path.../></svg>'
}
]
});
3.4.27
3.4.26
:bug: Bug Fix
:rocket: New Feature
3.4.25
Features
const editor = Jodit.make('#editor', {
textIcons: key => key !== 'bold'
});
3.4.24
Bug fixes
3.4.22
Features
Added maxHeight
option.
const jodit = Jodit.make('#editor', {
minHeight: 200,
maxHeight: 500
});
3.4.18
3.4.16
Bug fixes
Features
const editor = new Jodit('#editor', {
defaultFontSizePoints: 'pt'
});
const editor = new Jodit('#editor', {
language: 'en',
showCharsCounter: true,
countHTMLChars: true
});
editor.value = '<p>Simple text</p><p>Simple text</p>';
const statusbar = editor.container.querySelector('.jodit-status-bar');
expect(statusbar.textContent.match(/Chars: 36/)).is.not.null;
3.4.15
3.4.13
Bug fixes
3.4.12
Bug fixes
const jodit = new Jodit('#editor', {
allowTabNavigation: true
});
3.4.2
Bug fixes
https://github.com/xdan/jodit/issues/359
3.4
Bug fixes
Features
- All
less
variables were replaced to css custom properties for modern browsers.
- Added
WrapNodes
plugin - it wrap all alone text node(or inline elements) inside options.enter
element. You can
disable this behaviour:
const editor = Jodit.make('#editor', {
disablePlugins: ['WrapNodes']
});
- Added
shadowRoot
option for ShadowDom support.
ACE source editor does not support Shadow Dom
<div id="editor"></div>
const app = document.getElementById('editor');
app.attachShadow({ mode: 'open' });
const root = app.shadowRoot;
root.innerHTML = `
<link rel="stylesheet" href="./build/jodit.css"/>
<h1>Jodit example in Shadow DOM</h1>
<div id="edit"></div>
`;
const editor = Jodit.make(root.getElementById('edit'), {
globalFullSize: false,
shadowRoot: root
});
editor.value = '<p>start</p>';
- From
NativeEvent.on
method was removed selector
argument. It was jQuery.live
style. Example:
<div class="test">
<button>1</button>
<button>2</button>
</div>
Earlier, you can use something like this
editor.events.on(
document.querySelector('div'),
'click',
function () {
alert(this.innerText);
},
'button'
);
Now, you should use event.target
editor.events.on(document.querySelector('div'), 'click', function (e) {
alert(e.target.innerText);
});
Select.applyCSS
was renamed to Select.applyStyle
const editor = Jodit.make('#editor');
editor.s.applyStyle({ color: 'red' });
FileBrowser
, Dialog
etc. modules which extend View
has only one argument in the constructor - options. Before:
const editor = Jodit.make('#editor');
const fb = Jodit.modules.FileBrowser(editor, {
ajax: {
url: 'https://xdsoft.net'
}
});
fb.open();
fb.close();
editor.destruct();
fb.open();
Now:
const editor = Jodit.make('#editor');
const fb = Jodit.modules.FileBrowser({
ajax: {
url: 'https://xdsoft.net'
}
});
fb.open();
fb.close();
editor.destruct();
fb.open();
fb.destruct();
editor.e.on('beforeDestruct', () => {
fb.destruct();
});
- Split
table
plugin on select-cells
and resize-cells
plugins. useTableProcessor
was removed. Instead, use
Jodit.make('#editor', {
table: {
allowCellSelection: true,
selectionCellStyle: 'border: 1px double #1e88e5 !important;',
allowCellResize: true,
useExtraClassesOptions: true
}
});
- All
less
files were moved near with TS. Class naming was changed closer to BEM.
- Removed
PopupList
and Popup
. Instead, use only PopupMenu
.
- Added
ui.button
and ui.list
for working with buttons. toolbar.button
extends ui.button
. UIButton - is
reactive:
const button = new UIButton();
button.state.activated = true;
button.state.icon = 'plus';
button
.setState({
text: 'Click me'
})
.onAction(() => {
Jodit.Alert('Click');
})
.appendTo(document.body);
- In
tsconfig
added decorators supports. Methods that need binding binds with @autobind
decorator.
- Added
watch
decorator.
- All filenames were renamed to kebab-case.
- Added short aliases for. Can be used as chain -
this.j.e.on
this.jodit
=> this.j
this.options
=> this.o
this.selection
=> this.s
this.create
=> this.c
this.events
=> this.e
this.ownerDocument
=> this.od
this.ownerWindow
=> this.ow
this.editorDocument
=> this.ed
this.editorWindow
=> this.ew
- Change name
Dialog
.setTitle
to Dialog
.setHeader
- Remove
Create.inside
field and instead added Jodit.createInside
- In popups added position strategies:
'leftBottom' | 'rightBottom' | 'leftTop' | 'rightTop'
etc.
3.3.24
BugFix
3.3.23
BugFix
Feature
const editor = Jodit.make('#editor');
const a = editor.createInside.element('a');
const br = document.createElement('br');
Jodit.modules.Dom.isTag(a, 'a');
Jodit.modules.Dom.isTag(br, 'br');
- Added
Helpers
.call
method
const f = Math.random();
Jodit.modules.Helpers.call(f > 0.5 ? Math.ceil : Math.floor, f);
- Added
Helpers
.position
method - Helper function to get an element's exact position
console.log(Jodit.modules.Helpers.position(editor.editor.querySelector('p')));
3.3.19
BugFix
Feature
- In
link
plugin added formTemplate
and formClassName
options #333
const editor = getJodit({
link: {
formTemplate: function () {
return '<form class="form_url"><input ref="url_input" type="url"><button>save</button></form>';
},
formClassName: 'some_class'
}
});
- Added deprecated mechanism. Some methods will not be removed and only will be marked as deprecated until major
release. #330
3.3.16
Added createAttributes
option #243
All elements which will be inserted in editor will be created with these attributes
const editor2 = Jodit.make('#editor', {
createAttributes: {
div: {
class: 'test'
},
ul: function (ul) {
ul.classList.add('ui-test');
}
}
});
const div2 = editor2.createInside.div();
expect(div2.className).equals('test');
const ul = editor2.createInside.element('ul');
expect(ul.className).equals('ui-test');
3.3.15
Bugfix
Fixed SPLIT_MODE
Feature
Added editHTMLDocumentMode
in order to allow the user to edit the entire
document #241.
Also added iframeTitle
and iframeDoctype
options
const editor = Jodit.make('#editor', {
iframe: true,
iframeTitle: 'Hello world!',
iframeDoctype: '<!DOCTYPE html>',
editHTMLDocumentMode: true,
iframeStyle: ''
});
console.log(editor.value);
3.3.14
Bugfix
Fixed https://github.com/xdan/jodit/issues/316
Fixed bug when Jodit was initialized inside iframe.
const iframe = document.createElement('iframe');
document.body.appendChild(iframe);
const win = iframe.contentWindow;
const doc = win.document;
doc.open();
doc.write(
'<html><body><textarea id="editor"></textarea><' +
'script src="./build/jodit.js"><' +
'/script></body></html>'
);
doc.close();
Jodit.make('#editor', {
ownerWindow: win,
ownerDocument: doc
});
Fixed bug with ProgressBar - it simply does not work(
Feature
Source plugin was separated on several classes. Now you can choose SourceEditor or make
yourself (https://github.com/xdan/jodit/issues/242)
Before
Jodit.make('#editor', {
useAceEditor: true
});
Now
Jodit.make('#editor', {
sourceEditor: 'area' || 'ace'
});
In PRO version you can choose mirrror&
- Added Async module for control asynchronous operations
const editor = new Jodit('#editor');
setTimeout(() => {
editor.s.insertHTML('Hello!');
}, 1000);
editor.async.setTimeout(() => {
editor.s.insertHTML('World!');
}, 1000);
editor.destruct();
After destruct the first timeout will throw the error, but second will be cleared.
Added two methods setPanel and addPlace
<textarea id="editor"></textarea>
<textarea id="editor2"></textarea>
<textarea id="editor3"></textarea>
<div id="toolbar"></div>
const editor = new Jodit('#editor');
editor.setPanel('#toolbar');
editor.addPlace('#editor2');
editor.addPlace('#editor3');
Events
Added afterRemoveNode
event
const editor = new Jodit('#editor');
editor.events.on('afterRemoveNode', node => {
if (node.nodeName === 'IMG') {
fetch('delete.php', { image: node.src });
}
});
3.3.8
Plugin system was changed
Before
Jodit.plugins.insertText = function (editor) {
editor.events.on('someEvent', function (text) {
editor.s.insertHTMl('Hello ' + text);
});
};
Now
Jodit.plugins.add('insertText', function (editor) {
editor.events.on('someEvent', function (text) {
editor.s.insertHTMl('Hello ' + text);
});
});
console.log(Jodit.plugins.get('insertText'));
Jodit.plugins.remove('insertText');
Inside plugin, you can use several fields:
class Emoji {
hasStyle = true;
requires = ['autocomplete'];
init(editor) {
}
}
Jodit.plugins.add('emoji', Emoji);
And inside you init code
Jodit.make('#editor', {
basePath: 'https://sitename.com/somepath/',
extraPlugins: ['emoji']
});
It will try to download
https:
hasStyle = true;
means try download and include in page style file:
https:
In plugins/example
folder you can find an example.
extraPlugins option allows appending in editor extra plugins from npm, bower etc.
Build System
In Build system was added gulp subsystem to build extra plugins. You can make extra plugins like plugins/example
and
after build, this plugin will not be inside jodit.min.js
file. It will be in separate folder (
eg build/plugins/emoji/
).
Also in root you can find make.js
file for install your plugin in build system.
2.5.61
Added zIndex
option
var editor = new Jodir('.editor', {
zIndex: 10000
});
2.5.60
- Fix table editor in iframe mode
- Fix styles
2.5.57
- Added
useIframeResizer
option for resize IFRAME tag
- Added
offsetTopForAssix
option. For example, in Joomla, the top menu bar closes Jodit toolbar when scrolling.
Therefore, it is necessary to move the toolbar Jodit by this amount
const editor = Jodit.make('#editor', {
offsetTopForAssix: 74
});
Without affix offset
With affix offset
2.5.55
Added Embed video
button. Added vimeo
or youtube
video embeded code.
2.5.54
When you insert text into the editor from another site, all the images are from a remote site. Before Jodit, it was
quite uncomfortable: first I had to download the image from a remote resource, and then upload it to your site, then
replace the image in the editor. In 2.5.54 it can be done in 3 clicks
Note
. Need update PHP Connector
2.5.53
Added Jodit.focus method
const editor = Jodit.make('.redactor');
editor.focus();
2.5.52
Added OK
button in Alert dialog
More About dialogs
Alert
Jodit.Alert('File was uploaded');
Jodit.Alert('File was uploaded', 'Message');
Jodit.Alert('File was uploaded', function () {
$('form').hide();
});
Jodit.Alert("File wasn't uploaded", 'Error', function () {
$('form').hide();
});
Promt
Jodit.Promt('Enter your name', function (name) {
if (name.length < 3) {
Jodit.Alert('The name must be at least 3 letters');
return false;
}
});
Jodit.Promt('Enter your name', 'Promt Dialog', function (name) {
if (name.length < 3) {
Jodit.Alert('The name must be at least 3 letters');
return false;
}
});
Confirm
Jodit.Confirm('Are you sure?', function (yes) {
if (yes) {
}
});
2.5.49
First step for Mobile-friendly sizeLG,sizeMD,sizeSM and
sets of buttons for different sizes editors.
Note
. this is not the width of the device, the width of the editor
- buttons The list of buttons that appear in the editor's toolbar on large places (≥ options.sizeLG).
- buttonsMD The list of buttons that appear in the editor's toolbar on medium places (≥ options.sizeMD).
- buttonsSM The list of buttons that appear in the editor's toolbar on small places (≥ options.sizeSM).
- buttonsXS The list of buttons that appear in the editor's toolbar on tiny places (< options.sizeSM).
const editor = Jodit.make('#some-editor', {
sizeLG: 900,
sizeMD: 700,
sizeSM: 400,
buttons: [
'source',
'|',
'bold',
'italic',
'|',
'ul',
'ol',
'|',
'font',
'fontsize',
'brush',
'paragraph',
'|',
'image',
'table',
'link',
'|',
'left',
'center',
'right',
'justify',
'|',
'undo',
'redo',
'|',
'hr',
'eraser',
'fullsize',
'about'
],
buttonsMD: [
'source',
'|',
'bold',
'italic',
'|',
'ul',
'ol',
'|',
'font',
'fontsize',
'brush',
'paragraph',
'|',
'image',
'table',
'link',
'|',
'left',
'center',
'right',
'justify',
'|',
'undo',
'redo',
'|',
'hr',
'eraser',
'fullsize'
],
buttonsSM: [
'bold',
'italic',
'|',
'ul',
'ol',
'|',
'fontsize',
'brush',
'paragraph',
'|',
'image',
'table',
'link',
'|',
'left',
'center',
'right',
'|',
'undo',
'redo',
'|',
'eraser',
'fullsize'
],
buttonsXS: [
'bold',
'image',
'|',
'brush',
'paragraph',
'|',
'left',
'center',
'right',
'|',
'undo',
'redo',
'|',
'eraser'
]
});
2.5.46
- More comfortable colorpicker
2.5.45
- Fixed bug in Image Resizer when border was less than Image
- Rename Selection.setCursorTo to Selection.moveCursorTo
- Fixed style for Dialog resizer
2.5.42
Fix a few bugs in JJE
2.5.40
- In Helper module added [isHTML] method. Used plugin
insertHTML
- Added simple plugin
insertHTML
and him option askBeforePasteHTML
- Ask before paste HTML in WYSIWYG mode. Try
insert in WYSIWYG mode some HTML source
(function ($) {
'use strict';
Jodit.defaultOptions = $.extend(true, Jodit.defaultOptions, {
askBeforePasteHTML: true
});
Jodit.plugins.insertHTML = function (parent) {
if (parent.options.askBeforePasteHTML) {
parent.events.on('beforePaste', function (event) {
if (
event &&
event.clipboardData &&
event.clipboardData.getData &&
event.clipboardData.types[0] === 'text/plain'
) {
var html = event.clipboardData.getData('text/plain');
if (parent.helper.isHTML(html)) {
Jodit.Confirm(
'Your code is similar to HTML. Paste as HTML?',
'Paste as HTML',
function (agree) {
if (agree) {
parent.s.insertHTML(html);
} else {
parent.s.insertHTML(
parent.helper.htmlspecialchars(html)
);
}
parent.syncCode(true);
}
);
return false;
}
}
});
}
};
})(Jodit.modules.Dom);
2.5.39
Fix #issue 11 in file:
mode CDN CodeMirror not working
2.5.38
- Added
Filter
in FileBrowser
- Added
SortBy
in FileBrowser
2.5.37
- Fixed bug in
Beautifier
plugin. When in source
mode, start
comment enter <!--
Browser stops responding.
- Added
tiles
and list
switcher in filebrowser
2.5.36
- In PHP FileBrowser connector added MaxFileSize option
- Fixed popap error in filebrowser
2.5.30
Fix Splitmode autohaight
Fix syncronize code in TableProcessor module
2.5.28
Fix bug in Dialog.Confirm
Jodit.Confirm('Are you sure?', 'Confirm', function (success) {
if (success) {
alert('Agree');
}
});
2.5.27
const editor = Jodit.make('#example2_0', {
textIcons: true,
removeButtons: [
'hr',
'ol',
'about',
'italic',
'format',
'fullsize',
'justify'
]
});
2.5.26
Dom Module is now compatible with jQuery objects
var a = jQuery('<a href="#link">Link</a>');
jodit.modules.Dom('.selector').append(a);
jodit.modules.Dom(jQuery('#someid')).val();
jodit.modules.Dom('#someid').val();
But you must remember that Jodit.modules.Dom! = JQuery
2.5.23
2.5.20
2.5.19
Added cleanHTML.allowTags option.
var editor = Jodit('#editor', {
allowTags: 'p,a[href],table,tr,td, img[src=1.png]'
});
editor.val(
'Sorry! <strong>Goodby</strong> <span>mr.</span> <a style="color:red" href="http://xsoft.net">Freeman</a>'
);
console.log(editor.val());
Or you can use PlainObject. This code equivalent to the top
var editor = Jodit('#editor', {
allowTags: {
p: true,
a: {
href: true
},
table: true,
tr: true,
td: true,
img: {
src: '1.png'
}
}
});
2.5.18
Fixed bug in Image plugin
2.5.17
Fixed bug in JJE
2.5.16
2.5.15
2.5.13
- Added in FileBrowser sort options
- Jodit.Promt and Jodit.Alert by default set focus to OK button
Jodit.Promt('Enter your name', function (name) {
if (!name.length) {
Jodit.Alert('You need enter 3 chars');
return false;
}
});
- Fix
$config
bug in JJE
- Added a few options in JJE plugin
2.5.12
Added edit button in Image Properties Dialog
2.5.11
2.5.1
2.4.22
- Added contextmenu module.
- Added context menu in FileBrowser
- Added preview in FilwBrowser
2.4.21
- Fixed TableProcessor's bugs. In a situation did not appear resizer cells and the resizer throughout the table.
2.4.20
- Fixed z-index Popap
- Fixed behavior of selection table cells
2.4.17
Fixed copy-paste html behavior
2.4.16
Fixed bug on after type Enter
2.4.15
Fixed bug with insert OL
tag and Fixed Dom module work with Text node
2.4.12
Added toolbarButtonSize Size of icons in the
toolbar (can be "small", "middle", "large")
const editor = Jodit.make('#editor', {
toolbarButtonSize: 'small'
});
2.4.10
const editor = Jodit.make('.jodit'),
node = editor.node.create('text', 'Hellow world');
editor.s.insertNode(node);
- Added link plugin. And its options
- Replace format icon
2.4.8
Fixed Base icons issue
2.4.6
Fast Fixed in JJE Fixed a lot of bugs in Jodit
2.4.1
- Fixed a lot of bugs in Dom module
- Fixed a lot of bugs in TableProcessor module
- Replace PNG icon on SVG sprite
- Added new module Icons
- Added theme
Dark
- Fixed bug Popap's module
- Divide one less file by modules
2.3.59
- Added Cookie module
- Added saveModeInCookie if it is true that
the current mode is saved in a cookie , and is restored after a reload of the page
- In Joomla Jodit Editor(JJE) added corresponding option
saveModeInCookie Download Jodit Joomla editor
2.3.57
- Fixed issue with
input[type=checkbox]
and Dom.attr method
- Release Joomla Jodit Editor (JJE) Download JJE
2.3.53
2.3.49
Added iframeBaseUrl option - Base URL where the
root directory for iframe mode
2.3.48
Added spellcheck option specifies whether the editor
is to have its spelling and grammar checked or not
2.3.47
Added removeEmptyBlocks option - Remove empty
blocks
const editor = Jodit.make('#editor', {
removeEmptyBlocks: false
});
editor.val(' ');
console.log(editor.val());
editor.options.removeEmptyBlocks = true;
editor.val(' ');
console.log(editor.val());
2.3.46
- Fixed critical bug in Safari (window.performance)
- Fixed bug when editor can get selection from another place
2.3.44
Added direction option. The writing direction of the
language which is used to create editor content. Allowed values are:
- '' (an empty string) – Indicates that content direction will be the same as either the editor UI direction or the page
element direction.
- 'ltr' – Indicates a Left-To-Right text direction (like in English).
- 'rtl' – Indicates a Right-To-Left text direction (like in Arabic).
2.3.43
Fixed styles bugs
2.3.41
When filebrowser.showFoldersPanel === false show 4
colums in filelist
2.3.40
2.3.39
Fixed Filebrowser uploader's options bug. Previously , you had to
either use a general Uploader module settings , or override them
completely
const editor = Jodit.make('.redactor', {
filebrowser: {
uploader: null
},
uploader: {
url: 'uploader.php',
format: 'json'
}
});
const editor = Jodit.make('.redactor', {
filebrowser: {
uploader: {
url: 'uploader.php',
format: 'json',
filesVariableName: 'fils'
}
}
});
Now you can just override some of your settings
const editor = Jodit.make('.redactor', {
filebrowser: {
uploader: {
url: 'uploader2.php'
}
},
uploader: {
url: 'uploader.php'
}
});
2.3.38
- Fixed i18n bug
- useSplitMode set default false
- Fixed toolbar width after fullsize mode
- Fixed #issue5
2.3.37
Fast fix
2.3.36
- Added plugin
Fullsize
. Now you can change fullsize mode
const editor = Jodit.make();
editor.events.fire('toggleFullsize');
editor.events.fire('toggleFullsize', [true]);
editor.events.fire('toggleFullsize', [false]);
- Added globalFullsize (default
true
) if true,
after fullsize
- all parents element get jodit_fullsize_box
class (z-index: 100000 !important;)
- Fixed focus bug
2.3.35
- Fixed placeholder style
- Fixed Dom.css then
<div class="idclass" style="margin-top:20px;"></div>
Jodit.modules.Dom('.idclass').css('margin-top');
Jodit.modules.Dom('.idclass').css('margin-top');
2.3.33
2.3.32
Added uploader.data option. Data to be sent to the
server like POST parameters
2.3.31
Added editorCssClass option - Class name that
can be appended to the editor Fixed internacionalization
2.3.30
Added triggerChangeEvent option Fixed
uploader's options - When the uploader is not configured, the editor still displays images upload button
2.3.29
Add Dom.defaultAjaxOptions.async By default, all
requests are sent asynchronously (i.e. this is set to true by default). If you need synchronous requests, set this
option to false
2.3.28
Added headers
option in [[FileBrowser]] and [[Uploader]]. But primarily in [[Dom]]
var token = document
.querySelector('meta[name="csrf-token"]')
.getAttribute('content'),
editor = new Jodit('#redactor', {
uploader: {
url: '../connector/index.php?action=upload',
headers: {
'X-CSRF-Token': token
}
},
filebrowser: {
ajax: {
url: '../connector/index.php',
headers: {
'X-CSRF-Token': token
}
}
}
});
Jodit.modules.Dom.defaultAjaxOptions.headers = {
headers: {
'X-CSRF-Token': token
}
};
Jodit.modules.Dom.ajax({
url: 'data.json',
headers: {
'Accept-Language': 'en-US,en;q=0.8,ru;q=0.6,de;q=0.4,ja;q=0.2'
},
success: function (resp) {
console.log(resp);
}
});
2.3.27
Fixed #issues1
2.3.24
Fixed dialog's module when was opened Promt window, after Enter submit the form and the page reloaded. Fixed connector's
bugs Update Jodit.i18n method. Now it can be used staticly
const editor = Jodit.make('#redactor', {
langusage: 'ru'
});
console.log(editor.i18n('Cancel'));
Jodit.defaultOptions.language = 'ru';
console.log(Jodit.prototype.i18n('Cancel'));
Jodit.lang.cs = {
Cancel: 'Zrušit'
};
Jodit.defaultOptions.language = 'cs';
console.log(Jodit.prototype.i18n('Cancel'));
Jodit.lang.cs = {
'Hello world': 'Hello 1$ Good 2$'
};
Jodit.defaultOptions.language = 'cs';
console.log(Jodit.prototype.i18n('Hello world', 'mr.Perkins', 'day'));
Fixed Jodit.destroy method
const editor = Jodit.make('.jodit');
editor.destroy();
2.3.22
Fixed bug when Dialog module was used without Jodit context
Jodit.Alert('Hello world!!!');
2.3.20
Fixed dialog's module zIndex manage. Fixed Dom.css method bug. That
example has not worked.
Jodit.modules.Dom('.someelement').css('z-index', 1000);
2.3.19
Fixed bug in Uploader module when http://sitename.net/jodit///files/fg.jpg
was
replaced http:/sitename.net/jodit/files/fg.jpg
2.3.18
Added afterInsertImage
event - triggered after image was
inserted selection.insertImage. This method
can execute from Filebrowser
or Uploader
const editor = Jodit.make('#redactor');
editor.events.on('afterInsertImage', function (image) {
image.className = 'bloghead4';
});
2.3.15
Fixed bug with inserting table
2.3.14
Work with table became faster
2.3.12
- Fixed filbrowser bug. When a new file is uploaded file list has not been updated
- Added dialog.zIndex option
2.3.11
Fixed toolbar width fot fullsize mode
2.3.10
- Fixed CodeMirror bug on download XML parser
- Fixed CodeMirror bug endless cycle
- Fixed overflow behavior in fullsize mode
2.3.8
Fixed connector problem and Fixed item's style in filebrowser
2.3.3
Switched on FontAwesome icons
2.3.0
Added copy-paste image file for FireFox
2.2.6
Fixed copy-paste for FireFox
2.2.5
Added copy-paste support by clipboard image. Try paste print screen.
2.2.4
Added the ability in the file browser to obtain data about the file not as a string and as an object with parameters
{file: 'name.jpg', thumb: '_thumbs/name.jpg'}
2.2.3
Fixed conflict between textProcessor and Beatyfier plugins
2.2.2
Fixed BACKSPACE entering behavior. And Fixed ie10 support
2.2.0
Added iframe
, iframeStyle
, iframeIncludeJoditStyle
, iframeCSSLinks
, width
, height
, minHeight.
iframe
by default false. When this option is enabled, the editor's content will be placed in an iframe and isolated
from the rest of the page.
width
and height
you can set size fot editor
2.1.0
Added internationalization. Read more https://xdsoft.net/jodit/docs/classes/view.View.html#defaultoptions#.language
2.0.9
Added Split mode. Added useSplitMode options (
default true) Example here
2.0.8
Fixed dialog bug
2.0.4
Added CodeMirror plugin. Enable by default [[Config.codeMirror]]
2.0.0
We got rid of jQuery
1.2.1
Fixed bug in filebrowser
1.2.0
Fixed bug when selection.insertHTML
doesn't work without focus
1.1.0
Fixed bug with uploader and filebrowser
1.0.6
If source textarea
has placeholder
attribute then Jodit use it how placeholder
1.0.4
Added About button
1.0.1
First release