接入avue

package.json

@@ -23,8 +23,6 @@
     "@amap/amap-jsapi-loader": "^1.0.1",
     "@jiaminghi/data-view": "^2.10.0",
     "@logicflow/core": "^1.2.1",
-    "ag-grid-community": "^31.0.2",
-    "ag-grid-vue": "^31.0.2",
     "bin-ace-editor": "^3.2.0",
     "dayjs": "^1.8.35",
     "dui": "^2.0.0",

packages/bigscreen/designer/components/datasourcePicker.vue

@@ -3,15 +3,23 @@
     <config-item label="数据类型">
       <ai-select v-model="source.dataType" placeholder="请选择数据类型" :select-list="dataTypes"/>
     </config-item>
-    <config-item label="静态数据" v-if="source.dataType === 'staticData'">
+    <div class="codeEditor" v-if="['htmlData'].includes(source.dataType)">
-    </config-item>
-    <div class="codeEditor" v-if="['htmlData','staticData'].includes(source.dataType)">
       <ai-dialog-btn :modal="false" dialog-title="编辑器" :customFooter="false"
                      @confirm="changeData(JSON.parse(content))" @open="content=contentstr">
         <code-editor slot="btn" readonly :value="contentstr" :lang="dataLang" theme="github" width="100%" height="250"/>
         <code-editor v-model="content" :lang="dataLang" theme="github" width="100%" height="440" wrap/>
       </ai-dialog-btn>
     </div>
+    <template v-else-if="source.dataType === 'staticData'">
+      <config-item label="设置列" class="tableStyle">
+        <div class="fill">
+          <table-editor v-model="colConfigs" :configs="[{field:'field',headerName:'属性',width:100},{field:'headerName',headerName:'名称',width:100}]"/>
+        </div>
+      </config-item>
+      <config-item label="设置数据" class="tableStyle" v-if="colConfigs.length>0">
+        <table-editor v-model="content" :configs="colConfigs"/>
+      </config-item>
+    </template>
     <config-item v-else-if="source.dataType === 'dynamicData'" label="数据源">
       <ai-select v-model="source.sourceDataId" placeholder="请选择数据源" :instance="instance"
                  :prop="{label:'description'}" @change="changeData"
@@ -31,10 +39,11 @@ import 'brace/mode/json'
 import 'brace/snippets/json';
 import 'brace/theme/github';
 import 'brace/theme/monokai';
+import TableEditor from "./tableEditor.vue";
 
 export default {
   name: "datasourcePicker",
-  components: {ConfigItem, AiDialogBtn, CodeEditor},
+  components: {TableEditor, ConfigItem, AiDialogBtn, CodeEditor},
   model: {
     event: "input",
     prop: "options"
@@ -47,7 +56,8 @@ export default {
     return {
       dataTypes: Object.entries(DvCompData.types).map(e => ({id: e[0], label: e[1]})),
       content: "",
-      loading: false
+      loading: false,
+      colConfigs: []
     }
   },
   computed: {
@@ -78,5 +88,9 @@ export default {
     position: relative;
     padding-left: 10px;
   }
+
+  .tableStyle {
+    align-items: normal;
+  }
 }
 </style>

packages/bigscreen/designer/components/tableEditor.vue

@@ -1,23 +1,42 @@
 <script>
-import {AgGridVue} from "ag-grid-vue";
+import Vue from 'vue'
-import "ag-grid-community/styles/ag-grid.min.css"
-import "ag-grid-community/styles/ag-theme-balham.min.css"
 
+console.log(window.AVUE)
 export default {
   name: "tableEditor",
+  model: {
+    event: "input",
+    prop: "tableData"
+  },
   props: {
     tableData: {default: () => []},
     configs: {default: () => []}
   },
-  components: {AgGridVue},
   computed: {
     columns: v => v.configs
   },
+  created() {
+    Vue.use(window.AVUE, {
+      size: 'small',
+      tableSize: 'small',
+      calcHeight: 48,
+    })
+  }
 }
 </script>
 
 <template>
   <section class="tableEditor">
-    <ag-grid-vue class="ag-theme-balham" :columnDefs="columns" :rowData="tableData"/>
+    <avue-crud/>
   </section>
 </template>
+<style scoped lang="scss">
+.tableEditor {
+  width: 100%;
+  height: auto;
+
+  .ag-theme-balham {
+    height: 300px;
+  }
+}
+</style>

public/index.html

@@ -6,7 +6,9 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico"/>
     <link rel="stylesheet" href="<%= BASE_URL %>cdn/viewerjs/1.11.6/viewer.css"/>
-    <script src="<%= BASE_URL %>cdn/viewerjs/1.11.6/viewer.min.js"></script>
+    <link rel="stylesheet" href="<%= BASE_URL %>cdn/avue/2.10.18/index.css">
+    <script src="<%= BASE_URL %>cdn/viewerjs/1.11.6/viewer.min.js" charset="utf-8"></script>
+    <script src="<%= BASE_URL %>cdn/avue/2.10.18/avue.min.js" charset="utf-8"></script>
     <title>web端应用库-展示页面</title>
     <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js" referrerpolicy="origin"></script>
     <script src="https://open.work.weixin.qq.com/wwopen/js/jwxwork-1.0.0.js" referrerpolicy="origin"></script>

ui/lib/cdn/v-viewer/1.7.4/v-viewer.js

@@ -1,7 +1,7 @@
-import Viewer from "viewerjs";
 import Vue from "vue";
 
-export { default as Viewer } from "viewerjs";
+const Viewer = window.Viewer
+export {Viewer}
 var freeGlobal = typeof global == "object" && global && global.Object === Object && global;
 var freeGlobal$1 = freeGlobal;
 var freeSelf = typeof self == "object" && self && self.Object === Object && self;
@@ -13,6 +13,7 @@ var objectProto$8 = Object.prototype;
 var hasOwnProperty$6 = objectProto$8.hasOwnProperty;
 var nativeObjectToString$1 = objectProto$8.toString;
 var symToStringTag$1 = Symbol$2 ? Symbol$2.toStringTag : void 0;
+
 function getRawTag(value) {
   var isOwn = hasOwnProperty$6.call(value, symToStringTag$1), tag = value[symToStringTag$1];
   try {
@@ -30,48 +31,62 @@ function getRawTag(value) {
   }
   return result;
 }
+
 var objectProto$7 = Object.prototype;
 var nativeObjectToString = objectProto$7.toString;
+
 function objectToString(value) {
   return nativeObjectToString.call(value);
 }
+
 var nullTag = "[object Null]", undefinedTag = "[object Undefined]";
 var symToStringTag = Symbol$2 ? Symbol$2.toStringTag : void 0;
+
 function baseGetTag(value) {
   if (value == null) {
     return value === void 0 ? undefinedTag : nullTag;
   }
   return symToStringTag && symToStringTag in Object(value) ? getRawTag(value) : objectToString(value);
 }
+
 function isObjectLike(value) {
   return value != null && typeof value == "object";
 }
+
 var symbolTag = "[object Symbol]";
+
 function isSymbol(value) {
   return typeof value == "symbol" || isObjectLike(value) && baseGetTag(value) == symbolTag;
 }
+
 var isArray = Array.isArray;
 var isArray$1 = isArray;
 var reWhitespace = /\s/;
+
 function trimmedEndIndex(string) {
   var index2 = string.length;
   while (index2-- && reWhitespace.test(string.charAt(index2))) {
   }
   return index2;
 }
+
 var reTrimStart = /^\s+/;
+
 function baseTrim(string) {
   return string ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, "") : string;
 }
+
 function isObject(value) {
   var type = typeof value;
   return value != null && (type == "object" || type == "function");
 }
+
 var NAN = 0 / 0;
 var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
 var reIsBinary = /^0b[01]+$/i;
 var reIsOctal = /^0o[0-7]+$/i;
 var freeParseInt = parseInt;
+
 function toNumber(value) {
   if (typeof value == "number") {
     return value;
@@ -90,10 +105,13 @@ function toNumber(value) {
   var isBinary = reIsBinary.test(value);
   return isBinary || reIsOctal.test(value) ? freeParseInt(value.slice(2), isBinary ? 2 : 8) : reIsBadHex.test(value) ? NAN : +value;
 }
+
 function identity(value) {
   return value;
 }
+
 var asyncTag = "[object AsyncFunction]", funcTag$1 = "[object Function]", genTag = "[object GeneratorFunction]", proxyTag = "[object Proxy]";
+
 function isFunction(value) {
   if (!isObject(value)) {
     return false;
@@ -101,17 +119,21 @@ function isFunction(value) {
   var tag = baseGetTag(value);
   return tag == funcTag$1 || tag == genTag || tag == asyncTag || tag == proxyTag;
 }
+
 var coreJsData = root$1["__core-js_shared__"];
 var coreJsData$1 = coreJsData;
 var maskSrcKey = function () {
   var uid = /[^.]+$/.exec(coreJsData$1 && coreJsData$1.keys && coreJsData$1.keys.IE_PROTO || "");
   return uid ? "Symbol(src)_1." + uid : "";
 }();
+
 function isMasked(func) {
   return !!maskSrcKey && maskSrcKey in func;
 }
+
 var funcProto$1 = Function.prototype;
 var funcToString$1 = funcProto$1.toString;
+
 function toSource(func) {
   if (func != null) {
     try {
@@ -125,6 +147,7 @@ function toSource(func) {
   }
   return "";
 }
+
 var reRegExpChar = /[\\^$.*+?()[\]{}|]/g;
 var reIsHostCtor = /^\[object .+?Constructor\]$/;
 var funcProto = Function.prototype, objectProto$6 = Object.prototype;
@@ -133,6 +156,7 @@ var hasOwnProperty$5 = objectProto$6.hasOwnProperty;
 var reIsNative = RegExp(
   "^" + funcToString.call(hasOwnProperty$5).replace(reRegExpChar, "\\$&").replace(/hasOwnProperty|(function).*?(?=\\\()| for .+?(?=\\\])/g, "$1.*?") + "$"
 );
+
 function baseIsNative(value) {
   if (!isObject(value) || isMasked(value)) {
     return false;
@@ -140,13 +164,16 @@ function baseIsNative(value) {
   var pattern = isFunction(value) ? reIsNative : reIsHostCtor;
   return pattern.test(toSource(value));
 }
+
 function getValue(object, key) {
   return object == null ? void 0 : object[key];
 }
+
 function getNative(object, key) {
   var value = getValue(object, key);
   return baseIsNative(value) ? value : void 0;
 }
+
 function apply(func, thisArg, args) {
   switch (args.length) {
     case 0:
@@ -160,8 +187,10 @@ function apply(func, thisArg, args) {
   }
   return func.apply(thisArg, args);
 }
+
 var HOT_COUNT = 800, HOT_SPAN = 16;
 var nativeNow = Date.now;
+
 function shortOut(func) {
   var count = 0, lastCalled = 0;
   return function () {
@@ -177,11 +206,13 @@ function shortOut(func) {
     return func.apply(void 0, arguments);
   };
 }
+
 function constant(value) {
   return function () {
     return value;
   };
 }
+
 var defineProperty = function () {
   try {
     var func = getNative(Object, "defineProperty");
@@ -204,11 +235,13 @@ var setToString = shortOut(baseSetToString$1);
 var setToString$1 = setToString;
 var MAX_SAFE_INTEGER$1 = 9007199254740991;
 var reIsUint = /^(?:0|[1-9]\d*)$/;
+
 function isIndex(value, length) {
   var type = typeof value;
   length = length == null ? MAX_SAFE_INTEGER$1 : length;
   return !!length && (type == "number" || type != "symbol" && reIsUint.test(value)) && (value > -1 && value % 1 == 0 && value < length);
 }
+
 function baseAssignValue(object, key, value) {
   if (key == "__proto__" && defineProperty$1) {
     defineProperty$1(object, key, {
@@ -221,17 +254,21 @@ function baseAssignValue(object, key, value) {
     object[key] = value;
   }
 }
+
 function eq(value, other) {
   return value === other || value !== value && other !== other;
 }
+
 var objectProto$5 = Object.prototype;
 var hasOwnProperty$4 = objectProto$5.hasOwnProperty;
+
 function assignValue(object, key, value) {
   var objValue = object[key];
   if (!(hasOwnProperty$4.call(object, key) && eq(objValue, value)) || value === void 0 && !(key in object)) {
     baseAssignValue(object, key, value);
   }
 }
+
 function copyObject(source, props, object, customizer) {
   var isNew = !object;
   object || (object = {});
@@ -250,7 +287,9 @@ function copyObject(source, props, object, customizer) {
   }
   return object;
 }
+
 var nativeMax$1 = Math.max;
+
 function overRest(func, start, transform) {
   start = nativeMax$1(start === void 0 ? func.length - 1 : start, 0);
   return function () {
@@ -267,16 +306,21 @@ function overRest(func, start, transform) {
     return apply(func, this, otherArgs);
   };
 }
+
 function baseRest(func, start) {
   return setToString$1(overRest(func, start, identity), func + "");
 }
+
 var MAX_SAFE_INTEGER = 9007199254740991;
+
 function isLength(value) {
   return typeof value == "number" && value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;
 }
+
 function isArrayLike(value) {
   return value != null && isLength(value.length) && !isFunction(value);
 }
+
 function isIterateeCall(value, index2, object) {
   if (!isObject(object)) {
     return false;
@@ -287,6 +331,7 @@ function isIterateeCall(value, index2, object) {
   }
   return false;
 }
+
 function createAssigner(assigner) {
   return baseRest(function (object, sources) {
     var index2 = -1, length = sources.length, customizer = length > 1 ? sources[length - 1] : void 0, guard = length > 2 ? sources[2] : void 0;
@@ -305,11 +350,14 @@ function createAssigner(assigner) {
     return object;
   });
 }
+
 var objectProto$4 = Object.prototype;
+
 function isPrototype(value) {
   var Ctor = value && value.constructor, proto = typeof Ctor == "function" && Ctor.prototype || objectProto$4;
   return value === proto;
 }
+
 function baseTimes(n, iteratee) {
   var index2 = -1, result = Array(n);
   while (++index2 < n) {
@@ -317,10 +365,13 @@ function baseTimes(n, iteratee) {
   }
   return result;
 }
+
 var argsTag$1 = "[object Arguments]";
+
 function baseIsArguments(value) {
   return isObjectLike(value) && baseGetTag(value) == argsTag$1;
 }
+
 var objectProto$3 = Object.prototype;
 var hasOwnProperty$3 = objectProto$3.hasOwnProperty;
 var propertyIsEnumerable = objectProto$3.propertyIsEnumerable;
@@ -330,9 +381,11 @@ var isArguments = baseIsArguments(function() {
   return isObjectLike(value) && hasOwnProperty$3.call(value, "callee") && !propertyIsEnumerable.call(value, "callee");
 };
 var isArguments$1 = isArguments;
+
 function stubFalse() {
   return false;
 }
+
 var freeExports$1 = typeof exports == "object" && exports && !exports.nodeType && exports;
 var freeModule$1 = freeExports$1 && typeof module == "object" && module && !module.nodeType && module;
 var moduleExports$1 = freeModule$1 && freeModule$1.exports === freeExports$1;
@@ -340,19 +393,24 @@ var Buffer = moduleExports$1 ? root$1.Buffer : void 0;
 var nativeIsBuffer = Buffer ? Buffer.isBuffer : void 0;
 var isBuffer = nativeIsBuffer || stubFalse;
 var isBuffer$1 = isBuffer;
-var argsTag = "[object Arguments]", arrayTag = "[object Array]", boolTag = "[object Boolean]", dateTag = "[object Date]", errorTag = "[object Error]", funcTag = "[object Function]", mapTag = "[object Map]", numberTag = "[object Number]", objectTag = "[object Object]", regexpTag = "[object RegExp]", setTag = "[object Set]", stringTag = "[object String]", weakMapTag = "[object WeakMap]";
+var argsTag = "[object Arguments]", arrayTag = "[object Array]", boolTag = "[object Boolean]", dateTag = "[object Date]", errorTag = "[object Error]", funcTag = "[object Function]", mapTag = "[object Map]", numberTag = "[object Number]", objectTag = "[object Object]", regexpTag = "[object RegExp]",
-var arrayBufferTag = "[object ArrayBuffer]", dataViewTag = "[object DataView]", float32Tag = "[object Float32Array]", float64Tag = "[object Float64Array]", int8Tag = "[object Int8Array]", int16Tag = "[object Int16Array]", int32Tag = "[object Int32Array]", uint8Tag = "[object Uint8Array]", uint8ClampedTag = "[object Uint8ClampedArray]", uint16Tag = "[object Uint16Array]", uint32Tag = "[object Uint32Array]";
+  setTag = "[object Set]", stringTag = "[object String]", weakMapTag = "[object WeakMap]";
+var arrayBufferTag = "[object ArrayBuffer]", dataViewTag = "[object DataView]", float32Tag = "[object Float32Array]", float64Tag = "[object Float64Array]", int8Tag = "[object Int8Array]", int16Tag = "[object Int16Array]", int32Tag = "[object Int32Array]", uint8Tag = "[object Uint8Array]",
+  uint8ClampedTag = "[object Uint8ClampedArray]", uint16Tag = "[object Uint16Array]", uint32Tag = "[object Uint32Array]";
 var typedArrayTags = {};
 typedArrayTags[float32Tag] = typedArrayTags[float64Tag] = typedArrayTags[int8Tag] = typedArrayTags[int16Tag] = typedArrayTags[int32Tag] = typedArrayTags[uint8Tag] = typedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] = typedArrayTags[uint32Tag] = true;
 typedArrayTags[argsTag] = typedArrayTags[arrayTag] = typedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] = typedArrayTags[dataViewTag] = typedArrayTags[dateTag] = typedArrayTags[errorTag] = typedArrayTags[funcTag] = typedArrayTags[mapTag] = typedArrayTags[numberTag] = typedArrayTags[objectTag] = typedArrayTags[regexpTag] = typedArrayTags[setTag] = typedArrayTags[stringTag] = typedArrayTags[weakMapTag] = false;
+
 function baseIsTypedArray(value) {
   return isObjectLike(value) && isLength(value.length) && !!typedArrayTags[baseGetTag(value)];
 }
+
 function baseUnary(func) {
   return function (value) {
     return func(value);
   };
 }
+
 var freeExports = typeof exports == "object" && exports && !exports.nodeType && exports;
 var freeModule = freeExports && typeof module == "object" && module && !module.nodeType && module;
 var moduleExports = freeModule && freeModule.exports === freeExports;
@@ -373,8 +431,10 @@ var isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedA
 var isTypedArray$1 = isTypedArray;
 var objectProto$2 = Object.prototype;
 var hasOwnProperty$2 = objectProto$2.hasOwnProperty;
+
 function arrayLikeKeys(value, inherited) {
-  var isArr = isArray$1(value), isArg = !isArr && isArguments$1(value), isBuff = !isArr && !isArg && isBuffer$1(value), isType = !isArr && !isArg && !isBuff && isTypedArray$1(value), skipIndexes = isArr || isArg || isBuff || isType, result = skipIndexes ? baseTimes(value.length, String) : [], length = result.length;
+  var isArr = isArray$1(value), isArg = !isArr && isArguments$1(value), isBuff = !isArr && !isArg && isBuffer$1(value), isType = !isArr && !isArg && !isBuff && isTypedArray$1(value), skipIndexes = isArr || isArg || isBuff || isType, result = skipIndexes ? baseTimes(value.length, String) : [],
+    length = result.length;
   for (var key in value) {
     if ((inherited || hasOwnProperty$2.call(value, key)) && !(skipIndexes && (key == "length" || isBuff && (key == "offset" || key == "parent") || isType && (key == "buffer" || key == "byteLength" || key == "byteOffset") || isIndex(key, length)))) {
       result.push(key);
@@ -382,15 +442,18 @@ function arrayLikeKeys(value, inherited) {
   }
   return result;
 }
+
 function overArg(func, transform) {
   return function (arg) {
     return func(transform(arg));
   };
 }
+
 var nativeKeys = overArg(Object.keys, Object);
 var nativeKeys$1 = nativeKeys;
 var objectProto$1 = Object.prototype;
 var hasOwnProperty$1 = objectProto$1.hasOwnProperty;
+
 function baseKeys(object) {
   if (!isPrototype(object)) {
     return nativeKeys$1(object);
@@ -403,9 +466,11 @@ function baseKeys(object) {
   }
   return result;
 }
+
 function keys(object) {
   return isArrayLike(object) ? arrayLikeKeys(object) : baseKeys(object);
 }
+
 var objectProto = Object.prototype;
 var hasOwnProperty = objectProto.hasOwnProperty;
 var assign = createAssigner(function (object, source) {
@@ -426,6 +491,7 @@ var now = function() {
 var now$1 = now;
 var FUNC_ERROR_TEXT = "Expected a function";
 var nativeMax = Math.max, nativeMin = Math.min;
+
 function debounce(func, wait, options) {
   var lastArgs, lastThis, maxWait, result, timerId, lastCallTime, lastInvokeTime = 0, leading = false, maxing = false, trailing = true;
   if (typeof func != "function") {
@@ -438,6 +504,7 @@ function debounce(func, wait, 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 = void 0;
@@ -445,19 +512,23 @@ function debounce(func, wait, options) {
     result = func.apply(thisArg, args);
     return result;
   }
+
   function leadingEdge(time) {
     lastInvokeTime = time;
     timerId = setTimeout(timerExpired, wait);
     return leading ? invokeFunc(time) : result;
   }
+
   function remainingWait(time) {
     var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime, timeWaiting = wait - timeSinceLastCall;
     return maxing ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke) : timeWaiting;
   }
+
   function shouldInvoke(time) {
     var timeSinceLastCall = time - lastCallTime, timeSinceLastInvoke = time - lastInvokeTime;
     return lastCallTime === void 0 || timeSinceLastCall >= wait || timeSinceLastCall < 0 || maxing && timeSinceLastInvoke >= maxWait;
   }
+
   function timerExpired() {
     var time = now$1();
     if (shouldInvoke(time)) {
@@ -465,6 +536,7 @@ function debounce(func, wait, options) {
     }
     timerId = setTimeout(timerExpired, remainingWait(time));
   }
+
   function trailingEdge(time) {
     timerId = void 0;
     if (trailing && lastArgs) {
@@ -473,6 +545,7 @@ function debounce(func, wait, options) {
     lastArgs = lastThis = void 0;
     return result;
   }
+
   function cancel() {
     if (timerId !== void 0) {
       clearTimeout(timerId);
@@ -480,9 +553,11 @@ function debounce(func, wait, options) {
     lastInvokeTime = 0;
     lastArgs = lastCallTime = lastThis = timerId = void 0;
   }
+
   function flush() {
     return timerId === void 0 ? result : trailingEdge(now$1());
   }
+
   function debounced() {
     var time = now$1(), isInvoking = shouldInvoke(time);
     lastArgs = arguments;
@@ -503,10 +578,12 @@ function debounce(func, wait, options) {
     }
     return result;
   }
+
   debounced.cancel = cancel;
   debounced.flush = flush;
   return debounced;
 }
+
 var render = function () {
   var _vm = this;
   var _h = _vm.$createElement;
@@ -514,6 +591,7 @@ var render = function() {
   return _c("div", [_vm._t("default", null, {"images": _vm.images, "options": _vm.options})], 2);
 };
 var staticRenderFns = [];
+
 function normalizeComponent(scriptExports, render2, staticRenderFns2, functionalTemplate, injectStyles, scopeId, moduleIdentifier, shadowMode) {
   var options = typeof scriptExports === "function" ? scriptExports.options : scriptExports;
   if (render2) {
@@ -568,6 +646,7 @@ function normalizeComponent(scriptExports, render2, staticRenderFns2, functional
     options
   };
 }
+
 const __vue2_script = {
   props: {
     images: {
@@ -655,11 +734,13 @@ var __component__ = /* @__PURE__ */ normalizeComponent(
   null,
   null
 );
+
 function __vue2_injectStyles(context) {
   for (let o in __cssModules) {
     this[o] = __cssModules[o];
   }
 }
+
 var component = /* @__PURE__ */ function () {
   return __component__.exports;
 }();
@@ -678,6 +759,7 @@ const directive = ({ name = "viewer", debug = false } = {}) => {
       }
     });
   }
+
   function imageDiff(el) {
     const imageContent = el.innerHTML.match(/<img([\w\W]+?)[\\/]?>/g);
     const viewerImageText = imageContent ? imageContent.join("") : void 0;
@@ -690,6 +772,7 @@ const directive = ({ name = "viewer", debug = false } = {}) => {
       return true;
     }
   }
+
   function createObserver(el, options, debouncedCreateViewer, rebuild) {
     destroyObserver(el);
     const MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
@@ -708,6 +791,7 @@ const directive = ({ name = "viewer", debug = false } = {}) => {
     el.__viewerMutationObserver = observer;
     log("Observer created");
   }
+
   function createWatcher(el, {expression}, vnode, debouncedCreateViewer) {
     const simplePathRE = /^[A-Za-z_$][\w$]*(?:\.[A-Za-z_$][\w$]*|\['[^']*?']|\["[^"]*?"]|\[\d+]|\[[A-Za-z_$][\w$]*])*$/;
     if (!expression || !simplePathRE.test(expression)) {
@@ -722,6 +806,7 @@ const directive = ({ name = "viewer", debug = false } = {}) => {
     });
     log("Watcher created, expression: ", expression);
   }
+
   function destroyViewer(el) {
     if (!el[`$${name}`]) {
       return;
@@ -730,6 +815,7 @@ const directive = ({ name = "viewer", debug = false } = {}) => {
     delete el[`$${name}`];
     log("Viewer destroyed");
   }
+
   function destroyObserver(el) {
     if (!el.__viewerMutationObserver) {
       return;
@@ -738,6 +824,7 @@ const directive = ({ name = "viewer", debug = false } = {}) => {
     delete el.__viewerMutationObserver;
     log("Observer destroyed");
   }
+
   function destroyWatcher(el) {
     if (!el.__viewerUnwatch) {
       return;
@@ -746,9 +833,11 @@ const directive = ({ name = "viewer", debug = false } = {}) => {
     delete el.__viewerUnwatch;
     log("Watcher destroyed");
   }
+
   function log() {
     debug && console.log(...arguments);
   }
+
   const directive2 = {
     bind(el, binding, vnode) {
       log("Viewer bind");