@lesjoursfr/edith 0.1.0 → 0.1.4

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@lesjoursfr/edith",
-	"version": "0.1.0",
+	"version": "0.1.4",
 	"description": "Simple WYSIWYG editor.",
 	"license": "MIT",
 	"repository": "lesjoursfr/edith",
@@ -12,7 +12,7 @@
 		"access": "public"
 	},
 	"engines": {
-		"node": ">=v18.3.0"
+		"node": ">=16.15.1 || >=18.4.0"
 	},
 	"browserslist": [
 		"Chrome >= 60",
@@ -45,40 +45,40 @@
 		"editor"
 	],
 	"devDependencies": {
-		"@babel/core": "^7.18.5",
-		"@babel/preset-env": "^7.18.2",
-		"@codemirror/lang-html": "^6.0.0",
-		"@fortawesome/fontawesome-free": "^6.1.1",
+		"@babel/core": "^7.18.10",
+		"@babel/preset-env": "^7.18.10",
+		"@codemirror/lang-html": "^6.1.0",
+		"@fortawesome/fontawesome-free": "^6.1.2",
 		"@popperjs/core": "^2.11.5",
-		"ava": "^4.3.0",
+		"ava": "^4.3.1",
 		"babel-loader": "^8.2.5",
-		"codemirror": "^6.0.0",
+		"codemirror": "^6.0.1",
 		"css-loader": "^6.7.1",
-		"eslint": "^8.18.0",
+		"eslint": "^8.21.0",
 		"eslint-config-prettier": "^8.5.0",
 		"eslint-config-standard": "^17.0.0",
 		"eslint-plugin-import": "^2.26.0",
-		"eslint-plugin-n": "^15.2.3",
+		"eslint-plugin-n": "^15.2.4",
 		"eslint-plugin-promise": "^6.0.0",
 		"jsdom": "^20.0.0",
 		"mini-css-extract-plugin": "^2.6.1",
 		"postcss": "^8.4.14",
 		"prettier": "^2.7.1",
-		"sass": "^1.52.3",
-		"sass-loader": "^13.0.0",
+		"sass": "^1.54.0",
+		"sass-loader": "^13.0.2",
 		"style-loader": "^3.3.1",
 		"stylelint": "^14.9.1",
 		"stylelint-config-prettier": "^9.0.3",
 		"stylelint-config-sass-guidelines": "^9.0.1",
-		"webpack": "^5.73.0",
+		"webpack": "^5.74.0",
 		"webpack-cli": "^4.10.0",
-		"webpack-dev-server": "^4.9.2"
+		"webpack-dev-server": "^4.9.3"
 	},
 	"peerDependencies": {
-		"@codemirror/lang-html": "^6.0.0",
-		"@fortawesome/fontawesome-free": "^6.1.1",
+		"@codemirror/lang-html": "^6.1.0",
+		"@fortawesome/fontawesome-free": "^6.1.2",
 		"@popperjs/core": "^2.11.5",
-		"codemirror": "^6.0.0"
+		"codemirror": "^6.0.1"
 	},
-	"packageManager": "yarn@3.2.1"
+	"packageManager": "yarn@3.2.2"
 }

package/readme.md

@@ -1,5 +1,5 @@
 [![npm version](https://badge.fury.io/js/@lesjoursfr%2Fedith.svg)](https://badge.fury.io/js/@lesjoursfr%2Fedith)
-[![Build Status](https://travis-ci.org/lesjoursfr/edith.svg?branch=master)](https://travis-ci.org/lesjoursfr/edith)
+[![QC Checks](https://github.com/lesjoursfr/edith/actions/workflows/quality-control.yml/badge.svg)](https://github.com/lesjoursfr/edith/actions/workflows/quality-control.yml)
 
 # @lesjoursfr/edith
 

package/src/core/range.js

@@ -62,3 +62,13 @@ export function selectNodeContents(target) {
   sel.removeAllRanges();
   sel.addRange(range);
 }
+
+/**
+ * Check if the current selection is inside the given node.
+ * @param {Node} node the targeted node
+ * @returns {boolean} true if the selection is inside
+ */
+export function isSelectionInsideNode(node) {
+  const { range } = getSelection();
+  return node.contains(range.startContainer) && node.contains(range.endContainer);
+}

package/src/ui/button.js

@@ -46,7 +46,10 @@ function EdithButton(ctx, options) {
 }
 
 EdithButton.prototype.click = function (event) {
+  // Prevent default
   event.preventDefault();
+
+  // Check if the onclick attribute is a internal function ID or a custom function
   if (typeof this.onclick === "string") {
     onButtonClick(this.ctx, this.onclick, event);
   } else {

package/src/ui/editor.js

@@ -11,7 +11,7 @@ import {
 import { Events } from "../core/event.js";
 import { History } from "../core/history.js";
 import { EditorModes } from "../core/mode.js";
-import { getSelection, restoreSelection } from "../core/range.js";
+import { getSelection, restoreSelection, isSelectionInsideNode } from "../core/range.js";
 import { throttle } from "../core/throttle.js";
 import { EdithModal, createInputModalField, createCheckboxModalField } from "./modal.js";
 
@@ -58,6 +58,14 @@ EdithEditor.prototype.render = function () {
   return editorWrapper;
 };
 
+EdithEditor.prototype.getVisualEditorElement = function () {
+  return this.editors.visual;
+};
+
+EdithEditor.prototype.getCodeEditorElement = function () {
+  return this.editors.code;
+};
+
 EdithEditor.prototype.setContent = function (content) {
   // Replace   by the string we use as a visual return
   content = content.replace(/&nbsp;/g, '<span class="edith-nbsp" contenteditable="false">¶</span>');
@@ -107,13 +115,17 @@ EdithEditor.prototype.restoreSnapshot = function () {
 };
 
 EdithEditor.prototype.wrapInsideTag = function (tag) {
-  wrapInsideTag(tag);
-  this.takeSnapshot();
+  if (isSelectionInsideNode(this.editors.visual)) {
+    wrapInsideTag(tag);
+    this.takeSnapshot();
+  }
 };
 
 EdithEditor.prototype.replaceByHtml = function (html) {
-  replaceSelectionByHtml(html);
-  this.takeSnapshot();
+  if (isSelectionInsideNode(this.editors.visual)) {
+    replaceSelectionByHtml(html);
+    this.takeSnapshot();
+  }
 };
 
 EdithEditor.prototype.clearStyle = function () {
@@ -291,7 +303,7 @@ EdithEditor.prototype.onPasteEvent = function (e) {
     const lines = e.clipboardData.getData("text/plain").split(/[\r\n]+/g);
 
     // Add the content as text nodes with a <br> node between each line
-    for (let i = 0; i < lines.length - 1; i++) {
+    for (let i = 0; i < lines.length; i++) {
       if (frag.length !== 0) {
         frag.append(document.createElement("br"));
       }