react-marky-markdown - npm Package Compare versions

Comparing version 0.1.0 to 0.2.0

dist/index.d.ts

 import * as React_$1 from "react";
 import * as React_$2 from "react";
-interface EditorProps {
+declare type TextAreaProps = Omit<React_$1.HTMLProps<HTMLTextAreaElement>, 'onChange'>;
+interface EditorProps extends TextAreaProps {
     defaultValue?: string;
@@ -5,0 +6,0 @@ onChange?(value: string): void;

dist/react-marky-markdown.cjs.development.js

@@ -27,2 +27,17 @@ 'use strict';
 
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+
+  return target;
+}
+
 var defaultState = {
@@ -248,3 +263,5 @@ x: 0,
       onCancel = _ref.onCancel,
-      children = _ref.children;
+      children = _ref.children,
+      rest = _objectWithoutPropertiesLoose(_ref, ["defaultValue", "onChange", "onSubmit", "onBlur", "onCancel", "children"]);
+
   var containerRef = React.useRef(null);
@@ -255,3 +272,5 @@ var editorRef = React.useRef(null);
     return _extends({}, initial, {
-      value: defaultValue || ''
+      editor: _extends({}, initial.editor, {
+        value: defaultValue || ''
+      })
     });
@@ -338,13 +357,5 @@ }),
 
-      var handleBlur = function handleBlur() {
-        if (onBlur) {
-          onBlur();
-        }
-      };
-
       editor.addEventListener('keydown', handleKeyEvent, false);
-      editor.addEventListener('blur', handleBlur, false);
       return function () {
         editor.removeEventListener('keydown', handleKeyEvent, false);
-        editor.removeEventListener('blur', handleBlur, false);
       };
@@ -381,3 +392,3 @@ }
     className: "rmm-container"
-  }, React.createElement(TextareaAutosize, {
+  }, React.createElement(TextareaAutosize, Object.assign({}, rest, {
     ref: editorRef,
@@ -388,3 +399,3 @@ className: "rmm-editor",
     value: state.editor.value
-  }), children));
+  })), children));
 };
@@ -391,0 +402,0 @@

dist/react-marky-markdown.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var t=require("react"),r=e(require("react-autosize-textarea")),n=e(require("resize-observer-polyfill"));function a(){return(a=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}var o={x:0,y:0,width:0,height:0,top:0,right:0,bottom:0,left:0};function i(e,t){for(var r=0,n=e.split(/\n/g),a=0;a<n.length;a++){var o=n[a];if((r+=o.length)>=t)return o;r+=1}return""}function u(e,t,r){var n=e.selectionStart!==e.selectionEnd,a=e.value,o=e.selectionStart,i=e.selectionEnd,u=a.substr(0,o);if(t){var l=a.substr(o,a.length);o=(u+t).length,i+=t.length,e.value=a=u+t+l}if(r){var c=a.substr(i,a.length);i=((u=a.substr(0,i))+r).length,e.value=a=u+r+c}(t||r)&&(n?e.setSelectionRange(o-(t||"").length,i+(r||"").length):e.setSelectionRange(o,o));var s=function(e,t){for(var r=0,n=e.replace(/\n/g," ").split(" "),a=0;a<n.length;a++){var o=n[a];if((r+=o.length)>=t)return o.replace(/\r?\n|\r/g,"").trim();r+=1}return""}(a,o);return{value:a,currentWord:s,valueUpToStart:u}}function l(e,t){switch(t.type){case"EditorData":return a({},e,{editor:a({},u(t.payload))});case"EditorSize":return a({},e,{},t.payload);case"AddTab":return a({},e,{editor:a({},u(t.payload,"  "))});case"AddListItem":var r="\n- ";if("ol"===t.payload.type){var n=i(t.payload.el.value,t.payload.el.selectionStart),o=parseFloat(n.substr(0,3));r=1===o?"\n1. ":"\n"+(o+1)+". "}return a({},e,{editor:a({},u(t.payload.el,r))});case"Bold":return a({},e,{editor:a({},u(t.payload,"**","**"))});case"Italic":return a({},e,{editor:a({},u(t.payload,"_","_"))});default:return e}}var c={editor:{currentWord:"",value:"",valueUpToStart:""},width:0,height:0},s=t.createContext(void 0);exports.Editor=function(e){var u,d,f=e.defaultValue,v=e.onChange,p=e.onSubmit,y=e.onBlur,h=e.onCancel,m=e.children,g=t.useRef(null),E=t.useRef(null),b=t.useReducer(l,c,(function(e){return a({},e,{value:f||""})})),w=b[0],S=b[1],L=function(e,r){void 0===r&&(r=!1);var a=t.useState(o),i=a[0],u=a[1],l=t.useState((function(){return new n((function(e){return u(e[0].contentRect)}))}))[0];return t.useEffect((function(){if(e.current&&!r)return l.observe(e.current),function(){return l.disconnect()}}),[e,l,r]),i}(E),k=L.width,x=L.height;return t.useEffect((function(){var e=Array.isArray(u)?u:[u],t=function(t){e.reduce((function(e,r){return(!r.current||!r.current.contains(t.target))&&e}),!0)&&d(t)};return document.addEventListener("mousedown",t),document.addEventListener("touchstart",t),function(){document.removeEventListener("mousedown",t),document.removeEventListener("touchstart",t)}}),[u=g,d=function(){y&&y()}]),t.useEffect((function(){S({type:"EditorSize",payload:{width:k,height:x}})}),[k,x]),t.useEffect((function(){var e=E.current;if(e){var t=function(t){var r=function(e){var t=/(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);return t&&e.metaKey||!t&&e.ctrlKey}(t);if(r&&"Enter"===t.key&&p&&p(),"Escape"===t.key&&h&&h(),"Enter"===t.key){var n=i(e.value,e.selectionStart),a="- "===n.substr(0,2),o=new RegExp(/^[0-9]. /).test(n);(a||o)&&(S({type:"AddListItem",payload:{el:e,type:a?"ul":"ol"}}),t.preventDefault())}"Tab"===t.key&&(t.preventDefault(),S({type:"AddTab",payload:e})),r&&"b"===t.key&&S({type:"Bold",payload:e}),r&&"i"===t.key&&S({type:"Italic",payload:e})},r=function(){y&&y()};return e.addEventListener("keydown",t,!1),e.addEventListener("blur",r,!1),function(){e.removeEventListener("keydown",t,!1),e.removeEventListener("blur",r,!1)}}}),[p,h,y]),t.createElement(s.Provider,{value:{state:w,dispatch:S,editorRef:E}},t.createElement("div",{ref:g,className:"rmm-container"},t.createElement(r,{ref:E,className:"rmm-editor",wrap:"hard",onChange:function(e){var t=e.target.value,r=E.current;r&&(S({type:"EditorData",payload:r}),v&&v(t))},value:w.editor.value}),m))},exports.EditorContet=s,exports.Mention=function(e){var r=e.prefix,n=e.data,a=e.onSearch,o=function(){var e=t.useContext(s);if(!e)throw new Error("Component has to be wrapped inside <Editor />");return e}(),i=o.state,u=o.dispatch,l=o.editorRef,c=i.editor,d=c.currentWord,f=c.valueUpToStart,v=c.value,p=i.width,y=d[0]===r,h=t.useState([0,0]),m=h[0],g=m[0],E=m[1],b=h[1],w=t.useState(0),S=w[0],L=w[1],k=d.replace(r,""),x=n.filter((function(e){return(""+e.value+e.label).includes(k)}));return t.useEffect((function(){y&&a&&a(k)}),[y,k,a]),t.useEffect((function(){if(y&&l.current){var e=document.createElement("div"),t=f.split(/\n\r?/g),r=document.createElement("span");return e.classList.add("rmm-editor"),e.style.cssText="max-width: "+p+"px; position: absolute; opacity: 0; color: transparent; pointer-events: none; white-space: pre-wrap;",r.innerHTML="&nbsp;",r.style.position="absolute",e.innerHTML=t.join("<br />"),e.append(r),document.body.appendChild(e),b([r.offsetLeft,r.offsetTop+r.clientHeight+2]),function(){return document.body.removeChild(e)}}}),[y,p,l,f]),t.useEffect((function(){var e=l.current;if(y){S>x.length&&L(0);var t=function(e){if("Enter"===e.key){var t=x[S]||x[0];if(!t)return;var n=e.target,a=v.slice(0,n.selectionStart-d.length)+""+r+t.value+" ",o=a+v.slice(n.selectionStart,v.length),i=a.length,l=a.length;n.value=o,n.setSelectionRange(i,l),e.stopPropagation(),e.preventDefault(),u({type:"EditorData",payload:n}),L(0)}"ArrowUp"===e.key&&(L((function(e){return Math.abs((e-1)%x.length)})),e.preventDefault()),"ArrowDown"===e.key&&(L((function(e){return Math.abs((e+1)%x.length)})),e.preventDefault())};if(e)return e.addEventListener("keydown",t,!1),function(){e.removeEventListener("keydown",t,!1)}}}),[y,d,v,r,x,S,u,l]),y?t.createElement("div",{className:"rmm-list",style:{transform:"translate("+g+"px, "+E+"px)"}},x.map((function(e,r){return t.createElement("div",{key:e.value,className:"rmm-list-item "+(r===S&&"rmm-list-item-selected")},t.createElement("b",null,e.value)," ",e.label)}))):null};
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var t=require("react"),r=e(require("react-autosize-textarea")),n=e(require("resize-observer-polyfill"));function a(){return(a=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}var o={x:0,y:0,width:0,height:0,top:0,right:0,bottom:0,left:0};function i(e,t){for(var r=0,n=e.split(/\n/g),a=0;a<n.length;a++){var o=n[a];if((r+=o.length)>=t)return o;r+=1}return""}function u(e,t,r){var n=e.selectionStart!==e.selectionEnd,a=e.value,o=e.selectionStart,i=e.selectionEnd,u=a.substr(0,o);if(t){var l=a.substr(o,a.length);o=(u+t).length,i+=t.length,e.value=a=u+t+l}if(r){var c=a.substr(i,a.length);i=((u=a.substr(0,i))+r).length,e.value=a=u+r+c}(t||r)&&(n?e.setSelectionRange(o-(t||"").length,i+(r||"").length):e.setSelectionRange(o,o));var s=function(e,t){for(var r=0,n=e.replace(/\n/g," ").split(" "),a=0;a<n.length;a++){var o=n[a];if((r+=o.length)>=t)return o.replace(/\r?\n|\r/g,"").trim();r+=1}return""}(a,o);return{value:a,currentWord:s,valueUpToStart:u}}function l(e,t){switch(t.type){case"EditorData":return a({},e,{editor:a({},u(t.payload))});case"EditorSize":return a({},e,{},t.payload);case"AddTab":return a({},e,{editor:a({},u(t.payload,"  "))});case"AddListItem":var r="\n- ";if("ol"===t.payload.type){var n=i(t.payload.el.value,t.payload.el.selectionStart),o=parseFloat(n.substr(0,3));r=1===o?"\n1. ":"\n"+(o+1)+". "}return a({},e,{editor:a({},u(t.payload.el,r))});case"Bold":return a({},e,{editor:a({},u(t.payload,"**","**"))});case"Italic":return a({},e,{editor:a({},u(t.payload,"_","_"))});default:return e}}var c={editor:{currentWord:"",value:"",valueUpToStart:""},width:0,height:0},s=t.createContext(void 0);exports.Editor=function(e){var u,d,f=e.defaultValue,p=e.onChange,v=e.onSubmit,h=e.onBlur,y=e.onCancel,m=e.children,g=function(e,t){if(null==e)return{};var r,n,a={},o=Object.keys(e);for(n=0;n<o.length;n++)t.indexOf(r=o[n])>=0||(a[r]=e[r]);return a}(e,["defaultValue","onChange","onSubmit","onBlur","onCancel","children"]),E=t.useRef(null),b=t.useRef(null),w=t.useReducer(l,c,(function(e){return a({},e,{editor:a({},e.editor,{value:f||""})})})),S=w[0],k=w[1],x=function(e,r){void 0===r&&(r=!1);var a=t.useState(o),i=a[0],u=a[1],l=t.useState((function(){return new n((function(e){return u(e[0].contentRect)}))}))[0];return t.useEffect((function(){if(e.current&&!r)return l.observe(e.current),function(){return l.disconnect()}}),[e,l,r]),i}(b),L=x.width,C=x.height;return t.useEffect((function(){var e=Array.isArray(u)?u:[u],t=function(t){e.reduce((function(e,r){return(!r.current||!r.current.contains(t.target))&&e}),!0)&&d(t)};return document.addEventListener("mousedown",t),document.addEventListener("touchstart",t),function(){document.removeEventListener("mousedown",t),document.removeEventListener("touchstart",t)}}),[u=E,d=function(){h&&h()}]),t.useEffect((function(){k({type:"EditorSize",payload:{width:L,height:C}})}),[L,C]),t.useEffect((function(){var e=b.current;if(e){var t=function(t){var r=function(e){var t=/(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);return t&&e.metaKey||!t&&e.ctrlKey}(t);if(r&&"Enter"===t.key&&v&&v(),"Escape"===t.key&&y&&y(),"Enter"===t.key){var n=i(e.value,e.selectionStart),a="- "===n.substr(0,2),o=new RegExp(/^[0-9]. /).test(n);(a||o)&&(k({type:"AddListItem",payload:{el:e,type:a?"ul":"ol"}}),t.preventDefault())}"Tab"===t.key&&(t.preventDefault(),k({type:"AddTab",payload:e})),r&&"b"===t.key&&k({type:"Bold",payload:e}),r&&"i"===t.key&&k({type:"Italic",payload:e})};return e.addEventListener("keydown",t,!1),function(){e.removeEventListener("keydown",t,!1)}}}),[v,y,h]),t.createElement(s.Provider,{value:{state:S,dispatch:k,editorRef:b}},t.createElement("div",{ref:E,className:"rmm-container"},t.createElement(r,Object.assign({},g,{ref:b,className:"rmm-editor",wrap:"hard",onChange:function(e){var t=e.target.value,r=b.current;r&&(k({type:"EditorData",payload:r}),p&&p(t))},value:S.editor.value})),m))},exports.EditorContet=s,exports.Mention=function(e){var r=e.prefix,n=e.data,a=e.onSearch,o=function(){var e=t.useContext(s);if(!e)throw new Error("Component has to be wrapped inside <Editor />");return e}(),i=o.state,u=o.dispatch,l=o.editorRef,c=i.editor,d=c.currentWord,f=c.valueUpToStart,p=c.value,v=i.width,h=d[0]===r,y=t.useState([0,0]),m=y[0],g=m[0],E=m[1],b=y[1],w=t.useState(0),S=w[0],k=w[1],x=d.replace(r,""),L=n.filter((function(e){return(""+e.value+e.label).includes(x)}));return t.useEffect((function(){h&&a&&a(x)}),[h,x,a]),t.useEffect((function(){if(h&&l.current){var e=document.createElement("div"),t=f.split(/\n\r?/g),r=document.createElement("span");return e.classList.add("rmm-editor"),e.style.cssText="max-width: "+v+"px; position: absolute; opacity: 0; color: transparent; pointer-events: none; white-space: pre-wrap;",r.innerHTML="&nbsp;",r.style.position="absolute",e.innerHTML=t.join("<br />"),e.append(r),document.body.appendChild(e),b([r.offsetLeft,r.offsetTop+r.clientHeight+2]),function(){return document.body.removeChild(e)}}}),[h,v,l,f]),t.useEffect((function(){var e=l.current;if(h){S>L.length&&k(0);var t=function(e){if("Enter"===e.key){var t=L[S]||L[0];if(!t)return;var n=e.target,a=p.slice(0,n.selectionStart-d.length)+""+r+t.value+" ",o=a+p.slice(n.selectionStart,p.length),i=a.length,l=a.length;n.value=o,n.setSelectionRange(i,l),e.stopPropagation(),e.preventDefault(),u({type:"EditorData",payload:n}),k(0)}"ArrowUp"===e.key&&(k((function(e){return Math.abs((e-1)%L.length)})),e.preventDefault()),"ArrowDown"===e.key&&(k((function(e){return Math.abs((e+1)%L.length)})),e.preventDefault())};if(e)return e.addEventListener("keydown",t,!1),function(){e.removeEventListener("keydown",t,!1)}}}),[h,d,p,r,L,S,u,l]),h?t.createElement("div",{className:"rmm-list",style:{transform:"translate("+g+"px, "+E+"px)"}},L.map((function(e,r){return t.createElement("div",{key:e.value,className:"rmm-list-item "+(r===S&&"rmm-list-item-selected")},t.createElement("b",null,e.value)," ",e.label)}))):null};
 //# sourceMappingURL=react-marky-markdown.cjs.production.min.js.map

dist/react-marky-markdown.esm.js

@@ -23,2 +23,17 @@ import { useState, useEffect, createContext, useRef, useReducer, createElement, useContext } from 'react';
 
+function _objectWithoutPropertiesLoose(source, excluded) {
+  if (source == null) return {};
+  var target = {};
+  var sourceKeys = Object.keys(source);
+  var key, i;
+
+  for (i = 0; i < sourceKeys.length; i++) {
+    key = sourceKeys[i];
+    if (excluded.indexOf(key) >= 0) continue;
+    target[key] = source[key];
+  }
+
+  return target;
+}
+
 var defaultState = {
@@ -244,3 +259,5 @@ x: 0,
       onCancel = _ref.onCancel,
-      children = _ref.children;
+      children = _ref.children,
+      rest = _objectWithoutPropertiesLoose(_ref, ["defaultValue", "onChange", "onSubmit", "onBlur", "onCancel", "children"]);
+
   var containerRef = useRef(null);
@@ -251,3 +268,5 @@ var editorRef = useRef(null);
     return _extends({}, initial, {
-      value: defaultValue || ''
+      editor: _extends({}, initial.editor, {
+        value: defaultValue || ''
+      })
     });
@@ -334,13 +353,5 @@ }),
 
-      var handleBlur = function handleBlur() {
-        if (onBlur) {
-          onBlur();
-        }
-      };
-
       editor.addEventListener('keydown', handleKeyEvent, false);
-      editor.addEventListener('blur', handleBlur, false);
       return function () {
         editor.removeEventListener('keydown', handleKeyEvent, false);
-        editor.removeEventListener('blur', handleBlur, false);
       };
@@ -377,3 +388,3 @@ }
     className: "rmm-container"
-  }, createElement(TextareaAutosize, {
+  }, createElement(TextareaAutosize, Object.assign({}, rest, {
     ref: editorRef,
@@ -384,3 +395,3 @@ className: "rmm-editor",
     value: state.editor.value
-  }), children));
+  })), children));
 };
@@ -387,0 +398,0 @@

package.json

 {
   "name": "react-marky-markdown",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "license": "MIT",
@@ -27,3 +27,4 @@ "author": "Daniel Brodin",
     "test": "tsdx test --env=jsdom",
-    "lint": "tsdx lint"
+    "lint": "tsdx lint",
+    "release": "release-it"
   },
@@ -33,2 +34,17 @@ "peerDependencies": {
   },
+  "release-it": {
+    "git": {
+      "commitMessage": "chore: release %s",
+      "tagName": "v%s"
+    },
+    "npm": {
+      "publish": true
+    },
+    "github": {
+      "release": true
+    }
+  },
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
   "husky": {
@@ -52,2 +68,3 @@ "hooks": {
     "react-dom": "^16.11.0",
+    "release-it": "^12.4.3",
     "rollup-plugin-copy-assets": "^2.0.1",
@@ -54,0 +71,0 @@ "tsdx": "^0.10.5",

README.md

 # React Marky Markdown
+[![npm version](https://badge.fury.io/js/react-marky-markdown.svg)](https://badge.fury.io/js/react-marky-markdown)
 
@@ -13,2 +14,4 @@ A clean markdown editor for react.
 import { Editor, Mention } from 'react-marky-markdown';
+// Includes necessary styling
+import 'react-marky-markdown/dist/styles.css';
 
@@ -48,2 +51,2 @@ const App = () => {
 }
-```
+```

No alert changes

Improved metrics

Total package byte prevSize

121352

increased by0.97%

Lines of code

1029

increased by1.78%

Number of lines in readme file

50

increased by4.17%

Worsened metrics

Dev dependency count

11

increased by10%

No dependency changes