@seyamali/aurelia-editor 0.1.2 → 0.1.4

package/README.md

@@ -4,7 +4,7 @@
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg?style=flat-square)](https://opensource.org/licenses/MIT)
 [![TypeScript](https://img.shields.io/badge/Written%20With-TypeScript-3178C6?style=flat-square&logo=typescript)](https://www.typescriptlang.org/)
 
-**Aurelia Editor** is a powerful, customizable, and framework-agnostic rich text editor built on top of [Lexical](https://lexical.dev/). It is designed for modern content creation, offering a clean, "Notion-style" interface combined with enterprise-grade features like MS Word compatibility, PDF export, and advanced layout tools.
+**Aurelia Editor** is a powerful, customizable, and framework-agnostic rich text editor built on top of [Lexical](https://lexical.dev/). It is designed for modern content creation, offering a clean, "Notion-style" interface combined with enterprise-grade features like High-Fidelity Design Preservation, MS Word compatibility, and advanced layout tools.
 
 ![Editor Preview](https://via.placeholder.com/800x400?text=Aurelia+Editor+Preview)
 
@@ -14,53 +14,36 @@
  
 **Aurelia Editor** delivers a premium writing experience with a "batteries-included" philosophy:
  
+### 🎯 High-Fidelity Design (Same-to-Same)
+*   **Design Preservation**: Paste complex HTML layouts from tools or websites and preserve them 100%—including styles, meta tags, and scripts.
+*   **Clean Export**: Strips Lexical-specific internal attributes and pollution, ensuring production-ready HTML.
+*   **CSS Sandboxing**: Prefixes and scopes custom CSS to the editor container, preventing global style leaks.
+
 ### 📝 Core Editing
 *   **Rich Text**: Bold, Italic, Underline, Strikethrough, Subscript, Superscript, Inline Code.
 *   **Typography**: Hierarchical headings (H1-H6), Blockquotes, Dividers.
 *   **Fonts & Color**: Custom font families, text colors, and background highlights.
 *   **Lists**: Nested bullet and numbered lists with indentation controls.
 *   **Case Converter**: Toggle text between Uppercase, Lowercase, and Title Case.
-*   **Clear Formatting**: Instantly strip styles from copied text.
  
 ### 🖼️ Media & Embeds
 *   **Smart Images**: Drag & drop upload, resize, alignment positioning, captions, and link support.
 *   **Video Embedding**: YouTube integration with preview.
 *   **HTML Snippets**: Insert raw HTML for custom widgets or layouts.
-*   **Files**: Support for generic file attachments (extensible).
  
 ### 📊 Structured Content
 *   **Advanced Tables**: Header rows, cell merging, splitting, column resizing, and row/column management.
 *   **Code Blocks**: Syntax highlighting for multiple languages with copy support.
 *   **Table of Contents**: Auto-generated TOC based on document headings with scroll-spy.
 *   **Footnotes**: Academic-style referencing and footnotes.
-*   **Page Layout**: Page breaks and print-ready styles.
  
 ### 🚀 Productivity Tools
 *   **Slash Commands**: Type `/` to access a unified menu for all tools.
 *   **Format Painter**: Copy and paste styles between text blocks.
 *   **Find & Replace**: Search with match highlighting and bulk replacement.
 *   **Autosave**: Automatic local backup to prevent data loss.
-*   **Mentions & Tags**: Support for `@user` mentions or custom tags (configurable).
 *   **Placeholders / Merge Fields**: Insert dynamic variables like `{{FirstName}}`.
-*   **Emoji Picker**: Built-in library for expressive writing.
- 
-### 👀 View & Analysis
-*   **Document Outline**: Sidebar navigation for long documents.
-*   **Minimap**: VS Code-style minimap for quick scrolling.
-*   **Zen Mode**: Distraction-free full-screen writing.
-*   **Source View**: Edit the underlying HTML directly.
-*   **Word Count**: Real-time statistics.
  
-### 🔄 Collaboration & History
-*   **Track Changes**: Suggestion mode (Accept/Reject changes).
-*   **Revision History**: visual history of edits (if backend connected).
-*   **Comments**: Threaded comments support (framework ready).
- 
-### 📤 Import / Export
-*   **PDF Export**: High-fidelity client-side PDF generation.
-*   **Word Support**: Import `.docx` files and export content to Word.
-*   **Markdown**: Full Markdown shortcut support (`##`, `*`, `>`).
-
 ---
 
 ## 📦 Installation
@@ -75,36 +58,35 @@ npm install @seyamali/aurelia-editor
 
 ## 🛠️ Usage
 
-### Basic Setup
-Initialize the editor by mounting it to a DOM element:
+### Basic Setup (Recommended)
+Initialize the full-featured editor (including toolbar and layout) with a single command:
 
 ```typescript
 import { AureliaEditor } from '@seyamali/aurelia-editor';
-import '@seyamali/aurelia-editor/dist/style.css';
+import '@seyamali/aurelia-editor/dist/aurelia-editor.css';
 
-const editor = new AureliaEditor({
-  element: document.getElementById('editor-root'),
-  theme: 'default',
-  placeholder: 'Start writing...'
-});
+// 1. Get container
+const container = document.getElementById('editor-root');
 
-editor.render();
+// 2. Initialize (Static factory method)
+const editor = await AureliaEditor.create(container);
 ```
 
-### Retrieval & Events
-Listen to changes or get the content:
+### Retrieval & Fidelity (Framework Integration)
+To interact with the editor in React, Angular, or Vue, use these high-fidelity helper methods:
 
 ```typescript
-// Get HTML content
-const html = editor.getHTML();
+// --- GET CONTENT ---
+// Returns clean, production-ready, high-fidelity HTML
+const html = await editor.getHtml();
 
-// Get JSON State
-const jsonState = editor.getEditorState();
+// --- SET CONTENT ---
+// Sets high-fidelity HTML and injects associated styles/metadata
+await editor.setHtml(initialHtml);
 
-// Listen for updates
-editor.on('update', (content) => {
-  console.log('Document updated:', content);
-});
+// --- GET STATE ---
+// Get the internal Lexical JSON state
+const jsonState = editor.getInternalEditor().getEditorState().toJSON();
 ```
 
 ---
@@ -114,13 +96,13 @@ editor.on('update', (content) => {
 Aurelia Editor features a dynamic toolbar system. You can switch between built-in presets or define your own configuration.
 
 ### Toolbar Presets
-Available presets: `standard`, `minimal`, `blogging`, `full`.
+Available presets: `standard`, `minimal`, `blogging`, `documentation`, `full`.
 
 ```typescript
 import { ToolbarConfigManager } from '@seyamali/aurelia-editor';
 
-// Switch to a minimal, distraction-free interface
-ToolbarConfigManager.applyPreset('minimal');
+// Switch to a documentation-focused interface
+ToolbarConfigManager.applyPreset('documentation');
 ```
 
 ---

package/dist/aurelia-editor.js

@@ -1,4 +1,4 @@
-import { A as r, E as T, T as s } from "./index-CGFUKES8.js";
+import { A as r, E as T, T as s } from "./index-C42uz2Y9.js";
 export {
   r as AureliaEditor,
   T as EDITOR_LAYOUT_HTML,