{"id":18307916,"url":"https://github.com/froala/ember-froala-editor","last_synced_at":"2025-05-16T12:05:04.073Z","repository":{"id":5380551,"uuid":"53005035","full_name":"froala/ember-froala-editor","owner":"froala","description":"Ember component for Froala WYSIWYG HTML Rich Text Editor.","archived":false,"fork":false,"pushed_at":"2025-04-04T13:18:42.000Z","size":9781,"stargazers_count":71,"open_issues_count":6,"forks_count":36,"subscribers_count":7,"default_branch":"master","last_synced_at":"2025-04-05T02:01:58.289Z","etag":null,"topics":["javascript-editor","rich-text-editor","wysiwyg-editor","wysiwyg-html-editor"],"latest_commit_sha":null,"homepage":"https://froala.com/wysiwyg-editor","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/froala.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE.md","code_of_conduct":"CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-03-02T23:43:15.000Z","updated_at":"2025-04-04T13:18:46.000Z","dependencies_parsed_at":"2024-02-21T14:46:19.235Z","dependency_job_id":"d679a404-8790-4fa0-b7a8-301fbb5cc4bf","html_url":"https://github.com/froala/ember-froala-editor","commit_stats":{"total_commits":493,"total_committers":15,"mean_commits":32.86666666666667,"dds":"0.11561866125760645","last_synced_commit":"328df480e00cf004e0bcbecb514f57c8be13fdca"},"previous_names":[],"tags_count":80,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/froala%2Fember-froala-editor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/froala%2Fember-froala-editor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/froala%2Fember-froala-editor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/froala%2Fember-froala-editor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/froala","download_url":"https://codeload.github.com/froala/ember-froala-editor/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247640462,"owners_count":20971557,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["javascript-editor","rich-text-editor","wysiwyg-editor","wysiwyg-html-editor"],"created_at":"2024-11-05T16:05:52.936Z","updated_at":"2025-04-09T10:02:23.152Z","avatar_url":"https://github.com/froala.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"ember-froala-editor\n==============================================================================\n\n[![Build Status](https://github.com/froala/ember-froala-editor/workflows/CI/badge.svg)](https://github.com/froala/ember-froala-editor/actions?query=workflow%3ACI)\n[![Ember Observer Score](http://emberobserver.com/badges/ember-froala-editor.svg)](http://emberobserver.com/addons/ember-froala-editor)\n[![npm](https://img.shields.io/npm/v/ember-froala-editor.svg)](https://www.npmjs.com/package/ember-froala-editor)\n[![npm](https://img.shields.io/npm/dm/ember-froala-editor.svg)](https://www.npmjs.com/package/ember-froala-editor)\n\n\u003e Bring the [Froala WYSIWYG Editor][2] into an [ember-cli][1] project with this\n\u003e addon. Besides importing the required Froala Editor files, the _main_ part of\n\u003e this addon is the `\u003cFroalaEditor /\u003e` component, which adds the editor in your\n\u003e ember app. Other functionality is also included to help interact with the\n\u003e editor and content, see the [Usage](#Usage) section below.\n\n\nCompatibility\n------------------------------------------------------------------------------\n\n* Ember.js v3.20 or above\n* Ember CLI v3.20 or above\n* Node.js v18 and above\n* _`ember-auto-import` v2 or above_\n\n#### Note on `ember-auto-import` version requirement\n\nThis addon (and Ember v4+) uses `ember-auto-import` v2, which implies that\nconsuming projects also use `ember-auto-import` v2. Outside of\n`npm install --save-dev ember-auto-import@^2.0.0 webpack`, take a look at the\n[upgrade guide](https://github.com/ef4/ember-auto-import/blob/main/docs/upgrade-guide-2.0.md)\nfor further details when upgrading from `ember-auto-import` v1.\n\n\nUpgrading from 3.x\n------------------------------------------------------------------------------\n\nThe only change is with the configuration options in `ember-cli-build.js`. All\noption types (languages, plugins, themes) must now be arrays with specific\nassets listed. Boolean and string values are no longer supported. Ex:\n\n**From**\n```js\nlet app = new EmberApp(defaults, {\n  'ember-froala-editor': {\n    languages: 'es',\n    plugins  : ['align','char_counter'],\n    themes   : true\n  }\n});\n```\n\n**To**\n```js\nlet app = new EmberApp(defaults, {\n  'ember-froala-editor': {\n    languages: ['es'],\n    plugins  : ['align','char_counter'],\n    themes   : ['dark','gray','royal']\n  }\n});\n```\n\nNo other changes needed from an ember perspective. Installation and usage is\nstill the same, but editor configuration options might have changed. See the\n[Froala Editor docs](https://froala.com/wysiwyg-editor/docs/migrate-from-version-3-to-version-4/)\nfor those details.\n\n\nInstallation\n------------------------------------------------------------------------------\n\n```\nember install ember-froala-editor\n```\n\n\nConfiguration\n------------------------------------------------------------------------------\n\nThis addon will import files from the `froala-editor` package into the build-tree\nto be included in the final app output. This covers the [Download details][3]\non the Froala Editor docs to get the main editor files into your project. You\ncan additionally include [languages][4], [plugins][5], and [themes][6] by\nadding configuration details in your `ember-cli-build.js` file.\n\nWithin the `ember-cli-build.js` file, add a `ember-froala-editor` object and\nlist which additional assets to include in an array. For plugins, you can use\neither the plugin name as shown in the Froala Editor docs or file name (without\nthe extension). Ex:\n\n```js\n// ember-cli-build.js\n// ... (snip)\nlet app = new EmberApp(defaults, {\n  'ember-froala-editor': {\n    languages: ['es','fr','de'],\n    plugins  : ['align','charCounter','paragraph_format'],\n    themes   : ['royal']\n  }\n});\n// ... (snip)\n```\n\n\nUsage\n------------------------------------------------------------------------------\n\nThis addon includes a couple components, several template helpers, and a couple\ntest helpers.\n\n### `\u003cFroalaEditor\u003e` Component\n\nThe `\u003cFroalaEditor\u003e` component exposes many aspects of the Froala Editor in\n\"Ember ways\" and uses the `\u003cdiv contenteditable\u003e` version of the editor (not\n`\u003ctextarea\u003e`). And with the Froala Editor being a third-party program, this\ncomponent will handle proper setup and teardown.\n\n```hbs\n\u003cFroalaEditor /\u003e\n```\n\nPass-in existing HTML/content via the `@content` argument and capture changes\nfrom the `@update` argument (which should be a setter, including `{{mut}}`).\nHowever, when using `{{mut}}` it must be wrapped in `{{fn}}` to retain the\nfunction (setter) aspect. The `@content` must be a SafeString from\n[`htmlSafe`][14] and `@update` will also return a SafeString.\n\n```hbs\n\u003cFroalaEditor\n  @content={{this.content}}\n  @update={{fn (mut this.content)}}\n/\u003e\n```\n\nThe `@update` setter will be called on the [`contentChanged` editor event][9]\nby default. There *is* a slight debounce effect with that event, which may or\nmay not be desirable. To change which event is used, pass in the event name\nthrough the `@updateEvent` argument.\n\n```hbs\n\u003cFroalaEditor\n  @content={{this.content}}\n  @update={{fn (mut this.content)}}\n  @updateEvent=\"input\"\n/\u003e\n```\n\n[Options][7] can be passed in through the `@options` argument or individually\nusing the option name as the `@argument` name. Note: If the same option is\npassed within the `@options` argument and individual argument, the individual\nargument will \"win\". In the example below, the theme would be \"dark\".\n\n```hbs\n\u003cFroalaEditor\n  @options={{hash theme=\"gray\"}}\n  @theme=\"dark\"\n/\u003e\n```\n\n[Event callbacks][8] can be passed into the component using the `@on-*` argument\nformat, where the event name is prefixed with `@on-`. Also, when an event has a\nperiod in the name, replace it with a dash. The callback will be given the editor\ninstance as the first argument, with the other event params (if any) following.\n\n```hbs\n\u003cFroalaEditor\n  @on-focus={{this.focusCallback}}\n  @on-paste-afterCleanup={{this.pasteCallback}}\n  @on-commands-after={{this.commandsCallback}}\n/\u003e\n```\n\nThe callback signatures should look like;\n\n```js\nfunction(editor, ...params) {}\n// Or for the examples above\nfunction focusCallback(editor) {}\nfunction pasteCallback(editor, clipboard_html) {}\nfunction commandsCallback(editor, cmd, param1, param2) {}\n```\n\nThe `\u003cFroalaEditor\u003e` also watches the `@disabled` state and will appropriately\nenable/disable the editing abilities when this argument changes. It basically\nis the equivalent to the `\u003ctextarea disabled\u003e` attribute.\n\n```hbs\n\u003cFroalaEditor\n  @disabled={{this.disabled}}\n  @on-edit-on={{this.editorEnabledCallback}}\n  @on-edit-off={{this.editorDisabledCallback}}\n/\u003e\n```\n\n\n### `\u003cFroalaContent\u003e` Component\n\nAccording to the [Froala Editor documentation][12], content created from the\neditor should be contained within an element with the `.fr-view` class. This\nis simply a component that applies the class. It can be used in either inline\n(with the `@content` argument) or block form, but either should be SafeString\nfrom the [`htmlSafe()`][14].\n\n```hbs\n{{!-- this.content = htmlSafe('\u003cp\u003eContent here\u003c/p\u003e') --}}\n\u003cFroalaContent @content={{this.content}} /\u003e\n\u003cFroalaContent\u003e{{this.content}}\u003c/FroalaContent\u003e\n```\n\nEither will render:\n\n```html\n\u003cdiv class=\"fr-view\"\u003e\u003cp\u003eContent here\u003c/p\u003e\u003c/div\u003e\n```\n\n\n### `{{froala-arg}}` Template Helper\n\nThis helper creates a closure that will capture the editor instance and pass it\ninto the [event callback][8] as the first argument, with the other event args\nfollowing. The Froala Editor binds callbacks to the editor instance, so `this`\nis the editor and not the original context (even with the `@action` decorator).\n\nNote: All `@on-*` arguments on the `\u003cFroalaEditor\u003e` already have this applied\nautomatically. This is mainly useful when passing callbacks through the\n[`events` option][10].\n\n```hbs\n\u003cFroalaEditor\n  @options={{hash events=(hash click=(froala-arg this.callback))}}\n  @on-click={{this.callback}}\n/\u003e\n```\n\nThe callback signature should look like;\n\n```js\nfunction(editor, ...args) {}\n// Or for the example above with the click event\nfunction(editor, clickEvent) {}\n```\n\n\n### `{{froala-html}}` Template Helper\n\nThis helper creates a closure that will pass the editors current HTML/content\nas the first argument to the callback function. This is very useful when\ncombined with setters or the `{{mut}}` helper.\nEx: `{{froala-html (fn (mut this.content))}}`\n\nNote: The `@update` argument on `\u003cFroalaEditor\u003e` already has this applied\nautomatically. This is mainly useful when needing HTML on other callbacks\nbut can also be done by calling `editor.html.get()` from within your callback.\n\n```hbs\n\u003cFroalaEditor\n  @options={{hash events=(hash input=(froala-html this.callback))}}\n  @on-input={{froala-html this.callback}}\n/\u003e\n```\n\nThe callback signature should look like;\n\n```js\nfunction(html, editor, ...args) {}\n// Or for the example above with the input event\nfunction(html, editor, inputEvent) {}\n```\n\n\n### `{{froala-method}}` Template Helper\n\nThis helper creates a closure that will call an [editor method][11] when\ncalled. It is meant to replace an [event callback][8] on the\n`\u003cFroalaEditor\u003e` component. Simply specify the [method name][11] as the\nfirst parameter of the helper.\n\n```hbs\n\u003cFroalaEditor\n  @on-paste-after={{froala-method \"commands.undo\"}}\n/\u003e\n```\n\nThe helpers first parameter will be used as the editor method to be called, and\nthe remaining parameters will be used for method arguments. So you can pass in\nthe proper arguments as documented, and they will be spread out when called. Ex:\n\n```hbs\n{{froala-method \"align.apply\" \"right\"}}\n```\n\nIn addition, you can use values from the event callback and \"proxy\" them to the\nmethod. First, define a parameter in the position which the argument should be\npassed in (_to_). Then define a hash with the same name and an integer of the\nposition (1 indexed) which the argument would have been received (_from_). Ex:\n\n```hbs\n\u003cFroalaEditor\n  @on-save-error={{froala-method \"html.insert\" \"message\" message=2}}\n/\u003e\n```\n\nIn the above example, the \"on-save-error\" event callback would have received\n`(editor, error)`. In the `{{froala-method}}` helper we defined a \"message\"\nand told it to use the second argument, which is `error`.\n\n\n### `{{html-safe}}` Template Helper\n\nSince the `\u003cFroalaEditor\u003e` requires that `@content` be a SafeString from\n[`htmlSafe()`][14], this helper can provide a way to convert a content *string*\nwhen passing to the editor component. However, you should also sanitize the\ncontent going in to guard against XSS exploits.\n\nNote: This helper is **NOT** automatically imported into the app. Rather,\nyou must create your own helper to re-export the helper from this addon.\n\n1. `ember generate helper html-safe`\n2. Change `app/helpers/html-safe.js` to `export { default } from 'ember-froala-editor/helpers/html-safe';`\n3. Use `{{html-safe}}` in your app templates\n\n```hbs\n\u003cFroalaEditor\n  @content={{html-safe this.content}}\n/\u003e\n```\n\n\n### `{{to-string}}` Template Helper\n\nSince the `\u003cFroalaEditor\u003e` requires that `@content` to be a SafeString, it will\nalso return a SafeString from the `@update` callback (and any callbacks that\nuse the `{{froala-html}}` helper). This helper will convert that SafeString\nback to a normal string. However, you should also sanitize the content coming\nback to guard against XSS exploits.\n\nNote: This helper is **NOT** automatically imported into the app. Rather,\nyou must create your own helper to re-export the helper from this addon.\n\n1. `ember generate helper to-string`\n2. Change `app/helpers/to-string.js` to `export { default } from 'ember-froala-editor/helpers/to-string';`\n3. Use `{{to-string}}` in your app templates\n\n```hbs\n\u003cFroalaEditor\n  @content={{html-safe this.content}}\n  @update={{to-string (fn (mut this.content))}}\n/\u003e\n```\n\n\n### `{{merged-hash}}` Template Helper\n\nThis helper is a little out-of-scope for this addon, but can be very useful\nwhen you need to use a combination of [`options`][7]. It allows you to use an\nobject / hash property but also add others or override options. Ex:\n\n```hbs\n\u003cFroalaEditor\n  @options={{merged-hash this.parentOptions heightMin=400}}\n/\u003e\n```\n\nThe helper assumes all parameters are objects, and then uses [assign()][15] to\nmerge everything together. Each parameter takes priority on the previous, with\nthe \"hash\" (named parameters) being the final. So you can merge multiple\n\"levels\" of options. Ex:\n\n```hbs\n{{merged-hash\n  this.applicationOptions\n  this.routeOptions\n  pastePlain=true\n  placeholderText=\"Only plain text can go here...\"}}\n```\n\nNote: This helper is **NOT** automatically imported into the app. Rather,\nyou must create your own helper to re-export the helper from this addon.\n\n1. `ember generate helper merged-hash`\n2. Change `app/helpers/merged-hash.js` to `export { default } from 'ember-froala-editor/helpers/merged-hash';`\n3. Use `{{merged-hash}}` in your app templates\n\n\n### `fillInFroalaEditor()` Test Helper\n\nTest helper to best simulate content within the editor changing. It uses the\n[`fillIn()` helper provided by `ember-test-helpers`][22] but just ensures the\ncorrect DOM element is targeted. It requires a selector (string) as the first\nargument and HTML (string or [SafeString][14]) as the second argument. As an\nasync function, you should `await` the results before continuing with your test.\n\n```js\nimport { fillInFroalaEditor } from 'ember-froala-editor/test-support';\nawait fillInFroalaEditor('#editorId', '\u003cp\u003eHTML\u003c/p\u003e');\n```\n\n\n### `getInFroalaEditor()` Test Helper\n\nTest helper that grabs the `innerHTML` of the editor content, simple as that.\nIt returns the HTML as a string and *not* a SafeString, unlike `{{froala-html}}`.\n\n```js\nimport { getInFroalaEditor } from 'ember-froala-editor/test-support';\nlet content = getInFroalaEditor('#editorId');\n```\n\nSo putting both of these test helpers together, an [Acceptance Test][18] might\nlook something like this;\n\n```js\nimport { module, test } from 'qunit';\nimport { visit } from '@ember/test-helpers';\nimport { setupApplicationTest } from 'ember-qunit';\nimport { fillInFroalaEditor, getInFroalaEditor } from 'ember-froala-editor/test-support';\n\nmodule('Acceptance | FroalaEditor', function(hooks) {\n  setupApplicationTest(hooks);\n\n  test('\u003cFroalaEditor\u003e properly updates when content is filled in', async function(assert) {\n    assert.expect(2);\n\n    await visit('/');\n    assert.strictEqual(getInFroalaEditor('#editor'), '\u003cp\u003eFoobar\u003c/p\u003e');\n\n    await fillInFroalaEditor('#editor', '\u003cp\u003eFoobaz\u003c/p\u003e');\n    assert.strictEqual(getInFroalaEditor('#editor'), '\u003cp\u003eFoobaz\u003c/p\u003e');\n  });\n});\n```\n\n\nDefaults for `\u003cFroalaEditor\u003e` component\n------------------------------------------------------------------------------\n\nMost likely you will have customizations/options that are common across many/all\nof your `\u003cFroalaEditor\u003e` instances. Instead of passing around a shared `options`\nobject, there are a few ways to apply \"default\" options at once. And both ways\ncan be applied at the same time (ex: `environment.js` for the key and extending\nfor options/callbacks).\n\n### `environment.js` config\n\nThe `\u003cFroalaEditor\u003e` first looks to your `config/environment.js` file for a\n`ember-froala-editor` object to use as the [`options`][7]. This is a great\nplace for your key after purchasing the Froala Editor.\n\n```js\n'use strict';\n\nmodule.exports = function(environment) {\n  var ENV = {\n    // (other default code snipped...)\n\n    'ember-froala-editor': {\n      key: '_YOUR_KEY_HERE_'\n    }\n\n  };\n  // ... (other default code snipped...)\n  return ENV;\n};\n```\n\n\n### Extending `\u003cFroalaEditor\u003e` component\n\nThe `\u003cFroalaEditor\u003e` was created with extending and applying defaults in mind.\nSimply generate a new component within your app, extending from the addons\ncomponent and apply [options][7] and [event callbacks][8], similar to invoking\nthe editor in a template by passing arguments, but instead make them class\nproperties and methods.\n\n1. `ember generate component-class froala-editor`\n2. Change `app/components/froala-editor.js` to the example show below, where the editor is extended\n3. Add [options][7] to the `options = {}` object or individually\n4. Add [event callbacks][8] with the `on-eventName` naming strategy\n  * Note: Use the `@action` decorator to retain the component context\n\n```js\n// app/components/froala-editor.js\nimport FroalaEditorComponent from 'ember-froala-editor/components/froala-editor';\n\nexport default class FroalaEditor extends FroalaEditorComponent {\n  options = {\n    theme: \"gray\"\n  };\n  // OR\n  theme = \"gray\";\n\n  'on-eventName'(editor, ...args) {/* this = editor */}\n  @action 'on-eventName'(editor, ...args) {/* this = component */}\n}\n```\n\n\nCustom Elements\n------------------------------------------------------------------------------\n\nThe Froala Editor allows the creation of [custom elements][13] to use within\nthe editor, such as custom buttons, dropdowns, popups, icons, and plugins.\nThese should be created from within an [application initializer][17] so they\nare created/setup just once. Then you can use them within the editor as shown\nin the Froala Editor docs.\n\n1. `ember generate initializer froala-editor-elements` -- Or name(s) of your choosing\n2. `import FroalaEditor from 'froala-editor';`\n3. `FroalaEditor.DefineIcon()`, `FroalaEditor.RegisterCommand()`, etc.\n\n```js\nimport FroalaEditor from 'froala-editor';\n\nexport function initialize(/* application */) {\n  FroalaEditor.RegisterCommand('myButton', {});\n}\n\nexport default {\n  initialize\n};\n```\n\n\nFAQ\n------------------------------------------------------------------------------\n\n#### Why can't I use the `{{on}}` modifier for Froala Editor events?\nStarting with Froala Editor v3, it no longer triggers custom events on the DOM.\nInstead, the new way is to pass callbacks into the `options.events` object,\nor use the `editor.events.on()` method. This is done for you with the\n`\u003cFroalaEditor /\u003e` component by taking all  `@on-*` args and adding them\nto the editor using the `editor.events.on()` method.\n\n#### Why can't I customize the editor `tagName`?\nWith the move to Glimmer Components, the `tagName` is no longer customized\nthrough the component class. Rather, the forthcoming(?) `(element)` helper\nwill fill this need but it is not released in Ember.js proper yet. Once it is,\nyou'll be able to customize the emitted DOM Element using the `@tagName` argument.\nJust to note, the Froala Editor itself modifies the DOM quite a bit, so the\nemitted element might change anyway.\n\n#### Why can't content be passed into `\u003cFroalaEditor\u003e` in block form?\nContent changes must be captured by the component to properly update the editor\nusing `editor.html.set()` instead of through the Glimmer template. When content\nis passed in via block form (`\u003cFroalaEditor\u003e{{this.content}}\u003c/FroalaEditor\u003e`)\nthere is no way for the Glimmer component class to capture updates.\n\n#### Is there a way to enable two-way binding of `@content`?\nAs of this writing, no. Ember Octane with Glimmer Components do not allow\ntwo-way bound `@arguments` whatsoever. However, there has been discussion\non how to explicitly enable two-way binding in some manor, possibly by\na \"boxing\" a value with a setter. The `\u003cFroalaEditor\u003e` was designed with\nthis in mind, where the `@update` argument could look for a setter on\n`@content`, without needing to pass in the setter explicitly/separately.\n\n#### Why can't `@content` be a regular string anymore?\nThere has been some debate on if the `\u003cFroalaEditor\u003e` itself should automatically\ndisplay `@content` unescaped by applying [`htmlSafe()`][14]. Rather, the user\nof the component should indicate that the `@content` is Ok to display in its'\ncurrent form. Additionally, by requiring a SafeString, the addon was able to\nallow greater backwards compatibility without resorting to computeds. We can\nalways go back on this decision but it was a good change to make at v3.\n\n#### Why is my build output size larger with v4?\nWith the move to `ember-auto-import`, all possible dynamic `import()` assets\nare included in the build. Therefore, all language files, plugins, and themes\nwill be included in the project build output. However, only those listed in\nyour `ember-cli-build.js` `ember-froala-editor` options will actually be\nrequested by your browser.\n\n#### Why is it recommended to depend upon a minor version and not major?\nEx: `~4.0.0` instead of `^4.0.0`. Froala would like this addon (and other\nofficial integrations) to match versions of the main editor package. \nWhile we try to withold breaking changes to a major release, there are times\nwhere changes in the Ember ecosystem require changes to the addon, before the\nnext major release of the Froala Editor (we note these in the release notes).\n\n\nContributing\n------------------------------------------------------------------------------\n\nSee the [Contributing](CONTRIBUTING.md) guide for details.\n\n\nLicense\n------------------------------------------------------------------------------\n\nThe `ember-froala-editor` project is under [MIT License](LICENSE.md). However, in\norder to use Froala WYSIWYG HTML Editor plugin you must purchase a license for it.\n\nFroala Editor has [3 different licenses](http://froala.com/wysiwyg-editor/pricing) for commercial use.\nFor details please see [License Agreement](http://froala.com/wysiwyg-editor/terms).\n\n\n[1]: https://github.com/ember-cli/ember-cli\n[2]: https://www.froala.com/wysiwyg-editor\n[3]: https://www.froala.com/wysiwyg-editor/download\n[4]: https://www.froala.com/wysiwyg-editor/languages\n[5]: https://www.froala.com/wysiwyg-editor/docs/plugins\n[6]: https://www.froala.com/wysiwyg-editor/examples/color-themes\n[7]: https://www.froala.com/wysiwyg-editor/docs/options\n[8]: https://www.froala.com/wysiwyg-editor/docs/events\n[9]: https://www.froala.com/wysiwyg-editor/docs/events#contentChanged\n[10]: https://www.froala.com/wysiwyg-editor/docs/options#events\n[11]: https://www.froala.com/wysiwyg-editor/docs/methods\n[12]: https://www.froala.com/wysiwyg-editor/docs/overview#display\n[13]: https://www.froala.com/wysiwyg-editor/docs/concepts/custom/button\n[14]: https://api.emberjs.com/ember/release/functions/@ember%2Ftemplate/htmlSafe\n[15]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign\n[16]: https://api.emberjs.com/ember/release/classes/String/methods/camelize?anchor=classify\n[17]: https://guides.emberjs.com/release/applications/initializers/#toc_application-initializers\n[18]: https://guides.emberjs.com/release/testing/acceptance/\n[19]: https://emberjs.com/editions/octane/\n[20]: https://www.froala.com/wysiwyg-editor/changelog\n[21]: https://github.com/emberjs/rfcs/blob/master/text/0389-dynamic-tag-names.md\n[22]: https://github.com/emberjs/ember-test-helpers/blob/master/API.md#fillin\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffroala%2Fember-froala-editor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffroala%2Fember-froala-editor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffroala%2Fember-froala-editor/lists"}