add iframe custom

package.json

 {
     "name": "react-ag-qeditor",
-    "version": "1.0.20",
+    "version": "1.0.21",
     "description": "WYSIWYG html editor",
     "author": "atma",
     "license": "MIT",

src/QEditor.jsx

@@ -160,6 +160,10 @@ const QEditor = ({
             title: 'Видео по ссылке',
             onClick: () => modalOpener('iframe', 'Видео по ссылке')
         },
+        iframe_custom: {
+            title: 'Вставить iframe',
+            onClick: () => modalOpener('iframe_custom', 'Вставить iframe')
+        },
         image: {
             title: 'Загрузить изображение',
             onClick: () => modalOpener('image', 'Загрузить изображение')
@@ -498,6 +502,14 @@ const QEditor = ({
                         </ul>
                     </Fragment>
                 )
+            case 'iframe_custom':
+                return (
+                    <Fragment>
+                        <input type="text" value={embedContent} placeholder={'<iframe></iframe>'}
+                               onInput={(e) => setEmbedContent(e.target.value)}
+                        />
+                    </Fragment>
+                )
             case 'video':
                 return (
                     <Fragment>{getUploader({accept: 'video/*'})}</Fragment>
@@ -757,6 +769,10 @@ const QEditor = ({
                     isDisabled = true;
                 }
                 break;
+            case 'iframe_custom':
+                let regex = new RegExp('(?:<iframe[^>]*)(?:(?:\\/>)|(?:>.*?<\\/iframe>))');
+                isDisabled = !regex.test(embedContent);
+                break;
         }
 
         return isDisabled;
@@ -954,6 +970,9 @@ const QEditor = ({
                                                 editor.chain().focus().setIframe({src: _url}).run();
 
                                                 break
+                                            case 'iframe_custom':
+                                                editor.chain().focus().insertContent(embedContent).run();
+                                                break
                                             case 'file':
                                                 uploadedPaths.map((file, i) => {
                                                     let exp = file.path.split('.');

src/components/ToolBar.js

@@ -47,6 +47,7 @@ const toolsInit = {
                 'image',
                 'video',
                 'iframe',
+                'iframe_custom',
             ]
         },
         {

src/index.scss

@@ -883,7 +883,9 @@ body{
             background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2211%22%20height%3D%2218%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Ctext%20font-family%3D%22SFProRounded-Regular%2C%20SF%20Pro%20Rounded%22%20font-size%3D%2215%22%20fill%3D%22%231D1D1F%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ctspan%20x%3D%220%22%20y%3D%2214%22%3EU%3C%2Ftspan%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C%2Ftext%3E%3Cpath%20stroke%3D%22%231D1D1F%22%20stroke-width%3D%221.4%22%20stroke-linecap%3D%22round%22%20d%3D%22M1.43%2016.727h8%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');
         }
         &.qcodeBlock{
-            background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2221%22%20height%3D%2214%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M8.262%2013.837c.388.103.74-.11.857-.498L12.766.837C12.87.485%2012.7.134%2012.312.03c-.38-.102-.71.044-.842.498L7.844%2012.966c-.117.395.008.761.418.871zM20.53%206.923a.742.742%200%200%200-.25-.556l-4.892-4.41c-.315-.278-.718-.278-.974.008-.256.285-.22.703.073.967l4.41%203.991-4.41%203.992c-.293.264-.33.674-.073.967.256.285.66.285.974.007l4.893-4.416a.716.716%200%200%200%20.249-.55zM0%206.923c0%20.205.088.403.256.55l4.893%204.416c.308.278.718.278.974-.007.256-.293.212-.703-.08-.967L1.64%206.923l4.401-3.991c.293-.264.337-.682.081-.967-.256-.286-.666-.286-.974-.008L.256%206.367A.75.75%200%200%200%200%206.923z%22%20fill%3D%22%231D1D1F%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E');
+            background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pgo8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDIwMDEwOTA0Ly9FTiIKICJodHRwOi8vd3d3LnczLm9yZy9UUi8yMDAxL1JFQy1TVkctMjAwMTA5MDQvRFREL3N2ZzEwLmR0ZCI+CjxzdmcgdmVyc2lvbj0iMS4wIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiB3aWR0aD0iNjIwLjAwMDAwMHB0IiBoZWlnaHQ9IjM5NS4wMDAwMDBwdCIgdmlld0JveD0iMCAwIDYyMC4wMDAwMDAgMzk1LjAwMDAwMCIKIHByZXNlcnZlQXNwZWN0UmF0aW89InhNaWRZTWlkIG1lZXQiPgoKPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMC4wMDAwMDAsMzk1LjAwMDAwMCkgc2NhbGUoMC4xMDAwMDAsLTAuMTAwMDAwKSIKZmlsbD0iIzAwMDAwMCIgc3Ryb2tlPSJub25lIj4KPHBhdGggZD0iTTM4ODUgMzAwMSBsLTYwIC02IDQgLTI2MSBjMiAtMTQ0IDEgLTI2NyAtMyAtMjczIC01IC04IC0yNSA0IC01OQozNSAtMTAyIDkzIC0yMjUgMTI0IC0zNTcgOTAgLTgzIC0yMSAtMTQzIC01NyAtMjAxIC0xMTcgLTE4NCAtMTkzIC0xODQgLTUzOQoxIC03MjkgMTYyIC0xNjYgNDA0IC0xNzMgNTc4IC0xNiBsNTIgNDggMCAtNDAgYzAgLTIyIDMgLTUzIDYgLTcwIGw2IC0zMCAxMDIKMSAxMDEgMiAtNSAxNzUgYy02IDIyMyAtMyA2NTAgOCA5NDUgNSAxMjcgNiAyMzYgNCAyNDMgLTQgMTMgLTY0IDE0IC0xNzcgM3oKbS0yNTMgLTYwMyBjNTMgLTE2IDEyNCAtODAgMTU1IC0xNDIgMzQgLTY3IDQzIC0xODEgMTkgLTI1MyAtMjMgLTY4IC02OSAtMTI4Ci0xMjQgLTE2MSAtNDAgLTIzIC01OCAtMjcgLTEyMiAtMjcgLTExOCAxIC0xOTIgNTMgLTI0OCAxNzMgLTIxIDQ3IC0yNCA2NAotMjAgMTM2IDMgNTggMTEgOTQgMjcgMTI2IDY1IDEyNyAxODggMTg2IDMxMyAxNDh6Ii8+CjxwYXRoIGQ9Ik05NzUgMjU2MyBjLTEyOCAtMTA0IC0xOTggLTE1MiAtMzM1IC0yMzEgbC04NSAtNDkgMCAtODMgMCAtODMgMTE1Ci02NiBjMTE4IC02OCAxODQgLTExNCAzMjUgLTIzMSA0NCAtMzYgODUgLTY5IDkyIC03NCA4IC00IDI0IDE3IDQ5IDY1IGwzNiA3MgotNjYgNjMgYy03MyA3MCAtMjE1IDE2OCAtMzE4IDIyMCAtMzcgMTkgLTY4IDM2IC02OCAzOCAwIDIgMzMgMjAgNzQgMzkgMTQxCjY3IDM3NiAyNDQgMzc2IDI4MyAwIDE5IC01OCAxMzQgLTY4IDEzNCAtNCAwIC02MSAtNDQgLTEyNyAtOTd6Ii8+CjxwYXRoIGQ9Ik01MTcyIDI1OTUgYy0zOCAtNzggLTM4IC03OSA0NyAtMTU3IDc3IC03MiAxNzggLTEzOSAyODUgLTE4OSA0NwotMjIgODYgLTQyIDg2IC00NCAwIC0zIC0yMiAtMTYgLTQ5IC0zMCAtOTAgLTQ1IC0zMTYgLTIwMiAtMzU5IC0yNDkgbC00MyAtNDcKMzYgLTY3IGMyMSAtMzcgMzggLTY4IDQwIC03MCAyIC0yIDQ4IDM1IDEwNCA4MSAxMTcgOTggMjMzIDE3OCAzNDYgMjM4IDQ0IDI0CjgzIDQ4IDg4IDUzIDQgNiA2IDQ3IDUgOTEgbC0zIDc5IC04MCA0NCBjLTEwNCA1NyAtMjIzIDE0MCAtMzU4IDI0NyAtNTkgNDcKLTEwOCA4NSAtMTEwIDg1IC0xIDAgLTE3IC0yOSAtMzUgLTY1eiIvPgo8cGF0aCBkPSJNMTYwNSAyNTk2IGMtMjA2IC01MCAtMzU1IC0yNTQgLTM1NSAtNDg2IDAgLTE0NyA0NSAtMjU1IDE1MCAtMzYxCjE0MCAtMTQxIDMxNCAtMTczIDUxOSAtOTcgbDU0IDIwIC02IDY3IGMtMyAzNiAtMTEgODAgLTE3IDk4IGwtMTEgMzEgLTU3IC0yNgpjLTc2IC0zNiAtMTg2IC0zOCAtMjQ4IC01IC01MyAyOCAtMTA5IDg3IC0xMzcgMTQzIC0zMiA2NSAtMzEgMTk1IDIgMjYyIDcxCjE0NiAyMTEgMjAxIDM2NiAxNDQgNzggLTI4IDc3IC0yOSAxMDAgNDkgMjcgOTIgMjYgOTYgLTMzIDEyNiAtOTQgNDcgLTIyMSA2MQotMzI3IDM1eiIvPgo8cGF0aCBkPSJNNDUzMCAyNTk3IGMtODIgLTIzIC0xNDEgLTYxIC0yMDUgLTEyOCAtMTA5IC0xMTYgLTE1MyAtMjQyIC0xNDIKLTQwNyA3IC0xMTEgMjcgLTE3NCA3OSAtMjUyIDUwIC03NiAxMzQgLTE0MCAyMjAgLTE3MCA3NyAtMjYgMjEzIC0zNiAyOTMgLTIxCjgwIDE1IDE5MSA3MCAyMzkgMTIwIGw0MCA0MSAtMzQgNzAgYy0xOSAzOCAtMzUgNzAgLTM3IDcwIC0xIDAgLTMwIC0xOCAtNjMKLTM5IC04OCAtNTcgLTE1MCAtNzYgLTI1MCAtNzYgLTkyIDAgLTE0NSAxOSAtMjAzIDc0IC0yOCAyNSAtNjcgOTAgLTY3IDExMCAwCjUgMjggMTIgNjMgMTUgMzQgMyAxNjMgMTUgMjg2IDI3IDIzMCAyMSAyODEgMzIgMzAwIDY3IDI3IDUxIDMgMjAzIC00NiAyOTQKLTM5IDcyIC0xMzkgMTYxIC0yMTAgMTg4IC03MSAyNyAtMTk5IDM1IC0yNjMgMTd6IG0xNzUgLTE5NiBjOTQgLTQyIDE2NCAtMTc5CjEwMSAtMTk1IC00NiAtMTEgLTI4MSAtMzYgLTM0MyAtMzYgbC02MyAwIDAgMzcgYzAgNzcgNzEgMTcwIDE1MSAxOTkgNDkgMTgKMTA4IDE2IDE1NCAtNXoiLz4KPHBhdGggZD0iTTI0MDIgMjU4NSBjLTE0OCAtNDIgLTI3MiAtMTU3IC0zMjQgLTMwMiAtMjYgLTczIC0zNCAtMjA5IC0xOSAtMjg2CjI4IC0xMzAgMTM3IC0yNzkgMjQ4IC0zMzYgMTM1IC02OCAzMDMgLTY2IDQzNSA2IDYyIDM0IDE1OCAxMzQgMTkyIDIwMSA2OAoxMzUgNzUgMzExIDE2IDQ0NyAtNDYgMTA1IC0xNjAgMjE0IC0yNjcgMjU1IC03NSAyOSAtMjA4IDM2IC0yODEgMTV6IG0yMzQKLTIxMyBjNDkgLTI1IDEwMSAtODEgMTI0IC0xMzYgNzkgLTE4MiAtMzIgLTQwNCAtMjExIC00MjMgLTExNCAtMTEgLTIwMiA0MAotMjU5IDE1MSAtMzEgNjEgLTM1IDc3IC0zNCAxNDUgMSAxMzkgNzIgMjQyIDE5NCAyODIgNDEgMTQgMTQyIDMgMTg2IC0xOXoiLz4KPC9nPgo8L3N2Zz4K');
+            background-size: contain;
+            width: 46px;
         }
         &.qclearMarks{
             background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2215%22%20height%3D%2215%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M8.574%206.094%207.07%204.609l.47-1.093H5.995L3.965%201.484h9.355c.274%200%20.505.095.694.284.188.188.283.42.283.693a.943.943%200%200%201-.283.693.943.943%200%200%201-.694.284H9.707L8.574%206.094zm5.43%208.73L7.598%208.398l-1.465%203.438a.935.935%200%200%201-.362.43.976.976%200%200%201-.537.156.932.932%200%200%201-.82-.44.913.913%200%200%201-.078-.927l1.758-4.14L.176.995A.562.562%200%200%201%200%20.586C0%20.43.059.293.176.176A.562.562%200%200%201%20.586%200c.156%200%20.293.059.41.176l13.828%2013.828a.562.562%200%200%201%20.176.41.562.562%200%200%201-.176.41.562.562%200%200%201-.41.176.562.562%200%200%201-.41-.176z%22%20fill%3D%22%231D1D1F%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E');
@@ -921,6 +923,9 @@ body{
         &.qiframe{
             background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2218%22%20height%3D%2214%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2.623.597h12a2%202%200%200%201%202%202v8a2%202%200%200%201-2%202h-12a2%202%200%200%201-2-2v-8a2%202%200%200%201%202-2z%22%20stroke%3D%22%231F1E1D%22%20stroke-width%3D%221.2%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%20stroke-dasharray%3D%222.4%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E');
         }
+        &.qiframe_custom{
+            background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2221%22%20height%3D%2214%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M8.262%2013.837c.388.103.74-.11.857-.498L12.766.837C12.87.485%2012.7.134%2012.312.03c-.38-.102-.71.044-.842.498L7.844%2012.966c-.117.395.008.761.418.871zM20.53%206.923a.742.742%200%200%200-.25-.556l-4.892-4.41c-.315-.278-.718-.278-.974.008-.256.285-.22.703.073.967l4.41%203.991-4.41%203.992c-.293.264-.33.674-.073.967.256.285.66.285.974.007l4.893-4.416a.716.716%200%200%200%20.249-.55zM0%206.923c0%20.205.088.403.256.55l4.893%204.416c.308.278.718.278.974-.007.256-.293.212-.703-.08-.967L1.64%206.923l4.401-3.991c.293-.264.337-.682.081-.967-.256-.286-.666-.286-.974-.008L.256%206.367A.75.75%200%200%200%200%206.923z%22%20fill%3D%22%231D1D1F%22%20fill-rule%3D%22nonzero%22%2F%3E%3C%2Fsvg%3E');
+        }
         &.qinsertTable{
             background-image: url('data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2215%22%20height%3D%2214%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20transform%3D%22translate%281.517%20.975%29%22%20stroke%3D%22%231F1E1D%22%20stroke-width%3D%221.2%22%20fill%3D%22none%22%20fill-rule%3D%22evenodd%22%3E%3Cpath%20stroke-linecap%3D%22square%22%20d%3D%22M.976%205.967h11M6.035.033v11%22%2F%3E%3Crect%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%20width%3D%2212%22%20height%3D%2212%22%20rx%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');
         }