@livingdocs/editable.js 3.0.13 → 3.0.14

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@livingdocs/editable.js",
   "description": "Friendly contenteditable API",
-  "version": "3.0.13",
+  "version": "3.0.14",
   "dependencies": {
     "@babel/runtime": "^7.16.7",
     "bowser": "2.11.0",
@@ -83,11 +83,11 @@
     "isCi": true,
     "name": "Drone",
     "service": "drone",
-    "commit": "4447c61e9237a173cb2513cb00e3d620a7c0e26c",
-    "build": "429",
+    "commit": "7118df530cd823cb0da198a546b99cd16192739a",
+    "build": "440",
     "branch": "master",
     "isPr": false,
     "slug": "livingdocsIO/editable.js",
-    "date": "2022-02-01T12:17:05.512Z"
+    "date": "2022-02-03T20:50:51.262Z"
   }
 }

package/src/config.js

@@ -13,22 +13,26 @@ export default {
   boldMarkup: {
     type: 'tag',
     name: 'strong',
-    attribs: {}
+    attribs: {},
+    trim: true
   },
   italicMarkup: {
     type: 'tag',
     name: 'em',
-    attribs: {}
+    attribs: {},
+    trim: true
   },
   underlineMarkup: {
     type: 'tag',
     name: 'u',
-    attribs: {}
+    attribs: {},
+    trim: false
   },
   linkMarkup: {
     type: 'tag',
     name: 'a',
-    attribs: {}
+    attribs: {},
+    trim: true
   },
 
   // Rules that are applied when filtering pasted content

package/src/selection.js

@@ -87,9 +87,21 @@ export default class Selection extends Cursor {
         link.setAttribute(key, value)
       }
     }
+    if (config.linkMarkup.trim) this.trimRange()
+
     this.forceWrap(link)
   }
 
+  // trims whitespaces on the left and right of a selection, i.e. what you want in case of links
+  trimRange () {
+    const textToLink = this.range.toString()
+    const whitespacesOnTheLeft = textToLink.search(/\S|$/)
+    const lastNonWhitespace = textToLink.search(/\S[\s]+$/)
+    const whitespacesOnTheRight = lastNonWhitespace === -1 ? 0 : textToLink.length - (lastNonWhitespace + 1)
+    this.range.setStart(this.range.startContainer, this.range.startOffset + whitespacesOnTheLeft)
+    this.range.setEnd(this.range.endContainer, this.range.endOffset - whitespacesOnTheRight)
+  }
+
   unlink () {
     this.removeFormatting(config.linkMarkup.name)
   }
@@ -137,43 +149,51 @@ export default class Selection extends Cursor {
     this.setSelection()
   }
 
-  toggleCustom ({tagName, attributes}) {
+  toggleCustom ({tagName, attributes, trim = false}) {
     const customElem = this.createElement(tagName, attributes)
+    if (trim) this.trimRange()
     this.toggle(customElem)
   }
 
-  makeCustom ({tagName, attributes}) {
+  makeCustom ({tagName, attributes, trim = false}) {
     const customElem = this.createElement(tagName, attributes)
+    if (trim) this.trimRange()
     this.forceWrap(customElem)
   }
 
   makeBold () {
     const bold = this.createElement(config.boldMarkup.name, config.boldMarkup.attribs)
+    if (config.boldMarkup.trim) this.trimRange()
     this.forceWrap(bold)
   }
 
   toggleBold () {
     const bold = this.createElement(config.boldMarkup.name, config.boldMarkup.attribs)
+    if (config.boldMarkup.trim) this.trimRange()
     this.toggle(bold)
   }
 
   giveEmphasis () {
     const em = this.createElement(config.italicMarkup.name, config.italicMarkup.attribs)
+    if (config.italicMarkup.trim) this.trimRange()
     this.forceWrap(em)
   }
 
   toggleEmphasis () {
     const em = this.createElement(config.italicMarkup.name, config.italicMarkup.attribs)
+    if (config.italicMarkup.trim) this.trimRange()
     this.toggle(em)
   }
 
   makeUnderline () {
     const u = this.createElement(config.underlineMarkup.name, config.underlineMarkup.attribs)
+    if (config.underlineMarkup.trim) this.trimRange()
     this.forceWrap(u)
   }
 
   toggleUnderline () {
     const u = this.createElement(config.underlineMarkup.name, config.underlineMarkup.attribs)
+    if (config.underlineMarkup.trim) this.trimRange()
     this.toggle(u)
   }