diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index b561e52d..a9a21486 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,8 +1,5 @@ # Contributing -This project follows the [beehive-flow](https://github.com/tinymce/beehive-flow/) branching process ("Basic process - release from main branch"). -Please read the [beehive-flow readme](https://github.com/tinymce/beehive-flow/blob/main/README.md) for more information. -This mainly affects branching and merging for Tiny staff. - External contributors are free to submit PRs against the `main` branch. -Note that contributions will require signing of our Contributor License Agreement. + +In order for Tiny to accept your contribution, we will need legal permission from you to use your code. Please email `legal@tiny.cloud` with the subject `CLA request for [your Github username]`. Our legal team will send you a Contributors License Agreement (CLA) which you will need to sign and return. diff --git a/README.md b/README.md index 49ff7648..53d839d1 100644 --- a/README.md +++ b/README.md @@ -2,31 +2,82 @@ ## About -This package is a thin wrapper around [TinyMCE](https://github.com/tinymce/tinymce) to make it easier to use in an Angular application. +Official React component for TinyMCE, the rich text editor. It makes integrating TinyMCE into Angular applications easy and seamless. -* If you need detailed documentation on TinyMCE, see: [TinyMCE Documentation](https://www.tiny.cloud/docs/tinymce/8/). -* For the TinyMCE Angular Quick Start, see: [TinyMCE Documentation - Angular Integration](https://www.tiny.cloud/docs/tinymce/8/angular-cloud/). -* For the TinyMCE Angular Technical Reference, see: [TinyMCE Documentation - TinyMCE Angular Technical Reference](https://www.tiny.cloud/docs/tinymce/8/angular-ref/). -* For our quick demos, check out the TinyMCE Angular [Storybook](https://tinymce.github.io/tinymce-angular/). +## Quickstart -### Support +### Cloud CDN + +In your Angular project: + +1. [Sign up for a Tiny Cloud account](https://www.tiny.cloud/pricing/) to receive a Tiny Cloud API key. +2. `npm install @tinymce/tinymce-angular` +3. Include the following code: + +```js +import { Component } from '@angular/core'; +import { EditorComponent } from '@tinymce/tinymce-angular'; + +@Component({ + selector: 'app-root', + imports: [EditorComponent], + template: ` +

TinyMCE Angular demo

+ + ` +}) +export class AppComponent { + init: EditorComponent['init'] = { + plugins: 'lists link image table code help wordcount' + }; +} +``` + +4. Update the `apiKey` option in the editor element to include your Tiny Cloud API key. + +For more information: [Using TinyMCE with Angular - Cloud CDN](https://www.tiny.cloud/docs/tinymce/latest/angular-cloud/) + +### Self hosted via NPM package + +Using TinyMCE from NPM in an Angular project requires a couple of extra steps. See the documentation for more information: [Using TinyMCE with Angular - Self hosted via NPM](https://www.tiny.cloud/docs/tinymce/latest/angular-pm/) + + +## Demos + +For our quick demos, check out the TinyMCE Angular [Storybook](https://tinymce.github.io/tinymce-angular/). + +## Detailed documentation + +* [TinyMCE Angular Technical Reference](https://www.tiny.cloud/docs/tinymce/latest/angular-ref/). +* [TinyMCE Documentation](https://www.tiny.cloud/docs/tinymce/latest/). + +## Version compatibility |Angular version|`tinymce-angular` version| |--- |--- | -|>=16.x <=21.x |8+ | +|>=16.x |8+ | |14+ |7.x | |13+ |6.x | |9+ |4.x | |<= 8 |3.x | |< 5 | Not supported | -### Zoneless Support -This wrapper supports Angular's zoneless change detection. No additional configuration is needed — the component works with both zone-based and zoneless applications. +**Note**: The component works with both zone-based and zoneless applications. -### Issues +## Issues -Have you found an issue with tinymce-angular or do you have a feature request? +Have you found an issue with `tinymce-angular` or do you have a feature request? Open up an [issue](https://github.com/tinymce/tinymce-angular/issues) and let us know or submit a [pull request](https://github.com/tinymce/tinymce-angular/pulls). _Note: for issues concerning TinyMCE please visit the [TinyMCE repository](https://github.com/tinymce/tinymce)._ + + +## License + +`tinymce-angular` is licensed under the MIT License. See the LICENSE.txt file for details. + +Depending on use case, the TinyMCE core editor can be used under either GPL-2.0-or-later or a commercial license. See the [tinymce package](https://www.npmjs.com/package/tinymce) for details. diff --git a/package.json b/package.json index f4eefe3e..cfeb147e 100644 --- a/package.json +++ b/package.json @@ -2,9 +2,23 @@ "name": "@tinymce/tinymce-angular", "version": "9.1.2-rc", "private": true, - "description": "Official TinyMCE Angular Component", + "description": "Official Angular component for TinyMCE, a rich text editor.", "license": "MIT", "author": "Ephox Corporation DBA Tiny Technologies, Inc.", + "keywords": [ + "tinymce", + "angular", + "zoneless", + "angular2", + "ng", + "ngx", + "component", + "wysiwyg", + "rich-text-editor", + "html", + "contenteditable", + "editor" + ], "scripts": { "build": "yarn run clean && ng-packagr -p tinymce-angular-component/ng-package.json && json -I -f dist/tinymce-angular/package.json -e 'this.version=process.env.npm_package_version' && copyfiles README.md dist/tinymce-angular/", "build-storybook": "ng run angular:build-storybook",