@wangeditor-next/plugin-float-image 0.1.0

package/dist/index.js

@@ -0,0 +1,1006 @@
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory(require('@wangeditor-next/editor'), require('snabbdom'), require('dom7')) :
+  typeof define === 'function' && define.amd ? define(['@wangeditor-next/editor', 'snabbdom', 'dom7'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.WangEditorFloatImagePlugin = factory(global.editor, global.snabbdom, global.$));
+})(this, (function (editor, snabbdom, $) { 'use strict';
+
+  /**
+   * @description 多语言
+   * @author Yanghc
+   */
+  editor.i18nAddResources('en', {
+      float: {
+          none: 'Default',
+          left: 'Float Left',
+          right: 'Float Right',
+      },
+  });
+  editor.i18nAddResources('zh-CN', {
+      float: {
+          none: '默认',
+          left: '左浮动',
+          right: '右浮动',
+      },
+  });
+
+  /**
+   * @description elem to html
+   * @author Yanghc
+   */
+  // 生成 html 的函数
+  function imageToHtml(elem, _childrenHtml) {
+      var _a = elem, src = _a.src, _b = _a.alt, alt = _b === void 0 ? '' : _b, _c = _a.href, href = _c === void 0 ? '' : _c, _d = _a.style, style = _d === void 0 ? {} : _d;
+      var _e = style.width, width = _e === void 0 ? '' : _e, _f = style.height, height = _f === void 0 ? '' : _f, _g = style.float, float = _g === void 0 ? '' : _g;
+      var styleStr = '';
+      if (width) {
+          styleStr += "width: ".concat(width, ";");
+      }
+      if (height) {
+          styleStr += "height: ".concat(height, ";");
+      }
+      if (float) {
+          styleStr += "float: ".concat(float, ";");
+      }
+      return "<img src=\"".concat(src, "\" alt=\"").concat(alt, "\" data-href=\"").concat(href, "\" style=\"").concat(styleStr, "\"/>");
+  }
+  // 配置
+  var conf = {
+      type: 'image', // 节点 type ，重要！！！
+      elemToHtml: imageToHtml,
+  };
+
+  /******************************************************************************
+  Copyright (c) Microsoft Corporation.
+
+  Permission to use, copy, modify, and/or distribute this software for any
+  purpose with or without fee is hereby granted.
+
+  THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
+  REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
+  AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
+  INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
+  LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
+  OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
+  PERFORMANCE OF THIS SOFTWARE.
+  ***************************************************************************** */
+  /* global Reflect, Promise, SuppressedError, Symbol */
+
+  var extendStatics = function(d, b) {
+      extendStatics = Object.setPrototypeOf ||
+          ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+          function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+      return extendStatics(d, b);
+  };
+
+  function __extends(d, b) {
+      if (typeof b !== "function" && b !== null)
+          throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+      extendStatics(d, b);
+      function __() { this.constructor = d; }
+      d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+  }
+
+  var __assign = function() {
+      __assign = Object.assign || function __assign(t) {
+          for (var s, i = 1, n = arguments.length; i < n; i++) {
+              s = arguments[i];
+              for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
+          }
+          return t;
+      };
+      return __assign.apply(this, arguments);
+  };
+
+  function __read(o, n) {
+      var m = typeof Symbol === "function" && o[Symbol.iterator];
+      if (!m) return o;
+      var i = m.call(o), r, ar = [], e;
+      try {
+          while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+      }
+      catch (error) { e = { error: error }; }
+      finally {
+          try {
+              if (r && !r.done && (m = i["return"])) m.call(i);
+          }
+          finally { if (e) throw e.error; }
+      }
+      return ar;
+  }
+
+  function __spreadArray(to, from, pack) {
+      if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+          if (ar || !(i in from)) {
+              if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+              ar[i] = from[i];
+          }
+      }
+      return to.concat(ar || Array.prototype.slice.call(from));
+  }
+
+  typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
+      var e = new Error(message);
+      return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
+  };
+
+  /**
+   * @description icon svg
+   * @author Yanghc
+   */
+  /**
+   * 【注意】svg 字符串的长度 ，否则会导致代码体积过大
+   * 尽量选择 https://www.iconfont.cn/collections/detail?spm=a313x.7781069.0.da5a778a4&cid=20293
+   * 找不到再从 iconfont.com 搜索
+   */
+  // 默认不浮动
+  var DEFAULT_FLOAT_SVG = '<svg viewBox="0 0 1024 1024"><path d="M76.73805432 117.83964445m12.42756741 0l845.0745837 0q12.42756741 0 12.42756741 12.4275674l0 68.35162074q0 12.42756741-12.42756741 12.42756741l-845.0745837 0q-12.42756741 0-12.42756741-12.42756741l0-68.35162074q0-12.42756741 12.42756741-12.4275674Z"></path><path d="M76.73805432 801.35585185m12.42756741 0l845.0745837 0q12.42756741 0 12.42756741 12.42756741l0 68.35162074q0 12.42756741-12.42756741 12.42756742l-845.0745837 0q-12.42756741 0-12.42756741-12.42756742l0-68.35162074q0-12.42756741 12.42756741-12.42756741Z"></path><path d="M89.16562173 304.25315556h410.10972444c6.83516208 0 12.42756741 5.59240533 12.42756741 12.42756741v410.10972445a12.42756741 12.42756741 0 0 1-12.42756741 12.4275674h-410.10972444a12.42756741 12.42756741 0 0 1-12.42756741-12.4275674v-410.10972445c0-6.83516208 5.59240533-12.42756741 12.42756741-12.42756741z"></path></svg>';
+  // 左浮动
+  var LEFT_FLOAT_SVG = '<svg viewBox="0 0 1024 1024"><path d="M77.03514075 117.83964445m12.4275674 0l845.0745837 0q12.42756741 0 12.4275674 12.4275674l0 68.35162074q0 12.42756741-12.4275674 12.42756741l-845.0745837 0q-12.42756741 0-12.4275674-12.42756741l0-68.35162074q0-12.42756741 12.4275674-12.4275674Z"></path><path d="M77.03514075 801.35585185m12.4275674 0l845.0745837 0q12.42756741 0 12.4275674 12.42756741l0 68.35162074q0 12.42756741-12.4275674 12.42756742l-845.0745837 0q-12.42756741 0-12.4275674-12.42756742l0-68.35162074q0-12.42756741 12.4275674-12.42756741Z"></path><path d="M89.46270815 304.25315556h347.9718874c6.83516208 0 12.42756741 5.59240533 12.42756742 12.42756741v410.10972445a12.42756741 12.42756741 0 0 1-12.42756742 12.4275674h-347.9718874a12.42756741 12.42756741 0 0 1-12.4275674-12.4275674v-410.10972445c0-6.83516208 5.59240533-12.42756741 12.4275674-12.42756741z"></path><path d="M512 552.8045037m12.42756741 0l410.10972444 0q12.42756741 0 12.4275674 12.42756742l0 68.35162073q0 12.42756741-12.4275674 12.42756741l-410.10972444 0q-12.42756741 0-12.42756741-12.42756741l0-68.35162073q0-12.42756741 12.42756741-12.42756742Z"></path><path d="M512 366.39099259m12.42756741 0l410.10972444 0q12.42756741 0 12.4275674 12.42756741l0 68.35162075q0 12.42756741-12.4275674 12.4275674l-410.10972444 0q-12.42756741 0-12.42756741-12.4275674l0-68.35162075q0-12.42756741 12.42756741-12.42756741Z"></path></svg>';
+  // 右浮动
+  var RIGHT_FLOAT_SVG = '<svg viewBox="0 0 1024 1024"><path d="M77.03514075 117.83964445m12.4275674 0l845.0745837 0q12.42756741 0 12.4275674 12.4275674l0 68.35162074q0 12.42756741-12.4275674 12.42756741l-845.0745837 0q-12.42756741 0-12.4275674-12.42756741l0-68.35162074q0-12.42756741 12.4275674-12.4275674Z"></path><path d="M77.03514075 801.35585185m12.4275674 0l845.0745837 0q12.42756741 0 12.4275674 12.42756741l0 68.35162074q0 12.42756741-12.4275674 12.42756742l-845.0745837 0q-12.42756741 0-12.4275674-12.42756742l0-68.35162074q0-12.42756741 12.4275674-12.42756741Z"></path><path d="M586.56540445 304.25315556h347.9718874c6.83516208 0 12.42756741 5.59240533 12.4275674 12.42756741v410.10972445a12.42756741 12.42756741 0 0 1-12.4275674 12.4275674h-347.9718874a12.42756741 12.42756741 0 0 1-12.42756742-12.4275674v-410.10972445c0-6.83516208 5.59240533-12.42756741 12.42756742-12.42756741z"></path><path d="M77.03514075 552.8045037m12.4275674 0l410.10972444 0q12.42756741 0 12.42756741 12.42756742l0 68.35162073q0 12.42756741-12.42756741 12.42756741l-410.10972444 0q-12.42756741 0-12.4275674-12.42756741l0-68.35162073q0-12.42756741 12.4275674-12.42756742Z"></path><path d="M77.03514075 366.39099259m12.4275674 0l410.10972444 0q12.42756741 0 12.42756741 12.42756741l0 68.35162075q0 12.42756741-12.42756741 12.4275674l-410.10972444 0q-12.42756741 0-12.4275674-12.4275674l0-68.35162075q0-12.42756741 12.4275674-12.42756741Z"></path></svg>';
+
+  /**
+   * @description image float base class
+   * @author Yanghc
+   */
+  var ImageFloatBaseClass = /** @class */ (function () {
+      function ImageFloatBaseClass() {
+          this.tag = 'button';
+      }
+      ImageFloatBaseClass.prototype.getValue = function (editor) {
+          // 无需获取 val
+          return '';
+      };
+      ImageFloatBaseClass.prototype.isActive = function (editor) {
+          // 无需 active
+          return false;
+      };
+      ImageFloatBaseClass.prototype.getSelectedNode = function (editor$1) {
+          return editor.DomEditor.getSelectedNodeByType(editor$1, 'image');
+      };
+      ImageFloatBaseClass.prototype.isDisabled = function (editor) {
+          if (editor.selection == null) {
+              return true;
+          }
+          var imageNode = this.getSelectedNode(editor);
+          return imageNode == null;
+      };
+      ImageFloatBaseClass.prototype.exec = function (editor$1, value) {
+          if (this.isDisabled(editor$1)) {
+              return;
+          }
+          var imageNode = this.getSelectedNode(editor$1);
+          if (imageNode == null) {
+              return;
+          }
+          // 隐藏 hoverbar
+          var hoverbar = editor.DomEditor.getHoverbar(editor$1);
+          if (hoverbar) {
+              hoverbar.hideAndClean();
+          }
+          var _a = imageNode.style, style = _a === void 0 ? {} : _a;
+          var props = {
+              style: __assign(__assign({}, style), { float: this.value }),
+          };
+          editor.SlateTransforms.setNodes(editor$1, props, {
+              match: function (n) { return editor.DomEditor.checkNodeType(n, 'image'); },
+          });
+      };
+      return ImageFloatBaseClass;
+  }());
+
+  /**
+   * @description float image none
+   * @author Yanghc
+   */
+  var FloatNone = /** @class */ (function (_super) {
+      __extends(FloatNone, _super);
+      function FloatNone() {
+          var _this = _super.apply(this, __spreadArray([], __read(arguments), false)) || this;
+          _this.title = editor.t('float.none'); // 菜单标题
+          _this.value = 'none'; // css float 的值
+          _this.iconSvg = DEFAULT_FLOAT_SVG;
+          return _this;
+      }
+      return FloatNone;
+  }(ImageFloatBaseClass));
+
+  /**
+   * @description float image left
+   * @author Yanghc
+   */
+  var FloatLeft = /** @class */ (function (_super) {
+      __extends(FloatLeft, _super);
+      function FloatLeft() {
+          var _this = _super.apply(this, __spreadArray([], __read(arguments), false)) || this;
+          _this.title = editor.t('float.left'); // 菜单标题
+          _this.value = 'left'; // css float 的值
+          _this.iconSvg = LEFT_FLOAT_SVG;
+          return _this;
+      }
+      return FloatLeft;
+  }(ImageFloatBaseClass));
+
+  /**
+   * @description float image right
+   * @author Yanghc
+   */
+  var FloatRight = /** @class */ (function (_super) {
+      __extends(FloatRight, _super);
+      function FloatRight() {
+          var _this = _super.apply(this, __spreadArray([], __read(arguments), false)) || this;
+          _this.title = editor.t('float.right'); // 菜单标题
+          _this.value = 'right'; // css float 的值
+          _this.iconSvg = RIGHT_FLOAT_SVG;
+          return _this;
+      }
+      return FloatRight;
+  }(ImageFloatBaseClass));
+
+  /**
+   * @description menu index
+   * @author Yanghc
+   */
+  var imageFloatNoneMenuConf = {
+      key: 'imageFloatNone',
+      factory: function () {
+          return new FloatNone();
+      },
+  };
+  var imageFloatLeftMenuConf = {
+      key: 'imageFloatLeft',
+      factory: function () {
+          return new FloatLeft();
+      },
+  };
+  var imageFloatRightMenuConf = {
+      key: 'imageFloatRight',
+      factory: function () {
+          return new FloatRight();
+      },
+  };
+
+  /**
+   * @description parse elem html
+   * @author Yanghc
+   */
+  function parseHtml(elem, _children, _editor) {
+      var href = elem.getAttribute('data-href') || '';
+      href = decodeURIComponent(href); // 兼容 V4
+      return {
+          type: 'image',
+          src: elem.getAttribute('src') || '',
+          alt: elem.getAttribute('alt') || '',
+          href: href,
+          style: {
+              width: elem.getAttribute('width') || '',
+              height: elem.getAttribute('height') || '',
+              float: elem.getAttribute('float') || '',
+          },
+          children: [{ text: '' }], // void node 有一个空白 text
+      };
+  }
+  var parseHtmlConf = {
+      selector: 'img:not([data-w-e-type])', // data-w-e-type 属性，留给自定义元素，保证扩展性
+      parseElemHtml: parseHtml,
+  };
+
+  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
+
+  function getDefaultExportFromCjs (x) {
+  	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
+  }
+
+  /**
+   * lodash (Custom Build) <https://lodash.com/>
+   * Build: `lodash modularize exports="npm" -o ./`
+   * Copyright jQuery Foundation and other contributors <https://jquery.org/>
+   * Released under MIT license <https://lodash.com/license>
+   * Based on Underscore.js 1.8.3 <http://underscorejs.org/LICENSE>
+   * Copyright Jeremy Ashkenas, DocumentCloud and Investigative Reporters & Editors
+   */
+
+  var lodash_throttle;
+  var hasRequiredLodash_throttle;
+
+  function requireLodash_throttle () {
+  	if (hasRequiredLodash_throttle) return lodash_throttle;
+  	hasRequiredLodash_throttle = 1;
+  	/** Used as the `TypeError` message for "Functions" methods. */
+  	var FUNC_ERROR_TEXT = 'Expected a function';
+
+  	/** Used as references for various `Number` constants. */
+  	var NAN = 0 / 0;
+
+  	/** `Object#toString` result references. */
+  	var symbolTag = '[object Symbol]';
+
+  	/** Used to match leading and trailing whitespace. */
+  	var reTrim = /^\s+|\s+$/g;
+
+  	/** Used to detect bad signed hexadecimal string values. */
+  	var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
+
+  	/** Used to detect binary string values. */
+  	var reIsBinary = /^0b[01]+$/i;
+
+  	/** Used to detect octal string values. */
+  	var reIsOctal = /^0o[0-7]+$/i;
+
+  	/** Built-in method references without a dependency on `root`. */
+  	var freeParseInt = parseInt;
+
+  	/** Detect free variable `global` from Node.js. */
+  	var freeGlobal = typeof commonjsGlobal == 'object' && commonjsGlobal && commonjsGlobal.Object === Object && commonjsGlobal;
+
+  	/** Detect free variable `self`. */
+  	var freeSelf = typeof self == 'object' && self && self.Object === Object && self;
+
+  	/** Used as a reference to the global object. */
+  	var root = freeGlobal || freeSelf || Function('return this')();
+
+  	/** Used for built-in method references. */
+  	var objectProto = Object.prototype;
+
+  	/**
+  	 * Used to resolve the
+  	 * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)
+  	 * of values.
+  	 */
+  	var objectToString = objectProto.toString;
+
+  	/* Built-in method references for those with the same name as other `lodash` methods. */
+  	var nativeMax = Math.max,
+  	    nativeMin = Math.min;
+
+  	/**
+  	 * Gets the timestamp of the number of milliseconds that have elapsed since
+  	 * the Unix epoch (1 January 1970 00:00:00 UTC).
+  	 *
+  	 * @static
+  	 * @memberOf _
+  	 * @since 2.4.0
+  	 * @category Date
+  	 * @returns {number} Returns the timestamp.
+  	 * @example
+  	 *
+  	 * _.defer(function(stamp) {
+  	 *   console.log(_.now() - stamp);
+  	 * }, _.now());
+  	 * // => Logs the number of milliseconds it took for the deferred invocation.
+  	 */
+  	var now = function() {
+  	  return root.Date.now();
+  	};
+
+  	/**
+  	 * Creates a debounced function that delays invoking `func` until after `wait`
+  	 * milliseconds have elapsed since the last time the debounced function was
+  	 * invoked. The debounced function comes with a `cancel` method to cancel
+  	 * delayed `func` invocations and a `flush` method to immediately invoke them.
+  	 * Provide `options` to indicate whether `func` should be invoked on the
+  	 * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
+  	 * with the last arguments provided to the debounced function. Subsequent
+  	 * calls to the debounced function return the result of the last `func`
+  	 * invocation.
+  	 *
+  	 * **Note:** If `leading` and `trailing` options are `true`, `func` is
+  	 * invoked on the trailing edge of the timeout only if the debounced function
+  	 * is invoked more than once during the `wait` timeout.
+  	 *
+  	 * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+  	 * until to the next tick, similar to `setTimeout` with a timeout of `0`.
+  	 *
+  	 * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
+  	 * for details over the differences between `_.debounce` and `_.throttle`.
+  	 *
+  	 * @static
+  	 * @memberOf _
+  	 * @since 0.1.0
+  	 * @category Function
+  	 * @param {Function} func The function to debounce.
+  	 * @param {number} [wait=0] The number of milliseconds to delay.
+  	 * @param {Object} [options={}] The options object.
+  	 * @param {boolean} [options.leading=false]
+  	 *  Specify invoking on the leading edge of the timeout.
+  	 * @param {number} [options.maxWait]
+  	 *  The maximum time `func` is allowed to be delayed before it's invoked.
+  	 * @param {boolean} [options.trailing=true]
+  	 *  Specify invoking on the trailing edge of the timeout.
+  	 * @returns {Function} Returns the new debounced function.
+  	 * @example
+  	 *
+  	 * // Avoid costly calculations while the window size is in flux.
+  	 * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
+  	 *
+  	 * // Invoke `sendMail` when clicked, debouncing subsequent calls.
+  	 * jQuery(element).on('click', _.debounce(sendMail, 300, {
+  	 *   'leading': true,
+  	 *   'trailing': false
+  	 * }));
+  	 *
+  	 * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
+  	 * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
+  	 * var source = new EventSource('/stream');
+  	 * jQuery(source).on('message', debounced);
+  	 *
+  	 * // Cancel the trailing debounced invocation.
+  	 * jQuery(window).on('popstate', debounced.cancel);
+  	 */
+  	function debounce(func, wait, options) {
+  	  var lastArgs,
+  	      lastThis,
+  	      maxWait,
+  	      result,
+  	      timerId,
+  	      lastCallTime,
+  	      lastInvokeTime = 0,
+  	      leading = false,
+  	      maxing = false,
+  	      trailing = true;
+
+  	  if (typeof func != 'function') {
+  	    throw new TypeError(FUNC_ERROR_TEXT);
+  	  }
+  	  wait = toNumber(wait) || 0;
+  	  if (isObject(options)) {
+  	    leading = !!options.leading;
+  	    maxing = 'maxWait' in options;
+  	    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
+  	    trailing = 'trailing' in options ? !!options.trailing : trailing;
+  	  }
+
+  	  function invokeFunc(time) {
+  	    var args = lastArgs,
+  	        thisArg = lastThis;
+
+  	    lastArgs = lastThis = undefined;
+  	    lastInvokeTime = time;
+  	    result = func.apply(thisArg, args);
+  	    return result;
+  	  }
+
+  	  function leadingEdge(time) {
+  	    // Reset any `maxWait` timer.
+  	    lastInvokeTime = time;
+  	    // Start the timer for the trailing edge.
+  	    timerId = setTimeout(timerExpired, wait);
+  	    // Invoke the leading edge.
+  	    return leading ? invokeFunc(time) : result;
+  	  }
+
+  	  function remainingWait(time) {
+  	    var timeSinceLastCall = time - lastCallTime,
+  	        timeSinceLastInvoke = time - lastInvokeTime,
+  	        result = wait - timeSinceLastCall;
+
+  	    return maxing ? nativeMin(result, maxWait - timeSinceLastInvoke) : result;
+  	  }
+
+  	  function shouldInvoke(time) {
+  	    var timeSinceLastCall = time - lastCallTime,
+  	        timeSinceLastInvoke = time - lastInvokeTime;
+
+  	    // Either this is the first call, activity has stopped and we're at the
+  	    // trailing edge, the system time has gone backwards and we're treating
+  	    // it as the trailing edge, or we've hit the `maxWait` limit.
+  	    return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||
+  	      (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));
+  	  }
+
+  	  function timerExpired() {
+  	    var time = now();
+  	    if (shouldInvoke(time)) {
+  	      return trailingEdge(time);
+  	    }
+  	    // Restart the timer.
+  	    timerId = setTimeout(timerExpired, remainingWait(time));
+  	  }
+
+  	  function trailingEdge(time) {
+  	    timerId = undefined;
+
+  	    // Only invoke if we have `lastArgs` which means `func` has been
+  	    // debounced at least once.
+  	    if (trailing && lastArgs) {
+  	      return invokeFunc(time);
+  	    }
+  	    lastArgs = lastThis = undefined;
+  	    return result;
+  	  }
+
+  	  function cancel() {
+  	    if (timerId !== undefined) {
+  	      clearTimeout(timerId);
+  	    }
+  	    lastInvokeTime = 0;
+  	    lastArgs = lastCallTime = lastThis = timerId = undefined;
+  	  }
+
+  	  function flush() {
+  	    return timerId === undefined ? result : trailingEdge(now());
+  	  }
+
+  	  function debounced() {
+  	    var time = now(),
+  	        isInvoking = shouldInvoke(time);
+
+  	    lastArgs = arguments;
+  	    lastThis = this;
+  	    lastCallTime = time;
+
+  	    if (isInvoking) {
+  	      if (timerId === undefined) {
+  	        return leadingEdge(lastCallTime);
+  	      }
+  	      if (maxing) {
+  	        // Handle invocations in a tight loop.
+  	        timerId = setTimeout(timerExpired, wait);
+  	        return invokeFunc(lastCallTime);
+  	      }
+  	    }
+  	    if (timerId === undefined) {
+  	      timerId = setTimeout(timerExpired, wait);
+  	    }
+  	    return result;
+  	  }
+  	  debounced.cancel = cancel;
+  	  debounced.flush = flush;
+  	  return debounced;
+  	}
+
+  	/**
+  	 * Creates a throttled function that only invokes `func` at most once per
+  	 * every `wait` milliseconds. The throttled function comes with a `cancel`
+  	 * method to cancel delayed `func` invocations and a `flush` method to
+  	 * immediately invoke them. Provide `options` to indicate whether `func`
+  	 * should be invoked on the leading and/or trailing edge of the `wait`
+  	 * timeout. The `func` is invoked with the last arguments provided to the
+  	 * throttled function. Subsequent calls to the throttled function return the
+  	 * result of the last `func` invocation.
+  	 *
+  	 * **Note:** If `leading` and `trailing` options are `true`, `func` is
+  	 * invoked on the trailing edge of the timeout only if the throttled function
+  	 * is invoked more than once during the `wait` timeout.
+  	 *
+  	 * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
+  	 * until to the next tick, similar to `setTimeout` with a timeout of `0`.
+  	 *
+  	 * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
+  	 * for details over the differences between `_.throttle` and `_.debounce`.
+  	 *
+  	 * @static
+  	 * @memberOf _
+  	 * @since 0.1.0
+  	 * @category Function
+  	 * @param {Function} func The function to throttle.
+  	 * @param {number} [wait=0] The number of milliseconds to throttle invocations to.
+  	 * @param {Object} [options={}] The options object.
+  	 * @param {boolean} [options.leading=true]
+  	 *  Specify invoking on the leading edge of the timeout.
+  	 * @param {boolean} [options.trailing=true]
+  	 *  Specify invoking on the trailing edge of the timeout.
+  	 * @returns {Function} Returns the new throttled function.
+  	 * @example
+  	 *
+  	 * // Avoid excessively updating the position while scrolling.
+  	 * jQuery(window).on('scroll', _.throttle(updatePosition, 100));
+  	 *
+  	 * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
+  	 * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
+  	 * jQuery(element).on('click', throttled);
+  	 *
+  	 * // Cancel the trailing throttled invocation.
+  	 * jQuery(window).on('popstate', throttled.cancel);
+  	 */
+  	function throttle(func, wait, options) {
+  	  var leading = true,
+  	      trailing = true;
+
+  	  if (typeof func != 'function') {
+  	    throw new TypeError(FUNC_ERROR_TEXT);
+  	  }
+  	  if (isObject(options)) {
+  	    leading = 'leading' in options ? !!options.leading : leading;
+  	    trailing = 'trailing' in options ? !!options.trailing : trailing;
+  	  }
+  	  return debounce(func, wait, {
+  	    'leading': leading,
+  	    'maxWait': wait,
+  	    'trailing': trailing
+  	  });
+  	}
+
+  	/**
+  	 * Checks if `value` is the
+  	 * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)
+  	 * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)
+  	 *
+  	 * @static
+  	 * @memberOf _
+  	 * @since 0.1.0
+  	 * @category Lang
+  	 * @param {*} value The value to check.
+  	 * @returns {boolean} Returns `true` if `value` is an object, else `false`.
+  	 * @example
+  	 *
+  	 * _.isObject({});
+  	 * // => true
+  	 *
+  	 * _.isObject([1, 2, 3]);
+  	 * // => true
+  	 *
+  	 * _.isObject(_.noop);
+  	 * // => true
+  	 *
+  	 * _.isObject(null);
+  	 * // => false
+  	 */
+  	function isObject(value) {
+  	  var type = typeof value;
+  	  return !!value && (type == 'object' || type == 'function');
+  	}
+
+  	/**
+  	 * Checks if `value` is object-like. A value is object-like if it's not `null`
+  	 * and has a `typeof` result of "object".
+  	 *
+  	 * @static
+  	 * @memberOf _
+  	 * @since 4.0.0
+  	 * @category Lang
+  	 * @param {*} value The value to check.
+  	 * @returns {boolean} Returns `true` if `value` is object-like, else `false`.
+  	 * @example
+  	 *
+  	 * _.isObjectLike({});
+  	 * // => true
+  	 *
+  	 * _.isObjectLike([1, 2, 3]);
+  	 * // => true
+  	 *
+  	 * _.isObjectLike(_.noop);
+  	 * // => false
+  	 *
+  	 * _.isObjectLike(null);
+  	 * // => false
+  	 */
+  	function isObjectLike(value) {
+  	  return !!value && typeof value == 'object';
+  	}
+
+  	/**
+  	 * Checks if `value` is classified as a `Symbol` primitive or object.
+  	 *
+  	 * @static
+  	 * @memberOf _
+  	 * @since 4.0.0
+  	 * @category Lang
+  	 * @param {*} value The value to check.
+  	 * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
+  	 * @example
+  	 *
+  	 * _.isSymbol(Symbol.iterator);
+  	 * // => true
+  	 *
+  	 * _.isSymbol('abc');
+  	 * // => false
+  	 */
+  	function isSymbol(value) {
+  	  return typeof value == 'symbol' ||
+  	    (isObjectLike(value) && objectToString.call(value) == symbolTag);
+  	}
+
+  	/**
+  	 * Converts `value` to a number.
+  	 *
+  	 * @static
+  	 * @memberOf _
+  	 * @since 4.0.0
+  	 * @category Lang
+  	 * @param {*} value The value to process.
+  	 * @returns {number} Returns the number.
+  	 * @example
+  	 *
+  	 * _.toNumber(3.2);
+  	 * // => 3.2
+  	 *
+  	 * _.toNumber(Number.MIN_VALUE);
+  	 * // => 5e-324
+  	 *
+  	 * _.toNumber(Infinity);
+  	 * // => Infinity
+  	 *
+  	 * _.toNumber('3.2');
+  	 * // => 3.2
+  	 */
+  	function toNumber(value) {
+  	  if (typeof value == 'number') {
+  	    return value;
+  	  }
+  	  if (isSymbol(value)) {
+  	    return NAN;
+  	  }
+  	  if (isObject(value)) {
+  	    var other = typeof value.valueOf == 'function' ? value.valueOf() : value;
+  	    value = isObject(other) ? (other + '') : other;
+  	  }
+  	  if (typeof value != 'string') {
+  	    return value === 0 ? value : +value;
+  	  }
+  	  value = value.replace(reTrim, '');
+  	  var isBinary = reIsBinary.test(value);
+  	  return (isBinary || reIsOctal.test(value))
+  	    ? freeParseInt(value.slice(2), isBinary ? 2 : 8)
+  	    : (reIsBadHex.test(value) ? NAN : +value);
+  	}
+
+  	lodash_throttle = throttle;
+  	return lodash_throttle;
+  }
+
+  var lodash_throttleExports = requireLodash_throttle();
+  var throttle = /*@__PURE__*/getDefaultExportFromCjs(lodash_throttleExports);
+
+  /**
+   * @description DOM 操作
+   * @author Yanghc
+   */
+  if ($.css) {
+      $.fn.css = $.css;
+  }
+  if ($.append) {
+      $.fn.append = $.append;
+  }
+  if ($.prepend) {
+      $.fn.prepend = $.prepend;
+  }
+  if ($.addClass) {
+      $.fn.addClass = $.addClass;
+  }
+  if ($.removeClass) {
+      $.fn.removeClass = $.removeClass;
+  }
+  if ($.hasClass) {
+      $.fn.hasClass = $.hasClass;
+  }
+  if ($.on) {
+      $.fn.on = $.on;
+  }
+  if ($.off) {
+      $.fn.off = $.off;
+  }
+  if ($.focus) {
+      $.fn.focus = $.focus;
+  }
+  if ($.attr) {
+      $.fn.attr = $.attr;
+  }
+  if ($.removeAttr) {
+      $.fn.removeAttr = $.removeAttr;
+  }
+  if ($.hide) {
+      $.fn.hide = $.hide;
+  }
+  if ($.show) {
+      $.fn.show = $.show;
+  }
+  if ($.parents) {
+      $.fn.parents = $.parents;
+  }
+  if ($.dataset) {
+      $.fn.dataset = $.dataset;
+  }
+  if ($.val) {
+      $.fn.val = $.val;
+  }
+  if ($.text) {
+      $.fn.text = $.text;
+  }
+  if ($.html) {
+      $.fn.html = $.html;
+  }
+  if ($.children) {
+      $.fn.children = $.children;
+  }
+  if ($.remove) {
+      $.fn.remove = $.remove;
+  }
+  if ($.find) {
+      $.fn.find = $.find;
+  }
+  if ($.width) {
+      $.fn.width = $.width;
+  }
+  if ($.height) {
+      $.fn.height = $.height;
+  }
+  if ($.filter) {
+      $.fn.filter = $.filter;
+  }
+  if ($.empty) {
+      $.fn.empty = $.empty;
+  }
+
+  /**
+   * @description image render elem
+   * @author wangfupeng
+   */
+  function genContainerId(editor$1, elemNode) {
+      var id = editor.DomEditor.findKey(editor$1, elemNode).id; // node 唯一 id
+      return "w-e-image-container-".concat(id);
+  }
+  /**
+   * 未选中时，渲染 image container
+   */
+  function renderContainer(editor, elemNode, imageVnode, imageInfo) {
+      var width = imageInfo.width, height = imageInfo.height, float = imageInfo.float;
+      var style = {};
+      if (width) {
+          style.width = width;
+      }
+      if (height) {
+          style.height = height;
+      }
+      if (float) {
+          style.float = float;
+      }
+      var containerId = genContainerId(editor, elemNode);
+      return (snabbdom.jsx("div", { id: containerId, style: style, className: "w-e-image-container" }, imageVnode));
+  }
+  /**
+   * 选中状态下，渲染 image container（渲染拖拽容器，修改图片尺寸）
+   */
+  function renderResizeContainer(editor$1, elemNode, imageVnode, imageInfo) {
+      var $body = $('body');
+      var containerId = genContainerId(editor$1, elemNode);
+      var width = imageInfo.width, height = imageInfo.height, float = imageInfo.float;
+      var originalX = 0;
+      var originalWith = 0;
+      var originalHeight = 0;
+      var revers = false; // 是否反转。如向右拖拽 right-top 需增加宽度（非反转），但向右拖拽 left-top 则需要减少宽度（反转）
+      var $container = null;
+      function getContainerElem() {
+          var $containerFromDom = $("#".concat(containerId));
+          if ($containerFromDom.length === 0) {
+              throw new Error('Cannot find image container elem');
+          }
+          return $containerFromDom;
+      }
+      // mouseover callback （节流）
+      var onMousemove = throttle(function (e) {
+          e.preventDefault();
+          var clientX = e.clientX;
+          var gap = revers ? originalX - clientX : clientX - originalX; // 考虑是否反转
+          var newWidth = originalWith + gap;
+          var newHeight = originalHeight * (newWidth / originalWith); // 根据 width ，按比例计算 height
+          // 实时修改 img 宽高 -【注意】这里只修改 DOM ，mouseup 时再统一不修改 node
+          if ($container == null) {
+              return;
+          }
+          if (newWidth <= 15 || newHeight <= 15) {
+              return;
+          } // 最小就是 15px
+          $container.css('width', "".concat(newWidth, "px"));
+          $container.css('height', "".concat(newHeight, "px"));
+      }, 100);
+      function onMouseup(_e) {
+          // 取消监听 mousemove
+          $body.off('mousemove', onMousemove);
+          if ($container == null) {
+              return;
+          }
+          var newWidth = $container.width().toFixed(2);
+          var newHeight = $container.height().toFixed(2);
+          // 修改 node
+          var props = {
+              style: __assign(__assign({}, elemNode.style), { width: "".concat(newWidth, "px"), height: "".concat(newHeight, "px") }),
+          };
+          editor.SlateTransforms.setNodes(editor$1, props, { at: editor.DomEditor.findPath(editor$1, elemNode) });
+          // 取消监听 mouseup
+          $body.off('mouseup', onMouseup);
+      }
+      /**
+       * 初始化。监听事件，记录原始数据
+       */
+      function init(clientX) {
+          $container = getContainerElem();
+          // 记录当前 x 坐标值
+          originalX = clientX;
+          // 记录 img 原始宽高
+          var $img = $container.find('img');
+          if ($img.length === 0) {
+              throw new Error('Cannot find image elem');
+          }
+          originalWith = $img.width();
+          originalHeight = $img.height();
+          // 监听 mousemove
+          $body.on('mousemove', onMousemove);
+          // 监听 mouseup
+          $body.on('mouseup', onMouseup);
+          // 隐藏 hoverbar
+          var hoverbar = editor.DomEditor.getHoverbar(editor$1);
+          if (hoverbar) {
+              hoverbar.hideAndClean();
+          }
+      }
+      var style = {};
+      if (width) {
+          style.width = width;
+      }
+      if (height) {
+          style.height = height;
+      }
+      if (float) {
+          style.float = float;
+      }
+      // style.boxShadow = '0 0 0 1px #B4D5FF' // 自定义 selected 样式，因为有拖拽触手
+      return (snabbdom.jsx("div", { id: containerId, style: style, className: "w-e-image-container w-e-selected-image-container", on: {
+              // 统一绑定拖拽触手的 mousedown 事件
+              mousedown: function (e) {
+                  var $target = $(e.target);
+                  if (!$target.hasClass('w-e-image-dragger')) {
+                      // target 不是 .w-e-image-dragger 拖拽触手，则忽略
+                      return;
+                  }
+                  e.preventDefault();
+                  if ($target.hasClass('left-top') || $target.hasClass('left-bottom')) {
+                      revers = true; // 反转。向右拖拽，减少宽度
+                  }
+                  init(e.clientX); // 初始化
+              },
+          } },
+          imageVnode,
+          snabbdom.jsx("div", { className: "w-e-image-dragger left-top" }),
+          snabbdom.jsx("div", { className: "w-e-image-dragger right-top" }),
+          snabbdom.jsx("div", { className: "w-e-image-dragger left-bottom" }),
+          snabbdom.jsx("div", { className: "w-e-image-dragger right-bottom" })));
+  }
+  function renderImage(elemNode, children, editor$1) {
+      var _a = elemNode, src = _a.src, _b = _a.alt, alt = _b === void 0 ? '' : _b, _c = _a.href, href = _c === void 0 ? '' : _c, _d = _a.style, style = _d === void 0 ? {} : _d;
+      var _f = style.width, width = _f === void 0 ? '' : _f, _g = style.height, height = _g === void 0 ? '' : _g, float = style.float;
+      var selected = editor.DomEditor.isNodeSelected(editor$1, elemNode); // 图片是否选中
+      var imageStyle = {};
+      if (width) {
+          imageStyle.width = '100%';
+      }
+      if (height) {
+          imageStyle.height = '100%';
+      }
+      if (float) {
+          imageStyle.float = float;
+      }
+      // 【注意】void node 中，renderElem 不用处理 children 。core 会统一处理。
+      var vnode = snabbdom.jsx("img", { style: imageStyle, src: src, alt: alt, "data-href": href });
+      var isDisabled = editor$1.isDisabled();
+      if (selected && !isDisabled) {
+          // 选中，未禁用 - 渲染 resize container
+          return renderResizeContainer(editor$1, elemNode, vnode, { width: width, height: height, float: float });
+      }
+      // 其他，渲染普通 image container
+      return renderContainer(editor$1, elemNode, vnode, { width: width, height: height, float: float });
+  }
+  var renderImageConf = {
+      type: 'image', // 和 elemNode.type 一致
+      renderElem: renderImage,
+  };
+
+  /**
+   * @description module entry
+   * @author Yanghc
+   */
+  var module = {
+      renderElems: [renderImageConf],
+      elemsToHtml: [conf],
+      parseElemsHtml: [parseHtmlConf],
+      menus: [imageFloatLeftMenuConf, imageFloatRightMenuConf, imageFloatNoneMenuConf],
+  };
+
+  /**
+   * @description src entry
+   * @author Yanghc
+   */
+
+  return module;
+
+}));