- Squire is a rich text editor primarily built for email apps. It’s designed to be integrated with your own UI framework, and so does not provide its own UI toolbar, widgets or overlays. This is a really simple demo, with the most trivial of UI integrations, to show the raw component in action. Learn more and see the source on GitHub.
+ Squire is a rich text editor primarily built for email apps. It’s designed to be integrated with your own UI framework, and so does not provide its own UI toolbar, widgets or overlays. This is a really simple demo, with the most trivial of UI integrations, to show the raw component in action. Learn more and see the source on GitHub.
Bold
Unbold
@@ -135,6 +135,23 @@
Squire Editor Demo
}
});
+ editor.addEventListener('pasteImage', function(event) {
+ const items = [...event.detail.clipboardData.items];
+ const imageItems = items.filter((item) => /image/.test(item.type));
+
+ if (!imageItems.length) {
+ return false;
+ }
+
+ let reader = new FileReader();
+
+ reader.onload = (loadEvent) => {
+ this.insertImage(loadEvent.target.result);
+ }
+
+ reader.readAsDataURL(imageItems[0].getAsFile());
+ });
+
document.addEventListener( 'click', function ( e ) {
var id = e.target.id,
value;
diff --git a/README.md b/README.md
index 281e3ae0..3530419f 100644
--- a/README.md
+++ b/README.md
@@ -4,7 +4,7 @@ Squire is an HTML5 rich text editor, which provides powerful cross-browser norma
It was designed to handle email composition for the [Fastmail](https://www.fastmail.com) web app. The most important consequence of this (and where Squire differs from most other modern rich text editors) is that it must handle arbitrary HTML, because it may be used to forward or quote emails from third-parties and must be able to preserve their HTML without breaking the formatting. This means that it can't use a more structured (but limited) internal data model (as most other modern HTML editors do) and the HTML remains the source-of-truth. The other consequence is excellent handling of multiple levels of blockquotes.
-Squire is designed to be integrated with your own UI framework, and so does not provide its own UI toolbar, widgets or overlays. Instead, you get a component you can insert in place of a `