-
-
-
diff --git a/example/index.html b/example/index.html
deleted file mode 100644
index 801354d..0000000
--- a/example/index.html
+++ /dev/null
@@ -1,71 +0,0 @@
-
-
-
-
-
-
-
-
diff --git a/example/readme.md b/example/readme.md
deleted file mode 100644
index 861f483..0000000
--- a/example/readme.md
+++ /dev/null
@@ -1,41 +0,0 @@
-## This comes from `readme.md`
-
-### Technology used
-* angular.js
-* bootstrap
-* bootstrap-markdown
-* marked.js
-* angular-marked
-* highlight.js
-* angular-highlight
-* jQuery
-
-### Section 1
-**Bold** and **italic** ~~strike~~ test
-
-### Tables
-Colons can be used to align columns.
-
-| Tables | Are | Cool |
-| ------------- |:-------------:| -----:|
-| col 3 is | right-aligned | $1600 |
-| col 2 is | centered | $12 |
-| zebra stripes | are neat | $1 |
-
-Markdown | Less | Pretty
---- | --- | ---
-*Still* | `renders` | **nicely**
-1 | 2 | 3
-
-### Code sample
-```javascript
-// javascript code sample
-function log(data) {
- console.log(data);
-}
-```
-
-```html
-
-
+
+## Angular Compatibility
+- version `1.x` for AngularJS 1.x (EOL)
+- version `2.x` for Angular >= 4.x
+ - requires Bootstrap 3.x
+- version `3.x` for Angular >= 14.x
+ - Ivy only
+ - this version works with Bootstrap 4 and 5
+
+### Dependencies
+Here is the list of required dependencies
+- [Bootstrap-Markdown](https://github.com/refactory-id/bootstrap-markdown) (editor) itself
+- [jQuery](http://jquery.com/) _(required for Bootstrap-Markdown editor)_
+- [Bootstrap >=4.x](https://getbootstrap.com/)
+
+### Nice to have Dependency
+It's a "nice to have" extra, but not a hard dependency, which is to include the [ngx-markdown](https://github.com/jfcere/ngx-markdown) library. It is used in the demo of this package, but technically you could plug any other library that you wish for dealing with the markdown preview.
+
+### Demo page
+Standalone demo project, with Angular 14 & Bootstrap 5, that you can clone to easily get started
+- [Bootstrap 5 demo](https://ghiscoding.github.io/angular-markdown-editor) / [examples repo](https://github.com/ghiscoding/angular-markdown-editor-demo)
+
+## Installation
+
+### NPM Package
+[Angular-Markdown-Editor on NPM](https://www.npmjs.com/package/angular-markdown-editor)
+
+Install through `NPM` or `Yarn`
```bash
npm install angular-markdown-editor
+
+# or with Yarn
+yarn add angular-markdown-editor
```
-##### [NuGet](https://www.nuget.org/packages/Angular-Markdown-Editor/)
-_Some of the dependencies were added manually to this package (because they don't all exist on NuGet). For these packages, you could get them through Github and add them manually yourself or just use the one included with this package._
-```bash
-PM> Install-Package Angular-Markdown-Editor
+
+### Modify your `angular.json` config
+You need to add the necessary CSS Styles for Bootstrap, Markdown Editor and Font-Awesome v4.7.
+Also make sure to include the proper 3rd party javascript libraries in your `scripts` as shown below.
+
+```json
+"styles": [
+ "node_modules/bootstrap/dist/css/bootstrap.css",
+ "node_modules/bootstrap-markdown/css/bootstrap-markdown.min.css",
+ "node_modules/font-awesome/css/font-awesome.css"
+],
+"scripts": [
+ "node_modules/jquery/dist/jquery.js",
+ "node_modules/bootstrap-markdown/js/bootstrap-markdown.js"
+],
+```
+
+#### When using `ngx-markdown` and/or `Prism.js`
+`Prism.js` uses separate javascript file for each language, so you'll need to add them yourself.
+For example, we are showing below the highlight of `CSS`, `JavaScript` and `TypeScript` language:
+```json
+"styles": [
+ "node_modules/prismjs/themes/prism.css"
+],
+"scripts": [
+ "node_modules/prismjs/prism.js",
+ "node_modules/prismjs/components/prism-css.min.js",
+ "node_modules/prismjs/components/prism-javascript.min.js",
+ "node_modules/prismjs/components/prism-typescript.min.js"
+],
+```
+
+### Import Module
+```typescript
+import { AngularMarkdownEditorModule } from 'angular-markdown-editor';
+
+@NgModule({
+ declarations: [],
+ imports: [AngularMarkdownEditorModule]
+
+ // or pre-define global configuration using the forRoot
+ // imports: [AngularMarkdownEditorModule.forRoot({ iconlibrary: 'fa' })]
+});
```
-### Include Styles & Scripts
-_NOTE: Unfortunately, the "highlight.js" npm module doesn't seem to have proper bundles, so it's easier for us to get the minified CSS, JS files directly from CDN where they are bundled correctly. As for the highlight styles, if you want to use another style, then you can replace the "...xxx.min.css" by the name you want to use, for example if we want to use "github", we would get "highlight.js/.../github.min.css"_
+### Input attributes
+You can pass the following input attribute:
+
+| attribute | type | required | comments |
+| ------------- | ------------- | -------- | ------- |
+| **textareaId** | string | yes | id of the textarea DOM element used by the lib |
+| **rows** | number | no | number of rows for the textarea, defaults to 10 |
+| **options** | mixed | no | markdown Editor Options to pass to the element |
+| **locale** | EditorLocale | no | locale set that has a language and dictionary that can be added as an alternative language. Can be 1 or more dictionaries |
+
+### Global Options
+The library comes with it's own Global Editor Options, these propertoes can be overriden at any by the `options` attribute. Click to see the [Global Options](https://github.com/ghiscoding/angular-markdown-editor/blob/master/src/lib/angular-markdown-editor/global-editor-options.ts) defined.
+
+### Event Hooks
+You can hook to any of the [Bootstrap Markdown Editor Events](http://www.codingdrama.com/bootstrap-markdown/) through 2 ways, just choose the one you prefer:
+
+#### 1. Dispatch of Custom Event
+Each of the events are available in the View from a Custom Event as `(onX)="doSomething()"`, for example:
```html
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-```
-
-### Inside the HTML
-Simply create a `
+[(ngModel)] - Demo