@m2c2kit/addons 0.3.10 → 0.3.11

package/dist/index.d.ts

@@ -603,4 +603,4 @@ declare class Instructions extends Story {
     static Create(options: InstructionsOptions): Array<Scene>;
 }
 
-export { Button, ButtonOptions, Dialog, DialogEvent, DialogOptions, DialogResult, DrawPad, DrawPadEvent, DrawPadEventType, DrawPadItem, DrawPadItemEvent, DrawPadItemEventType, DrawPadOptions, DrawPadStroke, Grid, GridOptions, InstructionScene, Instructions, InstructionsOptions, KeyConfiguration, KeyTapMetadata, StrokeInteraction, VirtualKeyboard, VirtualKeyboardEvent, VirtualKeyboardOptions, VirtualKeyboardRow };
+export { Button, type ButtonOptions, Dialog, type DialogEvent, type DialogOptions, DialogResult, DrawPad, type DrawPadEvent, DrawPadEventType, type DrawPadItem, type DrawPadItemEvent, DrawPadItemEventType, type DrawPadOptions, type DrawPadStroke, Grid, type GridOptions, type InstructionScene, Instructions, type InstructionsOptions, type KeyConfiguration, type KeyTapMetadata, type StrokeInteraction, VirtualKeyboard, type VirtualKeyboardEvent, type VirtualKeyboardOptions, type VirtualKeyboardRow };

package/dist/index.js

@@ -1,28 +1,5 @@
 import { Composite, WebColors, Shape, Label, CanvasKitHelpers, EventType, MutablePath, Easings, Story, Transition, TransitionDirection, LabelHorizontalAlignmentMode, Scene, Dimensions, Sprite } from '@m2c2kit/core';
 
-var __defProp$4 = Object.defineProperty;
-var __defProps$1 = Object.defineProperties;
-var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
-var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
-var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$1.call(b, prop))
-      __defNormalProp$4(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1)
-    for (var prop of __getOwnPropSymbols$1(b)) {
-      if (__propIsEnum$1.call(b, prop))
-        __defNormalProp$4(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
-var __publicField$4 = (obj, key, value) => {
-  __defNormalProp$4(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Grid extends Composite {
   /**
    * A rectangular grid that supports placement of entities within the grid's
@@ -36,19 +13,16 @@ class Grid extends Composite {
    */
   constructor(options) {
     super(options);
-    __publicField$4(this, "compositeType", "grid");
+    this.compositeType = "grid";
     // Grid options
     // TODO: make getter, setter for these so they can be changed after initial construction
-    __publicField$4(this, "rows", 0);
-    __publicField$4(this, "columns", 0);
+    this.rows = 0;
+    this.columns = 0;
     // default Grid is: transparent gray, red lines, line width 1
-    __publicField$4(this, "gridBackgroundColor", [0, 0, 233, 0.25]);
-    __publicField$4(this, "gridLineColor", WebColors.Red);
-    __publicField$4(this, "gridLineWidth", 1);
-    __publicField$4(this, "cellWidth");
-    __publicField$4(this, "cellHeight");
-    __publicField$4(this, "gridChildren", new Array());
-    __publicField$4(this, "_gridBackground");
+    this.gridBackgroundColor = [0, 0, 233, 0.25];
+    this.gridLineColor = WebColors.Red;
+    this.gridLineWidth = 1;
+    this.gridChildren = new Array();
     if (options.size) {
       this.size = options.size;
     } else {
@@ -162,7 +136,9 @@ class Grid extends Composite {
    * provided, name will be the new uuid
    */
   duplicate(newName) {
-    const dest = new Grid(__spreadProps$1(__spreadValues$1(__spreadValues$1({}, this.getEntityOptions()), this.getDrawableOptions()), {
+    const dest = new Grid({
+      ...this.getEntityOptions(),
+      ...this.getDrawableOptions(),
       rows: this.rows,
       columns: this.columns,
       size: this.size,
@@ -170,7 +146,7 @@ class Grid extends Composite {
       gridLineWidth: this.gridLineWidth,
       gridLineColor: this.gridLineColor,
       name: newName
-    }));
+    });
     if (this.children.length > 0) {
       dest.children = this.children.map((child) => {
         const clonedChild = child.duplicate();
@@ -262,29 +238,6 @@ class Grid extends Composite {
   }
 }
 
-var __defProp$3 = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp$3(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp$3(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __publicField$3 = (obj, key, value) => {
-  __defNormalProp$3(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Button extends Composite {
   // todo: add getters/setters so button can respond to changes in its options
   // todo: add default "behaviors" (?) like button click animation?
@@ -299,15 +252,14 @@ class Button extends Composite {
    */
   constructor(options) {
     super(options);
-    __publicField$3(this, "compositeType", "button");
+    this.compositeType = "button";
     // Button options
-    __publicField$3(this, "_backgroundColor", WebColors.Black);
-    __publicField$3(this, "size", { width: 200, height: 50 });
-    __publicField$3(this, "cornerRadius", 9);
-    __publicField$3(this, "fontSize", 20);
-    __publicField$3(this, "text", "");
-    __publicField$3(this, "_fontColor", WebColors.White);
-    __publicField$3(this, "backgroundPaint");
+    this._backgroundColor = WebColors.Black;
+    this.size = { width: 200, height: 50 };
+    this.cornerRadius = 9;
+    this.fontSize = 20;
+    this.text = "";
+    this._fontColor = WebColors.White;
     if (options.text) {
       this.text = options.text;
     }
@@ -381,13 +333,16 @@ class Button extends Composite {
    * provided, name will be the new uuid
    */
   duplicate(newName) {
-    const dest = new Button(__spreadProps(__spreadValues(__spreadValues(__spreadValues({}, this.getEntityOptions()), this.getDrawableOptions()), this.getTextOptions()), {
+    const dest = new Button({
+      ...this.getEntityOptions(),
+      ...this.getDrawableOptions(),
+      ...this.getTextOptions(),
       size: this.size,
       cornerRadius: this.cornerRadius,
       backgroundColor: this.backgroundColor,
       fontColor: this.fontColor,
       name: newName
-    }));
+    });
     if (this.children.length > 0) {
       dest.children = this.children.map((child) => {
         const clonedChild = child.duplicate();
@@ -411,12 +366,6 @@ class Button extends Composite {
   }
 }
 
-var __defProp$2 = Object.defineProperty;
-var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$2 = (obj, key, value) => {
-  __defNormalProp$2(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 var DialogResult = /* @__PURE__ */ ((DialogResult2) => {
   DialogResult2["Dismiss"] = "Dismiss";
   DialogResult2["Positive"] = "Positive";
@@ -428,17 +377,16 @@ class Dialog extends Composite {
   // todo: add default "behaviors" (?) like button click animation?
   constructor(options) {
     super(options);
-    __publicField$2(this, "compositeType", "dialog");
-    __publicField$2(this, "_backgroundColor", WebColors.White);
-    __publicField$2(this, "cornerRadius", 9);
-    __publicField$2(this, "overlayAlpha", 0.5);
-    __publicField$2(this, "contentText", "");
-    __publicField$2(this, "positiveButtonText", "");
-    __publicField$2(this, "negativeButtonText", "");
-    __publicField$2(this, "zPosition", Number.MAX_VALUE);
-    __publicField$2(this, "hidden", true);
-    __publicField$2(this, "_fontColor", WebColors.White);
-    __publicField$2(this, "backgroundPaint");
+    this.compositeType = "dialog";
+    this._backgroundColor = WebColors.White;
+    this.cornerRadius = 9;
+    this.overlayAlpha = 0.5;
+    this.contentText = "";
+    this.positiveButtonText = "";
+    this.negativeButtonText = "";
+    this.zPosition = Number.MAX_VALUE;
+    this.hidden = true;
+    this._fontColor = WebColors.White;
     if (!options) {
       return;
     }
@@ -626,12 +574,6 @@ class Dialog extends Composite {
   }
 }
 
-var __defProp$1 = Object.defineProperty;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$1 = (obj, key, value) => {
-  __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 const DrawPadEventType = {
   StrokeStart: "StrokeStart",
   StrokeMove: "StrokeMove",
@@ -652,26 +594,21 @@ class DrawPad extends Composite {
    */
   constructor(options) {
     super(options);
-    __publicField$1(this, "compositeType", "DrawPad");
-    __publicField$1(this, "resumeDrawingOnReturn", false);
-    __publicField$1(this, "continuousDrawingOnly", false);
-    __publicField$1(this, "continuousDrawingOnlyExceptionDistance");
-    __publicField$1(this, "_backgroundColor", [0, 0, 0, 0]);
-    __publicField$1(this, "_borderColor", WebColors.Black);
-    __publicField$1(this, "_borderWidth", 1);
-    __publicField$1(this, "_lineColor", WebColors.Red);
-    __publicField$1(this, "_lineWidth", 1);
-    /** The rectangular "pad" on which to draw */
-    __publicField$1(this, "drawArea");
-    /** The lines that are drawn */
-    __publicField$1(this, "drawShape");
-    __publicField$1(this, "isDrawingPointerDown", false);
-    __publicField$1(this, "pointerIsDownAndPointerLeftDrawAreaWhenDown", false);
-    __publicField$1(this, "currentStrokesNotAllowed", false);
+    this.compositeType = "DrawPad";
+    this.resumeDrawingOnReturn = false;
+    this.continuousDrawingOnly = false;
+    this._backgroundColor = [0, 0, 0, 0];
+    this._borderColor = WebColors.Black;
+    this._borderWidth = 1;
+    this._lineColor = WebColors.Red;
+    this._lineWidth = 1;
+    this.isDrawingPointerDown = false;
+    this.pointerIsDownAndPointerLeftDrawAreaWhenDown = false;
+    this.currentStrokesNotAllowed = false;
     /** Array of strokes created on the DrawPad, with position and timestamps
      * of all interactions with each DrawPadStroke.
      */
-    __publicField$1(this, "strokes", new Array());
+    this.strokes = new Array();
     if (options.isUserInteractionEnabled === void 0) {
       this.isUserInteractionEnabled = true;
     }
@@ -712,9 +649,9 @@ class DrawPad extends Composite {
   initializeDrawShape() {
     if (!this.drawShape) {
       const mutablePath = new MutablePath();
-      mutablePath.size = this.size;
       this.drawShape = new Shape({
-        path: mutablePath
+        path: mutablePath,
+        size: this.size
       });
       this.addChild(this.drawShape);
     }
@@ -1141,12 +1078,6 @@ class DrawPad extends Composite {
   }
 }
 
-var __defProp = Object.defineProperty;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class VirtualKeyboard extends Composite {
   /**
    * An on-screen keyboard that can be used to enter text.
@@ -1154,31 +1085,15 @@ class VirtualKeyboard extends Composite {
    * @param options - {@link VirtualKeyboardOptions}
    */
   constructor(options) {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
     super(options);
-    __publicField(this, "keyboardHorizontalPaddingPercent");
-    __publicField(this, "keyboardVerticalPaddingPercent");
-    __publicField(this, "keyHorizontalPaddingPercent");
-    __publicField(this, "keyVerticalPaddingPercent");
-    __publicField(this, "rowsConfiguration", new Array());
-    __publicField(this, "keysPerRow");
-    __publicField(this, "fontSize");
-    __publicField(this, "fontNames");
-    __publicField(this, "hiddenKeys");
-    __publicField(this, "capitalLettersOnly");
-    __publicField(this, "keyColor");
-    __publicField(this, "keyDownColor");
-    __publicField(this, "specialKeyDownColor");
-    __publicField(this, "backgroundColor");
-    __publicField(this, "showKeyDownPreview");
-    __publicField(this, "shiftActivated", false);
-    __publicField(this, "shiftKeyShape");
+    this.rowsConfiguration = new Array();
+    this.shiftActivated = false;
     this.size = options.size;
-    this.position = (_a = options.position) != null ? _a : { x: 0, y: 0 };
-    this.keyboardHorizontalPaddingPercent = (_b = options.keyboardHorizontalPaddingPercent) != null ? _b : 0.02;
-    this.keyboardVerticalPaddingPercent = (_c = options.keyboardVerticalPaddingPercent) != null ? _c : 0.025;
-    this.keyHorizontalPaddingPercent = (_d = options.keyHorizontalPaddingPercent) != null ? _d : 0.1;
-    this.keyVerticalPaddingPercent = (_e = options.keyVerticalPaddingPercent) != null ? _e : 0.1;
+    this.position = options.position ?? { x: 0, y: 0 };
+    this.keyboardHorizontalPaddingPercent = options.keyboardHorizontalPaddingPercent ?? 0.02;
+    this.keyboardVerticalPaddingPercent = options.keyboardVerticalPaddingPercent ?? 0.025;
+    this.keyHorizontalPaddingPercent = options.keyHorizontalPaddingPercent ?? 0.1;
+    this.keyVerticalPaddingPercent = options.keyVerticalPaddingPercent ?? 0.1;
     if (options.rows !== void 0) {
       this.rowsConfiguration = options.rows.map((row) => {
         const internalRow = row.map((key) => {
@@ -1196,19 +1111,18 @@ class VirtualKeyboard extends Composite {
         return internalRow;
       });
     }
-    this.keysPerRow = (_f = options.keysPerRow) != null ? _f : NaN;
-    this.fontSize = (_g = options.fontSize) != null ? _g : NaN;
+    this.keysPerRow = options.keysPerRow ?? NaN;
+    this.fontSize = options.fontSize ?? NaN;
     this.fontNames = options.fontNames;
-    this.hiddenKeys = (_h = options.hiddenKeys) != null ? _h : "";
-    this.capitalLettersOnly = (_i = options.capitalLettersOnly) != null ? _i : false;
-    this.keyColor = (_j = options.keyColor) != null ? _j : WebColors.White;
-    this.keyDownColor = (_k = options.keyDownColor) != null ? _k : WebColors.Transparent;
-    this.specialKeyDownColor = (_l = options.specialKeyDownColor) != null ? _l : WebColors.LightSteelBlue;
-    this.backgroundColor = (_m = options.backgroundColor) != null ? _m : [242, 240, 244, 1];
-    this.showKeyDownPreview = (_n = options.showKeyDownPreview) != null ? _n : true;
+    this.hiddenKeys = options.hiddenKeys ?? "";
+    this.capitalLettersOnly = options.capitalLettersOnly ?? false;
+    this.keyColor = options.keyColor ?? WebColors.White;
+    this.keyDownColor = options.keyDownColor ?? WebColors.Transparent;
+    this.specialKeyDownColor = options.specialKeyDownColor ?? WebColors.LightSteelBlue;
+    this.backgroundColor = options.backgroundColor ?? [242, 240, 244, 1];
+    this.showKeyDownPreview = options.showKeyDownPreview ?? true;
   }
   initialize() {
-    var _a, _b, _c, _d, _e, _f, _g;
     if (this.rowsConfiguration.length === 0) {
       const numKeys = [
         ["1", "!"],
@@ -1248,7 +1162,7 @@ class VirtualKeyboard extends Composite {
       const shiftArrowShapeOptions = {
         path: {
           // Public Domain from https://www.freesvg.org
-          svgPathString: "m288-6.6849e-14 -288 288h144v288h288v-288h144l-288-288z",
+          pathString: "m288-6.6849e-14 -288 288h144v288h288v-288h144l-288-288z",
           width: 24
         },
         lineWidth: 2,
@@ -1258,7 +1172,7 @@ class VirtualKeyboard extends Composite {
       const backspaceShapeOptions = {
         path: {
           // CC0 from https://www.svgrepo.com
-          svgPathString: "M10.625 5.09 0 22.09l10.625 17H44.18v-34H10.625zm31.555 32H11.734l-9.375-15 9.375-15H42.18v30zm-23.293-6.293 7.293-7.293 7.293 7.293 1.414-1.414-7.293-7.293 7.293-7.293-1.414-1.414-7.293 7.293-7.293-7.293-1.414 1.414 7.293 7.293-7.293 7.293",
+          pathString: "M10.625 5.09 0 22.09l10.625 17H44.18v-34H10.625zm31.555 32H11.734l-9.375-15 9.375-15H42.18v30zm-23.293-6.293 7.293-7.293 7.293 7.293 1.414-1.414-7.293-7.293 7.293-7.293-1.414-1.414-7.293 7.293-7.293-7.293-1.414 1.414 7.293 7.293-7.293 7.293",
           width: 24
         },
         lineWidth: 1,
@@ -1309,7 +1223,6 @@ class VirtualKeyboard extends Composite {
     this.addChild(keyboardRectangle);
     const rows = this.rowsConfiguration.map((row) => {
       return row.map((key) => {
-        var _a2, _b2, _c2, _d2;
         let widthRatio = 1;
         const heightRatio = 1;
         let code;
@@ -1331,11 +1244,11 @@ class VirtualKeyboard extends Composite {
           labelShifted = key[1];
         } else {
           code = key.code;
-          label = (_a2 = key.labelText) != null ? _a2 : "";
-          labelShifted = (_b2 = key.labelTextShifted) != null ? _b2 : label;
-          widthRatio = (_c2 = key.widthRatio) != null ? _c2 : 1;
+          label = key.labelText ?? "";
+          labelShifted = key.labelTextShifted ?? label;
+          widthRatio = key.widthRatio ?? 1;
           keyIcon = key.keyIcon;
-          isShift = (_d2 = key.isShift) != null ? _d2 : false;
+          isShift = key.isShift ?? false;
         }
         return {
           widthRatio,
@@ -1352,17 +1265,14 @@ class VirtualKeyboard extends Composite {
       x: -keyboardRectangle.size.width / 2,
       y: -keyboardRectangle.size.height / 2
     };
-    const keyboardVerticalPadding = ((_a = this.keyboardVerticalPaddingPercent) != null ? _a : 0.025) * this.size.height;
-    const keyboardHorizontalPadding = ((_b = this.keyboardHorizontalPaddingPercent) != null ? _b : 0.02) * this.size.width;
+    const keyboardVerticalPadding = (this.keyboardVerticalPaddingPercent ?? 0.025) * this.size.height;
+    const keyboardHorizontalPadding = (this.keyboardHorizontalPaddingPercent ?? 0.02) * this.size.width;
     const keyBoxHeight = (this.size.height - 2 * keyboardVerticalPadding) / rows.length;
     const keyBoxWidth = (this.size.width - 2 * keyboardHorizontalPadding) / this.keysPerRow;
     for (let r = 0; r < rows.length; r++) {
       const row = rows[r];
       const rowSumKeyWidths = row.reduce(
-        (sum, key) => {
-          var _a2;
-          return sum + ((_a2 = key.widthRatio) != null ? _a2 : 1);
-        },
+        (sum, key) => sum + (key.widthRatio ?? 1),
         0
       );
       let extraPadding = 0;
@@ -1371,17 +1281,14 @@ class VirtualKeyboard extends Composite {
       }
       for (let k = 0; k < row.length; k++) {
         const key = row[k];
-        if ((_c = this.hiddenKeys) == null ? void 0 : _c.split(",").map((s) => s.trim()).includes(key.code)) {
+        if (this.hiddenKeys?.split(",").map((s) => s.trim()).includes(key.code)) {
           continue;
         }
-        const keyBoxWidthsSoFar = row.slice(0, k).reduce((sum, key2) => {
-          var _a2;
-          return sum + ((_a2 = key2.widthRatio) != null ? _a2 : 1);
-        }, 0) * keyBoxWidth;
+        const keyBoxWidthsSoFar = row.slice(0, k).reduce((sum, key2) => sum + (key2.widthRatio ?? 1), 0) * keyBoxWidth;
         const keyBox = new Shape({
           rect: {
             size: {
-              width: keyBoxWidth * ((_d = key.widthRatio) != null ? _d : 1),
+              width: keyBoxWidth * (key.widthRatio ?? 1),
               height: keyBoxHeight
             }
           },
@@ -1389,12 +1296,12 @@ class VirtualKeyboard extends Composite {
           strokeColor: WebColors.Transparent,
           lineWidth: 1,
           position: {
-            x: extraPadding + keyboardOrigin.x + keyboardHorizontalPadding + keyBoxWidthsSoFar + ((_e = key.widthRatio) != null ? _e : 1) * keyBoxWidth / 2,
+            x: extraPadding + keyboardOrigin.x + keyboardHorizontalPadding + keyBoxWidthsSoFar + (key.widthRatio ?? 1) * keyBoxWidth / 2,
             y: keyboardOrigin.y + keyboardVerticalPadding + r * keyBoxHeight + keyBoxHeight / 2
           }
         });
-        const keyWidth = keyBoxWidth * ((_f = key.widthRatio) != null ? _f : 1) - 2 * this.keyHorizontalPaddingPercent * keyBoxWidth;
-        const keyHeight = keyBoxHeight - ((_g = key.heightRatio) != null ? _g : 1) - 2 * this.keyVerticalPaddingPercent * keyBoxHeight;
+        const keyWidth = keyBoxWidth * (key.widthRatio ?? 1) - 2 * this.keyHorizontalPaddingPercent * keyBoxWidth;
+        const keyHeight = keyBoxHeight - (key.heightRatio ?? 1) - 2 * this.keyVerticalPaddingPercent * keyBoxHeight;
         const keyShape = new Shape({
           rect: { size: { width: keyWidth, height: keyHeight } },
           cornerRadius: 4,
@@ -1404,7 +1311,6 @@ class VirtualKeyboard extends Composite {
         });
         keyBox.addChild(keyShape);
         keyShape.onTapUp((tapEvent) => {
-          var _a2, _b2;
           let keyAsString = "";
           if (!key.isShift) {
             if (this.shiftActivated) {
@@ -1416,14 +1322,13 @@ class VirtualKeyboard extends Composite {
                 }
               }
               rows.flatMap((k2) => k2).forEach((k2) => {
-                var _a3, _b3;
-                if (((_a3 = k2.keyLabel) == null ? void 0 : _a3.text) !== void 0) {
-                  k2.keyLabel.text = (_b3 = k2.labelText) != null ? _b3 : "";
+                if (k2.keyLabel?.text !== void 0) {
+                  k2.keyLabel.text = k2.labelText ?? "";
                 }
               });
-              keyAsString = (_a2 = key.labelTextShifted) != null ? _a2 : key.code;
+              keyAsString = key.labelTextShifted ?? key.code;
             } else {
-              keyAsString = (_b2 = key.labelText) != null ? _b2 : key.code;
+              keyAsString = key.labelText ?? key.code;
             }
             if (key.code === " " || key.code === "Backspace") {
               keyAsString = key.code;
@@ -1460,7 +1365,6 @@ class VirtualKeyboard extends Composite {
           }
         });
         keyShape.onTapDown((tapEvent) => {
-          var _a2, _b2, _c2, _d2;
           if (key.isShift) {
             this.shiftActivated = !this.shiftActivated;
             if (this.shiftActivated) {
@@ -1469,9 +1373,8 @@ class VirtualKeyboard extends Composite {
                 key.keyIcon.fillColor = WebColors.Black;
               }
               rows.flatMap((k2) => k2).forEach((k2) => {
-                var _a3, _b3, _c3;
-                if (((_a3 = k2.keyLabel) == null ? void 0 : _a3.text) !== void 0) {
-                  k2.keyLabel.text = (_c3 = (_b3 = k2.labelTextShifted) != null ? _b3 : k2.labelText) != null ? _c3 : "";
+                if (k2.keyLabel?.text !== void 0) {
+                  k2.keyLabel.text = k2.labelTextShifted ?? k2.labelText ?? "";
                 }
               });
             } else {
@@ -1480,9 +1383,8 @@ class VirtualKeyboard extends Composite {
                 key.keyIcon.fillColor = WebColors.Transparent;
               }
               rows.flatMap((k2) => k2).forEach((k2) => {
-                var _a3, _b3;
-                if (((_a3 = k2.keyLabel) == null ? void 0 : _a3.text) !== void 0) {
-                  k2.keyLabel.text = (_b3 = k2.labelText) != null ? _b3 : "";
+                if (k2.keyLabel?.text !== void 0) {
+                  k2.keyLabel.text = k2.labelText ?? "";
                 }
               });
             }
@@ -1498,15 +1400,15 @@ class VirtualKeyboard extends Composite {
               letterCircle.position.x = keyBox.position.x;
               letterCircle.position.y = keyBox.position.y - keyHeight * 1.2;
               if (this.shiftActivated) {
-                letterCircleLabel.text = (_a2 = key.labelTextShifted) != null ? _a2 : key.code;
+                letterCircleLabel.text = key.labelTextShifted ?? key.code;
               } else {
-                letterCircleLabel.text = (_b2 = key.labelText) != null ? _b2 : key.code;
+                letterCircleLabel.text = key.labelText ?? key.code;
               }
             }
             if (this.shiftActivated) {
-              keyAsString = (_c2 = key.labelTextShifted) != null ? _c2 : key.code;
+              keyAsString = key.labelTextShifted ?? key.code;
             } else {
-              keyAsString = (_d2 = key.labelText) != null ? _d2 : key.code;
+              keyAsString = key.labelText ?? key.code;
             }
           }
           if (this.eventListeners.length > 0) {
@@ -1645,38 +1547,37 @@ class Instructions extends Story {
   static Create(options) {
     const scenes = new Array();
     options.instructionScenes.forEach((s, i) => {
-      var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I;
-      const nextSceneTransition = (_b = (_a = s.nextSceneTransition) != null ? _a : options.nextSceneTransition) != null ? _b : Transition.slide({
+      const nextSceneTransition = s.nextSceneTransition ?? options.nextSceneTransition ?? Transition.slide({
         direction: TransitionDirection.Left,
         duration: SCENE_TRANSITION_DURATION,
         easing: SCENE_TRANSITION_EASING
       });
-      const backSceneTransition = (_d = (_c = s.backSceneTransition) != null ? _c : options.backSceneTransition) != null ? _d : Transition.slide({
+      const backSceneTransition = s.backSceneTransition ?? options.backSceneTransition ?? Transition.slide({
         direction: TransitionDirection.Right,
         duration: SCENE_TRANSITION_DURATION,
         easing: SCENE_TRANSITION_EASING
       });
-      const backButtonText = (_f = (_e = s.backButtonText) != null ? _e : options.backButtonText) != null ? _f : "Back";
-      const nextButtonText = (_h = (_g = s.nextButtonText) != null ? _g : options.nextButtonText) != null ? _h : "Next";
-      const backButtonWidth = (_j = (_i = s.backButtonWidth) != null ? _i : options.backButtonWidth) != null ? _j : 125;
-      const nextButtonWidth = (_l = (_k = s.nextButtonWidth) != null ? _k : options.nextButtonWidth) != null ? _l : 125;
-      const backButtonHeight = (_n = (_m = s.backButtonHeight) != null ? _m : options.backButtonHeight) != null ? _n : 50;
-      const nextButtonHeight = (_p = (_o = s.nextButtonHeight) != null ? _o : options.nextButtonHeight) != null ? _p : 50;
-      const backgroundColor = (_q = s.backgroundColor) != null ? _q : options.backgroundColor;
-      const imageAboveText = (_r = s.imageAboveText) != null ? _r : true;
-      const imageMarginTop = (_s = s.imageMarginTop) != null ? _s : 0;
-      const imageMarginBottom = (_t = s.imageMarginBottom) != null ? _t : 0;
-      const textMarginStart = (_u = s.textMarginStart) != null ? _u : 48;
-      const textMarginEnd = (_v = s.textMarginEnd) != null ? _v : 48;
-      const textAlignmentMode = (_w = s.textAlignmentMode) != null ? _w : LabelHorizontalAlignmentMode.Left;
-      const textFontSize = (_x = s.textFontSize) != null ? _x : 16;
-      const titleFontSize = (_y = s.titleFontSize) != null ? _y : 16;
-      const titleMarginTop = (_z = s.titleMarginTop) != null ? _z : 48;
-      const backButtonBackgroundColor = (_B = (_A = s.backButtonBackgroundColor) != null ? _A : options.backButtonBackgroundColor) != null ? _B : WebColors.Black;
-      const backButtonFontColor = (_D = (_C = s.backButtonFontColor) != null ? _C : options.backButtonFontColor) != null ? _D : WebColors.White;
-      const nextButtonBackgroundColor = (_F = (_E = s.nextButtonBackgroundColor) != null ? _E : options.nextButtonBackgroundColor) != null ? _F : WebColors.Black;
-      const nextButtonFontColor = (_H = (_G = s.nextButtonFontColor) != null ? _G : options.nextButtonFontColor) != null ? _H : WebColors.White;
-      const sceneNamePrefix = (_I = options.sceneNamePrefix) != null ? _I : "instructions";
+      const backButtonText = s.backButtonText ?? options.backButtonText ?? "Back";
+      const nextButtonText = s.nextButtonText ?? options.nextButtonText ?? "Next";
+      const backButtonWidth = s.backButtonWidth ?? options.backButtonWidth ?? 125;
+      const nextButtonWidth = s.nextButtonWidth ?? options.nextButtonWidth ?? 125;
+      const backButtonHeight = s.backButtonHeight ?? options.backButtonHeight ?? 50;
+      const nextButtonHeight = s.nextButtonHeight ?? options.nextButtonHeight ?? 50;
+      const backgroundColor = s.backgroundColor ?? options.backgroundColor;
+      const imageAboveText = s.imageAboveText ?? true;
+      const imageMarginTop = s.imageMarginTop ?? 0;
+      const imageMarginBottom = s.imageMarginBottom ?? 0;
+      const textMarginStart = s.textMarginStart ?? 48;
+      const textMarginEnd = s.textMarginEnd ?? 48;
+      const textAlignmentMode = s.textAlignmentMode ?? LabelHorizontalAlignmentMode.Left;
+      const textFontSize = s.textFontSize ?? 16;
+      const titleFontSize = s.titleFontSize ?? 16;
+      const titleMarginTop = s.titleMarginTop ?? 48;
+      const backButtonBackgroundColor = s.backButtonBackgroundColor ?? options.backButtonBackgroundColor ?? WebColors.Black;
+      const backButtonFontColor = s.backButtonFontColor ?? options.backButtonFontColor ?? WebColors.White;
+      const nextButtonBackgroundColor = s.nextButtonBackgroundColor ?? options.nextButtonBackgroundColor ?? WebColors.Black;
+      const nextButtonFontColor = s.nextButtonFontColor ?? options.nextButtonFontColor ?? WebColors.White;
+      const sceneNamePrefix = options.sceneNamePrefix ?? "instructions";
       const scene = new Scene({
         name: sceneNamePrefix + "-" + (i + 1).toString().padStart(2, "0"),
         backgroundColor
@@ -1806,9 +1707,8 @@ class Instructions extends Story {
       } else {
         if (options.postInstructionsScene !== void 0) {
           nextButton.onTapDown(() => {
-            var _a2;
             scene.game.presentScene(
-              (_a2 = options.postInstructionsScene) != null ? _a2 : "",
+              options.postInstructionsScene ?? "",
               nextSceneTransition
             );
           });
@@ -1842,7 +1742,7 @@ class Instructions extends Story {
   }
 }
 
-console.log("\u26AA @m2c2kit/addons version 0.3.10 (291d0cee)");
+console.log("\u26AA @m2c2kit/addons version 0.3.11 (60325bea)");
 
 export { Button, Dialog, DialogResult, DrawPad, DrawPadEventType, DrawPadItemEventType, Grid, Instructions, VirtualKeyboard };
 //# sourceMappingURL=index.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m2c2kit/addons",
-  "version": "0.3.10",
+  "version": "0.3.11",
   "description": "Additions to m2c2kit core functionality, such as button, grid, and instructions",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -30,16 +30,16 @@
   },
   "homepage": "https://m2c2-project.github.io/m2c2kit",
   "dependencies": {
-    "@m2c2kit/core": "^0.3.6"
+    "@m2c2kit/core": "^0.3.14"
   },
   "devDependencies": {
-    "@rollup/plugin-replace": "5.0.2",
-    "rimraf": "5.0.1",
-    "rollup": "3.25.3",
-    "rollup-plugin-copy": "3.4.0",
-    "rollup-plugin-dts": "5.3.0",
-    "rollup-plugin-esbuild": "5.0.0",
-    "typescript": "5.1.6"
+    "@rollup/plugin-replace": "5.0.5",
+    "rimraf": "5.0.5",
+    "rollup": "4.6.1",
+    "rollup-plugin-copy": "3.5.0",
+    "rollup-plugin-dts": "6.1.0",
+    "rollup-plugin-esbuild": "6.1.0",
+    "typescript": "5.3.2"
   },
   "engines": {
     "node": ">=18"