react-simple-wysiwyg - npm Package Compare versions

Comparing version 3.2.0 to 3.2.1

lib/index.cjs.js

@@ -118,3 +118,3 @@ 'use strict';
     className = _a.className, disabled = _a.disabled, tagName = _a.tagName, _b = _a.value, value = _b === void 0 ? '' : _b, placeholder = _a.placeholder, rest = __rest(_a, ["className", "disabled", "tagName", "value", "placeholder"]);
-    var elRef = React.useRef();
+    var elRef = React.useRef(null);
     var htmlRef = React.useRef(value);
@@ -187,3 +187,3 @@ var restRef = React.useRef(rest);
 
-var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=!0===r.prepend?"prepend":"append",d=!0===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
+var e=[],t=[];function n(n,r){if(n&&"undefined"!=typeof document){var a,s=true===r.prepend?"prepend":"append",d=true===r.singleTag,i="string"==typeof r.container?document.querySelector(r.container):document.getElementsByTagName("head")[0];if(d){var u=e.indexOf(i);-1===u&&(u=e.push(i)-1,t[u]={}),a=t[u]&&t[u][s]?t[u][s]:t[u][s]=c();}else a=c();65279===n.charCodeAt(0)&&(n=n.substring(1)),a.styleSheet?a.styleSheet.cssText+=n:a.appendChild(document.createTextNode(n));}function c(){var e=document.createElement("style");if(e.setAttribute("type","text/css"),r.attributes)for(var t=Object.keys(r.attributes),n=0;n<t.length;n++)e.setAttribute(t[n],r.attributes[t[n]]);var a="prepend"===s?"afterbegin":"beforeend";return i.insertAdjacentElement(a,e),e}}
 
@@ -328,3 +328,3 @@ var css = ".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 items = _a.items, selected = _a.selected, inputProps = __rest(_a, ["items", "selected"]);
-    return (React.createElement("select", __assign({}, inputProps, { value: selected, className: "rsw-dd" }),
+    return (React.createElement("select", __assign({ className: "rsw-dd" }, inputProps, { value: selected }),
         React.createElement("option", { hidden: true }, inputProps.title),
@@ -345,3 +345,3 @@ items.map(function (item, index) { return (React.createElement("option", { key: item[2], value: index }, item[0])); })));
 
-function Separator() {
+function Separator(props) {
     var editorState = useEditorState();
@@ -351,7 +351,7 @@ if (editorState.htmlMode) {
     }
-    return React.createElement("div", { className: "rsw-separator" });
+    return React.createElement("div", __assign({ className: "rsw-separator" }, props));
 }
 
 function Toolbar(props) {
-    return React.createElement("div", __assign({}, props, { className: "rsw-toolbar" }));
+    return React.createElement("div", __assign({ className: "rsw-toolbar" }, props));
 }
@@ -361,20 +361,19 @@
     return (React.createElement(EditorProvider, null,
-        React.createElement(Editor, __assign({}, props, { ref: ref }),
-            React.createElement(Toolbar, null,
-                React.createElement(BtnUndo, null),
-                React.createElement(BtnRedo, null),
-                React.createElement(Separator, null),
-                React.createElement(BtnBold, null),
-                React.createElement(BtnItalic, null),
-                React.createElement(BtnUnderline, null),
-                React.createElement(BtnStrikeThrough, null),
-                React.createElement(Separator, null),
-                React.createElement(BtnNumberedList, null),
-                React.createElement(BtnBulletList, null),
-                React.createElement(Separator, null),
-                React.createElement(BtnLink, null),
-                React.createElement(BtnClearFormatting, null),
-                React.createElement(HtmlButton, null),
-                React.createElement(Separator, null),
-                React.createElement(BtnStyles, null)))));
+        React.createElement(Editor, __assign({}, props, { ref: ref }), props.children || (React.createElement(Toolbar, null,
+            React.createElement(BtnUndo, null),
+            React.createElement(BtnRedo, null),
+            React.createElement(Separator, null),
+            React.createElement(BtnBold, null),
+            React.createElement(BtnItalic, null),
+            React.createElement(BtnUnderline, null),
+            React.createElement(BtnStrikeThrough, null),
+            React.createElement(Separator, null),
+            React.createElement(BtnNumberedList, null),
+            React.createElement(BtnBulletList, null),
+            React.createElement(Separator, null),
+            React.createElement(BtnLink, null),
+            React.createElement(BtnClearFormatting, null),
+            React.createElement(HtmlButton, null),
+            React.createElement(Separator, null),
+            React.createElement(BtnStyles, null))))));
 });
@@ -381,0 +380,0 @@

lib/index.d.ts

@@ -1,103 +0,3 @@
-/// <reference types="react" />
-import React from "react";
-import { HTMLAttributes, SyntheticEvent, ComponentProps, ReactNode, FC } from "react";
-/**
- * Based on https://github.com/lovasoa/react-contenteditable
- * A simple component for a html element with editable contents.
- */
-declare const ContentEditable: React.MemoExoticComponent<React.ForwardRefExoticComponent<ContentEditableProps & React.RefAttributes<HTMLDivElement>>>;
-type ContentEditableEvent = SyntheticEvent<any, Event> & {
-    target: {
-        name?: string;
-        value: string;
-    };
-};
-interface ContentEditableProps extends HTMLAttributes<HTMLElement> {
-    disabled?: boolean;
-    name?: string;
-    onChange?: (event: ContentEditableEvent) => void;
-    placeholder?: string;
-    tagName?: string;
-    value?: string;
-}
-declare const Editor: React.ForwardRefExoticComponent<EditorProps & React.RefAttributes<HTMLDivElement>>;
-// eslint-disable-next-line @typescript-eslint/no-empty-interface
-interface EditorProps extends ContentEditableProps {
-    containerProps?: ComponentProps<"div">;
-}
-declare const DefaultEditor: React.ForwardRefExoticComponent<EditorProps & React.RefAttributes<HTMLDivElement>>;
-declare const EditorContext: React.Context<EditorState | undefined>;
-declare function EditorProvider({ children }: {
-    children: ReactNode;
-}): React.JSX.Element;
-declare function useEditorState(): EditorState;
-interface EditorState {
-    update(attrs: Partial<EditorState>): void;
-    $el?: HTMLElement;
-    $selection?: Node;
-    htmlMode: boolean;
-}
-declare const BtnBold: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnBulletList: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnClearFormatting: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnItalic: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnStrikeThrough: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnLink: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnNumberedList: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnRedo: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnUnderline: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnUndo: {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare function createButton(title: string, content: ReactNode, command: ((state: EditorState) => void) | string): {
-    (props: HTMLAttributes<HTMLButtonElement>): React.JSX.Element | null;
-    displayName: string;
-};
-declare const BtnStyles: React.FC<DropDownFactoryProps>;
-declare function createDropdown(title: string, items: DropDownItem[]): FC<DropDownFactoryProps>;
-declare function Dropdown({ items, selected, ...inputProps }: DropdownProps): React.JSX.Element;
-type DropDownItem = [
-    string,
-    string | ((editorState: EditorState) => void),
-    string
-];
-interface DropDownFactoryProps extends HTMLAttributes<HTMLSelectElement> {
-    selected?: number;
-}
-interface DropdownProps extends DropDownFactoryProps {
-    items: DropDownItem[];
-}
-declare function HtmlButton({ ...rest }: {
-    [x: string]: any;
-}): React.JSX.Element;
-declare function Separator(): React.JSX.Element | null;
-declare function Toolbar(props: HTMLAttributes<HTMLDivElement>): React.JSX.Element;
-export { ContentEditable, ContentEditableEvent, ContentEditableProps, DefaultEditor, DefaultEditor as default, Editor, EditorProps, EditorContext, EditorProvider, useEditorState, EditorState, BtnBold, BtnBulletList, BtnClearFormatting, BtnItalic, BtnStrikeThrough, BtnLink, BtnNumberedList, BtnRedo, BtnUnderline, BtnUndo, createButton, BtnStyles, createDropdown, Dropdown, DropDownItem, DropDownFactoryProps, DropdownProps, HtmlButton, Separator, Toolbar };
+export * from './editor';
+export { DefaultEditor as default } from './editor';
+export * from './toolbar';

lib/index.umd.min.js

@@ -1,2 +0,2 @@
-!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(),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({},a,{value:l,className:"rsw-dd"}),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(){return m().htmlMode?null:t.createElement("div",{className:"rsw-separator"})}function T(e){return t.createElement("div",n({},e,{className:"rsw-toolbar"}))}var O=t.forwardRef((function(e,r){return t.createElement(s,null,t.createElement(p,n({},e,{ref:r}),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})}));
+!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

package.json

 {
   "name": "react-simple-wysiwyg",
-  "version": "3.2.0",
+  "version": "3.2.1",
   "description": "Simple and lightweight React WYSIWYG editor",
@@ -36,25 +36,26 @@ "main": "lib/index.cjs.js",
   "devDependencies": {
-    "@ironkinoko/rollup-plugin-styles": "^4.0.3",
-    "@rollup/plugin-replace": "^5.0.2",
-    "@rollup/plugin-terser": "^0.4.3",
-    "@types/react": "^18.2.22",
-    "@typescript-eslint/eslint-plugin": "^6.7.2",
+    "@rollup/plugin-replace": "^6.0.2",
+    "@rollup/plugin-terser": "^0.4.4",
+    "@rollup/plugin-typescript": "^12.1.2",
+    "@types/react": "^19.0.10",
+    "@typescript-eslint/eslint-plugin": "^7.18.0",
     "eslint": "^8.50.0",
-    "eslint-config-airbnb-typescript": "^17.1.0",
-    "eslint-config-prettier": "^9.0.0",
-    "eslint-plugin-import": "^2.28.1",
-    "eslint-plugin-jsx-a11y": "^6.7.1",
-    "eslint-plugin-prettier": "^5.0.0",
-    "eslint-plugin-react": "^7.33.2",
-    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-config-airbnb-typescript": "^18.0.0",
+    "eslint-config-prettier": "^10.0.2",
+    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-prettier": "^5.2.3",
+    "eslint-plugin-react": "^7.37.4",
+    "eslint-plugin-react-hooks": "^5.2.0",
     "eslint-plugin-tsc": "^2.0.0",
-    "gh-pages": "^6.0.0",
-    "prettier": "^3.0.3",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "rollup": "^3.29.3",
+    "gh-pages": "^6.3.0",
+    "prettier": "^3.5.3",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "rollup": "^4.34.9",
     "rollup-plugin-filesize": "^10.0.0",
+    "rollup-plugin-styler": "^2.0.0",
     "rollup-plugin-ts": "^3.4.5",
     "spech": "^0.2.1",
-    "typescript": "^5.2.2"
+    "typescript": "^5.8.2"
   },
@@ -61,0 +62,0 @@ "peerDependencies": {

No alert changes

Improved metrics

Total package byte prevSize

165857

11.84%

Number of package files

24

140%

Lines of code

920

3.95%

Worsened metrics

Dev dependency count

24

4.35%

No dependency changes