UNPKG

react-simple-wysiwyg

Version:
3 lines (2 loc) â€Ē 9.9 kB
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("react")):"function"==typeof define&&define.amd?define(["exports","react"],t):t((e="undefined"!=typeof globalThis?globalThis:e||self).ReactSimpleWysiwyg={},e.React)}(this,(function(e,t){"use strict";var n=function(){return n=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},n.apply(this,arguments)};function r(e,t){var n={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var o=0;for(r=Object.getOwnPropertySymbols(e);o<r.length;o++)t.indexOf(r[o])<0&&Object.prototype.propertyIsEnumerable.call(e,r[o])&&(n[r[o]]=e[r[o]])}return n}function o(e){if(e){var t=e.textContent;e.style.direction=t&&/[\u0591-\u07FF\uFB1D-\uFDFD\uFE70-\uFEFC]/.test(t[0])?"rtl":"ltr"}}function l(){for(var e=[],t=0;t<arguments.length;t++)e[t]=arguments[t];return e.filter(Boolean).join(" ")}function a(){if(document.selection)return document.selection.createRange().parentElement();var e=window.getSelection();return e&&e.rangeCount>0&&e.getRangeAt(0).startContainer.parentNode||void 0}function c(e){return e?e.replace(/&nbsp;|\u202F|\u00A0/g," ").replace(/<br \/>/g,"<br>"):""}function u(e,t){"function"==typeof t?t(e):"object"==typeof t&&t&&(t.current=e)}"function"==typeof SuppressedError&&SuppressedError;var i=t.memo(t.forwardRef((function(e,a){var i=e.className,d=e.disabled,s=e.tagName,m=e.value,f=void 0===m?"":m,v=e.placeholder,p=r(e,["className","disabled","tagName","value","placeholder"]),h=t.useRef(null),g=t.useRef(f),E=t.useRef(p);return t.useEffect((function(){E.current=p;var e=h.current;e&&c(g.current)!==c(f)&&(g.current=f,e.innerHTML=f,function(e){var t=document.createTextNode("");e.appendChild(t);var n=document.activeElement===e;if(null!==t&&null!==t.nodeValue&&n){var r=window.getSelection();if(null!==r){var o=document.createRange();o.setStart(t,t.nodeValue.length),o.collapse(!0),r.removeAllRanges(),r.addRange(o)}e instanceof HTMLElement&&e.focus()}}(e))})),t.useMemo((function(){function e(e){var t,r,l=h.current;if(l){var a=l.innerHTML;a!==g.current&&(null===(r=(t=E.current).onChange)||void 0===r||r.call(t,n(n({},e),{target:{value:a,name:p.name}}))),o(l),g.current=a}}var r=l("rsw-ce",i);return t.createElement(s||"div",n(n({},p),{className:r,contentEditable:!d,dangerouslySetInnerHTML:{__html:f},onBlur:function(t){return(E.current.onBlur||e)(t)},onInput:e,onKeyDown:function(t){return(E.current.onKeyDown||e)(t)},onKeyUp:function(t){return(E.current.onKeyUp||e)(t)},placeholder:v,ref:function(e){h.current=e,o(e),u(e,a)}}))}),[i,d,v,s])}))),d=t.createContext(void 0);function s(e){var r=e.children,o=t.useState({htmlMode:!1,update:function(e){a((function(t){return n(n({},t),e)}))}}),l=o[0],a=o[1];return t.createElement(d.Provider,{value:l},r)}function m(){var e=t.useContext(d);if(!e)throw new Error("You should wrap your component by EditorProvider");return e}var f=[],v=[];!function(e,t){if(e&&"undefined"!=typeof document){var n,r=!0===t.prepend?"prepend":"append",o=!0===t.singleTag,l="string"==typeof t.container?document.querySelector(t.container):document.getElementsByTagName("head")[0];if(o){var a=f.indexOf(l);-1===a&&(a=f.push(l)-1,v[a]={}),n=v[a]&&v[a][r]?v[a][r]:v[a][r]=c()}else n=c();65279===e.charCodeAt(0)&&(e=e.substring(1)),n.styleSheet?n.styleSheet.cssText+=e:n.appendChild(document.createTextNode(e))}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),t.attributes)for(var n=Object.keys(t.attributes),o=0;o<n.length;o++)e.setAttribute(n[o],t.attributes[n[o]]);var a="prepend"===r?"afterbegin":"beforeend";return l.insertAdjacentElement(a,e),e}}(".rsw-editor{border:1px solid #ddd;border-radius:.375rem;display:flex;flex-direction:column;min-height:100px;overflow:hidden}.rsw-ce{flex:1 0 auto;padding:.5rem}.rsw-ce:focus{outline:1px solid #668}.rsw-ce[contentEditable=true]:empty:not(:focus):before{color:grey;content:attr(placeholder);pointer-events:none}.rsw-html{background:transparent;border:none;font-family:monospace,Courier New}.rsw-separator{align-self:stretch;border-right:1px solid #ddd;display:flex;margin:0 3px}.rsw-dd{box-sizing:border-box;outline:none}.rsw-btn{background:transparent;border:0;color:#222;cursor:pointer;font-size:1em;height:2em;outline:none;padding:0;width:2em}.rsw-btn:hover{background:#eaeaea}.rsw-btn[data-active=true]{background:#e0e0e0}.rsw-toolbar{align-items:center;background-color:#f5f5f5;border-bottom:1px solid #ddd;display:flex}",{});var p=t.forwardRef((function(e,o){var c=e.autoFocus,d=e.children,s=e.containerProps,f=e.onSelect,v=r(e,["autoFocus","children","containerProps","onSelect"]),p=m();function h(e){var t;e.target!==p.$el&&((null===(t=p.$el)||void 0===t?void 0:t.contains(e.target))||p.update({$selection:void 0}))}t.useEffect((function(){return document.addEventListener("click",h),function(){return document.removeEventListener("click",h)}}));var g=l("rsw-editor",null==s?void 0:s.className);return p.htmlMode?t.createElement("div",n({},s,{className:g}),d,t.createElement("textarea",n({},v,{className:"rsw-ce rsw-html"}))):t.createElement("div",n({},s,{className:g}),d,t.createElement(i,n({},v,{ref:function(e){p.update({$el:e}),u(e,o),c&&e&&void 0===p.$el&&e.focus()},onSelect:function(e){null==f||f(e),p.update({$selection:a()})}})))}));var h=S("Bold","𝐁","bold"),g=S("Bullet list",t.createElement((function(){return t.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 24 24",style:{verticalAlign:"text-top"}},t.createElement("path",{fill:"currentColor",d:"M7 5h14v2H7V5zm0 8v-2h14v2H7zM4 4.50001c.83 0 1.5.66992 1.5 1.5 0 .83007-.67 1.5-1.5 1.5s-1.5-.66993-1.5-1.5c0-.83008.67-1.5 1.5-1.5zM4 10.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5zM7 19v-2h14v2H7zm-3-2.5c.83 0 1.5.67 1.5 1.5s-.67 1.5-1.5 1.5-1.5-.67-1.5-1.5.67-1.5 1.5-1.5z"}))}),null),"insertUnorderedList"),E=S("Clear formatting","TĖēₓ","removeFormat"),b=S("Italic","𝑰","italic"),y=S("Strike through",t.createElement("s",null,"ab"),"strikeThrough"),w=S("Link","🔗",(function(e){var t=e.$selection;"A"===(null==t?void 0:t.nodeName)?document.execCommand("unlink"):document.execCommand("createLink",!1,prompt("URL","")||void 0)})),x=S("Numbered list",t.createElement((function(){return t.createElement("svg",{xmlns:"http://www.w3.org/2000/svg",width:"20",height:"20",viewBox:"0 0 24 24",style:{verticalAlign:"text-top"}},t.createElement("path",{fill:"currentColor",d:"M6.99938 12.998v-2H20.9994v2H6.99938zm0 6.0001v-2H20.9994v2H6.99938zm0-12.00001v-2H20.9994v2H6.99938zm-4 1v-3h-1v-1h2v4h-1zm-1 9.00001v-1h3v4h-3v-1h2v-.5h-1v-1h1v-.5h-2zM4.25 10c.41421 0 .75.3358.75.75 0 .2024-.08017.3861-.2105.521L3.11983 13H5v1H2v-.9218L4 11H2v-1h2.25z"}))}),null),"insertOrderedList"),B=S("Redo","↷","redo"),N=S("Underline",t.createElement("span",{style:{textDecoration:"underline"}},"𝐔"),"underline"),C=S("Undo","â†ķ","undo");function S(e,r,o){return l.displayName=e.replace(/\s/g,""),l;function l(l){var a=m(),c=a.$el,u=a.$selection,i=!1;return"string"==typeof o&&(i=!!u&&document.queryCommandState(o)),a.htmlMode?null:t.createElement("button",n({className:"rsw-btn","data-active":i,onMouseDown:function(e){e.preventDefault(),document.activeElement!==c&&(null==c||c.focus()),"function"==typeof o?o(a):document.execCommand(o)},tabIndex:-1,title:e,type:"button"},l),r)}}var k=M("Styles",[["Normal","formatBlock","DIV"],["𝗛ð—ēð—Ūð—ąð—ēð—ŋ 𝟭","formatBlock","H1"],["Header 2","formatBlock","H2"],["ð™ē𝚘𝚍𝚎","formatBlock","PRE"]]);function M(e,r){return o.displayName=e,o;function o(o){var l=m(),a=l.$el,c=l.$selection;if(l.htmlMode)return null;var u=r.findIndex((function(e){return"formatBlock"===e[1]&&(null==c?void 0:c.nodeName)===e[2]}));return t.createElement(H,n({},o,{items:r,onChange:function(e){var t=e.target,n=t.value,o=parseInt(n,10),c=r[o]||[],u=c[1],i=c[2];e.preventDefault(),document.activeElement!==a&&(null==a||a.focus());"function"==typeof u?u(l):u&&document.execCommand(u,!1,i);setTimeout((function(){return t.value=n}),10)},selected:u,tabIndex:-1,title:e}))}}function H(e){var o=e.items,l=e.selected,a=r(e,["items","selected"]);return t.createElement("select",n({className:"rsw-dd"},a,{value:l}),t.createElement("option",{hidden:!0},a.title),o.map((function(e,n){return t.createElement("option",{key:e[2],value:n},e[0])})))}function L(e){var o=r(e,[]),l=m();return t.createElement("button",n({className:"rsw-btn","data-active":l.htmlMode,onClick:function(){l.update({htmlMode:!l.htmlMode})},tabIndex:-1,title:"HTML mode",type:"button"},o),"</>")}function R(e){return m().htmlMode?null:t.createElement("div",n({className:"rsw-separator"},e))}function T(e){return t.createElement("div",n({className:"rsw-toolbar"},e))}var O=t.forwardRef((function(e,r){return t.createElement(s,null,t.createElement(p,n({},e,{ref:r}),e.children||t.createElement(T,null,t.createElement(C,null),t.createElement(B,null),t.createElement(R,null),t.createElement(h,null),t.createElement(b,null),t.createElement(N,null),t.createElement(y,null),t.createElement(R,null),t.createElement(x,null),t.createElement(g,null),t.createElement(R,null),t.createElement(w,null),t.createElement(E,null),t.createElement(L,null),t.createElement(R,null),t.createElement(k,null))))}));e.BtnBold=h,e.BtnBulletList=g,e.BtnClearFormatting=E,e.BtnItalic=b,e.BtnLink=w,e.BtnNumberedList=x,e.BtnRedo=B,e.BtnStrikeThrough=y,e.BtnStyles=k,e.BtnUnderline=N,e.BtnUndo=C,e.ContentEditable=i,e.DefaultEditor=O,e.Dropdown=H,e.Editor=p,e.EditorContext=d,e.EditorProvider=s,e.HtmlButton=L,e.Separator=R,e.Toolbar=T,e.createButton=S,e.createDropdown=M,e.default=O,e.useEditorState=m,Object.defineProperty(e,"__esModule",{value:!0})})); //# sourceMappingURL=index.umd.min.js.map