An ember-cli addon that properly wraps the Froala WYSIWYG Editor for use in Ember.js
npm install ember-froala-editorember-froala-editor
==============================================================================




> Bring the [Froala WYSIWYG Editor][2] into an [ember-cli][1] project with this
> addon. Besides importing the required Froala Editor files, the _main_ part of
> this addon is the component, which adds the editor in your
> ember app. Other functionality is also included to help interact with the
> editor and content, see the Usage section below.
Compatibility
------------------------------------------------------------------------------
* Ember.js v3.20 or above
* Ember CLI v3.20 or above
* Node.js v18 and above
* _ember-auto-import v2 or above_
#### Note on ember-auto-import version requirement
This addon (and Ember v4+) uses ember-auto-import v2, which implies that
consuming projects also use ember-auto-import v2. Outside ofnpm install --save-dev ember-auto-import@^2.0.0 webpack, take a look at the
upgrade guide
for further details when upgrading from ember-auto-import v1.
Upgrading from 3.x
------------------------------------------------------------------------------
The only change is with the configuration options in ember-cli-build.js. All
option types (languages, plugins, themes) must now be arrays with specific
assets listed. Boolean and string values are no longer supported. Ex:
From
``js`
let app = new EmberApp(defaults, {
'ember-froala-editor': {
languages: 'es',
plugins : ['align','char_counter'],
themes : true
}
});
To
`js`
let app = new EmberApp(defaults, {
'ember-froala-editor': {
languages: ['es'],
plugins : ['align','char_counter'],
themes : ['dark','gray','royal']
}
});
No other changes needed from an ember perspective. Installation and usage is
still the same, but editor configuration options might have changed. See the
Froala Editor docs
for those details.
Installation
------------------------------------------------------------------------------
``
ember install ember-froala-editor
Configuration
------------------------------------------------------------------------------
This addon will import files from the froala-editor package into the build-treeember-cli-build.js
to be included in the final app output. This covers the [Download details][3]
on the Froala Editor docs to get the main editor files into your project. You
can additionally include [languages][4], [plugins][5], and [themes][6] by
adding configuration details in your file.
Within the ember-cli-build.js file, add a ember-froala-editor object and
list which additional assets to include in an array. For plugins, you can use
either the plugin name as shown in the Froala Editor docs or file name (without
the extension). Ex:
`js`
// ember-cli-build.js
// ... (snip)
let app = new EmberApp(defaults, {
'ember-froala-editor': {
languages: ['es','fr','de'],
plugins : ['align','charCounter','paragraph_format'],
themes : ['royal']
}
});
// ... (snip)
Usage
------------------------------------------------------------------------------
This addon includes a couple components, several template helpers, and a couple
test helpers.
The component exposes many aspects of the Froala Editor in
"Ember ways" and uses the version of the editor (not