{"_id":"@advinsoftwares/ngx-rich-text-editor","_rev":"4-ffbc3c54a0d4774d40a3b96143054e29","name":"@advinsoftwares/ngx-rich-text-editor","dist-tags":{"latest":"0.3.1"},"versions":{"0.1.0":{"name":"@advinsoftwares/ngx-rich-text-editor","version":"0.1.0","keywords":["angular","rich-text-editor","wysiwyg","editor","contenteditable","cuteeditor"],"license":"MIT","_id":"@advinsoftwares/ngx-rich-text-editor@0.1.0","maintainers":[{"name":"advinsoftwares","email":"info@advinsoftwares.com"}],"dist":{"shasum":"f4d46b3077617062ef03d6453c982cf99f9cb0b6","tarball":"https://registry.npmjs.org/@advinsoftwares/ngx-rich-text-editor/-/ngx-rich-text-editor-0.1.0.tgz","fileCount":68,"integrity":"sha512-3cE60urpXGi3jIqomswbcvGc5SSc2ut/LZPqKpIUxmaGHnHmWD8sixNv1PHbXaXOq80+6zmUDD9NPRteVPnL6g==","signatures":[{"sig":"MEYCIQD0j489a1MNj+ysQ5c4zTCAIdfGEi2Rkeo8e4nQIBWu1QIhAIyi409h6do0k8P5eJQvb7wHGDYI7JfTlT7vY6OS5vF/","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1199054},"_from":"file:advinsoftwares-ngx-rich-text-editor-0.1.0.tgz","module":"fesm2022/advinsoftwares-ngx-rich-text-editor.mjs","exports":{".":{"esm":"./esm2022/advinsoftwares-ngx-rich-text-editor.mjs","types":"./index.d.ts","default":"./fesm2022/advinsoftwares-ngx-rich-text-editor.mjs","esm2022":"./esm2022/advinsoftwares-ngx-rich-text-editor.mjs"},"./package.json":{"default":"./package.json"}},"typings":"index.d.ts","_npmUser":{"name":"advinsoftwares","email":"info@advinsoftwares.com"},"_resolved":"C:\\Users\\Sumit Gore\\Downloads\\advinsoftwares-ngx-rich-text-editor-0.1.0.tgz","_integrity":"sha512-3cE60urpXGi3jIqomswbcvGc5SSc2ut/LZPqKpIUxmaGHnHmWD8sixNv1PHbXaXOq80+6zmUDD9NPRteVPnL6g==","_npmVersion":"10.8.2","description":"A from-scratch Angular rich text editor (CuteEditor-style: formatting, tables, image/file manager, templates, HTML source view, find/replace) with zero required backend — pluggable persistence via DI tokens, IndexedDB/localStorage defaults included.","directories":{},"sideEffects":false,"_nodeVersion":"18.20.8","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/core":"^16.2.0","@angular/forms":"^16.2.0","@angular/common":"^16.2.0"},"_npmOperationalInternal":{"tmp":"tmp/ngx-rich-text-editor_0.1.0_1786602673782_0.7845772588350224","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@advinsoftwares/ngx-rich-text-editor","version":"0.2.0","keywords":["angular","rich-text-editor","wysiwyg","editor","contenteditable","cuteeditor"],"license":"MIT","_id":"@advinsoftwares/ngx-rich-text-editor@0.2.0","maintainers":[{"name":"advinsoftwares","email":"info@advinsoftwares.com"}],"dist":{"shasum":"2749e6bf9c580a320b05149b37f8fd0a65efeec9","tarball":"https://registry.npmjs.org/@advinsoftwares/ngx-rich-text-editor/-/ngx-rich-text-editor-0.2.0.tgz","fileCount":68,"integrity":"sha512-4LVk/aCbj6Il0CwtKUbJLVesdW77L/dlK1iXwMVqDhVvrCYMEGFlPvHWYpvtgJVLwHEBbA+RxN3+RQGGVa403w==","signatures":[{"sig":"MEYCIQCEJXNcgnpQW2lGVo1yVT5oUCJPEaPY+gzpd479Dl835QIhAOvgLirf0A8QqJRNOS6775Pt8ErEyDbpeNsvKkUZQ/3A","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1251124},"_from":"file:advinsoftwares-ngx-rich-text-editor-0.2.0.tgz","module":"fesm2022/advinsoftwares-ngx-rich-text-editor.mjs","exports":{".":{"esm":"./esm2022/advinsoftwares-ngx-rich-text-editor.mjs","types":"./index.d.ts","default":"./fesm2022/advinsoftwares-ngx-rich-text-editor.mjs","esm2022":"./esm2022/advinsoftwares-ngx-rich-text-editor.mjs"},"./package.json":{"default":"./package.json"}},"typings":"index.d.ts","_npmUser":{"name":"advinsoftwares","email":"info@advinsoftwares.com"},"_resolved":"C:\\Users\\Sumit Gore\\Downloads\\advinsoftwares-ngx-rich-text-editor-0.2.0.tgz","_integrity":"sha512-4LVk/aCbj6Il0CwtKUbJLVesdW77L/dlK1iXwMVqDhVvrCYMEGFlPvHWYpvtgJVLwHEBbA+RxN3+RQGGVa403w==","_npmVersion":"10.8.2","description":"A from-scratch Angular rich text editor (CuteEditor-style: formatting, tables, image/file manager, templates, HTML source view, find/replace) with zero required backend — pluggable persistence via DI tokens, IndexedDB/localStorage defaults included.","directories":{},"sideEffects":false,"_nodeVersion":"18.20.8","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/core":"^16.2.0","@angular/forms":"^16.2.0","@angular/common":"^16.2.0"},"_npmOperationalInternal":{"tmp":"tmp/ngx-rich-text-editor_0.2.0_1786605439399_0.7195818337372464","host":"s3://npm-registry-packages-npm-production"}},"0.3.0":{"name":"@advinsoftwares/ngx-rich-text-editor","version":"0.3.0","keywords":["angular","rich-text-editor","wysiwyg","editor","contenteditable","cuteeditor"],"license":"MIT","_id":"@advinsoftwares/ngx-rich-text-editor@0.3.0","maintainers":[{"name":"advinsoftwares","email":"info@advinsoftwares.com"}],"dist":{"shasum":"b385a58ce7e731da6255104a0a2ec80db33622d8","tarball":"https://registry.npmjs.org/@advinsoftwares/ngx-rich-text-editor/-/ngx-rich-text-editor-0.3.0.tgz","fileCount":68,"integrity":"sha512-Xn3N1UrRRqYTv5nFMxjemqkEda3QbQb8u4k0509N76KqKzLS6nKl6kFnd+XNyOjdzexkmwrPdQuywxlwDVxVzQ==","signatures":[{"sig":"MEUCIALs/jz4exAybBbdSpev5HgSioWbEkRA1x3P8bhtzQq8AiEAxXRplGDLZ1y0tC3cmHFhadg4745pc8kBRqfEFG4hAiI=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":1322362},"module":"fesm2022/advinsoftwares-ngx-rich-text-editor.mjs","exports":{".":{"esm":"./esm2022/advinsoftwares-ngx-rich-text-editor.mjs","types":"./index.d.ts","default":"./fesm2022/advinsoftwares-ngx-rich-text-editor.mjs","esm2022":"./esm2022/advinsoftwares-ngx-rich-text-editor.mjs"},"./package.json":{"default":"./package.json"}},"gitHead":"568fc99c55618144d5769070bf27d98eba3f8d13","typings":"index.d.ts","_npmUser":{"name":"advinsoftwares","email":"info@advinsoftwares.com"},"_npmVersion":"10.8.2","description":"A from-scratch Angular rich text editor (CuteEditor-style: formatting, tables, image/file manager, templates, HTML source view, find/replace) with zero required backend — pluggable persistence via DI tokens, IndexedDB/localStorage defaults included.","directories":{},"sideEffects":false,"_nodeVersion":"18.20.8","dependencies":{"tslib":"^2.3.0"},"_hasShrinkwrap":false,"peerDependencies":{"rxjs":"^7.8.0","@angular/core":"^16.2.0","@angular/forms":"^16.2.0","@angular/common":"^16.2.0"},"_npmOperationalInternal":{"tmp":"tmp/ngx-rich-text-editor_0.3.0_1786607057556_0.3823421226872543","host":"s3://npm-registry-packages-npm-production"}},"0.3.1":{"name":"@advinsoftwares/ngx-rich-text-editor","version":"0.3.1","description":"A from-scratch Angular rich text editor (CuteEditor-style: formatting, tables, image/file manager, templates, HTML source view, find/replace) with zero required backend — pluggable persistence via DI tokens, IndexedDB/localStorage defaults included.","keywords":["angular","rich-text-editor","wysiwyg","editor","contenteditable","cuteeditor"],"license":"MIT","peerDependencies":{"@angular/common":"^16.2.0","@angular/core":"^16.2.0","@angular/forms":"^16.2.0","rxjs":"^7.8.0"},"dependencies":{"tslib":"^2.3.0"},"sideEffects":false,"module":"fesm2022/advinsoftwares-ngx-rich-text-editor.mjs","typings":"index.d.ts","exports":{"./package.json":{"default":"./package.json"},".":{"types":"./index.d.ts","esm2022":"./esm2022/advinsoftwares-ngx-rich-text-editor.mjs","esm":"./esm2022/advinsoftwares-ngx-rich-text-editor.mjs","default":"./fesm2022/advinsoftwares-ngx-rich-text-editor.mjs"}},"_id":"@advinsoftwares/ngx-rich-text-editor@0.3.1","gitHead":"8ea67dfe4bb0eba0dc1774cc73fc3ba47199ba3f","_nodeVersion":"18.20.8","_npmVersion":"10.8.2","dist":{"integrity":"sha512-xUWp3Bv/QVR8CZYhWEXFl/x1F3RFT4rle1aTpz6Vdv5TQ1sBWXD5+9WWHzCJpYcFzzC32D2ywxxuWjcWpLabsw==","shasum":"2d09f055254020731b1a193c464526303caa077a","tarball":"https://registry.npmjs.org/@advinsoftwares/ngx-rich-text-editor/-/ngx-rich-text-editor-0.3.1.tgz","fileCount":69,"unpackedSize":1345252,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQCguoEb0UV5Ly+qacBUp3RSw7qCsirEI7pksdDHh6PgZAIgOZ85zyu4bMucKn7wgXwC3+XJ7kBldLyAo/xwoPJRBg0="}]},"_npmUser":{"name":"advinsoftwares","email":"info@advinsoftwares.com"},"directories":{},"maintainers":[{"name":"advinsoftwares","email":"info@advinsoftwares.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/ngx-rich-text-editor_0.3.1_1786707663202_0.9229030327745913"},"_hasShrinkwrap":false}},"time":{"created":"2026-08-13T06:31:13.517Z","modified":"2026-08-14T11:41:03.513Z","0.1.0":"2026-08-13T06:31:13.937Z","0.2.0":"2026-08-13T07:17:19.561Z","0.3.0":"2026-08-13T07:44:17.735Z","0.3.1":"2026-08-14T11:41:03.361Z"},"license":"MIT","keywords":["angular","rich-text-editor","wysiwyg","editor","contenteditable","cuteeditor"],"description":"A from-scratch Angular rich text editor (CuteEditor-style: formatting, tables, image/file manager, templates, HTML source view, find/replace) with zero required backend — pluggable persistence via DI tokens, IndexedDB/localStorage defaults included.","maintainers":[{"name":"advinsoftwares","email":"info@advinsoftwares.com"}],"readme":"# @advinsoftwares/ngx-rich-text-editor\n\nA from-scratch Angular rich text editor built to cover the same ground as\nCuteEditor (CuteSoft RTE) — formatting toolbar, tables, an image/file\nmanager, reusable templates, an HTML source view, and find/replace —\nwithout a commercial license or any required backend. The editing\nsurface, toolbar, dialogs, undo history, and table logic are all\nhand-built on top of the browser's own `contenteditable`/Selection APIs;\nthis is not a wrapper around TinyMCE/CKEditor/CuteEditor.\n\nCompatible with Angular 16.2+ (peer dependencies on `@angular/core`,\n`@angular/common`, `@angular/forms`, and `rxjs`).\n\n> **This README is the quick start.** For the full API reference —\n> every input/output, the `ToolbarConfig` flags, exactly how content\n> flows in and out, the pluggable persistence services and their\n> contracts, wiring a real backend, and multi-tenant/scalability notes —\n> see **[GUIDE.md](./GUIDE.md)**.\n\n## Install\n\n```bash\nnpm install @advinsoftwares/ngx-rich-text-editor\n```\n\n## Usage\n\n```ts\nimport { RichTextEditorModule } from '@advinsoftwares/ngx-rich-text-editor';\n\n@NgModule({\n  imports: [RichTextEditorModule /* , ... */],\n})\nexport class YourFeatureModule {}\n```\n\n```html\n<!-- Reactive forms -->\n<rte-editor formControlName=\"bodyHtml\"></rte-editor>\n\n<!-- Template-driven -->\n<rte-editor [(ngModel)]=\"bodyHtml\"></rte-editor>\n```\n\n`<rte-editor>` implements Angular's `ControlValueAccessor`, so\n`formControlName`, `[(ngModel)]`, validators, `disabled` state, and\n`markAsTouched()` all work exactly like they would on an `<input>`. The\nvalue is a plain HTML string.\n\nTrim the toolbar per use case without a second component:\n\n```html\n<rte-editor\n  formControlName=\"comment\"\n  [toolbarConfig]=\"{ table: false, image: false, templates: false, fullscreen: false }\"\n  [minHeightPx]=\"120\"\n></rte-editor>\n```\n\nSee the exported `ToolbarConfig` model for every flag.\n\n## What's included\n\nFormatting (bold/italic/underline/strikethrough, font family/size,\nheadings, alignment, lists, blockquote, colors), links, tables (insert +\nrow/column add/delete + per-cell/per-table background color), an image\nmanager (upload, gallery, insert, with an optional built-in\ndownscale/WebP optimizer), a file attachment manager (upload any file\ntype, insert as a clickable chip), a reusable template manager, an HTML\nsource view, find & replace, undo/redo, an in-editor help guide, a\nfullscreen mode, and paste cleanup that preserves pasted visual\nformatting (including class-based CSS from Word/Excel/web sources).\n\nPersistence for images, attachments, and templates is 100% pluggable via\nAngular DI tokens (`IMAGE_ASSET_SERVICE`, `FILE_ATTACHMENT_SERVICE`,\n`TEMPLATE_SERVICE`, all exported from this package), and ships with\nzero-config local defaults so it works standalone with no server:\nimages/attachments in IndexedDB, templates in `localStorage`. Override\nany of the three tokens in your own module to point at a real backend\n(a suggested .NET Core Web API + SQL Server + Dapper contract, matching\nthis package's default service interfaces, is documented in the source\nrepository's `BACKEND-INTEGRATION.md`).\n\n## Pasting images directly (screenshots, clipboard images)\n\nCopying a screenshot and pasting it straight into the editor (Ctrl+V,\nnot the toolbar's Insert Image button) embeds it as a base64 `data:`\nURI right inside the saved HTML, rather than going through\n`IImageAssetService`. That's a deliberate choice: a directly-pasted\nimage has no natural \"file\" to upload and no dialog to go through, so\nembedding it makes the pasted image travel with the document to any\ndevice or user with zero backend and zero local browser storage\ninvolved — nothing to look up, nothing that can go missing.\n\nThe tradeoff is size: base64 inflates the image by roughly a third, and\nbecause it's part of the document's own HTML, it's included in every\nundo snapshot too (see `EditorHistoryService`'s note on\n`historyLimit` for what that costs at scale). For a document with a\nhandful of pasted screenshots this is a non-issue; for one with dozens\nof large, high-resolution pastes, consider trimming `[historyLimit]`\nlower, or asking users to use the Image Manager's Upload button instead\n(which always uses a lightweight URL reference, never inlines bytes).\n\nImages inserted via the toolbar's **Insert Image** button are\nunaffected by this — those always go through `IImageAssetService` and\nuse a real, lightweight reference (an IndexedDB-backed object URL by\ndefault, or a permanent server URL if you've wired up\n`HttpImageAssetService` below), never base64.\n\n## Resizing images\n\nClick any image in the surface — pasted-as-base64 or inserted via the\ntoolbar, both are handled identically — to select it; four small square\nhandles appear on its corners. Dragging a handle resizes the image with\nits aspect ratio locked (undistorted resize, the same default most\ndocument editors use for images; free distortion isn't offered since\nit's rarely what's actually wanted). The resize is clamped to the\nimage's own containing element (its parent — a table cell, if that's\nwhere it lives — not just the overall editor), and to a 24px floor so it\ncan never be dragged down to invisible.\n\nThe new size is written directly onto the `<img>` as an inline\n`style=\"width:…px;height:…px\"` (replacing any `width`/`height`\nattributes the toolbar's Image Manager may have set at insert time, so\nthe element never carries two conflicting size hints), which means it's\na completely normal part of the saved HTML — it survives reload,\ntravels with the document to any device, and participates in undo/redo\nexactly like a formatting change or a paste does. Clicking anywhere\nelse deselects the image and hides the handles; the handles themselves\nare never part of the saved content (they're built and positioned as a\nplain DOM overlay outside the contenteditable tree, not inserted into\nit), so there's nothing to strip out before saving.\n\nDisabled entirely when `[readOnly]`/`disabled` — a read-only document\nshouldn't let its images be dragged around.\n\n## Wiring uploads to a real endpoint (`HttpImageAssetService` / `HttpFileAttachmentService`)\n\nThe toolbar's Insert Image and Insert Attachment dialogs both call\n`upload(file)` on whatever service is provided for\n`IMAGE_ASSET_SERVICE` / `FILE_ATTACHMENT_SERVICE`. Alongside the\nzero-config IndexedDB defaults, this package also exports\n`HttpImageAssetService` and `HttpFileAttachmentService` — ready-made\nimplementations that `POST` the file to a configurable endpoint and use\nwhatever URL the server hands back directly as the `<img src>` /\nattachment `href`. This is the same \"upload once, get back a permanent\nURL\" pattern used by CuteEditor and most real-world document/image\nupload APIs — no base64, no local browser storage, and it works across\nevery device and user because the file genuinely lives on a server.\n\n```ts\nimport { HttpClientModule } from '@angular/common/http';\nimport {\n  RichTextEditorModule,\n  IMAGE_ASSET_SERVICE,\n  HttpImageAssetService,\n  RTE_IMAGE_UPLOAD_ENDPOINT,\n  FILE_ATTACHMENT_SERVICE,\n  HttpFileAttachmentService,\n  RTE_FILE_UPLOAD_ENDPOINT,\n} from '@advinsoftwares/ngx-rich-text-editor';\n\n@NgModule({\n  imports: [HttpClientModule, RichTextEditorModule /* , ... */],\n  providers: [\n    { provide: IMAGE_ASSET_SERVICE, useClass: HttpImageAssetService },\n    { provide: RTE_IMAGE_UPLOAD_ENDPOINT, useValue: 'https://api.example.com/api/editor/images' },\n    { provide: FILE_ATTACHMENT_SERVICE, useClass: HttpFileAttachmentService },\n    { provide: RTE_FILE_UPLOAD_ENDPOINT, useValue: 'https://api.example.com/api/editor/attachments' },\n  ],\n})\nexport class YourFeatureModule {}\n```\n\nEach endpoint is expected to behave like `BACKEND-INTEGRATION.md`'s\nsuggested API surface: `POST <endpoint>` with the file as\nmultipart/form-data returns the asset's JSON (id, fileName, `url`,\nsizeBytes, contentType, createdAtUtc); `GET <endpoint>` lists existing\nassets the same shape; `DELETE <endpoint>/{id}` removes one. You must\nimport `HttpClientModule` (or call `provideHttpClient()`) somewhere in\nyour app yourself — this library doesn't import it for you, to avoid\nthe well-known pitfall of registering `HttpClientModule`'s providers\nmore than once across a module tree.\n\n## License\n\nMIT\n","readmeFilename":"README.md"}