@themarioga/grid-editor 5.3.0 → 6.0.0-beta.1

package/dist/plugins/grideditor.elements.js

@@ -2,12 +2,16 @@
  * Element level controls for grid-editor.
  *
  * A feature plugin: load this file after the editor and the nodes a host
- * marked inside a content area become elements - one movable, deletable thing
- * each, instead of rich text. What it can ask the editor for is the handle its
- * factory is called with, described in docs/plugins.md.
+ * marked become elements - one movable, deletable block each, in the column
+ * beside the texts, instead of rich text. What it can ask the editor for is
+ * the handle its factory is called with, described in docs/plugins.md.
  *
  *   <script src="dist/jquery.grideditor.min.js"></script>
  *   <script src="dist/plugins/grideditor.elements.min.js"></script>
+ *
+ * Up to 5.x an element lived inside a content area, among the text. Markup
+ * saved that way still loads: the editor takes each element out of the text
+ * it sits in, which is what `cuts` is for.
  */
 (function($) {
 
@@ -17,37 +21,41 @@ $.extend($.fn.gridEditor.locales.en, {
     'confirm.delete_element': 'Delete element?',
 });
 
+/** A column's children that are something else than an element, whatever elements.auto says. */
+var NOT_ELEMENTS = '.row, .ge-content, .ge-text-block, [data-ge-container], .ge-tools-drawer, .ge-resize-handle';
+
 $.fn.gridEditor.features.elements = function(ge) {
 
+    var warnedIntoText = false;
+
     function elementsEnabled() {
         if (ge.settings.elements.enabled !== 'auto') { return !!ge.settings.elements.enabled; }
 
         return ge.settings.elements.auto || ge.canvas.find(ge.settings.elements.selector).length > 0;
     }
 
-    function elementsIn(contentArea) {
+    /** Whether a child of a column is an element. */
+    function isElement(node) {
         return ge.settings.elements.auto
-            ? contentArea.children()
-            : contentArea.children(ge.settings.elements.selector);
+            ? !node.is(NOT_ELEMENTS)
+            : node.is(ge.settings.elements.selector);
     }
 
     function markElements() {
         if (!elementsEnabled()) { return; }
 
-        ge.canvas.find('.ge-content').each(function() {
-            elementsIn($(this)).each(function() {
-                var element = $(this).addClass('ge-element').attr('contenteditable', 'false');
+        ge.canvas.find('.column').children().each(function() {
+            var element = $(this);
+            if (!element.hasClass('ge-element') && !isElement(element)) { return; }
 
-                if (element.find('> .ge-tools-drawer').length) { return; }
-
-                createElementControls(element);
-            });
+            element.addClass('ge-element');
+            if (!element.find('> .ge-tools-drawer').length) { createElementControls(element); }
         });
     }
 
     function unmarkElements() {
         ge.canvas.find('.ge-element').each(function() {
-            var element = $(this).removeClass('ge-element').removeAttr('contenteditable');
+            var element = $(this).removeClass('ge-element');
 
             // A host element that had no class of its own should not come
             // back from getHtml carrying an empty one
@@ -56,16 +64,7 @@ $.fn.gridEditor.features.elements = function(ge) {
     }
 
     function createElementControls(element) {
-        // data-mce-bogus="all" is how tinyMCE is told that a node is the
-        // editor's furniture rather than content: it leaves the subtree
-        // alone and keeps it out of what it serializes. Without it the
-        // drawer's tools are inline elements with no text, which is
-        // exactly what its cleanup removes, so an element inside an open
-        // editor would lose its move and delete tools.
-        var drawer = $('<div class="ge-tools-drawer ge-element-drawer" />')
-            .attr('data-mce-bogus', 'all')
-            .prependTo(element)
-        ;
+        var drawer = $('<div class="ge-tools-drawer ge-element-drawer" />').prependTo(element);
 
         ge.createMoveTool(drawer);
         ge.createTool(drawer, ge.t('tool.element_info', { name: elementName(element) }),
@@ -93,6 +92,32 @@ $.fn.gridEditor.features.elements = function(ge) {
         return label || type || element[0].tagName.toLowerCase();
     }
 
+    /**
+     * Placed into a content area, as 5.x did, an element would be text
+     * again, and the next init would cut it out. So it goes beside that
+     * content area instead - after it for appendTo, before it for
+     * prependTo - with a word to the host.
+     */
+    function placementBesideText(options) {
+        var placed = $.extend({}, options);
+
+        [['appendTo', 'insertAfter'], ['prependTo', 'insertBefore']].forEach(function(pair) {
+            var target = options[pair[0]] !== undefined ? $(options[pair[0]]) : null;
+            if (!target || !target.is('.ge-content')) { return; }
+
+            if (!warnedIntoText) {
+                warnedIntoText = true;
+                ge.warn('createElement: an element is a block of the column since 6.0, not part of a ' +
+                    'content area\'s text; it goes beside the content area. Place it in a column instead.');
+            }
+
+            delete placed[pair[0]];
+            placed[pair[1]] = target.parent('.ge-text-block').length ? target.parent() : target;
+        });
+
+        return placed;
+    }
+
     function apiCreateElement(content, options) {
         options = options || {};
 
@@ -104,7 +129,7 @@ $.fn.gridEditor.features.elements = function(ge) {
             element.attr('data-ge-label', options.label);
         }
 
-        return ge.place(element, 'element', options);
+        return ge.place(element, 'element', placementBesideText(options));
     }
 
     return {
@@ -117,24 +142,27 @@ $.fn.gridEditor.features.elements = function(ge) {
             return node.hasClass('ge-element') ? 'element' : null;
         },
 
-        onInit: markElements,
-        onDeinit: unmarkElements,
-
         /**
-         * An editor rewrites the content area as it takes it over, drawers
-         * included, so they go back in when it says it is ready.
+         * An element cuts the text it sits in: 5.x's markup, or markup a host
+         * wrote the same way, has it inside a content area, and it comes out.
          */
-        onContentReady: markElements,
+        cuts: function() {
+            if (!elementsEnabled()) { return null; }
 
-        /** Elements move within a content area and between them. */
-        onSortable: function(sortable) {
-            if (!elementsEnabled()) { return; }
+            return ge.settings.elements.auto ? '*' : ge.settings.elements.selector;
+        },
 
-            sortable(ge.canvas.find('.ge-content'), {
-                draggable: '.ge-element',
-                group: 'element',
-            });
+        // A block the columns move, beside the texts, the rows and the
+        // containers - and only the columns
+        blocks: '.ge-element',
+        accepts: function(region, node) {
+            if (node.hasClass('ge-element')) { return region.is('.column'); }
+
+            return true;
         },
+
+        onInit: markElements,
+        onDeinit: unmarkElements,
     };
 };
 

package/dist/plugins/grideditor.elements.min.js

@@ -1,2 +1,2 @@
-(a=>{a.extend(a.fn.gridEditor.locales.en,{"tool.delete_element":"Remove element","tool.element_info":"Element: {name}","confirm.delete_element":"Delete element?"}),a.fn.gridEditor.features.elements=function(l){function t(){return"auto"!==l.settings.elements.enabled?l.settings.elements.enabled:l.settings.elements.auto||0<l.canvas.find(l.settings.elements.selector).length}function e(){t()&&l.canvas.find(".ge-content").each(function(){var e;e=a(this),(l.settings.elements.auto?e.children():e.children(l.settings.elements.selector)).each(function(){var t,n,e=a(this).addClass("ge-element").attr("contenteditable","false");e.find("> .ge-tools-drawer").length||(t=e,n=a('<div class="ge-tools-drawer ge-element-drawer" />').attr("data-mce-bogus","all").prependTo(t),l.createMoveTool(n),l.createTool(n,l.t("tool.element_info",{name:(e=>{var t=e.attr("data-ge-element"),n=e.attr("data-ge-label");return n&&t?n+" ("+t+")":n||t||e[0].tagName.toLowerCase()})(t)}),"ge-element-info","bi bi-info-circle"),l.addSettingsTool(n,t,l.settings.element_classes),l.settings.element_tools.forEach(function(e){l.createTool(n,e.title||"",e.className||"",e.iconClass||"bi bi-wrench",e.on)}),l.createTool(n,l.t("tool.delete_element"),"ge-delete-element","bi bi-trash",function(){l.deleteNode("element",t,l.t("confirm.delete_element"),function(e){t.animate({opacity:"hide",height:"hide"},300,e)})}))})})}return{methods:{createElement:function(e,t){return t=t||{},e=a('<div class="ge-element" />').attr("data-ge-element",t.type||"element").append(e),void 0!==t.label&&e.attr("data-ge-label",t.label),l.place(e,"element",t)}},kindOf:function(e){return e.hasClass("ge-element")?"element":null},onInit:e,onDeinit:function(){l.canvas.find(".ge-element").each(function(){var e=a(this).removeClass("ge-element").removeAttr("contenteditable");e.attr("class")||e.removeAttr("class")})},onContentReady:e,onSortable:function(e){t()&&e(l.canvas.find(".ge-content"),{draggable:".ge-element",group:"element"})}}}})(jQuery);
+(s=>{s.extend(s.fn.gridEditor.locales.en,{"tool.delete_element":"Remove element","tool.element_info":"Element: {name}","confirm.delete_element":"Delete element?"}),s.fn.gridEditor.features.elements=function(a){var o=!1;function e(){return"auto"!==a.settings.elements.enabled?a.settings.elements.enabled:a.settings.elements.auto||0<a.canvas.find(a.settings.elements.selector).length}return{methods:{createElement:function(e,t){t=t||{};var n,l,e=s('<div class="ge-element" />').attr("data-ge-element",t.type||"element").append(e);return void 0!==t.label&&e.attr("data-ge-label",t.label),a.place(e,"element",(n=t,l=s.extend({},n),[["appendTo","insertAfter"],["prependTo","insertBefore"]].forEach(function(e){var t=void 0!==n[e[0]]?s(n[e[0]]):null;t&&t.is(".ge-content")&&(o||(o=!0,a.warn("createElement: an element is a block of the column since 6.0, not part of a content area's text; it goes beside the content area. Place it in a column instead.")),delete l[e[0]],l[e[1]]=t.parent(".ge-text-block").length?t.parent():t)}),l))}},kindOf:function(e){return e.hasClass("ge-element")?"element":null},cuts:function(){return e()?a.settings.elements.auto?"*":a.settings.elements.selector:null},blocks:".ge-element",accepts:function(e,t){return!t.hasClass("ge-element")||e.is(".column")},onInit:function(){e()&&a.canvas.find(".column").children().each(function(){var e,t,n,l=s(this);!l.hasClass("ge-element")&&(e=l,a.settings.elements.auto?e.is(".row, .ge-content, .ge-text-block, [data-ge-container], .ge-tools-drawer, .ge-resize-handle"):!e.is(a.settings.elements.selector))||(l.addClass("ge-element"),l.find("> .ge-tools-drawer").length)||(t=l,n=s('<div class="ge-tools-drawer ge-element-drawer" />').prependTo(t),a.createMoveTool(n),a.createTool(n,a.t("tool.element_info",{name:(e=>{var t=e.attr("data-ge-element"),n=e.attr("data-ge-label");return n&&t?n+" ("+t+")":n||t||e[0].tagName.toLowerCase()})(t)}),"ge-element-info","bi bi-info-circle"),a.addSettingsTool(n,t,a.settings.element_classes),a.settings.element_tools.forEach(function(e){a.createTool(n,e.title||"",e.className||"",e.iconClass||"bi bi-wrench",e.on)}),a.createTool(n,a.t("tool.delete_element"),"ge-delete-element","bi bi-trash",function(){a.deleteNode("element",t,a.t("confirm.delete_element"),function(e){t.animate({opacity:"hide",height:"hide"},300,e)})}))})},onDeinit:function(){a.canvas.find(".ge-element").each(function(){var e=s(this).removeClass("ge-element");e.attr("class")||e.removeAttr("class")})}}}})(jQuery);
 //# sourceMappingURL=grideditor.elements.min.js.map

package/dist/plugins/grideditor.elements.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"grideditor.elements.min.js","sources":["../../src/js/plugins/grideditor.elements.js"],"names":["$","extend","fn","gridEditor","locales","en","tool.delete_element","tool.element_info","confirm.delete_element","features","elements","ge","elementsEnabled","settings","enabled","auto","canvas","find","selector","length","markElements","each","contentArea","this","children","element","drawer","addClass","attr","prependTo","createMoveTool","createTool","t","name","type","label","tagName","toLowerCase","addSettingsTool","element_classes","element_tools","forEach","hostTool","title","className","iconClass","on","deleteNode","removed","animate","opacity","height","methods","createElement","content","options","append","undefined","place","kindOf","node","hasClass","onInit","onDeinit","removeClass","removeAttr","onContentReady","onSortable","sortable","draggable","group","jQuery"],"mappings":"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"}
+{"version":3,"file":"grideditor.elements.min.js","sources":["../../src/js/plugins/grideditor.elements.js"],"names":["$","extend","fn","gridEditor","locales","en","tool.delete_element","tool.element_info","confirm.delete_element","features","elements","ge","warnedIntoText","elementsEnabled","settings","enabled","auto","canvas","find","selector","length","methods","createElement","content","options","placed","element","attr","type","append","undefined","label","place","forEach","pair","target","is","warn","parent","kindOf","node","hasClass","cuts","blocks","accepts","region","onInit","children","each","drawer","this","addClass","prependTo","createMoveTool","createTool","t","name","tagName","toLowerCase","addSettingsTool","element_classes","element_tools","hostTool","title","className","iconClass","on","deleteNode","removed","animate","opacity","height","onDeinit","removeClass","removeAttr","jQuery"],"mappings":"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"}

package/dist/plugins/grideditor.summernote.js

@@ -10,7 +10,8 @@
  *   <script src="dist/jquery.grideditor.min.js"></script>
  *   <script src="dist/plugins/grideditor.summernote.min.js"></script>
  *
- * Up to 6.0 the main bundle carries a copy of this file too.
+ * Up to 5.x the main bundle carried a copy of this file; since 6.0 it is
+ * loaded on its own, like every plugin.
  */
 (function($) {
 

package/dist/plugins/grideditor.summernote.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"grideditor.summernote.min.js","sources":["../../src/js/plugins/grideditor.summernote.js"],"names":["$","extend","fn","gridEditor","locales","en","text.summernote","INITIAL_CONTENT","texts","summernote","ge","labelKey","initialContent","missingKey","available","start","contentAreas","settings","now","Date","each","configuration","contentArea","this","hasClass","html","addClass","config","tabsize","airMode","callbacks","onInit","callback","err","call","textReady","stop","filter","removeClass","removeAttr","jQuery"],"mappings":"CAcUA,IAENA,EAAEC,OAAOD,EAAEE,GAAGC,WAAWC,QAAQC,GAAI,CACjCC,kBAAmB,YACvB,CAAC,EAED,IAAIC,EAAkB,6BAEtBP,EAAEE,GAAGC,WAAWK,MAAMC,WAAa,SAASC,GACxC,MAAO,CACHC,SAAU,kBACVC,eAAgBL,EAChBM,WAAY,2BAEZC,UAAW,WAAa,MAAO,CAAC,CAACd,EAAEE,GAAGO,UAAY,EAElDM,MAAO,SAASC,GACZ,IAAIC,EAAWP,EAAGO,SAKbjB,EAAEkB,MAAOlB,EAAEkB,IAAMC,KAAKD,KAE3BF,EAAaI,KAAK,WACd,IAQIC,EARAC,EAActB,EAAEuB,IAAI,EACpBD,EAAYE,SAAS,QAAQ,IAE7BF,EAAYG,KAAK,GAAKlB,GACtBe,EAAYG,KAAK,EAAE,EAEvBH,EAAYI,SAAS,QAAQ,EAEzBL,EAAgBrB,EAAEC,OAClB,CAAA,EACA,GACCgB,EAASR,YAAcQ,EAASR,WAAWkB,OAASV,EAASR,WAAWkB,OAAS,GAClF,CACIC,QAAS,EACTC,QAAS,CAAA,EAETC,UAAW,CACPC,OAAQ,WAGJ,IAAIC,EACJ,IACIA,EAAWf,EAASR,WAAWkB,OAAOG,UAAUC,MAGpD,CAFE,MAAOE,IAGLD,GACAA,EAASE,KAAKX,IAAI,EAMtBb,EAAGyB,UAAUb,CAAW,EAExBA,EAAYb,WAAW,OAAO,CAClC,CACJ,CACJ,CACJ,EACAa,EAAYb,WAAWY,CAAa,EACxC,CAAC,CACL,EAEAe,KAAM,SAASpB,GACXA,EAAaqB,OAAO,SAAS,EAAEjB,KAAK,WAChC,IAAIE,EAActB,EAAEuB,IAAI,EACxBD,EAAYb,WAAW,SAAS,EAChCa,EACKgB,YAAY,QAAQ,EACpBC,WAAW,IAAI,EACfA,WAAW,OAAO,EAClBA,WAAW,YAAY,CAEhC,CAAC,CACL,CACJ,CACJ,CACH,GAAEC,MAAM"}
+{"version":3,"file":"grideditor.summernote.min.js","sources":["../../src/js/plugins/grideditor.summernote.js"],"names":["$","extend","fn","gridEditor","locales","en","text.summernote","INITIAL_CONTENT","texts","summernote","ge","labelKey","initialContent","missingKey","available","start","contentAreas","settings","now","Date","each","configuration","contentArea","this","hasClass","html","addClass","config","tabsize","airMode","callbacks","onInit","callback","err","call","textReady","stop","filter","removeClass","removeAttr","jQuery"],"mappings":"CAeUA,IAENA,EAAEC,OAAOD,EAAEE,GAAGC,WAAWC,QAAQC,GAAI,CACjCC,kBAAmB,YACvB,CAAC,EAED,IAAIC,EAAkB,6BAEtBP,EAAEE,GAAGC,WAAWK,MAAMC,WAAa,SAASC,GACxC,MAAO,CACHC,SAAU,kBACVC,eAAgBL,EAChBM,WAAY,2BAEZC,UAAW,WAAa,MAAO,CAAC,CAACd,EAAEE,GAAGO,UAAY,EAElDM,MAAO,SAASC,GACZ,IAAIC,EAAWP,EAAGO,SAKbjB,EAAEkB,MAAOlB,EAAEkB,IAAMC,KAAKD,KAE3BF,EAAaI,KAAK,WACd,IAQIC,EARAC,EAActB,EAAEuB,IAAI,EACpBD,EAAYE,SAAS,QAAQ,IAE7BF,EAAYG,KAAK,GAAKlB,GACtBe,EAAYG,KAAK,EAAE,EAEvBH,EAAYI,SAAS,QAAQ,EAEzBL,EAAgBrB,EAAEC,OAClB,CAAA,EACA,GACCgB,EAASR,YAAcQ,EAASR,WAAWkB,OAASV,EAASR,WAAWkB,OAAS,GAClF,CACIC,QAAS,EACTC,QAAS,CAAA,EAETC,UAAW,CACPC,OAAQ,WAGJ,IAAIC,EACJ,IACIA,EAAWf,EAASR,WAAWkB,OAAOG,UAAUC,MAGpD,CAFE,MAAOE,IAGLD,GACAA,EAASE,KAAKX,IAAI,EAMtBb,EAAGyB,UAAUb,CAAW,EAExBA,EAAYb,WAAW,OAAO,CAClC,CACJ,CACJ,CACJ,EACAa,EAAYb,WAAWY,CAAa,EACxC,CAAC,CACL,EAEAe,KAAM,SAASpB,GACXA,EAAaqB,OAAO,SAAS,EAAEjB,KAAK,WAChC,IAAIE,EAActB,EAAEuB,IAAI,EACxBD,EAAYb,WAAW,SAAS,EAChCa,EACKgB,YAAY,QAAQ,EACpBC,WAAW,IAAI,EACfA,WAAW,OAAO,EAClBA,WAAW,YAAY,CAEhC,CAAC,CACL,CACJ,CACJ,CACH,GAAEC,MAAM"}

package/dist/plugins/grideditor.tinymce.js

@@ -10,7 +10,8 @@
  *   <script src="dist/jquery.grideditor.min.js"></script>
  *   <script src="dist/plugins/grideditor.tinymce.min.js"></script>
  *
- * Up to 6.0 the main bundle carries a copy of this file too.
+ * Up to 5.x the main bundle carried a copy of this file; since 6.0 it is
+ * loaded on its own, like every plugin.
  */
 (function($) {
 

package/dist/plugins/grideditor.tinymce.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"grideditor.tinymce.min.js","sources":["../../src/js/plugins/grideditor.tinymce.js"],"names":["$","cleanUp","contentArea","removeClass","removeAttr","extend","fn","gridEditor","locales","en","text.tinymce","INITIAL_CONTENT","texts","tinymce","ge","labelKey","initialContent","missingKey","available","window","start","contentAreas","settings","userConfig","config","each","configuration","this","hasClass","html","addClass","promotion","target","inline","init_instance_callback","editor","data","removeData","remove","textReady","on","requestAnimationFrame","removed","ui","show","focus","call","oninit","selector","init","stop","filter","jQuery"],"mappings":"CAcUA,IASN,SAASC,EAAQC,GACbA,EACKC,YAAY,QAAQ,EACpBA,YAAY,eAAe,EAC3BC,WAAW,IAAI,EACfA,WAAW,OAAO,EAClBA,WAAW,YAAY,EACvBA,WAAW,iBAAiB,EAC5BA,WAAW,gBAAgB,CAEpC,CAjBAJ,EAAEK,OAAOL,EAAEM,GAAGC,WAAWC,QAAQC,GAAI,CACjCC,eAAgB,SACpB,CAAC,EAiBD,IAAIC,EAAkB,6BAEtBX,EAAEM,GAAGC,WAAWK,MAAMC,QAAU,SAASC,GACrC,MAAO,CACHC,SAAU,eACVC,eAAgBL,EAChBM,WAAY,wBAEZC,UAAW,WAAa,MAAO,CAAC,CAACC,OAAON,OAAS,EAEjDO,MAAO,SAASC,GACZ,IAAIC,EAAWR,EAAGQ,SACdC,EAAcD,EAAST,SAAWS,EAAST,QAAQW,OAAUF,EAAST,QAAQW,OAAS,GAE3FH,EAAaI,KAAK,WACd,IAQIC,EARAxB,EAAcF,EAAE2B,IAAI,EACpBzB,EAAY0B,SAAS,QAAQ,IAE7B1B,EAAY2B,KAAK,GAAKlB,GACtBT,EAAY2B,KAAK,EAAE,EAEvB3B,EAAY4B,SAAS,QAAQ,EAgF7B,OA9EIJ,EAAgB1B,EAAEK,OAAO,CAKzB0B,UAAW,CAAA,CACf,EAAGR,EAAY,CACXS,OAAQL,KACRM,OAAQ,CAAA,EACRC,uBAAwB,SAASC,GAEzBjC,EAAYkC,KAAK,2BAA2B,GAC5ClC,EAAYmC,WAAW,2BAA2B,EAClDF,EAAOG,OAAO,EAGdrC,EAAQC,CAAW,IAIvBA,EAAYkC,KAAK,aAAcD,CAAM,EAMrCrB,EAAGyB,UAAUrC,CAAW,EAMxBiC,EAAOK,GAAG,YAAa,WACnB1B,EAAGyB,UAAUrC,CAAW,CAC5B,CAAC,EAUDiB,OAAOsB,sBAAsB,WACrBN,CAAAA,EAAOO,SAAYP,EAAOQ,IAAOR,EAAOQ,GAAGC,MAE/CT,EAAOQ,GAAGC,KAAK,CACnB,CAAC,EAODT,EAAOK,GAAG,QAAS,WACfrB,OAAOsB,sBAAsB,WACrBN,CAAAA,EAAOO,SAAYP,EAAOQ,IAAOR,EAAOQ,GAAGC,MAE/CT,EAAOQ,GAAGC,KAAK,CACnB,CAAC,CACL,CAAC,EAGDT,EAAOU,MAAM,EAGTtB,EAAWW,wBACXX,EAAWW,uBAAuBY,KAAKnB,KAAMQ,CAAM,EAGnDZ,EAAWwB,QACXxB,EAAWwB,OAAOD,KAAKnB,KAAMQ,CAAM,EAE3C,CACJ,CAAC,GAGoBa,SAErB7B,OAAON,QAAQoC,KAAKvB,CAAa,EACrC,CAAC,CACL,EAEAwB,KAAM,SAAS7B,GACXA,EAAa8B,OAAO,SAAS,EAAE1B,KAAK,WAChC,IAAIvB,EAAcF,EAAE2B,IAAI,EACpBQ,EAASjC,EAAYkC,KAAK,YAAY,EAEtCD,GACAjC,EAAYmC,WAAW,YAAY,EACnCF,EAAOG,OAAO,GAIdpC,EAAYkC,KAAK,4BAA6B,CAAA,CAAI,EAGtDnC,EAAQC,CAAW,CACvB,CAAC,CACL,CACJ,CACJ,CACH,GAAEkD,MAAM"}
+{"version":3,"file":"grideditor.tinymce.min.js","sources":["../../src/js/plugins/grideditor.tinymce.js"],"names":["$","cleanUp","contentArea","removeClass","removeAttr","extend","fn","gridEditor","locales","en","text.tinymce","INITIAL_CONTENT","texts","tinymce","ge","labelKey","initialContent","missingKey","available","window","start","contentAreas","settings","userConfig","config","each","configuration","this","hasClass","html","addClass","promotion","target","inline","init_instance_callback","editor","data","removeData","remove","textReady","on","requestAnimationFrame","removed","ui","show","focus","call","oninit","selector","init","stop","filter","jQuery"],"mappings":"CAeUA,IASN,SAASC,EAAQC,GACbA,EACKC,YAAY,QAAQ,EACpBA,YAAY,eAAe,EAC3BC,WAAW,IAAI,EACfA,WAAW,OAAO,EAClBA,WAAW,YAAY,EACvBA,WAAW,iBAAiB,EAC5BA,WAAW,gBAAgB,CAEpC,CAjBAJ,EAAEK,OAAOL,EAAEM,GAAGC,WAAWC,QAAQC,GAAI,CACjCC,eAAgB,SACpB,CAAC,EAiBD,IAAIC,EAAkB,6BAEtBX,EAAEM,GAAGC,WAAWK,MAAMC,QAAU,SAASC,GACrC,MAAO,CACHC,SAAU,eACVC,eAAgBL,EAChBM,WAAY,wBAEZC,UAAW,WAAa,MAAO,CAAC,CAACC,OAAON,OAAS,EAEjDO,MAAO,SAASC,GACZ,IAAIC,EAAWR,EAAGQ,SACdC,EAAcD,EAAST,SAAWS,EAAST,QAAQW,OAAUF,EAAST,QAAQW,OAAS,GAE3FH,EAAaI,KAAK,WACd,IAQIC,EARAxB,EAAcF,EAAE2B,IAAI,EACpBzB,EAAY0B,SAAS,QAAQ,IAE7B1B,EAAY2B,KAAK,GAAKlB,GACtBT,EAAY2B,KAAK,EAAE,EAEvB3B,EAAY4B,SAAS,QAAQ,EAgF7B,OA9EIJ,EAAgB1B,EAAEK,OAAO,CAKzB0B,UAAW,CAAA,CACf,EAAGR,EAAY,CACXS,OAAQL,KACRM,OAAQ,CAAA,EACRC,uBAAwB,SAASC,GAEzBjC,EAAYkC,KAAK,2BAA2B,GAC5ClC,EAAYmC,WAAW,2BAA2B,EAClDF,EAAOG,OAAO,EAGdrC,EAAQC,CAAW,IAIvBA,EAAYkC,KAAK,aAAcD,CAAM,EAMrCrB,EAAGyB,UAAUrC,CAAW,EAMxBiC,EAAOK,GAAG,YAAa,WACnB1B,EAAGyB,UAAUrC,CAAW,CAC5B,CAAC,EAUDiB,OAAOsB,sBAAsB,WACrBN,CAAAA,EAAOO,SAAYP,EAAOQ,IAAOR,EAAOQ,GAAGC,MAE/CT,EAAOQ,GAAGC,KAAK,CACnB,CAAC,EAODT,EAAOK,GAAG,QAAS,WACfrB,OAAOsB,sBAAsB,WACrBN,CAAAA,EAAOO,SAAYP,EAAOQ,IAAOR,EAAOQ,GAAGC,MAE/CT,EAAOQ,GAAGC,KAAK,CACnB,CAAC,CACL,CAAC,EAGDT,EAAOU,MAAM,EAGTtB,EAAWW,wBACXX,EAAWW,uBAAuBY,KAAKnB,KAAMQ,CAAM,EAGnDZ,EAAWwB,QACXxB,EAAWwB,OAAOD,KAAKnB,KAAMQ,CAAM,EAE3C,CACJ,CAAC,GAGoBa,SAErB7B,OAAON,QAAQoC,KAAKvB,CAAa,EACrC,CAAC,CACL,EAEAwB,KAAM,SAAS7B,GACXA,EAAa8B,OAAO,SAAS,EAAE1B,KAAK,WAChC,IAAIvB,EAAcF,EAAE2B,IAAI,EACpBQ,EAASjC,EAAYkC,KAAK,YAAY,EAEtCD,GACAjC,EAAYmC,WAAW,YAAY,EACnCF,EAAOG,OAAO,GAIdpC,EAAYkC,KAAK,4BAA6B,CAAA,CAAI,EAGtDnC,EAAQC,CAAW,CACvB,CAAC,CACL,CACJ,CACJ,CACH,GAAEkD,MAAM"}

package/docs/events.md

@@ -130,9 +130,10 @@ the clipboard plugin put in, from a paste tool or the toolbar. A paste is an add
 like any other, so canceling its `before-add-*` turns it away.
 
 A text block is `kind: 'text'`, with its content area as the node, when it is
-added or deleted, and in `drawerTools`. Dragged between columns it is still
-`kind: 'content'`, as it was in 5.x; 6.0 makes that `text` too. The kinds for containers are the container's own type, so a listener
-can tell a tabs container from an accordion without reading the markup.
+added, deleted or moved, and in `drawerTools`. Up to 5.x a content area
+dragged between columns was `kind: 'content'`. The kinds for containers are
+the container's own type, so a listener can tell a tabs container from an
+accordion without reading the markup.
 
 
 Canceling, and what it can honestly do

package/docs/plugins.md

@@ -149,7 +149,8 @@ $.fn.gridEditor.features.elements = function(ge) {
         kindOf: function(node) { … },    // what an event calls this node
         onInit: function() { … },        // every init: put the furniture in
         onDeinit: function() { … },      // every deinit: take it out again
-        onContentReady: function(area) { … },  // a rich text editor just took over
+        onContentReady: function(area) { … },  // a rich text editor just took over, or rewrote a text
+        cuts: '[data-my-block]',          // what cuts a text: a block of the column, never part of a text
         onSortable: function(sortable) { … },  // declare your own sortable lists
         blocks: '.ge-section',            // more blocks the canvas and the columns move
         regions: '.ge-section',           // more lists those blocks move in
@@ -167,6 +168,12 @@ needs to put a new kind of block on the canvas:
   rows, content areas and containers, the editor's own blocks.
 - **`regions`** is a selector for more lists those blocks move in, in the same
   group, so a row dragged from the canvas can land in one.
+- **`cuts`** is a selector, or a function returning one, for nodes that are
+  never part of a text: blocks of the column. The editor cuts a content area
+  at each of its own children that matches - the text before it stays, the
+  node goes into the column, the text after goes into a new content area -
+  which is how the elements plugin takes 5.x's elements out of their text. Rows
+  and containers always cut.
 - **`accepts(region, node)`** can turn a block away from a list: `false` and the
   drag will not drop it there, whoever's block and whoever's list. With none of
   these hooks, every block goes everywhere, as before.
@@ -194,21 +201,12 @@ animation for rows, columns, containers and elements, kept in a
   takes off. `getHtml` keeps every attribute that is not the editor's.
 - **The dialog lives outside the canvas**, appended to `body`, so it is never
   part of the markup.
-- **An element sits inside text a rich text editor may be editing.** Written
-  behind its back, the attribute is lost the next time the user undoes
-  something: undo restores a snapshot from before it. With tinyMCE, write it
-  through the editor's undo manager, and it becomes a step of its own:
-
-  ```javascript
-  var area = node.closest('.ge-content')[0];
-  var editor = window.tinymce && tinymce.get().filter(function(e) { return e.getBody() === area; })[0];
-  var apply = function() { node.attr('data-animation', JSON.stringify(value)); };
-
-  if (editor) { editor.undoManager.transact(apply); } else { apply(); }
-  ```
-
-  Rows, columns, sections and containers are outside any content area, and a
-  plain `attr()` is all they need.
+- **Nothing else.** A plain `attr()` on any node. An element is never inside a
+  text editor since 6.0, and a text's own attributes, given while its editor
+  is open, are kept by grid-editor when the editor closes - tinyMCE would put
+  back the ones it found when it opened. Up to 5.x an element sat inside the
+  text, and an attribute written behind the editor's back was lost to its
+  undo.
 
 A node's drawer is built again on every `init`, so a tool reads the node
 rather than remembering anything about it.
@@ -298,9 +296,8 @@ $.fn.gridEditor.texts.mytext = function(ge) {
 A text editor is chosen by `content_types`, never by the `plugins` setting: a
 page that names its containers there has named no editor.
 
-Up to 6.0 the main bundle carries a copy of the three shipped ones, marked
-`bundled`; editing with a copy warns once that 6.0 leaves them out. A plugin's
-own file, loaded after, registers itself again and is the one used.
+Up to 5.x the main bundle carried a copy of the three shipped ones; since 6.0
+a page loads the plugin of the editor it uses, as it loads any other.
 
 5.x's `$.fn.gridEditor.RTEs.mytext = { init, deinit, initialContent }` still
 works: `init(settings, contentAreas)` and `deinit(settings, contentAreas)` are

package/example/attributes.html

@@ -69,40 +69,19 @@
                 }
 
                 /**
-                 * An element lives inside a content area, and while a rich
-                 * text editor is open there, a change it does not know about
-                 * is one its undo would take back: undoing the next thing the
-                 * user types restores a snapshot from before the attribute.
-                 * Made through tinyMCE's undo manager, it is a step of its
-                 * own, which undo and redo treat like any other.
+                 * A plain attr() on any node: an element is never inside a
+                 * text editor since 6.0, and a text's own attributes, given
+                 * while its editor is open, are kept by grid-editor when the
+                 * editor closes.
                  */
                 function write(node, value) {
-                    var apply = function() {
-                        if (value) {
-                            node.attr(ATTRIBUTE, JSON.stringify(value));
-                        } else {
-                            node.removeAttr(ATTRIBUTE);
-                        }
-                    };
-                    var editor = editorAround(node);
-
-                    if (editor) {
-                        editor.undoManager.transact(apply);
+                    if (value) {
+                        node.attr(ATTRIBUTE, JSON.stringify(value));
                     } else {
-                        apply();
+                        node.removeAttr(ATTRIBUTE);
                     }
                 }
 
-                /** The tinyMCE editor open on the content area around node, if there is one. */
-                function editorAround(node) {
-                    var area = node.closest('.ge-content');
-                    if (!area.length || !window.tinymce) { return null; }
-
-                    return window.tinymce.get().filter(function(editor) {
-                        return editor.getBody && editor.getBody() === area[0];
-                    })[0] || null;
-                }
-
                 /** Built once, outside the canvas, so it is never part of getHtml. */
                 function dialog() {
                     if (modal) { return modal; }
@@ -297,12 +276,13 @@
                     an animation has its tool highlighted.
                 </p>
                 <p class="form-text">
-                    The quote is an element, inside text tinyMCE edits. Open the
-                    editor there, set an animation on the quote, keep typing
-                    and press <kbd>Ctrl</kbd>+<kbd>Z</kbd>: the text goes, the
-                    animation stays, because the plugin wrote it through
-                    tinyMCE&rsquo;s undo manager. Written behind its back,
-                    undoing the typing would undo the attribute with it.
+                    Open tinyMCE on a text and set an animation on that same
+                    text, from its drawer, while you are typing: the attribute
+                    is kept when the editor closes, although tinyMCE puts back
+                    the attributes it found when it opened. The plugin does
+                    nothing special for that - a plain <code>attr()</code> -
+                    and nothing special for the quote either, which is an
+                    element: a block beside the texts, never inside one.
                 </p>
                 <p class="form-text">
                     <em>Open as a published page</em> puts the plain html in a
@@ -325,11 +305,15 @@
             </div>
             <div class="row">
                 <div class="col-lg-6">
-                    <p>Ordinary text, edited by tinyMCE.</p>
+                    <div class="ge-content" data-ge-content-type="tinymce">
+                        <p>Ordinary text, edited by tinyMCE.</p>
+                    </div>
                     <blockquote class="blockquote" data-ge-element="quote" data-ge-label="Quote">
-                        <p>An element: give it an animation while you edit the text around it.</p>
+                        <p>An element, beside the texts: give it an animation.</p>
                     </blockquote>
-                    <p>More text, after the element.</p>
+                    <div class="ge-content" data-ge-content-type="tinymce">
+                        <p>More text, after the element.</p>
+                    </div>
                 </div>
                 <div class="col-lg-6">
                     <div data-ge-container="card">

package/example/elements.html

@@ -49,8 +49,8 @@
                     selector: '[data-ge-element]',
 
                     // Turn this on for a page that configures no rich text
-                    // editor and injects its own markup: every child of a
-                    // content area is then an element.
+                    // editor and injects its own markup: every loose node of
+                    // a column is then an element.
                     auto: false,
                 },
 
@@ -74,11 +74,11 @@
             // own save step. Grid editor needs no feature for this - the
             // element level controls already apply (spec 4.4).
             $('#addTag').on('click', function() {
-                var contentArea = $('#myGrid .ge-content').first();
+                var column = $('#myGrid .column').first();
 
                 $('#myGrid').gridEditor('createElement',
                     '<span class="my-app-tag-placeholder">Analytics tag</span>',
-                    { type: 'analytics-tag', label: 'Analytics', appendTo: contentArea }
+                    { type: 'analytics-tag', label: 'Analytics', appendTo: column }
                 );
             });
 
@@ -103,17 +103,20 @@
             <div class="col-lg-8">
                 <h1 class="h4">Element level controls</h1>
                 <p class="form-text">
-                    An element is a node inside a content area that the editor
-                    treats as one movable, deletable thing instead of as rich
-                    text. The host marks them with
-                    <code>data-ge-element</code>, optionally naming them with
-                    <code>data-ge-label</code>. Each one gets a drawer of its
-                    own: move, an info tool, the host's own tools, and delete.
-                    They drag between content areas as well as within one.
+                    An element is a node the editor treats as one movable,
+                    deletable block instead of as rich text: a block of the
+                    column, beside its texts, its rows and its containers. The
+                    host marks them with <code>data-ge-element</code>,
+                    optionally naming them with <code>data-ge-label</code>.
+                    Each one gets a drawer of its own: move, an info tool, the
+                    host's own tools, and delete. They drag within a column and
+                    between columns.
                 </p>
                 <p class="form-text">
-                    Click the text around an element to edit it as text; the
-                    element itself stays atomic while the editor is open.
+                    Click a text to edit it; an element is never part of the
+                    text an editor edits. Markup that 5.x saved, with elements
+                    inside a content area's text, still loads: they come out of
+                    it, into the column.
                 </p>
                 <button class="btn btn-sm btn-secondary" id="addTag" type="button">Add an analytics tag</button>
                 <button class="btn btn-sm btn-secondary" id="output" type="button">Show the html this produces</button>
@@ -127,22 +130,24 @@
                 <div class="col-lg-6">
                     <div class="ge-content" data-ge-content-type="tinymce">
                         <p>Ordinary text, edited in place by tinyMCE.</p>
+                    </div>
 
-                        <blockquote class="my-app-quote" data-ge-element="quote" data-ge-label="Pull quote">
-                            <p>An element the host owns and styles.</p>
-                        </blockquote>
+                    <blockquote class="my-app-quote" data-ge-element="quote" data-ge-label="Pull quote">
+                        <p>An element the host owns and styles.</p>
+                    </blockquote>
 
+                    <div class="ge-content" data-ge-content-type="tinymce">
                         <p>More ordinary text, after the element.</p>
                     </div>
                 </div>
                 <div class="col-lg-6">
                     <div class="ge-content" data-ge-content-type="tinymce">
-                        <p>A second content area. Drag an element's drawer from
+                        <p>A second column. Drag an element's drawer from
                         the left column into this one.</p>
+                    </div>
 
-                        <div data-ge-element="figure" data-ge-label="Figure">
-                            <p><strong>Figure 1.</strong> Another element, of a different type.</p>
-                        </div>
+                    <div data-ge-element="figure" data-ge-label="Figure">
+                        <p><strong>Figure 1.</strong> Another element, of a different type.</p>
                     </div>
                 </div>
             </div>

package/example/plugins.html

@@ -180,12 +180,12 @@
                 <div class="col-lg-12">
                     <div class="ge-content">
                         <p>Ordinary text in a content area.</p>
-
-                        <blockquote data-ge-element="quote" data-ge-label="Pull quote">
-                            <p>A node the host marked: an element when the elements plugin is on,
-                            ordinary markup when it is off.</p>
-                        </blockquote>
                     </div>
+
+                    <blockquote data-ge-element="quote" data-ge-label="Pull quote">
+                        <p>A node the host marked: an element when the elements plugin is on,
+                        ordinary markup - text - when it is off.</p>
+                    </blockquote>
                 </div>
             </div>
 

package/example/utilities.html

@@ -154,7 +154,7 @@
                     <blockquote data-ge-element="quote" data-ge-label="Pull quote" class="float-sm-end ms-sm-3 p-3 border-start border-4">
                         A floated element, <code>float-sm-end</code>.
                     </blockquote>
-                    <p>The text of the content area flows round the quote from tablet up, and runs under it on phones, where it does not float. Switch between Phone and Tablet in the dropdown to see it move, or choose another float in the element's panel.</p>
+                    <p>The text after it flows round the quote from tablet up, and runs under it on phones, where it does not float. Switch between Phone and Tablet in the dropdown to see it move, or choose another float in the element's panel.</p>
                     <p>A second paragraph, so there is enough text to flow.</p>
                 </div>
             </div>

package/package.json

@@ -34,7 +34,7 @@
     "comment": "A scoped package publishes restricted unless it is told otherwise.",
     "access": "public"
   },
-  "version": "5.3.0",
+  "version": "6.0.0-beta.1",
   "main": "dist/jquery.grideditor.js",
   "files": [
     "dist",