x-block-lib 0.4.8 → 0.4.10

package/dist/components/blockly/index.vue.d.ts

@@ -2,7 +2,6 @@ import { Type } from './workspace';
 interface Props {
     type: Type;
     version: string;
-    active: boolean;
 }
 declare let __VLS_typeProps: Props;
 type __VLS_PublicProps = {

package/dist/components/index.d.ts

@@ -1,6 +1,4 @@
 import { App } from 'vue';
 import XBlockly from './blockly/index.vue';
-declare const global: {
-    install: (app: App) => void;
-};
-export { XBlockly, global as default };
+declare const install: (app: App) => void;
+export { XBlockly, install };

package/dist/index.d.ts

@@ -1,2 +1,6 @@
+declare const _default: {
+    install: (app: import("vue").App) => void;
+};
+export default _default;
 export * from './components';
 export * from './i18n';

package/dist/index.js

@@ -1,14 +1,14 @@
 (function(){"use strict";try{if(typeof document<"u"){var o=document.createElement("style");o.id="x-block-lib",o.appendChild(document.createTextNode(".blocklyToolboxDiv{overflow-x:hidden;width:56px}.blocklyMainBackground{stroke-width:0}.blocklyToolboxCategory{margin-bottom:10px}.blocklyTreeRow{height:28px;display:flex;align-items:center;border-left-width:6px!important;border-right-width:6px!important}.blocklyTreeIcon{display:none!important}.blocklyFlyout{z-index:21}")),document.head.appendChild(o)}}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
 var Qe = Object.defineProperty;
 var qe = (e, o, t) => o in e ? Qe(e, o, { enumerable: !0, configurable: !0, writable: !0, value: t }) : e[o] = t;
-var v = (e, o, t) => qe(e, typeof o != "symbol" ? o + "" : o, t);
-import { defineComponent as W, resolveComponent as C, openBlock as L, createBlock as V, unref as A, useModel as ue, ref as ee, onMounted as Me, onUnmounted as Ze, withCtx as Y, createElementBlock as X, Fragment as et, renderList as tt, createVNode as B, createTextVNode as ot, toDisplayString as pe, computed as K, isRef as nt, withKeys as it, withModifiers as le, mergeProps as st, createElementVNode as S, normalizeStyle as F, createCommentVNode as te, mergeModels as Ae, onBeforeUnmount as lt, watch as G, resolveDirective as at, withDirectives as rt } from "vue";
-import { d as _, j as s, O as l, u, X as ct, B as y, E as f, M as m, i as ie, a as M, b as d, C as Ue, F as Ee, c as _t, P as Te, N as he, V as oe, e as ut, f as Ve, s as pt, g as H, S as g, h as ae, k as D, l as J, m as re, n as $, o as U, p as be, G as ce, q as Tt, r as dt, t as _e, U as z, D as Q, v as x, w as ft, T as se, x as Pe, y as Et, z as ht } from "./blockly-jgwpd4oo.js";
+var A = (e, o, t) => qe(e, typeof o != "symbol" ? o + "" : o, t);
+import { defineComponent as X, resolveComponent as C, openBlock as L, createBlock as V, unref as v, useModel as ue, ref as ee, onMounted as Se, onUnmounted as Ze, withCtx as Y, createElementBlock as j, Fragment as et, renderList as tt, createVNode as B, createTextVNode as ot, toDisplayString as pe, computed as K, isRef as nt, withKeys as it, withModifiers as le, mergeProps as st, createElementVNode as S, normalizeStyle as F, createCommentVNode as te, mergeModels as Ae, onBeforeUnmount as lt, watch as W, resolveDirective as at, withDirectives as rt } from "vue";
+import { d as _, j as s, O as l, u, X as ct, B as y, E as f, M as E, i as ie, a as M, b as d, C as Me, F as Ee, c as _t, P as Te, N as he, V as oe, e as ut, f as Ue, s as pt, g as H, S as g, h as ae, k as D, l as J, m as re, n as G, o as U, p as ve, G as ce, q as Tt, r as dt, t as _e, U as z, D as Q, v as x, w as ft, T as se, x as Ve, y as Et, z as ht } from "./blockly-jgwpd4oo.js";
 import { storeToRefs as mt } from "pinia";
-import { openConfirmDlg as Ot, openPromptDlg as gt, eventBus as de, useSystem as It, useColor as Lt, useViewStack as xe, useGlobalStore as yt } from "x-essential-lib";
+import { openConfirmDlg as Ot, openPromptDlg as gt, eventBus as de, useSystem as It, useColor as Lt, useViewStack as Pe, useGlobalStore as yt } from "x-essential-lib";
 import { useDisplay as Ct } from "vuetify";
-import { useI18n as De } from "vue-i18n";
-var vt = "M19.36,2.72L20.78,4.14L15.06,9.85C16.13,11.39 16.28,13.24 15.38,14.44L9.06,8.12C10.26,7.22 12.11,7.37 13.65,8.44L19.36,2.72M5.93,17.57C3.92,15.56 2.69,13.16 2.35,10.92L7.23,8.83L14.67,16.27L12.58,21.15C10.34,20.81 7.94,19.58 5.93,17.57Z", At = "M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z", bt = "M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z", kt = "M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z", Nt = "M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6C4.89,22 4,21.1 4,20V10A2,2 0 0,1 6,8H15V6A3,3 0 0,0 12,3A3,3 0 0,0 9,6H7A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,17A2,2 0 0,0 14,15A2,2 0 0,0 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17Z", Bt = "M21 3L3 10.53V11.5L9.84 14.16L12.5 21H13.46L21 3Z";
+import { useI18n as xe } from "vue-i18n";
+var At = "M19.36,2.72L20.78,4.14L15.06,9.85C16.13,11.39 16.28,13.24 15.38,14.44L9.06,8.12C10.26,7.22 12.11,7.37 13.65,8.44L19.36,2.72M5.93,17.57C3.92,15.56 2.69,13.16 2.35,10.92L7.23,8.83L14.67,16.27L12.58,21.15C10.34,20.81 7.94,19.58 5.93,17.57Z", vt = "M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z", bt = "M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19A2,2 0 0,0 8,21H16A2,2 0 0,0 18,19V7H6V19Z", kt = "M12,17A2,2 0 0,0 14,15C14,13.89 13.1,13 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6A2,2 0 0,1 4,20V10C4,8.89 4.9,8 6,8H7V6A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,3A3,3 0 0,0 9,6V8H15V6A3,3 0 0,0 12,3Z", Nt = "M18,8A2,2 0 0,1 20,10V20A2,2 0 0,1 18,22H6C4.89,22 4,21.1 4,20V10A2,2 0 0,1 6,8H15V6A3,3 0 0,0 12,3A3,3 0 0,0 9,6H7A5,5 0 0,1 12,1A5,5 0 0,1 17,6V8H18M12,17A2,2 0 0,0 14,15A2,2 0 0,0 12,13A2,2 0 0,0 10,15A2,2 0 0,0 12,17Z", Bt = "M21 3L3 10.53V11.5L9.84 14.16L12.5 21H13.46L21 3Z";
 _([
   {
     type: "color_blend_v1",
@@ -196,7 +196,7 @@ function q(e) {
     console.assert(!1, "invalid param type", e.type);
   return u.xml.textToDom(o);
 }
-function Ye(e, o, t) {
+function De(e, o, t) {
   const n = `<xml><block type="parameter_v1"><mutation key="${o}" name="${t}"/></block></xml>`, i = u.xml.textToDom(n), a = ct.domToWorkspace(i, e);
   return e.getBlockById(a[0]);
 }
@@ -274,7 +274,7 @@ const Vt = {
         f.disable();
         const n = (t = o.getInput(e.oldInputName)) == null ? void 0 : t.connection;
         if (n) {
-          const i = Ye(this.workspace, this.key, this.name);
+          const i = De(this.workspace, this.key, this.name);
           n.connect(i.outputConnection);
         }
       } finally {
@@ -282,7 +282,7 @@ const Vt = {
       }
   },
   updateShape_: function() {
-    this.name ? this.setFieldValue(m[this.name], "LABEL") : this.setFieldValue(this.key, "LABEL");
+    this.name ? this.setFieldValue(E[this.name], "LABEL") : this.setFieldValue(this.key, "LABEL");
   }
 };
 y.parameter_v1 = Vt;
@@ -826,8 +826,8 @@ const Ht = {
     for (let e = 1; this.getInput("IF" + e); e++)
       this.removeInput("IF" + e), this.removeInput("DO" + e);
     for (let e = 1; e <= this.elseIfCount_; e++)
-      this.appendValueInput("IF" + e).setCheck("Boolean").appendField(m.LOGIC_ELSE_IF), this.appendStatementInput("DO" + e).appendField(m.LOGIC_DO);
-    this.hasElse_ && this.appendStatementInput("ELSE").appendField(m.LOGIC_ELSE);
+      this.appendValueInput("IF" + e).setCheck("Boolean").appendField(E.LOGIC_ELSE_IF), this.appendStatementInput("DO" + e).appendField(E.LOGIC_DO);
+    this.hasElse_ && this.appendStatementInput("ELSE").appendField(E.LOGIC_ELSE);
   },
   reconnectChildBlocks_: function(e, o, t) {
     var n, i;
@@ -1050,8 +1050,8 @@ const Gt = {
       };
       e.push({
         enabled: !0,
-        text: m.VARIABLES_SET_CREATE_GET.replace("%1", n),
-        callback: Ue.callbackFactory(this, i)
+        text: E.VARIABLES_SET_CREATE_GET.replace("%1", n),
+        callback: Me.callbackFactory(this, i)
       });
     }
   }
@@ -1088,7 +1088,7 @@ const $t = /* @__PURE__ */ new Set([
       return;
     const t = this.getSurroundLoop();
     if (console.log(e.type, t), this.setWarningText(
-      t ? null : m.LOOP_FLOW_CONTROL_WARNING
+      t ? null : E.LOOP_FLOW_CONTROL_WARNING
     ), !this.isInFlyout)
       try {
         f.setRecordUndo(!1), this.setDisabledReason(!t, "FLOW_CONTROL_NOT_IN_LOOP");
@@ -2253,7 +2253,7 @@ _([
 s.forBlock.object_to_json_v1 = function(e) {
   return [`__jsonStringifyV1__(${s.valueToCode(e, "OBJECT", l.NONE) || "null"})`, l.FUNCTION_CALL];
 };
-const ke = u.xml, qt = {
+const be = u.xml, qt = {
   init: function() {
     this.appendDummyInput().appendField("%{BKY_PROCEDURE_V1_DEF_CONTAINER_TITLE}").appendField(new _t(!1), "WITHRETURN"), this.appendStatementInput("STACK"), this.setStyle("procedure_blocks"), this.contextMenu = !1;
   }
@@ -2296,9 +2296,9 @@ const eo = {
     ), this.setStyle("procedure_blocks"), this.setTooltip("%{BKY_PROCEDURE_V1_DEF_TOOLTIP}"), this.setHelpUrl("%{BKY_PROCEDURE_V1_DEF_HELPURL}");
   },
   mutationToDom: function() {
-    const e = ke.createElement("mutation");
+    const e = be.createElement("mutation");
     return e.setAttribute("withreturn", this.withReturn ? "TRUE" : "FALSE"), this.args.forEach((o) => {
-      const t = ke.createElement("arg");
+      const t = be.createElement("arg");
       t.setAttribute("name", o.name), t.setAttribute("id", o.id), e.appendChild(t);
     }), e;
   },
@@ -2375,7 +2375,7 @@ const eo = {
           n.setKeyName(o.name, "");
         else
           try {
-            f.disable(), n = Ye(this.workspace, o.name, ""), n.outputConnection.connect(t);
+            f.disable(), n = De(this.workspace, o.name, ""), n.outputConnection.connect(t);
           } finally {
             f.enable();
           }
@@ -3048,11 +3048,11 @@ const ro = {
     if (this.isInFlyout) {
       if (this.type === "variables_get_v1" || this.type === "variables_get_v1_reporter") {
         const o = {
-          text: m.RENAME_VARIABLE,
+          text: E.RENAME_VARIABLE,
           enabled: !0,
           callback: co(this)
         }, t = this.getField("VAR").getText(), n = {
-          text: m.DELETE_VARIABLE.replace("%1", t),
+          text: E.DELETE_VARIABLE.replace("%1", t),
           enabled: !0,
           callback: _o(this)
         };
@@ -3060,7 +3060,7 @@ const ro = {
       }
     } else {
       let o, t;
-      this.type === "variables_get_v1" ? (o = "variables_set_v1", t = m.VARIABLE_V1_GET_CREATE_SET) : this.type === "variables_set_v1" ? (o = "variables_get_v1", t = m.VARIABLE_V1_SET_CREATE_GET) : console.assert(!1);
+      this.type === "variables_get_v1" ? (o = "variables_set_v1", t = E.VARIABLE_V1_GET_CREATE_SET) : this.type === "variables_set_v1" ? (o = "variables_get_v1", t = E.VARIABLE_V1_SET_CREATE_GET) : console.assert(!1);
       const n = this.getField("VAR"), i = {
         type: o,
         fields: { VAR: n.saveState(!0) }
@@ -3068,7 +3068,7 @@ const ro = {
       e.push({
         enabled: this.workspace.remainingCapacity() > 0,
         text: t.replace("%1", n.getText()),
-        callback: Ue.callbackFactory(this, i)
+        callback: Me.callbackFactory(this, i)
       });
     }
   }
@@ -3141,15 +3141,15 @@ s.forBlock.variable_set_v1 = function(e) {
   return `${o} = ${t};
 `;
 };
-const Ne = u.xml;
+const ke = u.xml;
 function uo() {
   const e = [];
   {
-    const o = Ne.createElement("label");
-    o.setAttribute("text", m.LABEL_ASSET_LAYER), e.push(o);
+    const o = ke.createElement("label");
+    o.setAttribute("text", E.LABEL_ASSET_LAYER), e.push(o);
   }
   {
-    const o = Ne.createElement("block");
+    const o = ke.createElement("block");
     o.setAttribute("type", "upload_asset_v1"), e.push(o);
   }
   return e;
@@ -3157,28 +3157,28 @@ function uo() {
 const po = {
   name: "INTERFACE_CATEGORY",
   callback: uo
-}, j = u.xml;
+}, $ = u.xml;
 function To() {
   const e = [];
   {
-    const o = j.createElement("label");
+    const o = $.createElement("label");
     o.setAttribute("text", "%{BKY_LABEL_PROCEDURE}"), e.push(o);
   }
   {
-    const o = j.createElement("block");
+    const o = $.createElement("block");
     o.setAttribute("type", "procedure_def_v1");
     {
-      const t = j.createElement("field");
+      const t = $.createElement("field");
       t.setAttribute("name", "NAME");
-      const n = j.createTextNode(
-        m.PROCEDURE_DEFAULT_NAME
+      const n = $.createTextNode(
+        E.PROCEDURE_DEFAULT_NAME
       );
       t.appendChild(n), o.appendChild(t);
     }
     e.push(o);
   }
   {
-    const o = j.createElement("block");
+    const o = $.createElement("block");
     o.setAttribute("type", "procedure_return_v1"), e.push(o);
   }
   return e;
@@ -3193,16 +3193,16 @@ function fo() {
     o.push({ id: t, name: n, type: i });
   }), o;
 }
-const Be = u.xml;
+const Ne = u.xml;
 function Eo() {
   const e = [];
   if (fo().length > 0) {
     {
-      const o = Be.createElement("label");
+      const o = Ne.createElement("label");
       o.setAttribute("text", "%{BKY_LABEL_ARGUMENT}"), e.push(o);
     }
     {
-      const o = Be.createElement("block");
+      const o = Ne.createElement("block");
       o.setAttribute("type", "get_arg_v1"), e.push(o);
     }
   }
@@ -3235,7 +3235,7 @@ function ho(e) {
   t.sort(ut.compareByName);
   {
     const n = Z.createElement("label");
-    n.setAttribute("text", m.LABEL_CREATED), o.push(n);
+    n.setAttribute("text", E.LABEL_CREATED), o.push(n);
   }
   return t.forEach((n) => {
     {
@@ -3252,21 +3252,21 @@ const N = {
   name: "VARIABLE_CATEGORY",
   callback: ho
 };
-Ve.setConfirm(async (e, o) => {
+Ue.setConfirm(async (e, o) => {
   const t = await Ot({
     title: "",
     text: e
   });
   o(!!t);
 });
-Ve.setPrompt(async (e, o, t) => {
+Ue.setPrompt(async (e, o, t) => {
   const n = await gt({
     title: "",
     value: o
   });
   t(String(n));
 });
-const Ke = (e, o, t) => {
+const Ye = (e, o, t) => {
   const n = e[o];
   return n ? typeof n == "function" ? n() : Promise.resolve(n) : new Promise((i, a) => {
     (typeof queueMicrotask == "function" ? queueMicrotask : setTimeout)(
@@ -3279,11 +3279,11 @@ const Ke = (e, o, t) => {
     );
   });
 };
-async function Re(e) {
-  const o = await Ke(/* @__PURE__ */ Object.assign({ "./msg/en.ts": () => import("./msg-en-kge4l75d.js"), "./msg/zhHans.ts": () => import("./msg-zhHans-hfznrf5k.js") }), `./msg/${e}.ts`, 3);
+async function Be(e) {
+  const o = await Ye(/* @__PURE__ */ Object.assign({ "./msg/en.ts": () => import("./msg-en-kge4l75d.js"), "./msg/zhHans.ts": () => import("./msg-zhHans-hfznrf5k.js") }), `./msg/${e}.ts`, 3);
   pt(o.default);
 }
-function Fe(e) {
+function Ke(e) {
   const o = H();
   if (!o)
     return;
@@ -3302,7 +3302,7 @@ function mo() {
   if (!e)
     return;
   const o = (t = e.getTopBlocks(!0)) == null ? void 0 : t[0];
-  o && Fe(o.id);
+  o && Ke(o.id);
 }
 class Oo {
   init({ contextMenu: o = !0, shortcut: t = !0 } = {
@@ -3320,11 +3320,11 @@ class Oo {
   blockCopyToStorageContextMenu() {
     const o = {
       displayText: function() {
-        return m.CROSS_TAB_COPY ? m.CROSS_TAB_COPY : "Copy";
+        return E.CROSS_TAB_COPY ? E.CROSS_TAB_COPY : "Copy";
       },
       preconditionFn: function() {
         const t = D();
-        return !t || !J(t) || !t.isDeletable() || !re(t) || !t.isMovable() || !$(t) ? "disabled" : "enabled";
+        return !t || !J(t) || !t.isDeletable() || !re(t) || !t.isMovable() || !G(t) ? "disabled" : "enabled";
       },
       callback: function(t) {
         var n;
@@ -3342,7 +3342,7 @@ class Oo {
   blockPasteFromStorageContextMenu() {
     const o = {
       displayText: function() {
-        return m.CROSS_TAB_PASTE ? m.CROSS_TAB_PASTE : "Paste";
+        return E.CROSS_TAB_PASTE ? E.CROSS_TAB_PASTE : "Paste";
       },
       preconditionFn: function(t) {
         var a;
@@ -3357,7 +3357,7 @@ class Oo {
         if (!n)
           return;
         const i = JSON.parse(n);
-        i && t.workspace && be.paste(i, t.workspace);
+        i && t.workspace && ve.paste(i, t.workspace);
       },
       scopeType: U.ScopeType.WORKSPACE,
       id: "blockPasteFromStorage",
@@ -3381,12 +3381,12 @@ class Oo {
         if (a.options.readOnly || ce.inProgress())
           return !1;
         const r = D();
-        return !(!r || !J(r) || !r.isDeletable() || !re(r) || !r.isMovable() || !$(r));
+        return !(!r || !J(r) || !r.isDeletable() || !re(r) || !r.isMovable() || !G(r));
       },
       callback: function(a, r) {
         r.preventDefault();
         const c = D();
-        if (!c || !$(c))
+        if (!c || !G(c))
           return !1;
         const p = c.toCopyData();
         return p ? (a.hideChaff(), localStorage.setItem("blocklyStash", JSON.stringify(p)), !0) : !1;
@@ -3411,12 +3411,12 @@ class Oo {
         if (a.options.readOnly || ce.inProgress())
           return !1;
         const r = D();
-        return !(!r || !J(r) || !r.isDeletable() || !re(r) || !r.isMovable() || !$(r) || r.workspace.isFlyout);
+        return !(!r || !J(r) || !r.isDeletable() || !re(r) || !r.isMovable() || !G(r) || r.workspace.isFlyout);
       },
       callback: function(a, r) {
         r.preventDefault();
         const c = D();
-        if (!c || !J(c) || !c.isDeletable() || !$(c))
+        if (!c || !J(c) || !c.isDeletable() || !G(c))
           return !1;
         const p = c.toCopyData();
         return p ? (localStorage.setItem("blocklyStash", JSON.stringify(p)), c instanceof Tt ? c.checkAndDelete() : c.dispose(), !0) : !1;
@@ -3452,7 +3452,7 @@ class Oo {
         if (!c)
           return !1;
         const p = JSON.parse(c);
-        return p ? (be.paste(p, a), !0) : !1;
+        return p ? (ve.paste(p, a), !0) : !1;
       },
       keyCodes: [o, t, n]
     };
@@ -3479,50 +3479,50 @@ class go {
     });
   }
 }
-function He(e) {
+function Fe(e) {
   const o = e.getParent();
-  return o && He(o) ? !0 : !o && !!(e.outputConnection || e.previousConnection);
+  return o && Fe(o) ? !0 : !o && !!(e.outputConnection || e.previousConnection);
 }
 class Io {
   init() {
     const o = U.registry.getItem("blockDisable");
     o && (o.preconditionFn = function(t) {
       const n = t.block;
-      return n && !n.isInFlyout && n.workspace.options.disable && n.isEditable() ? n.getInheritedDisabled() || He(n) ? "disabled" : "enabled" : "hidden";
+      return n && !n.isInFlyout && n.workspace.options.disable && n.isEditable() ? n.getInheritedDisabled() || Fe(n) ? "disabled" : "enabled" : "hidden";
     });
   }
 }
-class we extends _e {
+class He extends _e {
   constructor(t, n, i) {
     super(_e.SKIP_SETUP);
     /** The field's colour picker element. */
-    v(this, "picker", null);
+    A(this, "picker", null);
     /** Index of the currently highlighted element. */
-    v(this, "highlightedIndex", null);
+    A(this, "highlightedIndex", null);
     /**
      * Array holding info needed to unbind events.
      * Used for disposing.
      * Ex: [[node, name, func], [node, name, func]].
      */
-    v(this, "boundEvents", []);
+    A(this, "boundEvents", []);
     /**
      * Serializable fields are saved by the serializer, non-serializable fields
      * are not.  Editable fields should also be serializable.
      */
-    v(this, "SERIALIZABLE", !0);
+    A(this, "SERIALIZABLE", !0);
     /** Mouse cursor style when over the hotspot that initiates the editor. */
-    v(this, "CURSOR", "default");
+    A(this, "CURSOR", "default");
     /**
      * Used to tell if the field needs to be rendered the next time the block is
      * rendered.  Colour fields are statically sized, and only need to be
      * rendered at initialization.
      */
-    v(this, "isDirty_", !1);
+    A(this, "isDirty_", !1);
     /**
      * An array of colour strings for the palette.
      * Copied from goog.ui.ColorPicker.SIMPLE_GRID_COLORS
      */
-    v(this, "colours", [
+    A(this, "colours", [
       // red
       "#F44336",
       // base
@@ -4084,11 +4084,11 @@ class we extends _e {
      * An array of tooltip strings for the palette.  If not the same length as
      * COLOURS, the colour's hex code will be used for any missing titles.
      */
-    v(this, "titles", ["%{BKY_COLOR_RED}"]);
+    A(this, "titles", ["%{BKY_COLOR_RED}"]);
     /**
      * Number of columns in the palette.
      */
-    v(this, "columns", 14);
+    A(this, "columns", 14);
     t !== _e.SKIP_SETUP && (i && this.configure_(i), this.setValue(t), n && this.setValidator(n));
   }
   configure_(t) {
@@ -4198,8 +4198,8 @@ class we extends _e {
     const i = this.colours, a = this.columns;
     let r = this.highlightedIndex % a, c = Math.floor(this.highlightedIndex / a);
     r += t, c += n, t < 0 ? r < 0 && c > 0 ? (r = a - 1, c--) : r < 0 && (r = 0) : t > 0 ? r > a - 1 && c < Math.floor(i.length / a) - 1 ? (r = 0, c++) : r > a - 1 && r-- : n < 0 ? c < 0 && (c = 0) : n > 0 && c > Math.floor(i.length / a) - 1 && (c = Math.floor(i.length / a) - 1);
-    const p = this.picker.childNodes[c].childNodes[r], E = c * a + r;
-    this.setHighlightedCell(p, E);
+    const p = this.picker.childNodes[c].childNodes[r], h = c * a + r;
+    this.setHighlightedCell(p, h);
   }
   onMouseMove(t) {
     const n = t.target, i = n && Number(n.getAttribute("data-index"));
@@ -4309,7 +4309,7 @@ class we extends _e {
     return new this(t.colour, void 0, t);
   }
 }
-we.prototype.DEFAULT_VALUE = "#ffffff";
+He.prototype.DEFAULT_VALUE = "#ffffff";
 dt.register(`
 .blocklyColourTable {
   border-collapse: collapse;
@@ -4338,14 +4338,14 @@ dt.register(`
 }
 `);
 function Lo() {
-  ft.register("field_colour", we);
+  ft.register("field_colour", He);
 }
 const yo = new Oo();
 yo.init({ contextMenu: !0, shortcut: !0 });
 const Co = new go();
 Co.init();
-const vo = new Io();
-vo.init();
+const Ao = new Io();
+Ao.init();
 Lo();
 se.Classic.blockStyles = {
   color_blocks: {
@@ -4471,7 +4471,7 @@ se.Classic.categoryStyles = {
     colour: "#a55b80"
   }
 };
-const Ao = Pe.defineTheme("light", {
+const vo = Ve.defineTheme("light", {
   name: "light",
   base: se.Classic,
   componentStyles: {
@@ -4487,7 +4487,7 @@ const Ao = Pe.defineTheme("light", {
     scrollbarOpacity: 0.4,
     cursorColour: ""
   }
-}), bo = Pe.defineTheme("dark", {
+}), bo = Ve.defineTheme("dark", {
   name: "dark",
   base: se.Classic,
   componentStyles: {
@@ -4508,7 +4508,7 @@ function ko(e) {
   const o = H();
   switch (console.log(o), e) {
     case "light":
-      o.setTheme(Ao);
+      o.setTheme(vo);
       break;
     case "dark":
       o.setTheme(bo);
@@ -5260,7 +5260,7 @@ const me = {
       custom: k.name
     }
   ]
-}, Mo = /* @__PURE__ */ W({
+}, Mo = /* @__PURE__ */ X({
   __name: "index",
   setup(e) {
     const o = () => {
@@ -5276,12 +5276,12 @@ const me = {
         class: "mr-3",
         variant: "outlined",
         density: "comfortable",
-        icon: A(vt),
+        icon: v(At),
         onClick: o
       }, null, 8, ["icon"]);
     };
   }
-}), Uo = /* @__PURE__ */ W({
+}), Uo = /* @__PURE__ */ X({
   __name: "index",
   props: {
     modelValue: { type: Boolean, required: !0 },
@@ -5296,7 +5296,7 @@ const me = {
         class: "mr-3",
         variant: "outlined",
         density: "comfortable",
-        icon: o.value ? A(kt) : A(Nt),
+        icon: o.value ? v(kt) : v(Nt),
         onClick: n[0] || (n[0] = (a) => o.value = !o.value)
       }, null, 8, ["icon"]);
     };
@@ -5304,17 +5304,17 @@ const me = {
 }), Vo = {
   key: 1,
   class: "text-caption text-grey"
-}, Po = /* @__PURE__ */ W({
+}, Po = /* @__PURE__ */ X({
   __name: "index",
   setup(e) {
-    const { t: o } = De(), t = ee([]), n = () => {
-      var E;
+    const { t: o } = xe(), t = ee([]), n = () => {
+      var h;
       const a = H();
       if (!a) {
         t.value = [];
         return;
       }
-      const r = [], c = a.getTopBlocks(!0), p = ((E = D()) == null ? void 0 : E.id) ?? "";
+      const r = [], c = a.getTopBlocks(!0), p = ((h = D()) == null ? void 0 : h.id) ?? "";
       c.forEach((T) => {
         const I = T;
         if (I.type.startsWith("on_node_event_v"))
@@ -5325,7 +5325,7 @@ const me = {
           const O = I.getRelativeToSurfaceXY();
           r.push({
             id: I.id,
-            name: m.fffff,
+            name: E.fffff,
             x: O.x,
             y: O.y,
             active: I.id === p
@@ -5333,7 +5333,7 @@ const me = {
         }
       }), t.value = r;
     };
-    Me(() => {
+    Se(() => {
       de.on("codeUpdate", n);
     }), Ze(() => {
       de.off("codeUpdate", n);
@@ -5343,13 +5343,13 @@ const me = {
       if (!r)
         return;
       const c = r.getBlockById(a.id);
-      c && (Fe(a.id), c.select());
+      c && (Ke(a.id), c.select());
     };
     return (a, r) => {
-      const c = C("v-list-item-title"), p = C("v-list-item"), E = C("v-list");
-      return t.value.length > 0 ? (L(), V(E, { key: 0 }, {
+      const c = C("v-list-item-title"), p = C("v-list-item"), h = C("v-list");
+      return t.value.length > 0 ? (L(), V(h, { key: 0 }, {
         default: Y(() => [
-          (L(!0), X(et, null, tt(t.value, (T) => (L(), V(p, {
+          (L(!0), j(et, null, tt(t.value, (T) => (L(), V(p, {
             key: T.id,
             class: "d-flex justify-start",
             active: T.active,
@@ -5367,33 +5367,33 @@ const me = {
           }, 1032, ["active", "onClick"]))), 128))
         ]),
         _: 1
-      })) : (L(), X("span", Vo, pe(A(o)("x-block-lib.noOption")), 1));
+      })) : (L(), j("span", Vo, pe(v(o)("x-block-lib.noOption")), 1));
     };
   }
-}), xo = { class: "text-subtitle-1 ml-3" }, Do = /* @__PURE__ */ W({
+}), xo = { class: "text-subtitle-1 ml-3" }, Do = /* @__PURE__ */ X({
   __name: "index",
   setup(e) {
-    const { t: o } = De(), t = Ct(), { sysBarAvail: n } = It(), { backgroundColor1: i } = Lt(), a = K(() => {
-      let E = "100%";
-      return t.mdAndUp.value && (E = "400px"), {
+    const { t: o } = xe(), t = Ct(), { sysBarAvail: n } = It(), { backgroundColor1: i } = Lt(), a = K(() => {
+      let h = "100%";
+      return t.mdAndUp.value && (h = "400px"), {
         background: i.value,
-        width: E,
+        width: h,
         height: "100%"
       };
     }), r = K(() => {
-      let E = 48;
-      return n.value && (E += 24), {
+      let h = 48;
+      return n.value && (h += 24), {
         position: "relative",
         width: "100%",
-        height: `calc(100% - ${E}px)`
+        height: `calc(100% - ${h}px)`
       };
     }), c = K(() => ({
       height: "60px"
-    })), { open: p } = xe("selectNodeDlg");
-    return (E, T) => {
+    })), { open: p } = Pe("selectNodeDlg");
+    return (h, T) => {
       const I = C("v-btn"), O = C("v-sheet"), P = C("v-icon"), w = C("v-dialog");
       return L(), V(w, {
-        modelValue: A(p),
+        modelValue: v(p),
         "onUpdate:modelValue": T[3] || (T[3] = (b) => nt(p) ? p.value = b : null),
         transition: "scroll-x-reverse-transition",
         persistent: "",
@@ -5405,7 +5405,7 @@ const me = {
           B(I, st(b, {
             variant: "outlined",
             density: "comfortable",
-            icon: A(Bt)
+            icon: v(Bt)
           }), null, 16, ["icon"])
         ]),
         default: Y(() => [
@@ -5418,7 +5418,7 @@ const me = {
               class: "elevation-2",
               style: F(a.value)
             }, [
-              A(n) ? (L(), V(O, {
+              v(n) ? (L(), V(O, {
                 key: 0,
                 color: "transparent",
                 height: 24
@@ -5430,10 +5430,10 @@ const me = {
               }, {
                 default: Y(() => [
                   B(P, {
-                    icon: A(At),
+                    icon: v(vt),
                     onClick: T[0] || (T[0] = (b) => p.value = !1)
                   }, null, 8, ["icon"]),
-                  S("span", xo, pe(A(o)("x-block-lib.navigator")), 1)
+                  S("span", xo, pe(v(o)("x-block-lib.navigator")), 1)
                 ]),
                 _: 1
               }),
@@ -5453,7 +5453,7 @@ const me = {
       }, 8, ["modelValue"]);
     };
   }
-}), Se = {
+}), Re = {
   grid: {
     length: 2,
     snap: !0,
@@ -5478,8 +5478,8 @@ const me = {
 };
 function Yo(e, o, t) {
   let n;
-  o === "app" ? t === "v1" && (n = Bo) : o === "func" ? t === "v1" && (n = So) : o === "flow" && t === "v1" && (n = Ro), console.assert(!!n), Se.toolbox = n;
-  const i = Et(e, Se);
+  o === "app" ? t === "v1" && (n = Bo) : o === "func" ? t === "v1" && (n = So) : o === "flow" && t === "v1" && (n = Ro), console.assert(!!n), Re.toolbox = n;
+  const i = Et(e, Re);
   return o === "app" ? t === "v1" && (i.registerToolboxCategoryCallback(
     fe.name,
     fe.callback
@@ -5503,12 +5503,11 @@ function Yo(e, o, t) {
     N.callback
   )), i;
 }
-const Ko = { class: "position-relative w-100 h-100" }, zo = /* @__PURE__ */ W({
+const Ko = { class: "position-relative w-100 h-100" }, Fo = /* @__PURE__ */ X({
   __name: "index",
   props: /* @__PURE__ */ Ae({
     type: {},
-    version: {},
-    active: { type: Boolean }
+    version: {}
   }, {
     lock: { type: Boolean, required: !0 },
     lockModifiers: {},
@@ -5517,7 +5516,7 @@ const Ko = { class: "position-relative w-100 h-100" }, zo = /* @__PURE__ */ W({
   }),
   emits: /* @__PURE__ */ Ae(["ready", "change"], ["update:lock", "update:scale"]),
   setup(e, { expose: o, emit: t }) {
-    const n = yt(), { locale: i, dark: a } = mt(n), { open: r } = xe("blocklyEditorFlyout"), c = ue(e, "lock"), p = ue(e, "scale"), E = e, T = t, I = ee();
+    const n = yt(), { locale: i, dark: a } = mt(n), { open: r } = Pe("blocklyEditorFlyout"), c = ue(e, "lock"), p = ue(e, "scale"), h = e, T = t, I = ee();
     let O;
     const P = ee(!1), w = ee(!1), b = K(() => ({
       position: "absolute",
@@ -5528,7 +5527,7 @@ const Ko = { class: "position-relative w-100 h-100" }, zo = /* @__PURE__ */ W({
       height: "calc(100% - 1px)",
       pointerEvents: "none",
       zIndex: 999
-    })), Ge = K(() => ({
+    })), we = K(() => ({
       position: "absolute",
       background: a.value ? "#0000007f" : "#ffffff7f",
       top: "0px",
@@ -5536,76 +5535,77 @@ const Ko = { class: "position-relative w-100 h-100" }, zo = /* @__PURE__ */ W({
       width: "100%",
       height: "100%",
       pointerEvents: "none"
-    })), $e = K(() => ({
+    })), Ge = K(() => ({
       position: "absolute",
       top: "0px",
       right: "0px",
       zIndex: 20
     }));
-    Me(async () => {
+    Se(async () => {
       if (!I.value) {
         console.assert(!1);
         return;
       }
-      await Re(i.value), O = Yo(I.value, E.type, E.version), O.addChangeListener(f.disableOrphans), O.addChangeListener(je), O.setScale(p.value), T("ready", O);
+      await Be(i.value), O = Yo(I.value, h.type, h.version), O.addChangeListener(f.disableOrphans), O.addChangeListener(je), O.setScale(p.value), T("ready", O);
     }), lt(() => {
       r.value = !1;
     });
-    function ve() {
+    function $e() {
       O && ht(O);
     }
-    function je(h) {
-      if (h.type === f.FINISHED_LOADING) {
+    function je(m) {
+      if (m.type === f.FINISHED_LOADING) {
         mo(), de.emit("codeUpdate"), P.value = !1;
         return;
       }
-      P.value || (h.type === f.BLOCK_DRAG && (h.isStart ? w.value = !0 : w.value = !1), T("change", h));
+      if (!P.value) {
+        if (m.type === f.VIEWPORT_CHANGE) {
+          p.value = O.getScale();
+          return;
+        }
+        m.type === f.BLOCK_DRAG && (m.isStart ? w.value = !0 : w.value = !1), T("change", m);
+      }
     }
     return o({ load: () => {
       P.value = !0;
     }, resize: () => {
-    } }), G(i, (h) => {
-      Re(h);
-    }), G(a, (h) => {
-      ko(h ? "dark" : "light");
-    }), G(r, (h) => {
+    } }), W(i, (m) => {
+      Be(m);
+    }), W(a, (m) => {
+      ko(m ? "dark" : "light");
+    }), W(r, (m) => {
       var R;
-      h || (R = O.getToolbox()) == null || R.clearSelection();
-    }), G(
-      () => E.active,
-      (h) => {
-        h && setTimeout(() => ve(), 1);
-      }
-    ), G(p, (h) => {
-      O.setScale(h);
-    }), (h, R) => {
+      m || (R = O.getToolbox()) == null || R.clearSelection();
+    }), W(p, (m) => {
+      O.setScale(m);
+    }), (m, R) => {
       const Xe = C("v-icon"), We = C("x-loading"), Je = at("resize");
-      return L(), X("div", Ko, [
+      return L(), j("div", Ko, [
         rt(S("div", {
           id: "blocklyEditor",
           ref_key: "blocklyDiv",
           ref: I,
           class: "w-100 h-100"
         }, null, 512), [
-          [Je, ve]
+          [Je, $e]
         ]),
-        w.value ? (L(), X("div", {
+        w.value ? (L(), j("div", {
           key: 0,
           class: "d-flex flex-column align-center justify-center",
           style: F(b.value)
         }, [
           B(Xe, {
-            icon: A(bt),
+            icon: v(bt),
             size: "x-large"
           }, null, 8, ["icon"])
         ], 4)) : te("", !0),
-        c.value ? (L(), X("div", {
+        c.value ? (L(), j("div", {
           key: 1,
-          style: F(Ge.value)
+          style: F(we.value)
         }, null, 4)) : te("", !0),
         S("div", {
           class: "d-flex align-end pt-3 pr-3",
-          style: F($e.value)
+          style: F(Ge.value)
         }, [
           B(Mo),
           B(Uo, {
@@ -5621,11 +5621,16 @@ const Ko = { class: "position-relative w-100 h-100" }, zo = /* @__PURE__ */ W({
       ]);
     };
   }
-});
-async function Qo(e) {
-  return (await Ke(/* @__PURE__ */ Object.assign({ "./locales/en/index.ts": () => import("./i18n-en-hf8d9jpk.js"), "./locales/zhHans/index.ts": () => import("./i18n-zhHans-kicfou8k.js") }), `./locales/${e}/index.ts`, 4)).default;
+}), Ho = (e) => {
+  e.component("XBlockly", Fo);
+};
+async function qo(e) {
+  return (await Ye(/* @__PURE__ */ Object.assign({ "./locales/en/index.ts": () => import("./i18n-en-hf8d9jpk.js"), "./locales/zhHans/index.ts": () => import("./i18n-zhHans-kicfou8k.js") }), `./locales/${e}/index.ts`, 4)).default;
 }
+const Zo = { install: Ho };
 export {
-  zo as XBlockly,
-  Qo as loadLocaleMessageBlock
+  Fo as XBlockly,
+  Zo as default,
+  Ho as install,
+  qo as loadLocaleMessageBlock
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "x-block-lib",
   "private": false,
-  "version": "0.4.8",
+  "version": "0.4.10",
   "type": "module",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",