@themarioga/grid-editor 8.1.0 → 8.2.0

package/dist/grideditor.d.ts

@@ -107,6 +107,8 @@ export interface GridEditorOptions {
     text_tools?: HostTool[];
     drag_handle?: 'tool' | 'drawer';
     toolbar_drag?: 'auto' | boolean;
+    /** A click in a column or a section makes it where the toolbar's buttons add. Default false. */
+    active_target?: boolean;
     /** The plugins to use, of any kind; null is every one loaded. */
     plugins?: string[] | null;
     /** The text editors offered, in order. */
@@ -218,6 +220,13 @@ export interface ViewChangePayload {
     to: View;
 }
 
+/** The active target changed: the column or region the toolbar adds to, or null for the canvas. */
+export interface TargetChangePayload {
+    canvas: HTMLElement;
+    target: HTMLElement | null;
+    from: HTMLElement | null;
+}
+
 /** The events, by name, with their payloads. Adding fires a specific name and the generic one. */
 export interface GridEditorEventMap {
     'grideditor:before-add': Payload;
@@ -255,6 +264,7 @@ export interface GridEditorEventMap {
     'grideditor:after-copy': Payload;
     'grideditor:popup-orphan': PopupOrphanPayload;
     'grideditor:view-change': ViewChangePayload;
+    'grideditor:target-change': TargetChangePayload;
 }
 
 /** An event the editor dispatches on its canvas: a CustomEvent whose detail is the payload. */
@@ -343,6 +353,10 @@ export declare class GridEditor {
     /** Take the editor off: the markup stays, everything else goes. */
     destroy(): this;
     changeView(view: View): this;
+    /** The column or region the toolbar adds to, or null. Null without active_target. */
+    getActiveTarget(): HTMLElement | null;
+    /** Make a column or region, or the first a selector matches, where the toolbar adds; null for none. */
+    setActiveTarget(target: HTMLElement | string | null): this;
     getView(): View;
     setLocale(code: string): this;
     createRow(layout?: RowLayout, options?: Placement): HTMLElement | null;

package/dist/grideditor.esm.js

@@ -325,7 +325,9 @@ var METHODS = {
   addAccordionItem: { value: true },
   setLocale: {},
   getUtility: { value: true },
-  setUtility: { value: true }
+  setUtility: { value: true },
+  getActiveTarget: { value: true },
+  setActiveTarget: {}
 };
 var PLACEMENTS = ["appendTo", "prependTo", "insertAfter", "insertBefore"];
 var BREAKPOINTS = [
@@ -568,6 +570,8 @@ function build(instance, baseElem, optionsOrMethod) {
     // 'tool' for the move tool, 'drawer' for the whole drawer
     "toolbar_drag": "auto",
     // Drag the toolbar's buttons onto the canvas. 'auto' follows drag_handle
+    "active_target": false,
+    // A click in a column makes it where the toolbar's buttons add
     "element_tools": [],
     // Host tools on element drawers, same shape as row_tools
     "element_classes": [],
@@ -629,6 +633,7 @@ function build(instance, baseElem, optionsOrMethod) {
   var sizePicker = null;
   var sourceOpen = false;
   var dropMarker = null;
+  var activeTarget = null;
   var warnedHere = {};
   var sortables = [];
   var instanceId = ++editorCounter;
@@ -1033,6 +1038,34 @@ function build(instance, baseElem, optionsOrMethod) {
         e.preventDefault();
       }
     }, signal);
+    if (settings.active_target) {
+      var pressed = null;
+      canvas.addEventListener("pointerdown", function(e) {
+        pressed = { x: e.clientX, y: e.clientY };
+      }, signal);
+      canvas.addEventListener("click", function(e) {
+        var from = pressed;
+        pressed = null;
+        if (!hasClass(canvas, "ge-editing")) {
+          return;
+        }
+        if (from && Math.abs(e.clientX - from.x) + Math.abs(e.clientY - from.y) > settings.drag.threshold) {
+          return;
+        }
+        var region = closest(e.target, targetSelector());
+        changeTarget(region && region !== canvas && canvas.contains(region) ? region : null);
+      }, signal);
+      document.addEventListener("keydown", function(e) {
+        if (e.key !== "Escape" || !activeTarget || openSettingsState || dialogState) {
+          return;
+        }
+        var focus = document.activeElement;
+        if (focus && (is(focus, "input, textarea, select") || focus.isContentEditable)) {
+          return;
+        }
+        changeTarget(null);
+      }, signal);
+    }
   }
   function textReady(block) {
     if (!is(block, ".ge-content") || !canvas.contains(block)) {
@@ -1058,6 +1091,10 @@ function build(instance, baseElem, optionsOrMethod) {
         "data-ge-layout": grouped ? JSON.stringify(layout) : layout.join(",")
       });
       btn.addEventListener("click", function() {
+        if (activeTarget) {
+          addToTarget(btn, "tool");
+          return;
+        }
         var row = rowFromLayoutValue(layout);
         var added = addNode("row", row, function() {
           canvas.appendChild(row);
@@ -1086,6 +1123,10 @@ function build(instance, baseElem, optionsOrMethod) {
       );
       attr(button, { "data-ge-toolbar": "container", "data-ge-container-type": type });
       button.addEventListener("click", function() {
+        if (activeTarget) {
+          addToTarget(button, "tool");
+          return;
+        }
         var row = createRow();
         var column = row.appendChild(createColumn(MAX_COL_SIZE));
         var container = column.appendChild(definition.create({}));
@@ -1179,6 +1220,10 @@ function build(instance, baseElem, optionsOrMethod) {
       "data-ge-item": index
     });
     button.addEventListener("click", function() {
+      if (activeTarget) {
+        addToTarget(button, item.source || "tool");
+        return;
+      }
       var made = item.create();
       var placed = item.inColumn ? inRowOfItsOwn(made) : made;
       var added = addNode(item.kind, made, function() {
@@ -1284,7 +1329,7 @@ function build(instance, baseElem, optionsOrMethod) {
     });
     return { region, before };
   }
-  function insertFeatureFromToolbar(button, where) {
+  function insertFeatureFromToolbar(button, where, source) {
     var item = FEATURES[button.getAttribute("data-ge-feature")].toolbar[parseInt(button.getAttribute("data-ge-item"), 10)];
     var made = item.create();
     var placed = made;
@@ -1303,7 +1348,7 @@ function build(instance, baseElem, optionsOrMethod) {
       } else {
         where.region.appendChild(placed);
       }
-    }, { parent: where.region, source: item.source || "dragdrop" });
+    }, { parent: where.region, source: item.source || source || "dragdrop" });
   }
   function inRowOfItsOwn(node) {
     var row = createRow();
@@ -1330,9 +1375,9 @@ function build(instance, baseElem, optionsOrMethod) {
       dropMarker.remove();
     }
   }
-  function insertFromToolbar(button, where) {
+  function insertFromToolbar(button, where, source) {
     if (button.getAttribute("data-ge-toolbar") === "feature") {
-      return insertFeatureFromToolbar(button, where);
+      return insertFeatureFromToolbar(button, where, source);
     }
     var container = button.getAttribute("data-ge-toolbar") === "container";
     var type = button.getAttribute("data-ge-container-type");
@@ -1347,7 +1392,7 @@ function build(instance, baseElem, optionsOrMethod) {
       } else {
         where.region.appendChild(placed);
       }
-    }, { parent: where.region, source: "dragdrop" });
+    }, { parent: where.region, source: source || "dragdrop" });
   }
   function widthFamily() {
     var values = [];
@@ -1587,6 +1632,7 @@ function build(instance, baseElem, optionsOrMethod) {
   }
   function openSource() {
     deinit();
+    changeTarget(null);
     htmlTextArea.style.height = 0.8 * document.documentElement.clientHeight + "px";
     htmlTextArea.value = canvas.innerHTML;
     show(htmlTextArea);
@@ -1602,6 +1648,32 @@ function build(instance, baseElem, optionsOrMethod) {
     init();
     hide(htmlTextArea);
   }
+  function targetSelector() {
+    return [".column"].concat(pluginHooks("regions")).join(", ");
+  }
+  function isTarget(node) {
+    return !!node && node !== canvas && canvas.contains(node) && is(node, targetSelector());
+  }
+  function changeTarget(node) {
+    if (node === activeTarget) {
+      return;
+    }
+    var from = activeTarget;
+    if (from) {
+      removeClass(from, "ge-active-target");
+    }
+    activeTarget = node;
+    if (node && hasClass(canvas, "ge-editing")) {
+      addClass(node, "ge-active-target");
+    }
+    emit("target-change", { canvas, target: node, from });
+  }
+  function addToTarget(button, source) {
+    var made = insertFromToolbar(button, { region: activeTarget, before: null }, source);
+    if (made && made.scrollIntoView) {
+      made.scrollIntoView({ behavior: "smooth" });
+    }
+  }
   function init() {
     if (openSettingsState && !attached(openSettingsState.node)) {
       closeSettings();
@@ -1625,10 +1697,18 @@ function build(instance, baseElem, optionsOrMethod) {
     makeResizable();
     switchLayout(curView);
     refreshPreviews(canvas);
+    if (activeTarget && !canvas.contains(activeTarget)) {
+      changeTarget(null);
+    } else if (activeTarget) {
+      addClass(activeTarget, "ge-active-target");
+    }
   }
   function deinit() {
     closeSettings();
     removeClass(canvas, "ge-editing ge-drag-drawer ge-dropping");
+    if (activeTarget) {
+      removeClass(activeTarget, "ge-active-target");
+    }
     plugins("onBeforeDeinit");
     closeSizePicker();
     hideDropMarker();
@@ -1670,6 +1750,7 @@ function build(instance, baseElem, optionsOrMethod) {
       closeSource();
     }
     deinit();
+    activeTarget = null;
     removeConfirmModal();
     removeSettingsPanels();
     removeDialog();
@@ -4046,6 +4127,23 @@ function build(instance, baseElem, optionsOrMethod) {
       return featureMethods[name].apply(null, arguments);
     };
   }
+  function apiSetActiveTarget(value) {
+    if (!settings.active_target) {
+      warnOnceHere("active_target", "setActiveTarget needs the active_target setting: without it, it does nothing");
+      return;
+    }
+    if (value === null || value === void 0) {
+      changeTarget(null);
+      return;
+    }
+    var node = nodeFrom(value);
+    if (!isTarget(node)) {
+      var named = typeof value === "string" ? value : node ? "<" + node.tagName.toLowerCase() + ">" : String(value);
+      warn("setActiveTarget: " + named + " is not a column or a region of the canvas");
+      return;
+    }
+    changeTarget(node);
+  }
   var own = {
     getHtml,
     getPlainHtml,
@@ -4079,7 +4177,11 @@ function build(instance, baseElem, optionsOrMethod) {
     },
     setLocale,
     getUtility,
-    setUtility
+    setUtility,
+    getActiveTarget: function() {
+      return settings.active_target ? activeTarget : null;
+    },
+    setActiveTarget: apiSetActiveTarget
   };
   Object.keys(own).forEach(function(name) {
     var value = !!(METHODS[name] && METHODS[name].value);
@@ -4118,7 +4220,7 @@ GridEditor.t = translate;
 GridEditor._plainHtml = plainHtml;
 GridEditor.Sortable = null;
 GridEditor.bootstrap = null;
-GridEditor.version = false ? "dev" : "8.1.0";
+GridEditor.version = false ? "dev" : "8.2.0";
 GridEditor.locales = {
   en: {
     "tool.move": "Move",

package/dist/grideditor.jquery.js

@@ -45,7 +45,9 @@
       addAccordionItem: { value: true },
       setLocale: {},
       getUtility: { value: true },
-      setUtility: { value: true }
+      setUtility: { value: true },
+      getActiveTarget: { value: true },
+      setActiveTarget: {}
     };
     var TOOL_SETTINGS = [
       "row_tools",

package/dist/grideditor.jquery.min.js

@@ -1 +1 @@
-(()=>{var u=window.GridEditor;if(!u||typeof u.get!="function")throw new Error("grid-editor: load grideditor.js (or grideditor.bundle.min.js) before its plugins, its locales and grideditor.jquery.js");var i=window.jQuery,x=function(c,a){return u.t({locale:"en"},c,a)},m={};function b(c,a){m[c]||(m[c]=!0,window.console&&window.console.warn&&window.console.warn("grid-editor: "+a))}!i||!i.fn?b("no-jquery",x("warning.adapter_no_jquery")):T();function T(){var c={getHtml:{value:!0},getPlainHtml:{value:!0},init:{},deinit:{},reset:{},destroy:{},changeView:{},getView:{value:!0},createRow:{value:!0},createColumn:{value:!0},createElement:{value:!0},createText:{value:!0},createSection:{value:!0},createContainer:{value:!0},addTab:{value:!0},addAccordionItem:{value:!0},setLocale:{},getUtility:{value:!0},setUtility:{value:!0}},a=["row_tools","col_tools","element_tools","container_tools","tab_tools","accordion_tools","text_tools"];function g(r){return!!r&&r.nodeType===1}function l(r){return r instanceof i?r[0]||null:r}function h(r){if(r instanceof i)return l(r);if(r&&typeof r=="object"&&!Array.isArray(r)&&!g(r)){var t={};return Object.keys(r).forEach(function(e){t[e]=l(r[e])}),t}return r}function w(r){return g(r)?i(r):r}var s=new WeakMap;function p(r){if(!r||typeof r!="object")return r;if(s.has(r))return s.get(r);var t=Object.assign({},r);return["node","parent","canvas"].forEach(function(e){e in r&&(t[e]=i(r[e]||[]))}),r.container&&(t.container=i(r.container)),Array.isArray(r.nodes)&&(t.node=i(r.nodes)),["from","to"].forEach(function(e){var n=r[e];n&&typeof n=="object"&&"parent"in n&&(t[e]=Object.assign({},n,{parent:i(n.parent||[])}))}),s.set(r,t),t}var y=i.event.dispatch;i.event.dispatch=function(r){return arguments.length===1&&r instanceof window.CustomEvent&&typeof r.type=="string"&&r.type.indexOf("grideditor:")===0?y.call(this,r,p(r.detail)):y.apply(this,arguments)};function v(r){return function(t){return r.call(this,i.event.fix(t))}}function _(r){if(!r||!r.on)return r;var t;return typeof r.on=="function"?t=v(r.on):(t={},Object.keys(r.on).forEach(function(e){t[e]=v(r.on[e])})),Object.assign({},r,{on:t})}function j(r){return function(t,e){var n=typeof r=="string"?window[r]:r;return n(i(t),e)}}function E(r){if(r=Object.assign({},r||{}),r.callbacks){var t={};Object.keys(r.callbacks).forEach(function(n){var o=r.callbacks[n];t[n]=typeof o=="function"?function(f){return o(p(f))}:o}),r.callbacks=t}if(r.custom_filter&&r.custom_filter.length){var e=typeof r.custom_filter=="string"||typeof r.custom_filter=="function"?[r.custom_filter]:Array.prototype.slice.call(r.custom_filter);r.custom_filter=e.map(j)}return a.forEach(function(n){Array.isArray(r[n])&&(r[n]=r[n].map(_))}),r.source_textarea=l(r.source_textarea),r}function O(r){var t={canvas:i(r.canvas)};return Object.keys(c).forEach(function(e){t[e]=function(){var n=r[e].apply(r,Array.prototype.map.call(arguments,h));return n===r?void 0:w(n)}}),Object.defineProperty(t,"settings",{enumerable:!0,get:function(){return r.settings}}),t}u._created.push(function(r){i.data(r.canvas,"grideditor",O(r));var t=r.destroy;r.destroy=function(){var e=t.apply(this,arguments);return i.removeData(r.canvas,"grideditor"),e}});function A(r,t,e){var n=c[t];if(!n)return b("method:"+t,'unknown method "'+t+'"'),r;if(e=e.map(h),n.value){var o=r.first();if(!o.length)return null;var f=u.get(o[0]);return f?w(f[t].apply(f,e)):t==="getHtml"?o.html():t==="getPlainHtml"?u._plainHtml(o.html()):null}return r.each(function(){var d=u.get(this);d&&d[t].apply(d,e)}),r}i.fn.gridEditor=function(r){if(typeof r=="string")return A(this,r,Array.prototype.slice.call(arguments,1));var t=E(r);return this.each(function(){u.create(this,t)}),this},i.fn.gridEditor.locales=u.locales,i.fn.gridEditor.t=u.t}})();
+(()=>{var u=window.GridEditor;if(!u||typeof u.get!="function")throw new Error("grid-editor: load grideditor.js (or grideditor.bundle.min.js) before its plugins, its locales and grideditor.jquery.js");var i=window.jQuery,T=function(a,o){return u.t({locale:"en"},a,o)},m={};function b(a,o){m[a]||(m[a]=!0,window.console&&window.console.warn&&window.console.warn("grid-editor: "+o))}!i||!i.fn?b("no-jquery",T("warning.adapter_no_jquery")):x();function x(){var a={getHtml:{value:!0},getPlainHtml:{value:!0},init:{},deinit:{},reset:{},destroy:{},changeView:{},getView:{value:!0},createRow:{value:!0},createColumn:{value:!0},createElement:{value:!0},createText:{value:!0},createSection:{value:!0},createContainer:{value:!0},addTab:{value:!0},addAccordionItem:{value:!0},setLocale:{},getUtility:{value:!0},setUtility:{value:!0},getActiveTarget:{value:!0},setActiveTarget:{}},o=["row_tools","col_tools","element_tools","container_tools","tab_tools","accordion_tools","text_tools"];function g(r){return!!r&&r.nodeType===1}function l(r){return r instanceof i?r[0]||null:r}function h(r){if(r instanceof i)return l(r);if(r&&typeof r=="object"&&!Array.isArray(r)&&!g(r)){var t={};return Object.keys(r).forEach(function(e){t[e]=l(r[e])}),t}return r}function w(r){return g(r)?i(r):r}var s=new WeakMap;function p(r){if(!r||typeof r!="object")return r;if(s.has(r))return s.get(r);var t=Object.assign({},r);return["node","parent","canvas"].forEach(function(e){e in r&&(t[e]=i(r[e]||[]))}),r.container&&(t.container=i(r.container)),Array.isArray(r.nodes)&&(t.node=i(r.nodes)),["from","to"].forEach(function(e){var n=r[e];n&&typeof n=="object"&&"parent"in n&&(t[e]=Object.assign({},n,{parent:i(n.parent||[])}))}),s.set(r,t),t}var v=i.event.dispatch;i.event.dispatch=function(r){return arguments.length===1&&r instanceof window.CustomEvent&&typeof r.type=="string"&&r.type.indexOf("grideditor:")===0?v.call(this,r,p(r.detail)):v.apply(this,arguments)};function y(r){return function(t){return r.call(this,i.event.fix(t))}}function _(r){if(!r||!r.on)return r;var t;return typeof r.on=="function"?t=y(r.on):(t={},Object.keys(r.on).forEach(function(e){t[e]=y(r.on[e])})),Object.assign({},r,{on:t})}function j(r){return function(t,e){var n=typeof r=="string"?window[r]:r;return n(i(t),e)}}function E(r){if(r=Object.assign({},r||{}),r.callbacks){var t={};Object.keys(r.callbacks).forEach(function(n){var c=r.callbacks[n];t[n]=typeof c=="function"?function(f){return c(p(f))}:c}),r.callbacks=t}if(r.custom_filter&&r.custom_filter.length){var e=typeof r.custom_filter=="string"||typeof r.custom_filter=="function"?[r.custom_filter]:Array.prototype.slice.call(r.custom_filter);r.custom_filter=e.map(j)}return o.forEach(function(n){Array.isArray(r[n])&&(r[n]=r[n].map(_))}),r.source_textarea=l(r.source_textarea),r}function A(r){var t={canvas:i(r.canvas)};return Object.keys(a).forEach(function(e){t[e]=function(){var n=r[e].apply(r,Array.prototype.map.call(arguments,h));return n===r?void 0:w(n)}}),Object.defineProperty(t,"settings",{enumerable:!0,get:function(){return r.settings}}),t}u._created.push(function(r){i.data(r.canvas,"grideditor",A(r));var t=r.destroy;r.destroy=function(){var e=t.apply(this,arguments);return i.removeData(r.canvas,"grideditor"),e}});function O(r,t,e){var n=a[t];if(!n)return b("method:"+t,'unknown method "'+t+'"'),r;if(e=e.map(h),n.value){var c=r.first();if(!c.length)return null;var f=u.get(c[0]);return f?w(f[t].apply(f,e)):t==="getHtml"?c.html():t==="getPlainHtml"?u._plainHtml(c.html()):null}return r.each(function(){var d=u.get(this);d&&d[t].apply(d,e)}),r}i.fn.gridEditor=function(r){if(typeof r=="string")return O(this,r,Array.prototype.slice.call(arguments,1));var t=E(r);return this.each(function(){u.create(this,t)}),this},i.fn.gridEditor.locales=u.locales,i.fn.gridEditor.t=u.t}})();

package/dist/grideditor.jquery.min.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../src/js/register.js", "../src/js/grideditor.jquery.js"],
-  "sourcesContent": ["/**\n * What a plugin's or a locale's classic script imports in place of the\n * editor: the GridEditor the page already loaded.\n *\n * The build points `import { GridEditor } from '../grideditor.js'` here for\n * the classic scripts, so each registers on the editor the page has rather\n * than bringing its own. Loaded before the editor there is nothing to\n * register on, and saying so is better than a TypeError three calls later.\n */\nvar GridEditor = window.GridEditor;\n\nif (!GridEditor || typeof GridEditor.get !== 'function') {\n    throw new Error('grid-editor: load grideditor.js (or grideditor.bundle.min.js) before its plugins, ' +\n        'its locales and grideditor.jquery.js');\n}\n\nexport { GridEditor };\nexport default GridEditor;\n", "/**\n * The jQuery API of grid-editor 6, on top of the plain DOM editor.\n *\n * A page written for 6.x - one that calls $(el).gridEditor(...), listens\n * with $(el).on('grideditor:...') and reads jQuery objects out of the\n * payloads - loads jQuery 4 and this file after grideditor.js, and runs\n * unchanged:\n *\n *   <script src=\"jquery.min.js\"></script>\n *   <script src=\"dist/grideditor.min.js\"></script>\n *   <script src=\"dist/grideditor.jquery.min.js\"></script>\n *   <script src=\"dist/plugins/grideditor.tabs.min.js\"></script>\n *\n * What it keeps is the host's side of 6.x. Plugins are not: they register\n * on GridEditor, and the plugin contract hands out elements.\n *\n * Every value 6.x gave host code as a jQuery object is one again: the event\n * payloads and the callbacks' arguments, what the create* methods return,\n * the handle $(el).data('grideditor') gives, the canvas custom_filter gets,\n * and the event a host tool's handler gets. What the host hands in may be a\n * jQuery object wherever 6.x took one.\n */\nimport { GridEditor } from './grideditor.js';\n\nvar $ = window.jQuery;\n\nvar english = function(key, params) { return GridEditor.t({ locale: 'en' }, key, params); };\n\nvar warned = {};\n\nfunction warnOnce(key, message) {\n    if (warned[key]) { return; }\n    warned[key] = true;\n    if (window.console && window.console.warn) { window.console.warn('grid-editor: ' + message); }\n}\n\nif (!$ || !$.fn) {\n    warnOnce('no-jquery', english('warning.adapter_no_jquery'));\n} else {\n    install();\n}\n\nfunction install() {\n\n    /**\n     * Every method 6.x dispatched, and which hand back something other than\n     * the jQuery set: those run against the first element only, and do not\n     * chain.\n     */\n    var METHODS = {\n        getHtml:          { value: true },\n        getPlainHtml:     { value: true },\n        init:             {},\n        deinit:           {},\n        reset:            {},\n        destroy:          {},\n        changeView:       {},\n        getView:          { value: true },\n        createRow:        { value: true },\n        createColumn:     { value: true },\n        createElement:    { value: true },\n        createText:       { value: true },\n        createSection:    { value: true },\n        createContainer:  { value: true },\n        addTab:           { value: true },\n        addAccordionItem: { value: true },\n        setLocale:        {},\n        getUtility:       { value: true },\n        setUtility:       { value: true },\n    };\n\n    /** The *_tools settings, whose handlers 6.x bound with jQuery. */\n    var TOOL_SETTINGS = ['row_tools', 'col_tools', 'element_tools', 'container_tools',\n        'tab_tools', 'accordion_tools', 'text_tools'];\n\n    function isElement(value) {\n        return !!value && value.nodeType === 1;\n    }\n\n    /** What the host handed in, as the editor takes it: a jQuery object is its first element. */\n    function unwrap(value) {\n        if (value instanceof $) { return value[0] || null; }\n        return value;\n    }\n\n    /** An argument, and the options object an argument may be, unwrapped one level down. */\n    function unwrapArgument(value) {\n        if (value instanceof $) { return unwrap(value); }\n\n        if (value && typeof value === 'object' && !Array.isArray(value) && !isElement(value)) {\n            var copy = {};\n            Object.keys(value).forEach(function(key) { copy[key] = unwrap(value[key]); });\n            return copy;\n        }\n\n        return value;\n    }\n\n    /** What the editor handed back, as 6.x did: an element is a jQuery object. */\n    function wrapResult(value) {\n        return isElement(value) ? $(value) : value;\n    }\n\n    /**\n     * A payload as 6.x built it: its nodes jQuery objects, and an empty set\n     * where there is no node - a detached node's parent. The same payload\n     * wraps to the same object, so every listener of one notification sees\n     * one payload, as they did.\n     */\n    var wrappedPayloads = new WeakMap();\n\n    function wrapPayload(payload) {\n        if (!payload || typeof payload !== 'object') { return payload; }\n        if (wrappedPayloads.has(payload)) { return wrappedPayloads.get(payload); }\n\n        var copy = Object.assign({}, payload);\n\n        ['node', 'parent', 'canvas'].forEach(function(key) {\n            if (key in payload) { copy[key] = $(payload[key] || []); }\n        });\n        if (payload.container) { copy.container = $(payload.container); }\n        // edit-html writes any number of nodes, which 6.x gave as one set\n        if (Array.isArray(payload.nodes)) { copy.node = $(payload.nodes); }\n        ['from', 'to'].forEach(function(key) {\n            var position = payload[key];\n            if (position && typeof position === 'object' && 'parent' in position) {\n                copy[key] = Object.assign({}, position, { parent: $(position.parent || []) });\n            }\n        });\n\n        wrappedPayloads.set(payload, copy);\n        return copy;\n    }\n\n    /**\n     * The events, as jQuery handlers had them: (event, payload).\n     *\n     * The editor dispatches DOM events, which jQuery hands its handlers with\n     * no second argument. Its dispatcher is where every one of them passes,\n     * delegated ones too, so that is where the payload goes back in: once,\n     * for each handler, and preventDefault() on the jQuery event is\n     * preventDefault() on the editor's.\n     */\n    var dispatch = $.event.dispatch;\n    $.event.dispatch = function(nativeEvent) {\n        if (arguments.length === 1 && nativeEvent instanceof window.CustomEvent &&\n                typeof nativeEvent.type === 'string' && nativeEvent.type.indexOf('grideditor:') === 0) {\n            return dispatch.call(this, nativeEvent, wrapPayload(nativeEvent.detail));\n        }\n\n        return dispatch.apply(this, arguments);\n    };\n\n    /** A handler of a host's tool, given a jQuery event as 6.x gave it. */\n    function jqueryHandler(handler) {\n        return function(event) {\n            return handler.call(this, $.event.fix(event));\n        };\n    }\n\n    function adaptTool(tool) {\n        if (!tool || !tool.on) { return tool; }\n\n        var on;\n        if (typeof tool.on === 'function') {\n            on = jqueryHandler(tool.on);\n        } else {\n            on = {};\n            Object.keys(tool.on).forEach(function(name) { on[name] = jqueryHandler(tool.on[name]); });\n        }\n\n        return Object.assign({}, tool, { on: on });\n    }\n\n    /** A custom_filter, as a function of a jQuery canvas; a name is looked up when it runs. */\n    function adaptFilter(filter) {\n        return function(canvas, isInit) {\n            var func = typeof filter === 'string' ? window[filter] : filter;\n            return func($(canvas), isInit);\n        };\n    }\n\n    /** The host's 6.x options, as the editor takes them. */\n    function adaptOptions(options) {\n        options = Object.assign({}, options || {});\n\n        if (options.callbacks) {\n            var callbacks = {};\n            Object.keys(options.callbacks).forEach(function(name) {\n                var callback = options.callbacks[name];\n                callbacks[name] = typeof callback === 'function'\n                    ? function(payload) { return callback(wrapPayload(payload)); }\n                    : callback;\n            });\n            options.callbacks = callbacks;\n        }\n\n        if (options.custom_filter && options.custom_filter.length) {\n            var filters = typeof options.custom_filter === 'string' || typeof options.custom_filter === 'function'\n                ? [options.custom_filter]\n                : Array.prototype.slice.call(options.custom_filter);\n            options.custom_filter = filters.map(adaptFilter);\n        }\n\n        TOOL_SETTINGS.forEach(function(name) {\n            if (Array.isArray(options[name])) { options[name] = options[name].map(adaptTool); }\n        });\n\n        options.source_textarea = unwrap(options.source_textarea);\n\n        return options;\n    }\n\n    /**\n     * The handle $(el).data('grideditor') gave in 6.x: the same methods, with\n     * jQuery going in and coming out, and the canvas as a jQuery object.\n     */\n    function handleFor(instance) {\n        var handle = { canvas: $(instance.canvas) };\n\n        Object.keys(METHODS).forEach(function(name) {\n            handle[name] = function() {\n                var result = instance[name].apply(instance, Array.prototype.map.call(arguments, unwrapArgument));\n                return result === instance ? undefined : wrapResult(result);\n            };\n        });\n\n        Object.defineProperty(handle, 'settings', {\n            enumerable: true,\n            get: function() { return instance.settings; },\n        });\n\n        return handle;\n    }\n\n    /**\n     * Every editor gets its 6.x handle, whoever made it: $(el).gridEditor()\n     * or new GridEditor(el). It goes with the editor.\n     */\n    GridEditor._created.push(function(instance) {\n        $.data(instance.canvas, 'grideditor', handleFor(instance));\n\n        var destroy = instance.destroy;\n        instance.destroy = function() {\n            var result = destroy.apply(this, arguments);\n            $.removeData(instance.canvas, 'grideditor');\n            return result;\n        };\n    });\n\n    function dispatchMethod(set, name, args) {\n        var descriptor = METHODS[name];\n\n        if (!descriptor) {\n            warnOnce('method:' + name, 'unknown method \"' + name + '\"');\n            return set;\n        }\n\n        args = args.map(unwrapArgument);\n\n        if (descriptor.value) {\n            var element = set.first();\n            if (!element.length) { return null; }\n\n            var instance = GridEditor.get(element[0]);\n            if (!instance) {\n                if (name === 'getHtml') { return element.html(); }\n                if (name === 'getPlainHtml') { return GridEditor._plainHtml(element.html()); }\n                return null;\n            }\n\n            return wrapResult(instance[name].apply(instance, args));\n        }\n\n        set.each(function() {\n            var found = GridEditor.get(this);\n            if (found) { found[name].apply(found, args); }\n        });\n\n        return set;\n    }\n\n    /**\n     * $(el).gridEditor(options): an editor on each element that has none.\n     * $(el).gridEditor('method', ...): a method, 6.x style.\n     */\n    $.fn.gridEditor = function(optionsOrMethod) {\n        if (typeof optionsOrMethod == 'string') {\n            return dispatchMethod(this, optionsOrMethod, Array.prototype.slice.call(arguments, 1));\n        }\n\n        var options = adaptOptions(optionsOrMethod);\n\n        this.each(function() {\n            GridEditor.create(this, options);\n        });\n\n        return this;\n    };\n\n    // Strings are the same thing in both: a 6.x locale file loads unchanged\n    $.fn.gridEditor.locales = GridEditor.locales;\n    $.fn.gridEditor.t = GridEditor.t;\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["/**\n * What a plugin's or a locale's classic script imports in place of the\n * editor: the GridEditor the page already loaded.\n *\n * The build points `import { GridEditor } from '../grideditor.js'` here for\n * the classic scripts, so each registers on the editor the page has rather\n * than bringing its own. Loaded before the editor there is nothing to\n * register on, and saying so is better than a TypeError three calls later.\n */\nvar GridEditor = window.GridEditor;\n\nif (!GridEditor || typeof GridEditor.get !== 'function') {\n    throw new Error('grid-editor: load grideditor.js (or grideditor.bundle.min.js) before its plugins, ' +\n        'its locales and grideditor.jquery.js');\n}\n\nexport { GridEditor };\nexport default GridEditor;\n", "/**\n * The jQuery API of grid-editor 6, on top of the plain DOM editor.\n *\n * A page written for 6.x - one that calls $(el).gridEditor(...), listens\n * with $(el).on('grideditor:...') and reads jQuery objects out of the\n * payloads - loads jQuery 4 and this file after grideditor.js, and runs\n * unchanged:\n *\n *   <script src=\"jquery.min.js\"></script>\n *   <script src=\"dist/grideditor.min.js\"></script>\n *   <script src=\"dist/grideditor.jquery.min.js\"></script>\n *   <script src=\"dist/plugins/grideditor.tabs.min.js\"></script>\n *\n * What it keeps is the host's side of 6.x. Plugins are not: they register\n * on GridEditor, and the plugin contract hands out elements.\n *\n * Every value 6.x gave host code as a jQuery object is one again: the event\n * payloads and the callbacks' arguments, what the create* methods return,\n * the handle $(el).data('grideditor') gives, the canvas custom_filter gets,\n * and the event a host tool's handler gets. What the host hands in may be a\n * jQuery object wherever 6.x took one.\n */\nimport { GridEditor } from './grideditor.js';\n\nvar $ = window.jQuery;\n\nvar english = function(key, params) { return GridEditor.t({ locale: 'en' }, key, params); };\n\nvar warned = {};\n\nfunction warnOnce(key, message) {\n    if (warned[key]) { return; }\n    warned[key] = true;\n    if (window.console && window.console.warn) { window.console.warn('grid-editor: ' + message); }\n}\n\nif (!$ || !$.fn) {\n    warnOnce('no-jquery', english('warning.adapter_no_jquery'));\n} else {\n    install();\n}\n\nfunction install() {\n\n    /**\n     * Every method 6.x dispatched, and which hand back something other than\n     * the jQuery set: those run against the first element only, and do not\n     * chain.\n     */\n    var METHODS = {\n        getHtml:          { value: true },\n        getPlainHtml:     { value: true },\n        init:             {},\n        deinit:           {},\n        reset:            {},\n        destroy:          {},\n        changeView:       {},\n        getView:          { value: true },\n        createRow:        { value: true },\n        createColumn:     { value: true },\n        createElement:    { value: true },\n        createText:       { value: true },\n        createSection:    { value: true },\n        createContainer:  { value: true },\n        addTab:           { value: true },\n        addAccordionItem: { value: true },\n        setLocale:        {},\n        getUtility:       { value: true },\n        setUtility:       { value: true },\n        getActiveTarget:  { value: true },\n        setActiveTarget:  {},\n    };\n\n    /** The *_tools settings, whose handlers 6.x bound with jQuery. */\n    var TOOL_SETTINGS = ['row_tools', 'col_tools', 'element_tools', 'container_tools',\n        'tab_tools', 'accordion_tools', 'text_tools'];\n\n    function isElement(value) {\n        return !!value && value.nodeType === 1;\n    }\n\n    /** What the host handed in, as the editor takes it: a jQuery object is its first element. */\n    function unwrap(value) {\n        if (value instanceof $) { return value[0] || null; }\n        return value;\n    }\n\n    /** An argument, and the options object an argument may be, unwrapped one level down. */\n    function unwrapArgument(value) {\n        if (value instanceof $) { return unwrap(value); }\n\n        if (value && typeof value === 'object' && !Array.isArray(value) && !isElement(value)) {\n            var copy = {};\n            Object.keys(value).forEach(function(key) { copy[key] = unwrap(value[key]); });\n            return copy;\n        }\n\n        return value;\n    }\n\n    /** What the editor handed back, as 6.x did: an element is a jQuery object. */\n    function wrapResult(value) {\n        return isElement(value) ? $(value) : value;\n    }\n\n    /**\n     * A payload as 6.x built it: its nodes jQuery objects, and an empty set\n     * where there is no node - a detached node's parent. The same payload\n     * wraps to the same object, so every listener of one notification sees\n     * one payload, as they did.\n     */\n    var wrappedPayloads = new WeakMap();\n\n    function wrapPayload(payload) {\n        if (!payload || typeof payload !== 'object') { return payload; }\n        if (wrappedPayloads.has(payload)) { return wrappedPayloads.get(payload); }\n\n        var copy = Object.assign({}, payload);\n\n        ['node', 'parent', 'canvas'].forEach(function(key) {\n            if (key in payload) { copy[key] = $(payload[key] || []); }\n        });\n        if (payload.container) { copy.container = $(payload.container); }\n        // edit-html writes any number of nodes, which 6.x gave as one set\n        if (Array.isArray(payload.nodes)) { copy.node = $(payload.nodes); }\n        ['from', 'to'].forEach(function(key) {\n            var position = payload[key];\n            if (position && typeof position === 'object' && 'parent' in position) {\n                copy[key] = Object.assign({}, position, { parent: $(position.parent || []) });\n            }\n        });\n\n        wrappedPayloads.set(payload, copy);\n        return copy;\n    }\n\n    /**\n     * The events, as jQuery handlers had them: (event, payload).\n     *\n     * The editor dispatches DOM events, which jQuery hands its handlers with\n     * no second argument. Its dispatcher is where every one of them passes,\n     * delegated ones too, so that is where the payload goes back in: once,\n     * for each handler, and preventDefault() on the jQuery event is\n     * preventDefault() on the editor's.\n     */\n    var dispatch = $.event.dispatch;\n    $.event.dispatch = function(nativeEvent) {\n        if (arguments.length === 1 && nativeEvent instanceof window.CustomEvent &&\n                typeof nativeEvent.type === 'string' && nativeEvent.type.indexOf('grideditor:') === 0) {\n            return dispatch.call(this, nativeEvent, wrapPayload(nativeEvent.detail));\n        }\n\n        return dispatch.apply(this, arguments);\n    };\n\n    /** A handler of a host's tool, given a jQuery event as 6.x gave it. */\n    function jqueryHandler(handler) {\n        return function(event) {\n            return handler.call(this, $.event.fix(event));\n        };\n    }\n\n    function adaptTool(tool) {\n        if (!tool || !tool.on) { return tool; }\n\n        var on;\n        if (typeof tool.on === 'function') {\n            on = jqueryHandler(tool.on);\n        } else {\n            on = {};\n            Object.keys(tool.on).forEach(function(name) { on[name] = jqueryHandler(tool.on[name]); });\n        }\n\n        return Object.assign({}, tool, { on: on });\n    }\n\n    /** A custom_filter, as a function of a jQuery canvas; a name is looked up when it runs. */\n    function adaptFilter(filter) {\n        return function(canvas, isInit) {\n            var func = typeof filter === 'string' ? window[filter] : filter;\n            return func($(canvas), isInit);\n        };\n    }\n\n    /** The host's 6.x options, as the editor takes them. */\n    function adaptOptions(options) {\n        options = Object.assign({}, options || {});\n\n        if (options.callbacks) {\n            var callbacks = {};\n            Object.keys(options.callbacks).forEach(function(name) {\n                var callback = options.callbacks[name];\n                callbacks[name] = typeof callback === 'function'\n                    ? function(payload) { return callback(wrapPayload(payload)); }\n                    : callback;\n            });\n            options.callbacks = callbacks;\n        }\n\n        if (options.custom_filter && options.custom_filter.length) {\n            var filters = typeof options.custom_filter === 'string' || typeof options.custom_filter === 'function'\n                ? [options.custom_filter]\n                : Array.prototype.slice.call(options.custom_filter);\n            options.custom_filter = filters.map(adaptFilter);\n        }\n\n        TOOL_SETTINGS.forEach(function(name) {\n            if (Array.isArray(options[name])) { options[name] = options[name].map(adaptTool); }\n        });\n\n        options.source_textarea = unwrap(options.source_textarea);\n\n        return options;\n    }\n\n    /**\n     * The handle $(el).data('grideditor') gave in 6.x: the same methods, with\n     * jQuery going in and coming out, and the canvas as a jQuery object.\n     */\n    function handleFor(instance) {\n        var handle = { canvas: $(instance.canvas) };\n\n        Object.keys(METHODS).forEach(function(name) {\n            handle[name] = function() {\n                var result = instance[name].apply(instance, Array.prototype.map.call(arguments, unwrapArgument));\n                return result === instance ? undefined : wrapResult(result);\n            };\n        });\n\n        Object.defineProperty(handle, 'settings', {\n            enumerable: true,\n            get: function() { return instance.settings; },\n        });\n\n        return handle;\n    }\n\n    /**\n     * Every editor gets its 6.x handle, whoever made it: $(el).gridEditor()\n     * or new GridEditor(el). It goes with the editor.\n     */\n    GridEditor._created.push(function(instance) {\n        $.data(instance.canvas, 'grideditor', handleFor(instance));\n\n        var destroy = instance.destroy;\n        instance.destroy = function() {\n            var result = destroy.apply(this, arguments);\n            $.removeData(instance.canvas, 'grideditor');\n            return result;\n        };\n    });\n\n    function dispatchMethod(set, name, args) {\n        var descriptor = METHODS[name];\n\n        if (!descriptor) {\n            warnOnce('method:' + name, 'unknown method \"' + name + '\"');\n            return set;\n        }\n\n        args = args.map(unwrapArgument);\n\n        if (descriptor.value) {\n            var element = set.first();\n            if (!element.length) { return null; }\n\n            var instance = GridEditor.get(element[0]);\n            if (!instance) {\n                if (name === 'getHtml') { return element.html(); }\n                if (name === 'getPlainHtml') { return GridEditor._plainHtml(element.html()); }\n                return null;\n            }\n\n            return wrapResult(instance[name].apply(instance, args));\n        }\n\n        set.each(function() {\n            var found = GridEditor.get(this);\n            if (found) { found[name].apply(found, args); }\n        });\n\n        return set;\n    }\n\n    /**\n     * $(el).gridEditor(options): an editor on each element that has none.\n     * $(el).gridEditor('method', ...): a method, 6.x style.\n     */\n    $.fn.gridEditor = function(optionsOrMethod) {\n        if (typeof optionsOrMethod == 'string') {\n            return dispatchMethod(this, optionsOrMethod, Array.prototype.slice.call(arguments, 1));\n        }\n\n        var options = adaptOptions(optionsOrMethod);\n\n        this.each(function() {\n            GridEditor.create(this, options);\n        });\n\n        return this;\n    };\n\n    // Strings are the same thing in both: a 6.x locale file loads unchanged\n    $.fn.gridEditor.locales = GridEditor.locales;\n    $.fn.gridEditor.t = GridEditor.t;\n}\n"],
+  "mappings": "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",
   "names": ["GridEditor", "$", "english", "key", "params", "GridEditor", "warned", "warnOnce", "message", "install", "METHODS", "TOOL_SETTINGS", "isElement", "value", "unwrap", "unwrapArgument", "copy", "wrapResult", "wrappedPayloads", "wrapPayload", "payload", "position", "dispatch", "nativeEvent", "jqueryHandler", "handler", "event", "adaptTool", "tool", "on", "name", "adaptFilter", "filter", "canvas", "isInit", "func", "adaptOptions", "options", "callbacks", "callback", "filters", "handleFor", "instance", "handle", "result", "destroy", "dispatchMethod", "set", "args", "descriptor", "element", "found", "optionsOrMethod"]
 }

package/dist/grideditor.js

@@ -326,7 +326,9 @@
     addAccordionItem: { value: true },
     setLocale: {},
     getUtility: { value: true },
-    setUtility: { value: true }
+    setUtility: { value: true },
+    getActiveTarget: { value: true },
+    setActiveTarget: {}
   };
   var PLACEMENTS = ["appendTo", "prependTo", "insertAfter", "insertBefore"];
   var BREAKPOINTS = [
@@ -569,6 +571,8 @@
       // 'tool' for the move tool, 'drawer' for the whole drawer
       "toolbar_drag": "auto",
       // Drag the toolbar's buttons onto the canvas. 'auto' follows drag_handle
+      "active_target": false,
+      // A click in a column makes it where the toolbar's buttons add
       "element_tools": [],
       // Host tools on element drawers, same shape as row_tools
       "element_classes": [],
@@ -630,6 +634,7 @@
     var sizePicker = null;
     var sourceOpen = false;
     var dropMarker = null;
+    var activeTarget = null;
     var warnedHere = {};
     var sortables = [];
     var instanceId = ++editorCounter;
@@ -1034,6 +1039,34 @@
           e.preventDefault();
         }
       }, signal);
+      if (settings.active_target) {
+        var pressed = null;
+        canvas.addEventListener("pointerdown", function(e) {
+          pressed = { x: e.clientX, y: e.clientY };
+        }, signal);
+        canvas.addEventListener("click", function(e) {
+          var from = pressed;
+          pressed = null;
+          if (!hasClass(canvas, "ge-editing")) {
+            return;
+          }
+          if (from && Math.abs(e.clientX - from.x) + Math.abs(e.clientY - from.y) > settings.drag.threshold) {
+            return;
+          }
+          var region = closest(e.target, targetSelector());
+          changeTarget(region && region !== canvas && canvas.contains(region) ? region : null);
+        }, signal);
+        document.addEventListener("keydown", function(e) {
+          if (e.key !== "Escape" || !activeTarget || openSettingsState || dialogState) {
+            return;
+          }
+          var focus = document.activeElement;
+          if (focus && (is(focus, "input, textarea, select") || focus.isContentEditable)) {
+            return;
+          }
+          changeTarget(null);
+        }, signal);
+      }
     }
     function textReady(block) {
       if (!is(block, ".ge-content") || !canvas.contains(block)) {
@@ -1059,6 +1092,10 @@
           "data-ge-layout": grouped ? JSON.stringify(layout) : layout.join(",")
         });
         btn.addEventListener("click", function() {
+          if (activeTarget) {
+            addToTarget(btn, "tool");
+            return;
+          }
           var row = rowFromLayoutValue(layout);
           var added = addNode("row", row, function() {
             canvas.appendChild(row);
@@ -1087,6 +1124,10 @@
         );
         attr(button, { "data-ge-toolbar": "container", "data-ge-container-type": type });
         button.addEventListener("click", function() {
+          if (activeTarget) {
+            addToTarget(button, "tool");
+            return;
+          }
           var row = createRow();
           var column = row.appendChild(createColumn(MAX_COL_SIZE));
           var container = column.appendChild(definition.create({}));
@@ -1180,6 +1221,10 @@
         "data-ge-item": index
       });
       button.addEventListener("click", function() {
+        if (activeTarget) {
+          addToTarget(button, item.source || "tool");
+          return;
+        }
         var made = item.create();
         var placed = item.inColumn ? inRowOfItsOwn(made) : made;
         var added = addNode(item.kind, made, function() {
@@ -1285,7 +1330,7 @@
       });
       return { region, before };
     }
-    function insertFeatureFromToolbar(button, where) {
+    function insertFeatureFromToolbar(button, where, source) {
       var item = FEATURES[button.getAttribute("data-ge-feature")].toolbar[parseInt(button.getAttribute("data-ge-item"), 10)];
       var made = item.create();
       var placed = made;
@@ -1304,7 +1349,7 @@
         } else {
           where.region.appendChild(placed);
         }
-      }, { parent: where.region, source: item.source || "dragdrop" });
+      }, { parent: where.region, source: item.source || source || "dragdrop" });
     }
     function inRowOfItsOwn(node) {
       var row = createRow();
@@ -1331,9 +1376,9 @@
         dropMarker.remove();
       }
     }
-    function insertFromToolbar(button, where) {
+    function insertFromToolbar(button, where, source) {
       if (button.getAttribute("data-ge-toolbar") === "feature") {
-        return insertFeatureFromToolbar(button, where);
+        return insertFeatureFromToolbar(button, where, source);
       }
       var container = button.getAttribute("data-ge-toolbar") === "container";
       var type = button.getAttribute("data-ge-container-type");
@@ -1348,7 +1393,7 @@
         } else {
           where.region.appendChild(placed);
         }
-      }, { parent: where.region, source: "dragdrop" });
+      }, { parent: where.region, source: source || "dragdrop" });
     }
     function widthFamily() {
       var values = [];
@@ -1588,6 +1633,7 @@
     }
     function openSource() {
       deinit();
+      changeTarget(null);
       htmlTextArea.style.height = 0.8 * document.documentElement.clientHeight + "px";
       htmlTextArea.value = canvas.innerHTML;
       show(htmlTextArea);
@@ -1603,6 +1649,32 @@
       init();
       hide(htmlTextArea);
     }
+    function targetSelector() {
+      return [".column"].concat(pluginHooks("regions")).join(", ");
+    }
+    function isTarget(node) {
+      return !!node && node !== canvas && canvas.contains(node) && is(node, targetSelector());
+    }
+    function changeTarget(node) {
+      if (node === activeTarget) {
+        return;
+      }
+      var from = activeTarget;
+      if (from) {
+        removeClass(from, "ge-active-target");
+      }
+      activeTarget = node;
+      if (node && hasClass(canvas, "ge-editing")) {
+        addClass(node, "ge-active-target");
+      }
+      emit("target-change", { canvas, target: node, from });
+    }
+    function addToTarget(button, source) {
+      var made = insertFromToolbar(button, { region: activeTarget, before: null }, source);
+      if (made && made.scrollIntoView) {
+        made.scrollIntoView({ behavior: "smooth" });
+      }
+    }
     function init() {
       if (openSettingsState && !attached(openSettingsState.node)) {
         closeSettings();
@@ -1626,10 +1698,18 @@
       makeResizable();
       switchLayout(curView);
       refreshPreviews(canvas);
+      if (activeTarget && !canvas.contains(activeTarget)) {
+        changeTarget(null);
+      } else if (activeTarget) {
+        addClass(activeTarget, "ge-active-target");
+      }
     }
     function deinit() {
       closeSettings();
       removeClass(canvas, "ge-editing ge-drag-drawer ge-dropping");
+      if (activeTarget) {
+        removeClass(activeTarget, "ge-active-target");
+      }
       plugins("onBeforeDeinit");
       closeSizePicker();
       hideDropMarker();
@@ -1671,6 +1751,7 @@
         closeSource();
       }
       deinit();
+      activeTarget = null;
       removeConfirmModal();
       removeSettingsPanels();
       removeDialog();
@@ -4047,6 +4128,23 @@
         return featureMethods[name].apply(null, arguments);
       };
     }
+    function apiSetActiveTarget(value) {
+      if (!settings.active_target) {
+        warnOnceHere("active_target", "setActiveTarget needs the active_target setting: without it, it does nothing");
+        return;
+      }
+      if (value === null || value === void 0) {
+        changeTarget(null);
+        return;
+      }
+      var node = nodeFrom(value);
+      if (!isTarget(node)) {
+        var named = typeof value === "string" ? value : node ? "<" + node.tagName.toLowerCase() + ">" : String(value);
+        warn("setActiveTarget: " + named + " is not a column or a region of the canvas");
+        return;
+      }
+      changeTarget(node);
+    }
     var own = {
       getHtml,
       getPlainHtml,
@@ -4080,7 +4178,11 @@
       },
       setLocale,
       getUtility,
-      setUtility
+      setUtility,
+      getActiveTarget: function() {
+        return settings.active_target ? activeTarget : null;
+      },
+      setActiveTarget: apiSetActiveTarget
     };
     Object.keys(own).forEach(function(name) {
       var value = !!(METHODS[name] && METHODS[name].value);
@@ -4119,7 +4221,7 @@
   GridEditor._plainHtml = plainHtml;
   GridEditor.Sortable = null;
   GridEditor.bootstrap = null;
-  GridEditor.version = false ? "dev" : "8.1.0";
+  GridEditor.version = false ? "dev" : "8.2.0";
   GridEditor.locales = {
     en: {
       "tool.move": "Move",