@daneshnaik/rich-text-editor 1.0.3 → 1.0.4

package/README.md

@@ -111,6 +111,45 @@ export default MyEditorPage;
 
 If you're bundling the library for npm, include the `ExportButton` in your published module exports so consumers can import it directly from the package.
 
+### New: sizing & drag-and-drop support
+
+
+The editor now accepts a few props to allow consuming apps to control the editor canvas size and to support drag-and-drop from the host application.
+
+- `width` (string): set the page width (e.g. `800px` or `100%`).
+- `height` (string): set the minimum page height (e.g. `1123px`).
+- `fullBleed` (boolean, default: `true`): when `true`, removes the side gutters so the page sits edge-to-edge in its container. The editor now defaults to full-bleed so embedding apps receive the editor + toolbar only (no centered page gaps).
+- `onComponentDrop` (function): optional callback called when something is dropped onto the editor. Receives `(info, event)` where `info` contains `{ html, text, files, types }`.
+
+Example usage:
+
+```jsx
+import React from 'react';
+import RichTextEditor from '@daneshnaik/rich-text-editor';
+import ExportButton from '@daneshnaik/rich-text-editor/ExportButton';
+import '@daneshnaik/rich-text-editor/dist/style.css';
+
+function MyEditorPage() {
+  const handleDrop = (info, ev) => {
+    // info.html / info.text / info.files available
+    console.log('dropped', info);
+  };
+
+  return (
+    <div style={{ width: '100%', height: '100vh' }}>
+      <RichTextEditor width="100%" height="900px" fullBleed={true} onComponentDrop={handleDrop} />
+      <ExportButton />
+    </div>
+  );
+}
+
+export default MyEditorPage;
+```
+
+Notes:
+- If the dropped data contains `text/html`, it will be inserted as HTML at the caret location. Plain text is inserted as text. Image files dropped will be read and inserted as data-URL images.
+- The `fullBleed` mode keeps the editor from centering and removes left/right page gutters; you can also pass an exact `width` to control the page size.
+
 ## Requirements
 
 - React 18.0.0 or higher