cubing 0.28.0 → 0.28.4

package/dist/esm/twisty/index.js

@@ -1,28 +1,36 @@
 import {
+  CSSSource,
   DEGREES_PER_RADIAN,
   FreshListenerManager,
+  HTMLElementShim,
   HintFaceletProp,
+  ManagedCustomElement,
   NO_VALUE,
+  RenderScheduler,
   SimpleTwistyPropSource,
   StaleDropper,
   THREEJS,
+  Twisty3DVantage,
   TwistyPropDerived,
   TwistyPropSource,
-  proxy3D
-} from "../chunk-7BLWQDZX.js";
-import "../chunk-GVPTO3OF.js";
+  customElementsShim,
+  proxy3D,
+  setCameraFromOrbitCoordinates,
+  setTwistyDebug
+} from "../chunk-RQGVI4ZL.js";
+import "../chunk-OX6O2ZO5.js";
 import {
   countAnimatedLeaves,
   countMoves
-} from "../chunk-47SWOA3X.js";
+} from "../chunk-ZNAYJGVL.js";
 import {
   cube3x3x3,
   puzzles
-} from "../chunk-JAGHV77R.js";
+} from "../chunk-QDVCP6G7.js";
 import {
   customPGPuzzleLoader
-} from "../chunk-LTPPXK6F.js";
-import "../chunk-UP6RBLG2.js";
+} from "../chunk-PYWGREIP.js";
+import "../chunk-XU5ILFX5.js";
 import {
   Alg,
   AlgBuilder,
@@ -35,40 +43,8 @@ import {
   direct,
   directedGenerator,
   experimentalAppendMove
-} from "../chunk-GXZIBFSN.js";
-import {
-  __privateAdd,
-  __privateGet,
-  __privateMethod,
-  __privateSet
-} from "../chunk-MGJA5U5O.js";
-
-// src/cubing/twisty/controllers/RenderScheduler.ts
-var RenderScheduler = class {
-  constructor(callback) {
-    this.callback = callback;
-    this.animFrameID = null;
-    this.animFrame = this.animFrameWrapper.bind(this);
-  }
-  requestIsPending() {
-    return !!this.animFrameID;
-  }
-  requestAnimFrame() {
-    if (!this.animFrameID) {
-      this.animFrameID = requestAnimationFrame(this.animFrame);
-    }
-  }
-  cancelAnimFrame() {
-    if (this.animFrameID) {
-      cancelAnimationFrame(this.animFrameID);
-      this.animFrameID = 0;
-    }
-  }
-  animFrameWrapper(timestamp) {
-    this.animFrameID = 0;
-    this.callback(timestamp);
-  }
-};
+} from "../chunk-NI7U4XAZ.js";
+import "../chunk-SBZRVSPK.js";
 
 // src/cubing/twisty/controllers/AnimationTypes.ts
 function directionScalar(direction) {
@@ -117,7 +93,9 @@ var CatchUpHelper = class {
     this.model = model;
     this.catchingUp = false;
     this.pendingFrame = false;
-    this.scheduler = new RenderScheduler(this.animFrame.bind(this));
+    this.scheduler = new RenderScheduler(
+      this.animFrame.bind(this)
+    );
     this.catchUpMs = 500;
     this.lastTimestamp = 0;
   }
@@ -137,41 +115,43 @@ var CatchUpHelper = class {
     this.scheduler.requestAnimFrame();
     const delta = (timestamp - this.lastTimestamp) / this.catchUpMs;
     this.lastTimestamp = timestamp;
-    this.model.catchUpMove.set((async () => {
-      const previousCatchUpMove = await this.model.catchUpMove.get();
-      if (previousCatchUpMove.move === null) {
-        return previousCatchUpMove;
-      }
-      const amount = previousCatchUpMove.amount + delta;
-      if (amount >= 1) {
-        this.pendingFrame = true;
-        this.stop();
-        this.model.timestampRequest.set("end");
+    this.model.catchUpMove.set(
+      (async () => {
+        const previousCatchUpMove = await this.model.catchUpMove.get();
+        if (previousCatchUpMove.move === null) {
+          return previousCatchUpMove;
+        }
+        const amount = previousCatchUpMove.amount + delta;
+        if (amount >= 1) {
+          this.pendingFrame = true;
+          this.stop();
+          this.model.timestampRequest.set("end");
+          return {
+            move: null,
+            amount: 0
+          };
+        }
+        this.pendingFrame = false;
         return {
-          move: null,
-          amount: 0
+          move: previousCatchUpMove.move,
+          amount
         };
-      }
-      this.pendingFrame = false;
-      return {
-        move: previousCatchUpMove.move,
-        amount
-      };
-    })());
+      })()
+    );
   }
 };
-var _effectiveTimestampMilliseconds, effectiveTimestampMilliseconds_fn, _animFrameEffectiveTimestampStaleDropper;
 var TwistyAnimationController = class {
   constructor(model, delegate) {
     this.delegate = delegate;
-    __privateAdd(this, _effectiveTimestampMilliseconds);
     this.playing = false;
     this.direction = 1 /* Forwards */;
     this.lastDatestamp = 0;
-    this.scheduler = new RenderScheduler(this.animFrame.bind(this));
-    __privateAdd(this, _animFrameEffectiveTimestampStaleDropper, new StaleDropper());
+    this.scheduler = new RenderScheduler(
+      this.animFrame.bind(this)
+    );
+    this.#animFrameEffectiveTimestampStaleDropper = new StaleDropper();
     this.model = model;
-    this.lastTimestampPromise = __privateMethod(this, _effectiveTimestampMilliseconds, effectiveTimestampMilliseconds_fn).call(this);
+    this.lastTimestampPromise = this.#effectiveTimestampMilliseconds();
     this.model.playingInfo.addFreshListener(this.onPlayingProp.bind(this));
     this.catchUpHelper = new CatchUpHelper(this.model);
     this.model.catchUpMove.addFreshListener(this.onCatchUpMoveProp.bind(this));
@@ -188,6 +168,9 @@ var TwistyAnimationController = class {
     }
     this.scheduler.requestAnimFrame();
   }
+  async #effectiveTimestampMilliseconds() {
+    return (await this.model.detailedTimelineInfo.get()).timestamp;
+  }
   jumpToStart(options) {
     this.model.timestampRequest.set("start");
     this.pause();
@@ -230,7 +213,7 @@ var TwistyAnimationController = class {
     });
     this.playing = true;
     this.lastDatestamp = performance.now();
-    this.lastTimestampPromise = __privateMethod(this, _effectiveTimestampMilliseconds, effectiveTimestampMilliseconds_fn).call(this);
+    this.lastTimestampPromise = this.#effectiveTimestampMilliseconds();
     this.scheduler.requestAnimFrame();
   }
   pause() {
@@ -241,18 +224,21 @@ var TwistyAnimationController = class {
       untilBoundary: "entire-timeline" /* EntireTimeline */
     });
   }
+  #animFrameEffectiveTimestampStaleDropper;
   async animFrame(frameDatestamp) {
     if (this.playing) {
       this.scheduler.requestAnimFrame();
     }
     const lastDatestamp = this.lastDatestamp;
-    const freshenerResult = await __privateGet(this, _animFrameEffectiveTimestampStaleDropper).queue(Promise.all([
-      this.model.playingInfo.get(),
-      this.lastTimestampPromise,
-      this.model.timeRange.get(),
-      this.model.tempoScale.get(),
-      this.model.currentMoveInfo.get()
-    ]));
+    const freshenerResult = await this.#animFrameEffectiveTimestampStaleDropper.queue(
+      Promise.all([
+        this.model.playingInfo.get(),
+        this.lastTimestampPromise,
+        this.model.timeRange.get(),
+        this.model.tempoScale.get(),
+        this.model.currentMoveInfo.get()
+      ])
+    );
     const [playingInfo, lastTimestamp, timeRange, tempoScale, currentMoveInfo] = freshenerResult;
     if (!playingInfo.playing) {
       this.playing = false;
@@ -273,7 +259,11 @@ var TwistyAnimationController = class {
     let newSmartTimestampRequest = null;
     if (newTimestamp >= end) {
       if (playingInfo.loop) {
-        newTimestamp = modIntoRange(newTimestamp, timeRange.start, timeRange.end);
+        newTimestamp = modIntoRange(
+          newTimestamp,
+          timeRange.start,
+          timeRange.end
+        );
       } else {
         if (newTimestamp === timeRange.end) {
           newSmartTimestampRequest = "end";
@@ -287,7 +277,11 @@ var TwistyAnimationController = class {
       }
     } else if (newTimestamp <= start) {
       if (playingInfo.loop) {
-        newTimestamp = modIntoRange(newTimestamp, timeRange.start, timeRange.end);
+        newTimestamp = modIntoRange(
+          newTimestamp,
+          timeRange.start,
+          timeRange.end
+        );
       } else {
         if (newTimestamp === timeRange.start) {
           newSmartTimestampRequest = "start";
@@ -305,11 +299,6 @@ var TwistyAnimationController = class {
     this.model.timestampRequest.set(newSmartTimestampRequest ?? newTimestamp);
   }
 };
-_effectiveTimestampMilliseconds = new WeakSet();
-effectiveTimestampMilliseconds_fn = async function() {
-  return (await this.model.detailedTimelineInfo.get()).timestamp;
-};
-_animFrameEffectiveTimestampStaleDropper = new WeakMap();
 
 // src/cubing/twisty/controllers/TwistyPlayerController.ts
 var TwistyPlayerController = class {
@@ -348,77 +337,6 @@ var ControlPanelProp = class extends SimpleTwistyPropSource {
   }
 };
 
-// src/cubing/twisty/views/node-custom-element-shims.ts
-var HTMLElementStub = class {
-};
-var HTMLElementShim;
-if (globalThis.HTMLElement) {
-  HTMLElementShim = HTMLElement;
-} else {
-  HTMLElementShim = HTMLElementStub;
-}
-var CustomElementsStub = class {
-  define() {
-  }
-};
-var customElementsShim;
-if (globalThis.customElements) {
-  customElementsShim = customElements;
-} else {
-  customElementsShim = new CustomElementsStub();
-}
-
-// src/cubing/twisty/views/ManagedCustomElement.ts
-var CSSSource = class {
-  constructor(sourceText) {
-    this.sourceText = sourceText;
-  }
-  getAsString() {
-    return this.sourceText;
-  }
-};
-var _cssSourceMap;
-var ManagedCustomElement = class extends HTMLElementShim {
-  constructor(options) {
-    super();
-    __privateAdd(this, _cssSourceMap, /* @__PURE__ */ new Map());
-    this.shadow = this.attachShadow({ mode: options?.mode ?? "closed" });
-    this.contentWrapper = document.createElement("div");
-    this.contentWrapper.classList.add("wrapper");
-    this.shadow.appendChild(this.contentWrapper);
-  }
-  addCSS(cssSource) {
-    const existing = __privateGet(this, _cssSourceMap).get(cssSource);
-    if (existing) {
-      return existing;
-    }
-    const cssElem = document.createElement("style");
-    cssElem.textContent = cssSource.getAsString();
-    __privateGet(this, _cssSourceMap).set(cssSource, cssElem);
-    this.shadow.appendChild(cssElem);
-    return cssElem;
-  }
-  removeCSS(cssSource) {
-    const cssElem = __privateGet(this, _cssSourceMap).get(cssSource);
-    if (!cssElem) {
-      return;
-    }
-    this.shadow.removeChild(cssElem);
-    __privateGet(this, _cssSourceMap).delete(cssSource);
-  }
-  addElement(element) {
-    return this.contentWrapper.appendChild(element);
-  }
-  prependElement(element) {
-    this.contentWrapper.prepend(element);
-  }
-  removeElement(element) {
-    return this.contentWrapper.removeChild(element);
-  }
-};
-_cssSourceMap = new WeakMap();
-customElementsShim.define("twisty-managed-custom-element", ManagedCustomElement);
-
 // src/cubing/twisty/views/TwistyViewerWrapper.css.ts
 var twistyViewerWrapperCSS = new CSSSource(`
 :host {
@@ -617,29 +535,67 @@ var KPuzzleSVGWrapper = class {
       for (let idx = 0; idx < orbitDefinition.numPieces; idx++) {
         for (let orientation = 0; orientation < orbitDefinition.numOrientations; orientation++) {
           const id = this.elementID(orbitName, idx, orientation);
-          const fromCur = this.elementID(orbitName, curTransformationOrbit.permutation[idx], (orbitDefinition.numOrientations - curTransformationOrbit.orientation[idx] + orientation) % orbitDefinition.numOrientations);
+          const fromCur = this.elementID(
+            orbitName,
+            curTransformationOrbit.permutation[idx],
+            (orbitDefinition.numOrientations - curTransformationOrbit.orientation[idx] + orientation) % orbitDefinition.numOrientations
+          );
           let singleColor = false;
           if (nextTransformationOrbit) {
-            const fromNext = this.elementID(orbitName, nextTransformationOrbit.permutation[idx], (orbitDefinition.numOrientations - nextTransformationOrbit.orientation[idx] + orientation) % orbitDefinition.numOrientations);
+            const fromNext = this.elementID(
+              orbitName,
+              nextTransformationOrbit.permutation[idx],
+              (orbitDefinition.numOrientations - nextTransformationOrbit.orientation[idx] + orientation) % orbitDefinition.numOrientations
+            );
             if (fromCur === fromNext) {
               singleColor = true;
             }
             fraction = fraction || 0;
             const easedBackwardsPercent = 100 * (1 - fraction * fraction * (2 - fraction * fraction));
-            this.gradients[id].children[0].setAttribute("stop-color", this.originalColors[fromCur]);
-            this.gradients[id].children[1].setAttribute("stop-color", this.originalColors[fromCur]);
-            this.gradients[id].children[1].setAttribute("offset", `${Math.max(easedBackwardsPercent - 5, 0)}%`);
-            this.gradients[id].children[2].setAttribute("offset", `${Math.max(easedBackwardsPercent - 5, 0)}%`);
-            this.gradients[id].children[3].setAttribute("offset", `${easedBackwardsPercent}%`);
-            this.gradients[id].children[4].setAttribute("offset", `${easedBackwardsPercent}%`);
-            this.gradients[id].children[4].setAttribute("stop-color", this.originalColors[fromNext]);
-            this.gradients[id].children[5].setAttribute("stop-color", this.originalColors[fromNext]);
+            this.gradients[id].children[0].setAttribute(
+              "stop-color",
+              this.originalColors[fromCur]
+            );
+            this.gradients[id].children[1].setAttribute(
+              "stop-color",
+              this.originalColors[fromCur]
+            );
+            this.gradients[id].children[1].setAttribute(
+              "offset",
+              `${Math.max(easedBackwardsPercent - 5, 0)}%`
+            );
+            this.gradients[id].children[2].setAttribute(
+              "offset",
+              `${Math.max(easedBackwardsPercent - 5, 0)}%`
+            );
+            this.gradients[id].children[3].setAttribute(
+              "offset",
+              `${easedBackwardsPercent}%`
+            );
+            this.gradients[id].children[4].setAttribute(
+              "offset",
+              `${easedBackwardsPercent}%`
+            );
+            this.gradients[id].children[4].setAttribute(
+              "stop-color",
+              this.originalColors[fromNext]
+            );
+            this.gradients[id].children[5].setAttribute(
+              "stop-color",
+              this.originalColors[fromNext]
+            );
           } else {
             singleColor = true;
           }
           if (singleColor) {
-            this.gradients[id].children[0].setAttribute("stop-color", this.originalColors[fromCur]);
-            this.gradients[id].children[1].setAttribute("stop-color", this.originalColors[fromCur]);
+            this.gradients[id].children[0].setAttribute(
+              "stop-color",
+              this.originalColors[fromCur]
+            );
+            this.gradients[id].children[1].setAttribute(
+              "stop-color",
+              this.originalColors[fromCur]
+            );
             this.gradients[id].children[1].setAttribute("offset", `100%`);
             this.gradients[id].children[2].setAttribute("offset", `100%`);
             this.gradients[id].children[3].setAttribute("offset", `100%`);
@@ -650,7 +606,10 @@ var KPuzzleSVGWrapper = class {
     }
   }
   newGradient(id, originalColor) {
-    const grad = document.createElementNS(xmlns, "radialGradient");
+    const grad = document.createElementNS(
+      xmlns,
+      "radialGradient"
+    );
     grad.setAttribute("id", `grad-${this.svgID}-${id}`);
     grad.setAttribute("r", `70.7107%`);
     const stopDefs = [
@@ -679,7 +638,6 @@ var KPuzzleSVGWrapper = class {
 };
 
 // src/cubing/twisty/views/2D/Twisty2DPuzzle.ts
-var _cachedPosition, _freshListenerManager;
 var Twisty2DPuzzle = class extends ManagedCustomElement {
   constructor(model, kpuzzle, svgSource, options, puzzleLoader) {
     super();
@@ -689,22 +647,30 @@ var Twisty2DPuzzle = class extends ManagedCustomElement {
     this.options = options;
     this.puzzleLoader = puzzleLoader;
     this.scheduler = new RenderScheduler(this.render.bind(this));
-    __privateAdd(this, _cachedPosition, null);
-    __privateAdd(this, _freshListenerManager, new FreshListenerManager());
+    this.#cachedPosition = null;
+    this.#freshListenerManager = new FreshListenerManager();
     this.addCSS(twisty2DSVGCSS);
     this.resetSVG();
-    __privateGet(this, _freshListenerManager).addListener(this.model.puzzleID, (puzzleID) => {
-      if (puzzleLoader?.id !== puzzleID) {
-        this.disconnect();
+    this.#freshListenerManager.addListener(
+      this.model.puzzleID,
+      (puzzleID) => {
+        if (puzzleLoader?.id !== puzzleID) {
+          this.disconnect();
+        }
       }
-    });
-    __privateGet(this, _freshListenerManager).addListener(this.model.legacyPosition, this.onPositionChange.bind(this));
+    );
+    this.#freshListenerManager.addListener(
+      this.model.legacyPosition,
+      this.onPositionChange.bind(this)
+    );
     if (this.options?.experimentalStickering) {
       this.experimentalSetStickering(this.options.experimentalStickering);
     }
   }
+  #cachedPosition;
+  #freshListenerManager;
   disconnect() {
-    __privateGet(this, _freshListenerManager).disconnect();
+    this.#freshListenerManager.disconnect();
   }
   onPositionChange(position) {
     try {
@@ -715,13 +681,21 @@ var Twisty2DPuzzle = class extends ManagedCustomElement {
           partialMove = move.invert();
         }
         const newState = position.state.applyMove(partialMove);
-        this.svgWrapper.draw(position.state, newState, position.movesInProgress[0].fraction);
+        this.svgWrapper.draw(
+          position.state,
+          newState,
+          position.movesInProgress[0].fraction
+        );
       } else {
         this.svgWrapper.draw(position.state);
-        __privateSet(this, _cachedPosition, position);
+        this.#cachedPosition = position;
       }
     } catch (e) {
-      console.warn("Bad position (this doesn't necessarily mean something is wrong). Pre-emptively disconnecting:", this.puzzleLoader?.id, e);
+      console.warn(
+        "Bad position (this doesn't necessarily mean something is wrong). Pre-emptively disconnecting:",
+        this.puzzleLoader?.id,
+        e
+      );
       this.disconnect();
     }
   }
@@ -744,146 +718,153 @@ var Twisty2DPuzzle = class extends ManagedCustomElement {
     if (!this.kpuzzle) {
       return;
     }
-    this.svgWrapper = new KPuzzleSVGWrapper(this.kpuzzle, this.svgSource, appearance);
+    this.svgWrapper = new KPuzzleSVGWrapper(
+      this.kpuzzle,
+      this.svgSource,
+      appearance
+    );
     this.addElement(this.svgWrapper.wrapperElement);
-    if (__privateGet(this, _cachedPosition)) {
-      this.onPositionChange(__privateGet(this, _cachedPosition));
+    if (this.#cachedPosition) {
+      this.onPositionChange(this.#cachedPosition);
     }
   }
   render() {
   }
 };
-_cachedPosition = new WeakMap();
-_freshListenerManager = new WeakMap();
 customElementsShim.define("twisty-2d-puzzle", Twisty2DPuzzle);
 
 // src/cubing/twisty/views/2D/Twisty2DPuzzleWrapper.ts
-var _freshListenerManager2, _cachedTwisty2DPuzzle;
 var Twisty2DPuzzleWrapper = class {
   constructor(model, schedulable, puzzleLoader, effectiveVisualization) {
     this.model = model;
     this.schedulable = schedulable;
     this.puzzleLoader = puzzleLoader;
     this.effectiveVisualization = effectiveVisualization;
-    __privateAdd(this, _freshListenerManager2, new FreshListenerManager());
-    __privateAdd(this, _cachedTwisty2DPuzzle, null);
     this.twisty2DPuzzle();
-    __privateGet(this, _freshListenerManager2).addListener(this.model.twistySceneModel.stickering, async (stickering) => {
-      (await this.twisty2DPuzzle()).experimentalSetStickering(stickering);
-    });
+    this.#freshListenerManager.addListener(
+      this.model.twistySceneModel.stickering,
+      async (stickering) => {
+        (await this.twisty2DPuzzle()).experimentalSetStickering(stickering);
+      }
+    );
   }
+  #freshListenerManager = new FreshListenerManager();
   disconnect() {
-    __privateGet(this, _freshListenerManager2).disconnect();
+    this.#freshListenerManager.disconnect();
   }
   scheduleRender() {
   }
+  #cachedTwisty2DPuzzle = null;
   async twisty2DPuzzle() {
-    return __privateGet(this, _cachedTwisty2DPuzzle) ?? __privateSet(this, _cachedTwisty2DPuzzle, (async () => {
+    return this.#cachedTwisty2DPuzzle ?? (this.#cachedTwisty2DPuzzle = (async () => {
       const svgPromise = this.effectiveVisualization === "experimental-2D-LL" ? this.puzzleLoader.llSVG() : this.puzzleLoader.svg();
-      return new Twisty2DPuzzle(this.model, await this.puzzleLoader.kpuzzle(), await svgPromise, {}, this.puzzleLoader);
+      return new Twisty2DPuzzle(
+        this.model,
+        await this.puzzleLoader.kpuzzle(),
+        await svgPromise,
+        {},
+        this.puzzleLoader
+      );
     })());
   }
 };
-_freshListenerManager2 = new WeakMap();
-_cachedTwisty2DPuzzle = new WeakMap();
 
 // src/cubing/twisty/views/2D/Twisty2DSceneWrapper.ts
-var _freshListenerManager3, _cachedScene, _currentTwisty2DPuzzleWrapper;
 var Twisty2DSceneWrapper = class extends ManagedCustomElement {
   constructor(model, effectiveVisualization) {
     super();
     this.model = model;
     this.effectiveVisualization = effectiveVisualization;
-    __privateAdd(this, _freshListenerManager3, new FreshListenerManager());
-    __privateAdd(this, _cachedScene, void 0);
-    __privateAdd(this, _currentTwisty2DPuzzleWrapper, null);
   }
+  #freshListenerManager = new FreshListenerManager();
   disconnect() {
-    __privateGet(this, _freshListenerManager3).disconnect();
+    this.#freshListenerManager.disconnect();
   }
   async connectedCallback() {
     this.addCSS(twistyViewerWrapperCSS);
     if (this.model) {
-      __privateGet(this, _freshListenerManager3).addListener(this.model.twistyPlayerModel.puzzleLoader, this.onPuzzleLoader.bind(this));
+      this.#freshListenerManager.addListener(
+        this.model.twistyPlayerModel.puzzleLoader,
+        this.onPuzzleLoader.bind(this)
+      );
     }
   }
+  #cachedScene;
   async scene() {
-    return __privateGet(this, _cachedScene) ?? __privateSet(this, _cachedScene, (async () => new (await THREEJS).Scene())());
+    return this.#cachedScene ?? (this.#cachedScene = (async () => new (await THREEJS).Scene())());
   }
   scheduleRender() {
-    __privateGet(this, _currentTwisty2DPuzzleWrapper)?.scheduleRender();
+    this.#currentTwisty2DPuzzleWrapper?.scheduleRender();
   }
+  #currentTwisty2DPuzzleWrapper = null;
   currentTwisty2DPuzzleWrapper() {
-    return __privateGet(this, _currentTwisty2DPuzzleWrapper);
+    return this.#currentTwisty2DPuzzleWrapper;
   }
   async setCurrentTwisty2DPuzzleWrapper(twisty2DPuzzleWrapper) {
-    const old = __privateGet(this, _currentTwisty2DPuzzleWrapper);
-    __privateSet(this, _currentTwisty2DPuzzleWrapper, twisty2DPuzzleWrapper);
+    const old = this.#currentTwisty2DPuzzleWrapper;
+    this.#currentTwisty2DPuzzleWrapper = twisty2DPuzzleWrapper;
     old?.disconnect();
     const twisty2DPuzzlePromise = twisty2DPuzzleWrapper.twisty2DPuzzle();
     this.contentWrapper.textContent = "";
     this.addElement(await twisty2DPuzzlePromise);
   }
   async onPuzzleLoader(puzzleLoader) {
-    __privateGet(this, _currentTwisty2DPuzzleWrapper)?.disconnect();
-    const twisty2DPuzzleWrapper = new Twisty2DPuzzleWrapper(this.model.twistyPlayerModel, this, puzzleLoader, this.effectiveVisualization);
+    this.#currentTwisty2DPuzzleWrapper?.disconnect();
+    const twisty2DPuzzleWrapper = new Twisty2DPuzzleWrapper(
+      this.model.twistyPlayerModel,
+      this,
+      puzzleLoader,
+      this.effectiveVisualization
+    );
     this.setCurrentTwisty2DPuzzleWrapper(twisty2DPuzzleWrapper);
   }
 };
-_freshListenerManager3 = new WeakMap();
-_cachedScene = new WeakMap();
-_currentTwisty2DPuzzleWrapper = new WeakMap();
 customElementsShim.define("twisty-2d-scene-wrapper", Twisty2DSceneWrapper);
 
 // src/cubing/twisty/views/ClassListManager.ts
-var _currentClassName;
 var ClassListManager = class {
   constructor(elem, prefix, validSuffixes) {
     this.elem = elem;
     this.prefix = prefix;
     this.validSuffixes = validSuffixes;
-    __privateAdd(this, _currentClassName, null);
   }
+  #currentClassName = null;
   clearValue() {
-    if (__privateGet(this, _currentClassName)) {
-      this.elem.contentWrapper.classList.remove(__privateGet(this, _currentClassName));
+    if (this.#currentClassName) {
+      this.elem.contentWrapper.classList.remove(this.#currentClassName);
     }
-    __privateSet(this, _currentClassName, null);
+    this.#currentClassName = null;
   }
   setValue(suffix) {
     if (!this.validSuffixes.includes(suffix)) {
       throw new Error(`Invalid suffix: ${suffix}`);
     }
     const newClassName = `${this.prefix}${suffix}`;
-    const changed = __privateGet(this, _currentClassName) !== newClassName;
+    const changed = this.#currentClassName !== newClassName;
     if (changed) {
       this.clearValue();
       this.elem.contentWrapper.classList.add(newClassName);
-      __privateSet(this, _currentClassName, newClassName);
+      this.#currentClassName = newClassName;
     }
     return changed;
   }
 };
-_currentClassName = new WeakMap();
 
 // src/cubing/twisty/views/InitialValueTracker.ts
-var _resolve;
 var InitialValueTracker = class {
   constructor() {
-    __privateAdd(this, _resolve, void 0);
     this.promise = new Promise((resolve, reject) => {
-      __privateSet(this, _resolve, resolve);
+      this.#resolve = resolve;
       this.reject = reject;
     });
   }
+  #resolve;
   handleNewValue(t) {
-    __privateGet(this, _resolve).call(this, t);
+    this.#resolve(t);
   }
 };
-_resolve = new WeakMap();
 
 // src/cubing/twisty/views/3D/Twisty3DPuzzleWrapper.ts
-var _freshListenerManager4, _cachedTwisty3DPuzzle;
 var Twisty3DPuzzleWrapper = class extends EventTarget {
   constructor(model, schedulable, puzzleLoader, visualizationStrategy) {
     super();
@@ -891,69 +872,91 @@ var Twisty3DPuzzleWrapper = class extends EventTarget {
     this.schedulable = schedulable;
     this.puzzleLoader = puzzleLoader;
     this.visualizationStrategy = visualizationStrategy;
-    __privateAdd(this, _freshListenerManager4, new FreshListenerManager());
-    __privateAdd(this, _cachedTwisty3DPuzzle, null);
     this.twisty3DPuzzle();
-    __privateGet(this, _freshListenerManager4).addListener(this.model.puzzleLoader, (puzzleLoader2) => {
-      if (this.puzzleLoader.id !== puzzleLoader2.id) {
-        this.disconnect();
+    this.#freshListenerManager.addListener(
+      this.model.puzzleLoader,
+      (puzzleLoader2) => {
+        if (this.puzzleLoader.id !== puzzleLoader2.id) {
+          this.disconnect();
+        }
       }
-    });
-    __privateGet(this, _freshListenerManager4).addListener(this.model.legacyPosition, async (position) => {
-      try {
-        (await this.twisty3DPuzzle()).onPositionChange(position);
+    );
+    this.#freshListenerManager.addListener(
+      this.model.legacyPosition,
+      async (position) => {
+        try {
+          (await this.twisty3DPuzzle()).onPositionChange(position);
+          this.scheduleRender();
+        } catch (e) {
+          this.disconnect();
+        }
+      }
+    );
+    this.#freshListenerManager.addListener(
+      this.model.twistySceneModel.hintFacelet,
+      async (hintFaceletStyle) => {
+        (await this.twisty3DPuzzle()).experimentalUpdateOptions({
+          hintFacelets: hintFaceletStyle === "auto" ? "floating" : hintFaceletStyle
+        });
         this.scheduleRender();
-      } catch (e) {
-        this.disconnect();
       }
-    });
-    __privateGet(this, _freshListenerManager4).addListener(this.model.twistySceneModel.hintFacelet, async (hintFaceletStyle) => {
-      (await this.twisty3DPuzzle()).experimentalUpdateOptions({
-        hintFacelets: hintFaceletStyle === "auto" ? "floating" : hintFaceletStyle
-      });
-      this.scheduleRender();
-    });
-    __privateGet(this, _freshListenerManager4).addListener(this.model.twistySceneModel.foundationDisplay, async (foundationDisplay) => {
-      (await this.twisty3DPuzzle()).experimentalUpdateOptions({
-        showFoundation: foundationDisplay !== "none"
-      });
-      this.scheduleRender();
-    });
-    __privateGet(this, _freshListenerManager4).addListener(this.model.twistySceneModel.stickering, async (stickering) => {
-      if ("setStickering" in await this.twisty3DPuzzle()) {
-        (await this.twisty3DPuzzle()).setStickering(stickering);
+    );
+    this.#freshListenerManager.addListener(
+      this.model.twistySceneModel.foundationDisplay,
+      async (foundationDisplay) => {
+        (await this.twisty3DPuzzle()).experimentalUpdateOptions({
+          showFoundation: foundationDisplay !== "none"
+        });
         this.scheduleRender();
-      } else {
-        if ("appearance" in this.puzzleLoader) {
-          const [twisty3D, appearancePromise] = await Promise.all([
-            this.twisty3DPuzzle(),
-            this.puzzleLoader.appearance(stickering ?? "full")
-          ]);
-          twisty3D.experimentalSetAppearance(appearancePromise);
+      }
+    );
+    this.#freshListenerManager.addListener(
+      this.model.twistySceneModel.stickering,
+      async (stickering) => {
+        if ("setStickering" in await this.twisty3DPuzzle()) {
+          (await this.twisty3DPuzzle()).setStickering(stickering);
           this.scheduleRender();
+        } else {
+          if ("appearance" in this.puzzleLoader) {
+            const [twisty3D, appearancePromise] = await Promise.all([
+              this.twisty3DPuzzle(),
+              this.puzzleLoader.appearance(stickering ?? "full")
+            ]);
+            twisty3D.experimentalSetAppearance(appearancePromise);
+            this.scheduleRender();
+          }
         }
       }
-    });
-    __privateGet(this, _freshListenerManager4).addMultiListener3([
-      this.model.twistySceneModel.stickering,
-      this.model.twistySceneModel.foundationStickerSprite,
-      this.model.twistySceneModel.hintStickerSprite
-    ], async (inputs) => {
-      if ("experimentalUpdateTexture" in await this.twisty3DPuzzle()) {
-        (await this.twisty3DPuzzle()).experimentalUpdateTexture(inputs[0] === "picture", inputs[1], inputs[2]);
-        this.scheduleRender();
+    );
+    this.#freshListenerManager.addMultiListener3(
+      [
+        this.model.twistySceneModel.stickering,
+        this.model.twistySceneModel.foundationStickerSprite,
+        this.model.twistySceneModel.hintStickerSprite
+      ],
+      async (inputs) => {
+        if ("experimentalUpdateTexture" in await this.twisty3DPuzzle()) {
+          (await this.twisty3DPuzzle()).experimentalUpdateTexture(
+            inputs[0] === "picture",
+            inputs[1],
+            inputs[2]
+          );
+          this.scheduleRender();
+        }
       }
-    });
+    );
   }
+  #freshListenerManager = new FreshListenerManager();
   disconnect() {
-    __privateGet(this, _freshListenerManager4).disconnect();
+    this.#freshListenerManager.disconnect();
   }
   scheduleRender() {
     this.schedulable.scheduleRender();
     this.dispatchEvent(new CustomEvent("render-scheduled"));
   }
+  #cachedTwisty3DPuzzle = null;
   async twisty3DPuzzle() {
-    return __privateGet(this, _cachedTwisty3DPuzzle) ?? __privateSet(this, _cachedTwisty3DPuzzle, (async () => {
+    return this.#cachedTwisty3DPuzzle ?? (this.#cachedTwisty3DPuzzle = (async () => {
       const proxyPromise = proxy3D();
       if (this.puzzleLoader.id === "3x3x3" && this.visualizationStrategy === "Cube3D") {
         const [foundationSprite, hintSprite, experimentalStickering] = await Promise.all([
@@ -961,19 +964,32 @@ var Twisty3DPuzzleWrapper = class extends EventTarget {
           this.model.twistySceneModel.hintStickerSprite.get(),
           this.model.twistySceneModel.stickering.get()
         ]);
-        return (await proxyPromise).cube3DShim({
-          foundationSprite,
-          hintSprite,
-          experimentalStickering
-        });
+        return (await proxyPromise).cube3DShim(
+          () => this.schedulable.scheduleRender(),
+          {
+            foundationSprite,
+            hintSprite,
+            experimentalStickering
+          }
+        );
       } else {
         const [hintFacelets, foundationSprite, hintSprite] = await Promise.all([
           this.model.twistySceneModel.hintFacelet.get(),
           this.model.twistySceneModel.foundationStickerSprite.get(),
           this.model.twistySceneModel.hintStickerSprite.get()
         ]);
-        const pg3d = (await proxyPromise).pg3dShim(this.puzzleLoader, hintFacelets === "auto" ? "floating" : hintFacelets);
-        pg3d.then((p) => p.experimentalUpdateTexture(true, foundationSprite ?? void 0, hintSprite ?? void 0));
+        const pg3d = (await proxyPromise).pg3dShim(
+          () => this.schedulable.scheduleRender(),
+          this.puzzleLoader,
+          hintFacelets === "auto" ? "floating" : hintFacelets
+        );
+        pg3d.then(
+          (p) => p.experimentalUpdateTexture(
+            true,
+            foundationSprite ?? void 0,
+            hintSprite ?? void 0
+          )
+        );
         return pg3d;
       }
     })());
@@ -988,7 +1004,10 @@ var Twisty3DPuzzleWrapper = class extends EventTarget {
     const [raycaster] = await Promise.all([raycasterPromise]);
     const intersects = raycaster.intersectObjects(targets);
     if (intersects.length > 0) {
-      const closestMove = puzzle.getClosestMoveToAxis(intersects[0].point, transformations);
+      const closestMove = puzzle.getClosestMoveToAxis(
+        intersects[0].point,
+        transformations
+      );
       if (closestMove) {
         this.model.experimentalAddMove(closestMove.move, {
           coalesce: true,
@@ -1000,708 +1019,56 @@ var Twisty3DPuzzleWrapper = class extends EventTarget {
     }
   }
 };
-_freshListenerManager4 = new WeakMap();
-_cachedTwisty3DPuzzle = new WeakMap();
-
-// src/cubing/vendor/three/examples/jsm/libs/stats.modified.module.ts
-var performance2 = globalThis.performance;
-var Stats = class {
-  constructor() {
-    this.mode = 0;
-    this.dom = document.createElement("div");
-    this.beginTime = (performance2 || Date).now();
-    this.prevTime = this.beginTime;
-    this.frames = 0;
-    this.fpsPanel = this.addPanel(new StatsPanel("FPS", "#0ff", "#002"));
-    this.msPanel = this.addPanel(new StatsPanel("MS", "#0f0", "#020"));
-    this.memPanel = performance2?.memory ? this.addPanel(new StatsPanel("MB", "#f08", "#201")) : null;
-    this.REVISION = 16;
-    this.dom.style.cssText = "position:fixed;top:0;left:0;cursor:pointer;opacity:0.9;z-index:10000";
-    this.dom.addEventListener("click", (event) => {
-      event.preventDefault();
-      this.showPanel(++this.mode % this.dom.children.length);
-    }, false);
-    this.showPanel(0);
-  }
-  addPanel(panel) {
-    this.dom.appendChild(panel.dom);
-    return panel;
-  }
-  showPanel(id) {
-    for (let i = 0; i < this.dom.children.length; i++) {
-      this.dom.children[i].style.display = i === id ? "block" : "none";
-    }
-    this.mode = id;
-  }
-  begin() {
-    this.beginTime = (performance2 || Date).now();
-  }
-  end() {
-    this.frames++;
-    const time = (performance2 || Date).now();
-    this.msPanel.update(time - this.beginTime, 200);
-    if (time >= this.prevTime + 1e3) {
-      this.fpsPanel.update(this.frames * 1e3 / (time - this.prevTime), 100);
-      this.prevTime = time;
-      this.frames = 0;
-      if (this.memPanel) {
-        const memory = performance2.memory;
-        this.memPanel.update(memory.usedJSHeapSize / 1048576, memory.jsHeapSizeLimit / 1048576);
-      }
-    }
-    return time;
-  }
-  update() {
-    this.beginTime = this.end();
-  }
-};
-var PR = Math.round(globalThis?.window?.devicePixelRatio ?? 1);
-var WIDTH = 80 * PR;
-var HEIGHT = 48 * PR;
-var TEXT_X = 3 * PR;
-var TEXT_Y = 2 * PR;
-var GRAPH_X = 3 * PR;
-var GRAPH_Y = 15 * PR;
-var GRAPH_WIDTH = 74 * PR;
-var GRAPH_HEIGHT = 30 * PR;
-var StatsPanel = class {
-  constructor(name, fg, bg) {
-    this.name = name;
-    this.fg = fg;
-    this.bg = bg;
-    this.min = Infinity;
-    this.max = 0;
-    this.dom = document.createElement("canvas");
-    this.context = this.dom.getContext("2d");
-    this.dom.width = WIDTH;
-    this.dom.height = HEIGHT;
-    this.dom.style.cssText = "width:80px;height:48px";
-    this.context.font = `bold ${9 * PR}px Helvetica,Arial,sans-serif`;
-    this.context.textBaseline = "top";
-    this.context.fillStyle = bg;
-    this.context.fillRect(0, 0, WIDTH, HEIGHT);
-    this.context.fillStyle = fg;
-    this.context.fillText(name, TEXT_X, TEXT_Y);
-    this.context.fillRect(GRAPH_X, GRAPH_Y, GRAPH_WIDTH, GRAPH_HEIGHT);
-    this.context.fillStyle = bg;
-    this.context.globalAlpha = 0.9;
-    this.context.fillRect(GRAPH_X, GRAPH_Y, GRAPH_WIDTH, GRAPH_HEIGHT);
-  }
-  update(value, maxValue) {
-    this.min = Math.min(this.min, value);
-    this.max = Math.max(this.max, value);
-    this.context.fillStyle = this.bg;
-    this.context.globalAlpha = 1;
-    this.context.fillRect(0, 0, WIDTH, GRAPH_Y);
-    this.context.fillStyle = this.fg;
-    this.context.fillText(Math.round(value) + " " + this.name + " (" + Math.round(this.min) + "-" + Math.round(this.max) + ")", TEXT_X, TEXT_Y);
-    this.context.drawImage(this.dom, GRAPH_X + PR, GRAPH_Y, GRAPH_WIDTH - PR, GRAPH_HEIGHT, GRAPH_X, GRAPH_Y, GRAPH_WIDTH - PR, GRAPH_HEIGHT);
-    this.context.fillRect(GRAPH_X + GRAPH_WIDTH - PR, GRAPH_Y, PR, GRAPH_HEIGHT);
-    this.context.fillStyle = this.bg;
-    this.context.globalAlpha = 0.9;
-    this.context.fillRect(GRAPH_X + GRAPH_WIDTH - PR, GRAPH_Y, PR, Math.round((1 - value / maxValue) * GRAPH_HEIGHT));
-  }
-};
-
-// src/cubing/twisty/views/canvas.ts
-var globalPixelRatioOverride = null;
-function pixelRatio() {
-  return globalPixelRatioOverride ?? (devicePixelRatio || 1);
-}
-
-// src/cubing/twisty/views/3D/Twisty3DVantage.css.ts
-var twisty3DVantageCSS = new CSSSource(`
-:host {
-  width: 384px;
-  height: 256px;
-  display: grid;
-}
-
-.wrapper {
-  width: 100%;
-  height: 100%;
-  display: grid;
-  overflow: hidden;
-  place-content: center;
-  contain: strict;
-}
-
-.loading {
-  width: 4em;
-  height: 4em;
-  border-radius: 2.5em;
-  border: 0.5em solid rgba(0, 0, 0, 0);
-  border-top: 0.5em solid rgba(0, 0, 0, 0.7);
-  border-right: 0.5em solid rgba(0, 0, 0, 0.7);
-  animation: fade-in-delayed 4s, rotate 1s linear infinite;
-}
-
-@keyframes fade-in-delayed {
-  0% { opacity: 0; }
-  25% {opacity: 0; }
-  100% { opacity: 1; }
-}
-
-@keyframes rotate {
-  from { transform: rotate(0deg); }
-  to { transform: rotate(360deg); }
-}
-
-/* TODO: This is due to stats hack. Replace with \`canvas\`. */
-.wrapper > canvas {
-  max-width: 100%;
-  max-height: 100%;
-  animation: fade-in 0.25s ease-in;
-}
-
-@keyframes fade-in {
-  from { opacity: 0; }
-  to { opacity: 1; }
-}
-
-.wrapper.invisible {
-  opacity: 0;
-}
-
-.wrapper.drag-input-enabled > canvas {
-  cursor: grab;
-}
-
-.wrapper.drag-input-enabled > canvas:active {
-  cursor: grabbing;
-}
-`);
-
-// src/cubing/twisty/views/3D/DragTracker.ts
-var MOVEMENT_EPSILON = 0.1;
-var _dragInfoMap, _targetListeners, _lazyListenersRegistered, _registerLazyListeners, registerLazyListeners_fn, _clear, clear_fn, _trackDrag, trackDrag_fn;
-var DragTracker = class extends EventTarget {
-  constructor(target) {
-    super();
-    this.target = target;
-    __privateAdd(this, _registerLazyListeners);
-    __privateAdd(this, _clear);
-    __privateAdd(this, _trackDrag);
-    __privateAdd(this, _dragInfoMap, /* @__PURE__ */ new Map());
-    __privateAdd(this, _targetListeners, /* @__PURE__ */ new Map());
-    __privateAdd(this, _lazyListenersRegistered, false);
-  }
-  start() {
-    this.addTargetListener("pointerdown", this.onPointerDown.bind(this));
-    this.addTargetListener("contextmenu", (e) => {
-      e.preventDefault();
-    });
-    this.addTargetListener("touchmove", (e) => e.preventDefault());
-    this.addTargetListener("dblclick", (e) => e.preventDefault());
-  }
-  stop() {
-    for (const [eventType, listener] of __privateGet(this, _targetListeners).entries()) {
-      this.target.removeEventListener(eventType, listener);
-    }
-    __privateGet(this, _targetListeners).clear();
-    __privateSet(this, _lazyListenersRegistered, false);
-  }
-  addTargetListener(eventType, listener) {
-    if (!__privateGet(this, _targetListeners).has(eventType)) {
-      this.target.addEventListener(eventType, listener);
-      __privateGet(this, _targetListeners).set(eventType, listener);
-    }
-  }
-  onPointerDown(e) {
-    __privateMethod(this, _registerLazyListeners, registerLazyListeners_fn).call(this);
-    const newDragInfo = {
-      attachedInfo: {},
-      hasMoved: false,
-      lastClientX: e.clientX,
-      lastClientY: e.clientY,
-      lastTimeStamp: e.timeStamp
-    };
-    __privateGet(this, _dragInfoMap).set(e.pointerId, newDragInfo);
-    this.target.setPointerCapture(e.pointerId);
-  }
-  onPointerMove(e) {
-    const movementInfo = __privateMethod(this, _trackDrag, trackDrag_fn).call(this, e).movementInfo;
-    if (movementInfo) {
-      e.preventDefault();
-      this.dispatchEvent(new CustomEvent("move", {
-        detail: movementInfo
-      }));
-    }
-  }
-  onPointerUp(e) {
-    const trackDragResult = __privateMethod(this, _trackDrag, trackDrag_fn).call(this, e);
-    const existing = __privateGet(this, _dragInfoMap).get(e.pointerId);
-    __privateMethod(this, _clear, clear_fn).call(this, e);
-    this.target.releasePointerCapture(e.pointerId);
-    let event;
-    if (trackDragResult.hasMoved) {
-      event = new CustomEvent("up", {
-        detail: { attachedInfo: existing.attachedInfo }
-      });
-    } else {
-      const { altKey, ctrlKey, metaKey, shiftKey } = e;
-      event = new CustomEvent("press", {
-        detail: {
-          normalizedX: e.offsetX / this.target.offsetWidth * 2 - 1,
-          normalizedY: 1 - e.offsetY / this.target.offsetHeight * 2,
-          rightClick: !!(e.button & 2),
-          keys: {
-            altKey,
-            ctrlOrMetaKey: ctrlKey || metaKey,
-            shiftKey
-          }
-        }
-      });
-    }
-    this.dispatchEvent(event);
-  }
-};
-_dragInfoMap = new WeakMap();
-_targetListeners = new WeakMap();
-_lazyListenersRegistered = new WeakMap();
-_registerLazyListeners = new WeakSet();
-registerLazyListeners_fn = function() {
-  if (__privateGet(this, _lazyListenersRegistered)) {
-    return;
-  }
-  this.addTargetListener("pointermove", this.onPointerMove.bind(this));
-  this.addTargetListener("pointerup", this.onPointerUp.bind(this));
-  __privateSet(this, _lazyListenersRegistered, true);
-};
-_clear = new WeakSet();
-clear_fn = function(e) {
-  __privateGet(this, _dragInfoMap).delete(e.pointerId);
-};
-_trackDrag = new WeakSet();
-trackDrag_fn = function(e) {
-  const existing = __privateGet(this, _dragInfoMap).get(e.pointerId);
-  if (!existing) {
-    return { movementInfo: null, hasMoved: false };
-  }
-  let movementInfo;
-  if ((e.movementX ?? 0) !== 0 || (e.movementY ?? 0) !== 0) {
-    movementInfo = {
-      attachedInfo: existing.attachedInfo,
-      movementX: e.movementX,
-      movementY: e.movementY,
-      elapsedMs: e.timeStamp - existing.lastTimeStamp
-    };
-  } else {
-    movementInfo = {
-      attachedInfo: existing.attachedInfo,
-      movementX: e.clientX - existing.lastClientX,
-      movementY: e.clientY - existing.lastClientY,
-      elapsedMs: e.timeStamp - existing.lastTimeStamp
-    };
-  }
-  existing.lastClientX = e.clientX;
-  existing.lastClientY = e.clientY;
-  existing.lastTimeStamp = e.timeStamp;
-  if (Math.abs(movementInfo.movementX) < MOVEMENT_EPSILON && Math.abs(movementInfo.movementY) < MOVEMENT_EPSILON) {
-    return { movementInfo: null, hasMoved: existing.hasMoved };
-  } else {
-    existing.hasMoved = true;
-    return { movementInfo, hasMoved: existing.hasMoved };
-  }
-};
-
-// src/cubing/twisty/views/3D/RendererPool.ts
-var renderers = [];
-async function renderPooled(width, height, canvas, scene, camera) {
-  if (width === 0 || height === 0) {
-    return;
-  }
-  if (renderers.length === 0) {
-    renderers.push(newRenderer());
-  }
-  const renderer = await renderers[0];
-  renderer.setSize(width, height);
-  renderer.render(scene, camera);
-  const context = canvas.getContext("2d");
-  context.clearRect(0, 0, canvas.width, canvas.height);
-  context.drawImage(renderer.domElement, 0, 0);
-}
-async function newRenderer() {
-  const rendererConstructor = (await THREEJS).WebGLRenderer;
-  const renderer = new rendererConstructor({
-    antialias: true,
-    alpha: true
-  });
-  renderer.setPixelRatio(pixelRatio());
-  return renderer;
-}
-
-// src/cubing/twisty/views/3D/TwistyOrbitControls.ts
-var INERTIA_DEFAULT = true;
-var INERTIA_DURATION_MS = 500;
-var INERTIA_TIMEOUT_MS = 50;
-var VERTICAL_MOVEMENT_BASE_SCALE = 0.75;
-function momentumScale(progress) {
-  return (Math.exp(1 - progress) - (1 - progress)) / (1 - Math.E) + 1;
-}
-var Inertia = class {
-  constructor(startTimestamp, momentumX, momentumY, callback) {
-    this.startTimestamp = startTimestamp;
-    this.momentumX = momentumX;
-    this.momentumY = momentumY;
-    this.callback = callback;
-    this.scheduler = new RenderScheduler(this.render.bind(this));
-    this.scheduler.requestAnimFrame();
-    this.lastTimestamp = startTimestamp;
-  }
-  render(now) {
-    const progressBefore = (this.lastTimestamp - this.startTimestamp) / INERTIA_DURATION_MS;
-    const progressAfter = Math.min(1, (now - this.startTimestamp) / INERTIA_DURATION_MS);
-    if (progressBefore === 0 && progressAfter > INERTIA_TIMEOUT_MS / INERTIA_DURATION_MS) {
-      return;
-    }
-    const delta = momentumScale(progressAfter) - momentumScale(progressBefore);
-    this.callback(this.momentumX * delta * 1e3, this.momentumY * delta * 1e3);
-    if (progressAfter < 1) {
-      this.scheduler.requestAnimFrame();
-    }
-    this.lastTimestamp = now;
-  }
-};
-var TwistyOrbitControls = class {
-  constructor(model, mirror, canvas, dragTracker) {
-    this.model = model;
-    this.mirror = mirror;
-    this.canvas = canvas;
-    this.dragTracker = dragTracker;
-    this.experimentalInertia = INERTIA_DEFAULT;
-    this.onMovementBound = this.onMovement.bind(this);
-    this.experimentalHasBeenMoved = false;
-    this.dragTracker.addEventListener("move", this.onMove.bind(this));
-    this.dragTracker.addEventListener("up", this.onUp.bind(this));
-  }
-  temperMovement(f) {
-    return Math.sign(f) * Math.log(Math.abs(f * 10) + 1) / 6;
-  }
-  onMove(e) {
-    var _a;
-    (_a = e.detail).attachedInfo ?? (_a.attachedInfo = {});
-    const { temperedX, temperedY } = this.onMovement(e.detail.movementX, e.detail.movementY);
-    const attachedInfo = e.detail.attachedInfo;
-    attachedInfo.lastTemperedX = temperedX * 10;
-    attachedInfo.lastTemperedY = temperedY * 10;
-    attachedInfo.timestamp = e.timeStamp;
-  }
-  onMovement(movementX, movementY) {
-    const scale = this.mirror ? -1 : 1;
-    const minDim = Math.min(this.canvas.offsetWidth, this.canvas.offsetHeight);
-    const temperedX = this.temperMovement(movementX / minDim);
-    const temperedY = this.temperMovement(movementY / minDim * VERTICAL_MOVEMENT_BASE_SCALE);
-    this.model.twistySceneModel.orbitCoordinatesRequest.set((async () => {
-      const prevCoords = await this.model.twistySceneModel.orbitCoordinates.get();
-      const newCoords = {
-        latitude: prevCoords.latitude + 2 * temperedY * DEGREES_PER_RADIAN * scale,
-        longitude: prevCoords.longitude - 2 * temperedX * DEGREES_PER_RADIAN
-      };
-      return newCoords;
-    })());
-    return { temperedX, temperedY };
-  }
-  onUp(e) {
-    e.preventDefault();
-    if ("lastTemperedX" in e.detail.attachedInfo && "lastTemperedY" in e.detail.attachedInfo && "timestamp" in e.detail.attachedInfo && e.timeStamp - e.detail.attachedInfo.timestamp < 60) {
-      new Inertia(e.timeStamp, e.detail.attachedInfo.lastTemperedX, e.detail.attachedInfo.lastTemperedY, this.onMovementBound);
-    }
-  }
-};
-
-// src/cubing/twisty/views/3D/Twisty3DVantage.ts
-var SHOW_STATS = false;
-function debugShowRenderStats(enable) {
-  SHOW_STATS = enable;
-}
-async function setCameraFromOrbitCoordinates(camera, orbitCoordinates, backView = false) {
-  const spherical = new (await THREEJS).Spherical(orbitCoordinates.distance, (90 - (backView ? -1 : 1) * orbitCoordinates.latitude) / DEGREES_PER_RADIAN, ((backView ? 180 : 0) + orbitCoordinates.longitude) / DEGREES_PER_RADIAN);
-  spherical.makeSafe();
-  camera.position.setFromSpherical(spherical);
-  camera.lookAt(0, 0, 0);
-}
-var shareAllNewRenderers = null;
-function experimentalForceNewRendererSharing(share) {
-  shareAllNewRenderers = share;
-}
-var dedicatedRenderersSoFar = 0;
-var DEFAULT_MAX_DEDICATED_RENDERERS = 2;
-function shareRenderer() {
-  if (shareAllNewRenderers !== null) {
-    if (!shareAllNewRenderers) {
-      dedicatedRenderersSoFar++;
-    }
-    return shareAllNewRenderers;
-  }
-  if (dedicatedRenderersSoFar < DEFAULT_MAX_DEDICATED_RENDERERS) {
-    dedicatedRenderersSoFar++;
-    return false;
-  } else {
-    return true;
-  }
-}
-var _setupBasicPresses, setupBasicPresses_fn, _onResizeStaleDropper, _width, _height, _onResize, onResize_fn, _cachedRenderer, _cachedCanvas, _cachedDragTracker, _dragTracker, dragTracker_fn, _cachedCamera, _cachedOrbitControls, _disconnectionFunctions, _experimentalNextRenderFinishedCallback, _scheduler;
-var Twisty3DVantage = class extends ManagedCustomElement {
-  constructor(model, scene, options) {
-    super();
-    this.model = model;
-    this.options = options;
-    __privateAdd(this, _setupBasicPresses);
-    __privateAdd(this, _onResize);
-    __privateAdd(this, _dragTracker);
-    this.scene = null;
-    this.stats = null;
-    this.rendererIsShared = shareRenderer();
-    this.loadingElement = null;
-    __privateAdd(this, _onResizeStaleDropper, new StaleDropper());
-    __privateAdd(this, _width, 0);
-    __privateAdd(this, _height, 0);
-    __privateAdd(this, _cachedRenderer, null);
-    __privateAdd(this, _cachedCanvas, null);
-    __privateAdd(this, _cachedDragTracker, null);
-    __privateAdd(this, _cachedCamera, null);
-    __privateAdd(this, _cachedOrbitControls, null);
-    __privateAdd(this, _disconnectionFunctions, []);
-    __privateAdd(this, _experimentalNextRenderFinishedCallback, null);
-    __privateAdd(this, _scheduler, new RenderScheduler(this.render.bind(this)));
-    this.scene = scene ?? null;
-    this.loadingElement = this.addElement(document.createElement("div"));
-    this.loadingElement.classList.add("loading");
-    if (SHOW_STATS) {
-      this.stats = new Stats();
-      this.stats.dom.style.position = "absolute";
-      this.contentWrapper.appendChild(this.stats.dom);
-    }
-  }
-  async connectedCallback() {
-    this.addCSS(twisty3DVantageCSS);
-    this.addElement((await this.canvasInfo()).canvas);
-    __privateMethod(this, _onResize, onResize_fn).call(this);
-    const observer = new ResizeObserver(__privateMethod(this, _onResize, onResize_fn).bind(this));
-    observer.observe(this.contentWrapper);
-    this.orbitControls();
-    __privateMethod(this, _setupBasicPresses, setupBasicPresses_fn).call(this);
-    this.scheduleRender();
-  }
-  async clearCanvas() {
-    if (this.rendererIsShared) {
-      const canvasInfo = await this.canvasInfo();
-      canvasInfo.context.clearRect(0, 0, canvasInfo.canvas.width, canvasInfo.canvas.height);
-    } else {
-      const renderer = await this.renderer();
-      const context = renderer.getContext();
-      context.clear(context.COLOR_BUFFER_BIT);
-    }
-  }
-  async renderer() {
-    if (this.rendererIsShared) {
-      throw new Error("renderer expected to be shared.");
-    }
-    return __privateGet(this, _cachedRenderer) ?? __privateSet(this, _cachedRenderer, newRenderer());
-  }
-  async canvasInfo() {
-    return __privateGet(this, _cachedCanvas) ?? __privateSet(this, _cachedCanvas, (async () => {
-      let canvas;
-      if (this.rendererIsShared) {
-        canvas = this.addElement(document.createElement("canvas"));
-      } else {
-        const renderer = await this.renderer();
-        canvas = this.addElement(renderer.domElement);
-      }
-      this.loadingElement?.remove();
-      const context = canvas.getContext("2d");
-      return { canvas, context };
-    })());
-  }
-  async camera() {
-    return __privateGet(this, _cachedCamera) ?? __privateSet(this, _cachedCamera, (async () => {
-      const camera = new (await THREEJS).PerspectiveCamera(20, 1, 0.1, 20);
-      camera.position.copy(new (await THREEJS).Vector3(2, 4, 4).multiplyScalar(this.options?.backView ? -1 : 1));
-      camera.lookAt(0, 0, 0);
-      return camera;
-    })());
-  }
-  async orbitControls() {
-    return __privateGet(this, _cachedOrbitControls) ?? __privateSet(this, _cachedOrbitControls, (async () => {
-      const orbitControls = new TwistyOrbitControls(this.model, !!this.options?.backView, (await this.canvasInfo()).canvas, await __privateMethod(this, _dragTracker, dragTracker_fn).call(this));
-      if (this.model) {
-        this.addListener(this.model.twistySceneModel.orbitCoordinates, async (orbitCoordinates) => {
-          const camera = await this.camera();
-          setCameraFromOrbitCoordinates(camera, orbitCoordinates, this.options?.backView);
-          this.scheduleRender();
-        });
-      }
-      return orbitControls;
-    })());
-  }
-  addListener(prop, listener) {
-    prop.addFreshListener(listener);
-    __privateGet(this, _disconnectionFunctions).push(() => {
-      prop.removeFreshListener(listener);
-    });
-  }
-  disconnect() {
-    for (const fn of __privateGet(this, _disconnectionFunctions)) {
-      fn();
-    }
-    __privateSet(this, _disconnectionFunctions, []);
-  }
-  experimentalNextRenderFinishedCallback(callback) {
-    __privateSet(this, _experimentalNextRenderFinishedCallback, callback);
-  }
-  async render() {
-    var _a;
-    if (!this.scene) {
-      throw new Error("Attempted to render without a scene");
-    }
-    this.stats?.begin();
-    const [scene, camera, canvas] = await Promise.all([
-      this.scene.scene(),
-      this.camera(),
-      this.canvasInfo()
-    ]);
-    if (this.rendererIsShared) {
-      renderPooled(__privateGet(this, _width), __privateGet(this, _height), canvas.canvas, scene, camera);
-    } else {
-      (await this.renderer()).render(scene, camera);
-    }
-    this.stats?.end();
-    (_a = __privateGet(this, _experimentalNextRenderFinishedCallback)) == null ? void 0 : _a.call(this);
-    __privateSet(this, _experimentalNextRenderFinishedCallback, null);
-  }
-  scheduleRender() {
-    __privateGet(this, _scheduler).requestAnimFrame();
-  }
-};
-_setupBasicPresses = new WeakSet();
-setupBasicPresses_fn = async function() {
-  const dragTracker = await __privateMethod(this, _dragTracker, dragTracker_fn).call(this);
-  dragTracker.addEventListener("press", async (e) => {
-    const movePressInput = await this.model.twistySceneModel.movePressInput.get();
-    if (movePressInput !== "basic") {
-      return;
-    }
-    this.dispatchEvent(new CustomEvent("press", {
-      detail: {
-        pressInfo: e.detail,
-        cameraPromise: this.camera()
-      }
-    }));
-  });
-};
-_onResizeStaleDropper = new WeakMap();
-_width = new WeakMap();
-_height = new WeakMap();
-_onResize = new WeakSet();
-onResize_fn = async function() {
-  const camera = await __privateGet(this, _onResizeStaleDropper).queue(this.camera());
-  const w = this.contentWrapper.clientWidth;
-  const h = this.contentWrapper.clientHeight;
-  __privateSet(this, _width, w);
-  __privateSet(this, _height, h);
-  const off = 0;
-  let yoff = 0;
-  let excess = 0;
-  if (h > w) {
-    excess = h - w;
-    yoff = -Math.floor(0.5 * excess);
-  }
-  camera.aspect = w / h;
-  camera.setViewOffset(w, h - excess, off, yoff, w, h);
-  camera.updateProjectionMatrix();
-  this.clearCanvas();
-  if (this.rendererIsShared) {
-    const canvasInfo = await this.canvasInfo();
-    canvasInfo.canvas.width = w * pixelRatio();
-    canvasInfo.canvas.height = h * pixelRatio();
-    canvasInfo.canvas.style.width = w.toString();
-    canvasInfo.canvas.style.height = h.toString();
-  } else {
-    const renderer = await this.renderer();
-    renderer.setSize(w, h, true);
-  }
-  this.scheduleRender();
-};
-_cachedRenderer = new WeakMap();
-_cachedCanvas = new WeakMap();
-_cachedDragTracker = new WeakMap();
-_dragTracker = new WeakSet();
-dragTracker_fn = async function() {
-  return __privateGet(this, _cachedDragTracker) ?? __privateSet(this, _cachedDragTracker, (async () => {
-    const dragTracker = new DragTracker((await this.canvasInfo()).canvas);
-    this.model?.twistySceneModel.dragInput.addFreshListener((dragInputMode) => {
-      let dragInputEnabled = false;
-      switch (dragInputMode) {
-        case "auto":
-          dragTracker.start();
-          dragInputEnabled = true;
-          break;
-        case "none":
-          dragTracker.stop();
-          break;
-      }
-      this.contentWrapper.classList.toggle("drag-input-enabled", dragInputEnabled);
-    });
-    return dragTracker;
-  })());
-};
-_cachedCamera = new WeakMap();
-_cachedOrbitControls = new WeakMap();
-_disconnectionFunctions = new WeakMap();
-_experimentalNextRenderFinishedCallback = new WeakMap();
-_scheduler = new WeakMap();
-customElementsShim.define("twisty-3d-vantage", Twisty3DVantage);
 
 // src/cubing/twisty/views/3D/Twisty3DSceneWrapper.ts
-var _backViewClassListManager, _freshListenerManager5, _backViewVantage, _cachedScene2, _vantages, _currentTwisty3DPuzzleWrapper, _initialWrapperTracker, _twisty3DStaleDropper;
 var Twisty3DSceneWrapper = class extends ManagedCustomElement {
   constructor(model) {
     super();
     this.model = model;
-    __privateAdd(this, _backViewClassListManager, new ClassListManager(this, "back-view-", [
-      "auto",
-      "none",
-      "side-by-side",
-      "top-right"
-    ]));
-    __privateAdd(this, _freshListenerManager5, new FreshListenerManager());
-    __privateAdd(this, _backViewVantage, null);
-    __privateAdd(this, _cachedScene2, void 0);
-    __privateAdd(this, _vantages, /* @__PURE__ */ new Set());
-    __privateAdd(this, _currentTwisty3DPuzzleWrapper, null);
-    __privateAdd(this, _initialWrapperTracker, new InitialValueTracker());
-    __privateAdd(this, _twisty3DStaleDropper, new StaleDropper());
   }
+  #backViewClassListManager = new ClassListManager(this, "back-view-", [
+    "auto",
+    "none",
+    "side-by-side",
+    "top-right"
+  ]);
+  #freshListenerManager = new FreshListenerManager();
   disconnect() {
-    __privateGet(this, _freshListenerManager5).disconnect();
+    this.#freshListenerManager.disconnect();
   }
   async connectedCallback() {
     this.addCSS(twistyViewerWrapperCSS);
     const vantage = new Twisty3DVantage(this.model, this);
     this.addVantage(vantage);
     if (this.model) {
-      __privateGet(this, _freshListenerManager5).addMultiListener([this.model.puzzleLoader, this.model.visualizationStrategy], this.onPuzzle.bind(this));
-      __privateGet(this, _freshListenerManager5).addListener(this.model.backView, this.onBackView.bind(this));
+      this.#freshListenerManager.addMultiListener(
+        [this.model.puzzleLoader, this.model.visualizationStrategy],
+        this.onPuzzle.bind(this)
+      );
+      this.#freshListenerManager.addListener(
+        this.model.backView,
+        this.onBackView.bind(this)
+      );
     }
     this.scheduleRender();
   }
+  #backViewVantage = null;
   setBackView(backView) {
     const shouldHaveBackView = ["side-by-side", "top-right"].includes(backView);
-    const hasBackView = __privateGet(this, _backViewVantage) !== null;
-    __privateGet(this, _backViewClassListManager).setValue(backView);
+    const hasBackView = this.#backViewVantage !== null;
+    this.#backViewClassListManager.setValue(backView);
     if (shouldHaveBackView) {
       if (!hasBackView) {
-        __privateSet(this, _backViewVantage, new Twisty3DVantage(this.model, this, {
+        this.#backViewVantage = new Twisty3DVantage(this.model, this, {
           backView: true
-        }));
-        this.addVantage(__privateGet(this, _backViewVantage));
+        });
+        this.addVantage(this.#backViewVantage);
         this.scheduleRender();
       }
     } else {
-      if (__privateGet(this, _backViewVantage)) {
-        this.removeVantage(__privateGet(this, _backViewVantage));
-        __privateSet(this, _backViewVantage, null);
+      if (this.#backViewVantage) {
+        this.removeVantage(this.#backViewVantage);
+        this.#backViewVantage = null;
       }
     }
   }
@@ -1709,7 +1076,7 @@ var Twisty3DSceneWrapper = class extends ManagedCustomElement {
     this.setBackView(backView);
   }
   async onPress(e) {
-    const twisty3DPuzzleWrapper = __privateGet(this, _currentTwisty3DPuzzleWrapper);
+    const twisty3DPuzzleWrapper = this.#currentTwisty3DPuzzleWrapper;
     if (!twisty3DPuzzleWrapper) {
       console.info("no wrapper; skipping scene wrapper press!");
       return;
@@ -1720,7 +1087,10 @@ var Twisty3DSceneWrapper = class extends ManagedCustomElement {
         THREEJS
       ]);
       const raycaster = new three.Raycaster();
-      const mouse = new (await THREEJS).Vector2(e.detail.pressInfo.normalizedX, e.detail.pressInfo.normalizedY);
+      const mouse = new (await THREEJS).Vector2(
+        e.detail.pressInfo.normalizedX,
+        e.detail.pressInfo.normalizedY
+      );
       raycaster.setFromCamera(mouse, camera);
       return raycaster;
     })();
@@ -1729,32 +1099,35 @@ var Twisty3DSceneWrapper = class extends ManagedCustomElement {
       depth: e.detail.pressInfo.keys.ctrlOrMetaKey ? "rotation" : e.detail.pressInfo.keys.shiftKey ? "secondSlice" : "none"
     });
   }
+  #cachedScene;
   async scene() {
-    return __privateGet(this, _cachedScene2) ?? __privateSet(this, _cachedScene2, (async () => new (await THREEJS).Scene())());
+    return this.#cachedScene ?? (this.#cachedScene = (async () => new (await THREEJS).Scene())());
   }
+  #vantages = /* @__PURE__ */ new Set();
   addVantage(vantage) {
     vantage.addEventListener("press", this.onPress.bind(this));
-    __privateGet(this, _vantages).add(vantage);
+    this.#vantages.add(vantage);
     this.contentWrapper.appendChild(vantage);
   }
   removeVantage(vantage) {
-    __privateGet(this, _vantages).delete(vantage);
+    this.#vantages.delete(vantage);
     vantage.remove();
     vantage.disconnect();
-    __privateGet(this, _currentTwisty3DPuzzleWrapper)?.disconnect();
+    this.#currentTwisty3DPuzzleWrapper?.disconnect();
   }
   experimentalVantages() {
-    return __privateGet(this, _vantages).values();
+    return this.#vantages.values();
   }
   scheduleRender() {
-    for (const vantage of __privateGet(this, _vantages)) {
+    for (const vantage of this.#vantages) {
       vantage.scheduleRender();
     }
   }
+  #currentTwisty3DPuzzleWrapper = null;
   async setCurrentTwisty3DPuzzleWrapper(scene, twisty3DPuzzleWrapper) {
-    const old = __privateGet(this, _currentTwisty3DPuzzleWrapper);
+    const old = this.#currentTwisty3DPuzzleWrapper;
     try {
-      __privateSet(this, _currentTwisty3DPuzzleWrapper, twisty3DPuzzleWrapper);
+      this.#currentTwisty3DPuzzleWrapper = twisty3DPuzzleWrapper;
       old?.disconnect();
       scene.add(await twisty3DPuzzleWrapper.twisty3DPuzzle());
     } finally {
@@ -1762,31 +1135,27 @@ var Twisty3DSceneWrapper = class extends ManagedCustomElement {
         scene.remove(await old.twisty3DPuzzle());
       }
     }
-    __privateGet(this, _initialWrapperTracker).handleNewValue(twisty3DPuzzleWrapper);
+    this.#initialWrapperTracker.handleNewValue(twisty3DPuzzleWrapper);
   }
+  #initialWrapperTracker = new InitialValueTracker();
   async experimentalTwisty3DPuzzleWrapper() {
-    return __privateGet(this, _currentTwisty3DPuzzleWrapper) || __privateGet(this, _initialWrapperTracker).promise;
+    return this.#currentTwisty3DPuzzleWrapper || this.#initialWrapperTracker.promise;
   }
+  #twisty3DStaleDropper = new StaleDropper();
   async onPuzzle(inputs) {
     if (inputs[1] === "2D") {
       return;
     }
-    __privateGet(this, _currentTwisty3DPuzzleWrapper)?.disconnect();
-    const [scene, twisty3DPuzzleWrapper] = await __privateGet(this, _twisty3DStaleDropper).queue(Promise.all([
-      this.scene(),
-      new Twisty3DPuzzleWrapper(this.model, this, inputs[0], inputs[1])
-    ]));
+    this.#currentTwisty3DPuzzleWrapper?.disconnect();
+    const [scene, twisty3DPuzzleWrapper] = await this.#twisty3DStaleDropper.queue(
+      Promise.all([
+        this.scene(),
+        new Twisty3DPuzzleWrapper(this.model, this, inputs[0], inputs[1])
+      ])
+    );
     this.setCurrentTwisty3DPuzzleWrapper(scene, twisty3DPuzzleWrapper);
   }
 };
-_backViewClassListManager = new WeakMap();
-_freshListenerManager5 = new WeakMap();
-_backViewVantage = new WeakMap();
-_cachedScene2 = new WeakMap();
-_vantages = new WeakMap();
-_currentTwisty3DPuzzleWrapper = new WeakMap();
-_initialWrapperTracker = new WeakMap();
-_twisty3DStaleDropper = new WeakMap();
 customElementsShim.define("twisty-3d-scene-wrapper", Twisty3DSceneWrapper);
 
 // src/cubing/twisty/views/control-panel/TwistyButtons.css.ts
@@ -2003,14 +1372,12 @@ var buttonCommands = {
   "jump-to-end": true,
   "twizzle-link": true
 };
-var _onCommand, onCommand_fn;
 var TwistyButtons = class extends ManagedCustomElement {
   constructor(model, controller, fullscreenElement) {
     super();
     this.model = model;
     this.controller = controller;
     this.fullscreenElement = fullscreenElement;
-    __privateAdd(this, _onCommand);
     this.buttons = null;
   }
   connectedCallback() {
@@ -2019,12 +1386,48 @@ var TwistyButtons = class extends ManagedCustomElement {
     for (const command in buttonCommands) {
       const button = new TwistyButton();
       buttons[command] = button;
-      button.htmlButton.addEventListener("click", () => __privateMethod(this, _onCommand, onCommand_fn).call(this, command));
+      button.htmlButton.addEventListener(
+        "click",
+        () => this.#onCommand(command)
+      );
       this.addElement(button);
     }
     this.buttons = buttons;
     this.model?.buttonAppearance.addFreshListener(this.update.bind(this));
   }
+  #onCommand(command) {
+    switch (command) {
+      case "fullscreen":
+        this.onFullscreenButton();
+        break;
+      case "jump-to-start":
+        this.controller?.jumpToStart({ flash: true });
+        break;
+      case "play-step-backwards":
+        this.controller?.animationController.play({
+          direction: -1 /* Backwards */,
+          untilBoundary: "move" /* Move */
+        });
+        break;
+      case "play-pause":
+        this.controller?.togglePlay();
+        break;
+      case "play-step":
+        this.controller?.animationController.play({
+          direction: 1 /* Forwards */,
+          untilBoundary: "move" /* Move */
+        });
+        break;
+      case "jump-to-end":
+        this.controller?.jumpToEnd({ flash: true });
+        break;
+      case "twizzle-link":
+        this.controller?.visitTwizzleLink();
+        break;
+      default:
+        throw new Error("Missing command");
+    }
+  }
   async onFullscreenButton() {
     if (!this.fullscreenElement) {
       throw new Error("Attempted to go fullscreen without an element.");
@@ -2054,57 +1457,26 @@ var TwistyButtons = class extends ManagedCustomElement {
     }
   }
 };
-_onCommand = new WeakSet();
-onCommand_fn = function(command) {
-  switch (command) {
-    case "fullscreen":
-      this.onFullscreenButton();
-      break;
-    case "jump-to-start":
-      this.controller?.jumpToStart({ flash: true });
-      break;
-    case "play-step-backwards":
-      this.controller?.animationController.play({
-        direction: -1 /* Backwards */,
-        untilBoundary: "move" /* Move */
-      });
-      break;
-    case "play-pause":
-      this.controller?.togglePlay();
-      break;
-    case "play-step":
-      this.controller?.animationController.play({
-        direction: 1 /* Forwards */,
-        untilBoundary: "move" /* Move */
-      });
-      break;
-    case "jump-to-end":
-      this.controller?.jumpToEnd({ flash: true });
-      break;
-    case "twizzle-link":
-      this.controller?.visitTwizzleLink();
-      break;
-    default:
-      throw new Error("Missing command");
-  }
-};
 customElementsShim.define("twisty-buttons", TwistyButtons);
-var _iconManager;
 var TwistyButton = class extends ManagedCustomElement {
   constructor() {
     super(...arguments);
     this.htmlButton = document.createElement("button");
-    __privateAdd(this, _iconManager, new ClassListManager(this, "svg-", buttonIcons));
+    this.#iconManager = new ClassListManager(
+      this,
+      "svg-",
+      buttonIcons
+    );
   }
   connectedCallback() {
     this.addCSS(buttonCSS);
     this.addElement(this.htmlButton);
   }
+  #iconManager;
   setIcon(iconName) {
-    __privateGet(this, _iconManager).setValue(iconName);
+    this.#iconManager.setValue(iconName);
   }
 };
-_iconManager = new WeakMap();
 customElementsShim.define("twisty-button", TwistyButton);
 
 // src/cubing/twisty/views/control-panel/TwistyScrubber.css.ts
@@ -2133,21 +1505,33 @@ input:not(:disabled) {
 // src/cubing/twisty/views/control-panel/TwistyScrubber.ts
 var SLOW_DOWN_SCRUBBING = false;
 var isMouseDown = false;
-globalSafeDocument?.addEventListener("mousedown", function(event) {
-  if (event.which) {
-    isMouseDown = true;
-  }
-}, true);
-globalSafeDocument?.addEventListener("mouseup", function(event) {
-  if (event.which) {
-    isMouseDown = false;
-  }
-}, true);
+globalSafeDocument?.addEventListener(
+  "mousedown",
+  function(event) {
+    if (event.which) {
+      isMouseDown = true;
+    }
+  },
+  true
+);
+globalSafeDocument?.addEventListener(
+  "mouseup",
+  function(event) {
+    if (event.which) {
+      isMouseDown = false;
+    }
+  },
+  true
+);
 var y = 0;
 var clickNum = 0;
-globalSafeDocument?.addEventListener("mousedown", () => {
-  clickNum++;
-}, false);
+globalSafeDocument?.addEventListener(
+  "mousedown",
+  () => {
+    clickNum++;
+  },
+  false
+);
 globalSafeDocument?.addEventListener("mousemove", onMouseUpdate, false);
 globalSafeDocument?.addEventListener("mouseenter", onMouseUpdate, false);
 function onMouseUpdate(e) {
@@ -2157,12 +1541,10 @@ var lastVal = 0;
 var lastPreval = 0;
 var scaling = false;
 var currentClickNum = 0;
-var _inputElem;
 var TwistyScrubber = class extends ManagedCustomElement {
   constructor(model) {
     super();
     this.model = model;
-    __privateAdd(this, _inputElem, null);
   }
   async onDetailedTimelineInfo(detailedTimelineInfo) {
     const inputElem = await this.inputElem();
@@ -2175,12 +1557,15 @@ var TwistyScrubber = class extends ManagedCustomElement {
     this.addCSS(twistyScrubberCSS);
     this.addElement(await this.inputElem());
   }
+  #inputElem = null;
   async inputElem() {
-    return __privateGet(this, _inputElem) ?? __privateSet(this, _inputElem, (async () => {
+    return this.#inputElem ?? (this.#inputElem = (async () => {
       const elem = document.createElement("input");
       elem.type = "range";
       elem.disabled = true;
-      this.model?.detailedTimelineInfo.addFreshListener(this.onDetailedTimelineInfo.bind(this));
+      this.model?.detailedTimelineInfo.addFreshListener(
+        this.onDetailedTimelineInfo.bind(this)
+      );
       elem.addEventListener("input", this.onInput.bind(this));
       return elem;
     })());
@@ -2227,7 +1612,6 @@ var TwistyScrubber = class extends ManagedCustomElement {
     }
   }
 };
-_inputElem = new WeakMap();
 customElementsShim.define("twisty-scrubber", TwistyScrubber);
 
 // src/cubing/twisty/views/screenshot.ts
@@ -2240,8 +1624,13 @@ async function screenshot(model, options) {
     return new (await THREEJS).PerspectiveCamera(20, aspectRatio, 0.1, 20);
   })());
   const scene = new (await THREEJS).Scene();
-  const twisty3DWrapper = new Twisty3DPuzzleWrapper(model, { scheduleRender: () => {
-  } }, await model.puzzleLoader.get(), await model.visualizationStrategy.get());
+  const twisty3DWrapper = new Twisty3DPuzzleWrapper(
+    model,
+    { scheduleRender: () => {
+    } },
+    await model.puzzleLoader.get(),
+    await model.visualizationStrategy.get()
+  );
   await model.twistySceneModel.stickering.get();
   await new Promise((resolve) => setTimeout(resolve, 1e3));
   await model.legacyPosition.get();
@@ -2451,9 +1840,13 @@ var AnchorTransformationProp = class extends TwistyPropDerived {
       case "start":
         return inputs.setupAlgTransformation;
       case "end": {
-        const algTransformation = inputs.indexer.transformationAtIndex(inputs.indexer.numAnimatedLeaves());
+        const algTransformation = inputs.indexer.transformationAtIndex(
+          inputs.indexer.numAnimatedLeaves()
+        );
         const inverseAlgTransformation = algTransformation.invert();
-        return inputs.setupAlgTransformation.applyTransformation(inverseAlgTransformation);
+        return inputs.setupAlgTransformation.applyTransformation(
+          inverseAlgTransformation
+        );
       }
       default:
         throw new Error("Unimplemented!");
@@ -2476,12 +1869,24 @@ var CurrentLeavesSimplifiedProp = class extends TwistyPropDerived {
   derive(inputs) {
     return {
       stateIndex: inputs.currentMoveInfo.stateIndex,
-      movesFinishing: inputs.currentMoveInfo.movesFinishing.map((currentMoveInfo) => currentMoveInfo.move),
-      movesFinished: inputs.currentMoveInfo.movesFinished.map((currentMoveInfo) => currentMoveInfo.move)
+      movesFinishing: inputs.currentMoveInfo.movesFinishing.map(
+        (currentMoveInfo) => currentMoveInfo.move
+      ),
+      movesFinished: inputs.currentMoveInfo.movesFinished.map(
+        (currentMoveInfo) => currentMoveInfo.move
+      )
     };
   }
   canReuse(v1, v2) {
-    return v1.stateIndex === v2.stateIndex && arrayEqualsCompare(v1.movesFinishing, v2.movesFinishing, (m1, m2) => m1.isIdentical(m2)) && arrayEqualsCompare(v1.movesFinished, v2.movesFinished, (m1, m2) => m1.isIdentical(m2));
+    return v1.stateIndex === v2.stateIndex && arrayEqualsCompare(
+      v1.movesFinishing,
+      v2.movesFinishing,
+      (m1, m2) => m1.isIdentical(m2)
+    ) && arrayEqualsCompare(
+      v1.movesFinished,
+      v2.movesFinished,
+      (m1, m2) => m1.isIdentical(m2)
+    );
   }
 };
 
@@ -2501,9 +1906,13 @@ var CurrentMoveInfoProp = class extends TwistyPropDerived {
       return currentMoveInfo;
     }
     if (inputs.indexer.currentMoveInfo) {
-      return addCatchUpMove(inputs.indexer.currentMoveInfo(inputs.detailedTimelineInfo.timestamp));
+      return addCatchUpMove(
+        inputs.indexer.currentMoveInfo(inputs.detailedTimelineInfo.timestamp)
+      );
     } else {
-      const idx = inputs.indexer.timestampToIndex(inputs.detailedTimelineInfo.timestamp);
+      const idx = inputs.indexer.timestampToIndex(
+        inputs.detailedTimelineInfo.timestamp
+      );
       const currentMoveInfo = {
         stateIndex: idx,
         currentMoves: [],
@@ -2535,8 +1944,14 @@ var CurrentMoveInfoProp = class extends TwistyPropDerived {
           currentMoveInfo.movesFinishing.push(currentMove);
         } else {
           currentMoveInfo.currentMoves.push(currentMove);
-          currentMoveInfo.latestStart = Math.max(currentMoveInfo.latestStart, start);
-          currentMoveInfo.earliestEnd = Math.min(currentMoveInfo.earliestEnd, end);
+          currentMoveInfo.latestStart = Math.max(
+            currentMoveInfo.latestStart,
+            start
+          );
+          currentMoveInfo.earliestEnd = Math.min(
+            currentMoveInfo.earliestEnd,
+            end
+          );
         }
       }
       return addCatchUpMove(currentMoveInfo);
@@ -2547,7 +1962,9 @@ var CurrentMoveInfoProp = class extends TwistyPropDerived {
 // src/cubing/twisty/model/props/puzzle/state/CurrentStateProp.ts
 var CurrentStateProp = class extends TwistyPropDerived {
   derive(inputs) {
-    let transformation = inputs.indexer.transformationAtIndex(inputs.currentLeavesSimplified.stateIndex);
+    let transformation = inputs.indexer.transformationAtIndex(
+      inputs.currentLeavesSimplified.stateIndex
+    );
     transformation = inputs.anchoredStart.applyTransformation(transformation);
     for (const finishingMove of inputs.currentLeavesSimplified.movesFinishing) {
       transformation = transformation.applyMove(finishingMove);
@@ -2611,7 +2028,9 @@ var AlgDuration = class extends TraversalUp {
 var SimpleAlgIndexer = class {
   constructor(kpuzzle, alg) {
     this.kpuzzle = kpuzzle;
-    this.durationFn = new AlgDuration(defaultDurationForAmount);
+    this.durationFn = new AlgDuration(
+      defaultDurationForAmount
+    );
     this.moves = new Alg(alg.experimentalExpand());
   }
   getAnimLeaf(index) {
@@ -2696,15 +2115,20 @@ var LocalSimulMoves = class extends TraversalUp {
           return this.traverseAlg(alg);
         }
       }
-      maxSimulDur = Math.max(maxSimulDur, defaultDurationForAmount(moves[i].amount));
+      maxSimulDur = Math.max(
+        maxSimulDur,
+        defaultDurationForAmount(moves[i].amount)
+      );
     }
-    const localMovesWithRange = moves.map((blockMove) => {
-      return {
-        animLeafAlgNode: blockMove,
-        msUntilNext: 0,
-        duration: maxSimulDur
-      };
-    });
+    const localMovesWithRange = moves.map(
+      (blockMove) => {
+        return {
+          animLeafAlgNode: blockMove,
+          msUntilNext: 0,
+          duration: maxSimulDur
+        };
+      }
+    );
     localMovesWithRange[localMovesWithRange.length - 1].msUntilNext = maxSimulDur;
     return localMovesWithRange;
   }
@@ -2772,18 +2196,22 @@ var LocalSimulMoves = class extends TraversalUp {
   }
 };
 var localSimulMovesInstance = new LocalSimulMoves();
-var localSimulMoves = localSimulMovesInstance.traverseAlg.bind(localSimulMovesInstance);
+var localSimulMoves = localSimulMovesInstance.traverseAlg.bind(
+  localSimulMovesInstance
+);
 function simulMoves(a) {
   let timestamp = 0;
-  const l = localSimulMoves(a).map((localSimulMove) => {
-    const leafWithRange = {
-      animLeaf: localSimulMove.animLeafAlgNode,
-      start: timestamp,
-      end: timestamp + localSimulMove.duration
-    };
-    timestamp += localSimulMove.msUntilNext;
-    return leafWithRange;
-  });
+  const l = localSimulMoves(a).map(
+    (localSimulMove) => {
+      const leafWithRange = {
+        animLeaf: localSimulMove.animLeafAlgNode,
+        start: timestamp,
+        end: timestamp + localSimulMove.duration
+      };
+      timestamp += localSimulMove.msUntilNext;
+      return leafWithRange;
+    }
+  );
   return l;
 }
 
@@ -2864,7 +2292,10 @@ var SimultaneousMoveIndexer = class {
   timestampToPosition(timestamp, startState) {
     const currentMoveInfo = this.currentMoveInfo(timestamp);
     let state = startState ?? this.kpuzzle.identityTransformation().toKState();
-    for (const leafWithRange of this.animLeaves.slice(0, currentMoveInfo.stateIndex)) {
+    for (const leafWithRange of this.animLeaves.slice(
+      0,
+      currentMoveInfo.stateIndex
+    )) {
       const move = leafWithRange.animLeaf.as(Move);
       if (move !== null) {
         state = state.applyMove(move);
@@ -2879,7 +2310,10 @@ var SimultaneousMoveIndexer = class {
     let windowEarliestTimestamp = Infinity;
     for (const leafWithRange of this.animLeaves) {
       if (leafWithRange.start <= timestamp && leafWithRange.end >= timestamp) {
-        windowEarliestTimestamp = Math.min(windowEarliestTimestamp, leafWithRange.start);
+        windowEarliestTimestamp = Math.min(
+          windowEarliestTimestamp,
+          leafWithRange.start
+        );
       } else if (leafWithRange.start > timestamp) {
         break;
       }
@@ -2992,10 +2426,18 @@ var DecoratorConstructor = class extends TraversalUp {
   constructor(kpuzzle) {
     super();
     this.kpuzzle = kpuzzle;
-    this.durationFn = new AlgDuration(defaultDurationForAmount);
+    this.durationFn = new AlgDuration(
+      defaultDurationForAmount
+    );
     this.cache = {};
     this.identity = kpuzzle.identityTransformation();
-    this.dummyLeaf = new AlgWalkterDecoration(0, 0, this.identity, this.identity, []);
+    this.dummyLeaf = new AlgWalkterDecoration(
+      0,
+      0,
+      this.identity,
+      this.identity,
+      []
+    );
   }
   traverseAlg(alg) {
     let moveCount = 0;
@@ -3013,7 +2455,13 @@ var DecoratorConstructor = class extends TraversalUp {
       }
       child.push(apd);
     }
-    return new AlgWalkterDecoration(moveCount, duration, transformation, transformation.invert(), child);
+    return new AlgWalkterDecoration(
+      moveCount,
+      duration,
+      transformation,
+      transformation.invert(),
+      child
+    );
   }
   traverseGrouping(grouping) {
     const dec = this.traverseAlg(grouping.alg);
@@ -3026,7 +2474,12 @@ var DecoratorConstructor = class extends TraversalUp {
       return r;
     }
     const transformation = this.kpuzzle.moveToTransformation(move);
-    r = new AlgWalkterDecoration(1, this.durationFn.traverseAlgNode(move), transformation, transformation.invert());
+    r = new AlgWalkterDecoration(
+      1,
+      this.durationFn.traverseAlgNode(move),
+      transformation,
+      transformation.invert()
+    );
     this.cache[key] = r;
     return r;
   }
@@ -3036,7 +2489,13 @@ var DecoratorConstructor = class extends TraversalUp {
     const AB = decA.forward.applyTransformation(decB.forward);
     const ApBp = decA.backward.applyTransformation(decB.backward);
     const ABApBp = AB.applyTransformation(ApBp);
-    const dec = new AlgWalkterDecoration(2 * (decA.moveCount + decB.moveCount), 2 * (decA.duration + decB.duration), ABApBp, ABApBp.invert(), [decA, decB]);
+    const dec = new AlgWalkterDecoration(
+      2 * (decA.moveCount + decB.moveCount),
+      2 * (decA.duration + decB.duration),
+      ABApBp,
+      ABApBp.invert(),
+      [decA, decB]
+    );
     return this.mult(dec, 1, [dec, decA, decB]);
   }
   traverseConjugate(conjugate) {
@@ -3044,14 +2503,25 @@ var DecoratorConstructor = class extends TraversalUp {
     const decB = this.traverseAlg(conjugate.B);
     const AB = decA.forward.applyTransformation(decB.forward);
     const ABAp = AB.applyTransformation(decA.backward);
-    const dec = new AlgWalkterDecoration(2 * decA.moveCount + decB.moveCount, 2 * decA.duration + decB.duration, ABAp, ABAp.invert(), [decA, decB]);
+    const dec = new AlgWalkterDecoration(
+      2 * decA.moveCount + decB.moveCount,
+      2 * decA.duration + decB.duration,
+      ABAp,
+      ABAp.invert(),
+      [decA, decB]
+    );
     return this.mult(dec, 1, [dec, decA, decB]);
   }
   traversePause(pause) {
     if (pause.experimentalNISSGrouping) {
       return this.dummyLeaf;
     }
-    return new AlgWalkterDecoration(1, this.durationFn.traverseAlgNode(pause), this.identity, this.identity);
+    return new AlgWalkterDecoration(
+      1,
+      this.durationFn.traverseAlgNode(pause),
+      this.identity,
+      this.identity
+    );
   }
   traverseNewline(_newline) {
     return this.dummyLeaf;
@@ -3062,7 +2532,13 @@ var DecoratorConstructor = class extends TraversalUp {
   mult(apd, n, child) {
     const absn = Math.abs(n);
     const st = apd.forward.selfMultiply(n);
-    return new AlgWalkterDecoration(apd.moveCount * absn, apd.duration * absn, st, st.invert(), child);
+    return new AlgWalkterDecoration(
+      apd.moveCount * absn,
+      apd.duration * absn,
+      st,
+      st.invert(),
+      child
+    );
   }
 };
 var WalkerDown = class {
@@ -3116,8 +2592,14 @@ var AlgWalker = class extends TraversalDownUp {
       return false;
     }
     let i = wd.back ? alg.experimentalNumChildAlgNodes() - 1 : 0;
-    for (const algNode of directedGenerator(alg.childAlgNodes(), wd.back ? -1 /* Backwards */ : 1 /* Forwards */)) {
-      if (this.traverseAlgNode(algNode, new WalkerDown(wd.apd.children[i], wd.back))) {
+    for (const algNode of directedGenerator(
+      alg.childAlgNodes(),
+      wd.back ? -1 /* Backwards */ : 1 /* Forwards */
+    )) {
+      if (this.traverseAlgNode(
+        algNode,
+        new WalkerDown(wd.apd.children[i], wd.back)
+      )) {
         return true;
       }
       i += wd.back ? -1 : 1;
@@ -3129,7 +2611,10 @@ var AlgWalker = class extends TraversalDownUp {
       return false;
     }
     const back = this.domult(wd, grouping.amount);
-    return this.traverseAlg(grouping.alg, new WalkerDown(wd.apd.children[0], back));
+    return this.traverseAlg(
+      grouping.alg,
+      new WalkerDown(wd.apd.children[0], back)
+    );
   }
   traverseMove(move, wd) {
     if (!this.firstcheck(wd)) {
@@ -3146,9 +2631,30 @@ var AlgWalker = class extends TraversalDownUp {
     }
     const back = this.domult(wd, 1);
     if (back) {
-      return this.traverseAlg(commutator.B, new WalkerDown(wd.apd.children[2], !back)) || this.traverseAlg(commutator.A, new WalkerDown(wd.apd.children[1], !back)) || this.traverseAlg(commutator.B, new WalkerDown(wd.apd.children[2], back)) || this.traverseAlg(commutator.A, new WalkerDown(wd.apd.children[1], back));
+      return this.traverseAlg(
+        commutator.B,
+        new WalkerDown(wd.apd.children[2], !back)
+      ) || this.traverseAlg(
+        commutator.A,
+        new WalkerDown(wd.apd.children[1], !back)
+      ) || this.traverseAlg(
+        commutator.B,
+        new WalkerDown(wd.apd.children[2], back)
+      ) || this.traverseAlg(commutator.A, new WalkerDown(wd.apd.children[1], back));
     } else {
-      return this.traverseAlg(commutator.A, new WalkerDown(wd.apd.children[1], back)) || this.traverseAlg(commutator.B, new WalkerDown(wd.apd.children[2], back)) || this.traverseAlg(commutator.A, new WalkerDown(wd.apd.children[1], !back)) || this.traverseAlg(commutator.B, new WalkerDown(wd.apd.children[2], !back));
+      return this.traverseAlg(
+        commutator.A,
+        new WalkerDown(wd.apd.children[1], back)
+      ) || this.traverseAlg(
+        commutator.B,
+        new WalkerDown(wd.apd.children[2], back)
+      ) || this.traverseAlg(
+        commutator.A,
+        new WalkerDown(wd.apd.children[1], !back)
+      ) || this.traverseAlg(
+        commutator.B,
+        new WalkerDown(wd.apd.children[2], !back)
+      );
     }
   }
   traverseConjugate(conjugate, wd) {
@@ -3157,9 +2663,21 @@ var AlgWalker = class extends TraversalDownUp {
     }
     const back = this.domult(wd, 1);
     if (back) {
-      return this.traverseAlg(conjugate.A, new WalkerDown(wd.apd.children[1], !back)) || this.traverseAlg(conjugate.B, new WalkerDown(wd.apd.children[2], back)) || this.traverseAlg(conjugate.A, new WalkerDown(wd.apd.children[1], back));
+      return this.traverseAlg(
+        conjugate.A,
+        new WalkerDown(wd.apd.children[1], !back)
+      ) || this.traverseAlg(
+        conjugate.B,
+        new WalkerDown(wd.apd.children[2], back)
+      ) || this.traverseAlg(conjugate.A, new WalkerDown(wd.apd.children[1], back));
     } else {
-      return this.traverseAlg(conjugate.A, new WalkerDown(wd.apd.children[1], back)) || this.traverseAlg(conjugate.B, new WalkerDown(wd.apd.children[2], back)) || this.traverseAlg(conjugate.A, new WalkerDown(wd.apd.children[1], !back));
+      return this.traverseAlg(
+        conjugate.A,
+        new WalkerDown(wd.apd.children[1], back)
+      ) || this.traverseAlg(
+        conjugate.B,
+        new WalkerDown(wd.apd.children[2], back)
+      ) || this.traverseAlg(conjugate.A, new WalkerDown(wd.apd.children[1], !back));
     }
   }
   traversePause(pause, wd) {
@@ -3193,7 +2711,10 @@ var AlgWalker = class extends TraversalDownUp {
       amount = -amount;
     }
     const base = wd.apd.children[0];
-    const full = Math.min(Math.floor((this.goali - this.i) / base.moveCount), Math.ceil((this.goaldur - this.dur) / base.duration - 1));
+    const full = Math.min(
+      Math.floor((this.goali - this.i) / base.moveCount),
+      Math.ceil((this.goaldur - this.dur) / base.duration - 1)
+    );
     if (full > 0) {
       this.keepgoing(new WalkerDown(base, back), full);
     }
@@ -3204,7 +2725,9 @@ var AlgWalker = class extends TraversalDownUp {
     this.dur += mul * wd.apd.duration;
     if (mul !== 1) {
       if (wd.back) {
-        this.st = this.st.applyTransformation(wd.apd.backward.selfMultiply(mul));
+        this.st = this.st.applyTransformation(
+          wd.apd.backward.selfMultiply(mul)
+        );
       } else {
         this.st = this.st.applyTransformation(wd.apd.forward.selfMultiply(mul));
       }
@@ -3243,16 +2766,25 @@ var ChunkAlgs = class extends TraversalUp {
     return chunkifyAlg(alg, Math.ceil(Math.sqrt(algLength)));
   }
   traverseGrouping(grouping) {
-    return new Grouping(this.traverseAlg(grouping.alg), grouping.amount);
+    return new Grouping(
+      this.traverseAlg(grouping.alg),
+      grouping.amount
+    );
   }
   traverseMove(move) {
     return move;
   }
   traverseCommutator(commutator) {
-    return new Conjugate(this.traverseAlg(commutator.A), this.traverseAlg(commutator.B));
+    return new Conjugate(
+      this.traverseAlg(commutator.A),
+      this.traverseAlg(commutator.B)
+    );
   }
   traverseConjugate(conjugate) {
-    return new Conjugate(this.traverseAlg(conjugate.A), this.traverseAlg(conjugate.B));
+    return new Conjugate(
+      this.traverseAlg(conjugate.A),
+      this.traverseAlg(conjugate.B)
+    );
   }
   traversePause(pause) {
     return pause;
@@ -3265,7 +2797,9 @@ var ChunkAlgs = class extends TraversalUp {
   }
 };
 var chunkAlgsInstance = new ChunkAlgs();
-var chunkAlgs = chunkAlgsInstance.traverseAlg.bind(chunkAlgsInstance);
+var chunkAlgs = chunkAlgsInstance.traverseAlg.bind(
+  chunkAlgsInstance
+);
 
 // src/cubing/twisty/controllers/indexer/tree/TreeAlgIndexer.ts
 var TreeAlgIndexer = class {
@@ -3303,7 +2837,9 @@ var TreeAlgIndexer = class {
   }
   stateAtIndex(index, startState) {
     this.walker.moveByIndex(index);
-    return (startState ?? this.kpuzzle.startState()).applyTransformation(this.walker.st);
+    return (startState ?? this.kpuzzle.startState()).applyTransformation(
+      this.walker.st
+    );
   }
   transformationAtIndex(index) {
     this.walker.moveByIndex(index);
@@ -3477,14 +3013,9 @@ var CoarseTimelineInfoProp = class extends TwistyPropDerived {
 };
 
 // src/cubing/twisty/model/props/timeline/DetailedTimelineInfoProp.ts
-var _requestedTimestampToMilliseconds, requestedTimestampToMilliseconds_fn;
 var DetailedTimelineInfoProp = class extends TwistyPropDerived {
-  constructor() {
-    super(...arguments);
-    __privateAdd(this, _requestedTimestampToMilliseconds);
-  }
   derive(inputs) {
-    let timestamp = __privateMethod(this, _requestedTimestampToMilliseconds, requestedTimestampToMilliseconds_fn).call(this, inputs);
+    let timestamp = this.#requestedTimestampToMilliseconds(inputs);
     let atStart = false;
     let atEnd = false;
     if (timestamp >= inputs.timeRange.end) {
@@ -3502,25 +3033,24 @@ var DetailedTimelineInfoProp = class extends TwistyPropDerived {
       atEnd
     };
   }
+  #requestedTimestampToMilliseconds(inputs) {
+    switch (inputs.timestampRequest) {
+      case "start":
+        return inputs.timeRange.start;
+      case "end":
+        return inputs.timeRange.end;
+      case "anchor":
+        return inputs.setupAnchor === "start" ? inputs.timeRange.start : inputs.timeRange.end;
+      case "opposite-anchor":
+        return inputs.setupAnchor === "start" ? inputs.timeRange.end : inputs.timeRange.start;
+      default:
+        return inputs.timestampRequest;
+    }
+  }
   canReuse(v1, v2) {
     return v1.timestamp === v2.timestamp && v1.timeRange.start === v2.timeRange.start && v1.timeRange.end === v2.timeRange.end && v1.atStart === v2.atStart && v1.atEnd === v2.atEnd;
   }
 };
-_requestedTimestampToMilliseconds = new WeakSet();
-requestedTimestampToMilliseconds_fn = function(inputs) {
-  switch (inputs.timestampRequest) {
-    case "start":
-      return inputs.timeRange.start;
-    case "end":
-      return inputs.timeRange.end;
-    case "anchor":
-      return inputs.setupAnchor === "start" ? inputs.timeRange.start : inputs.timeRange.end;
-    case "opposite-anchor":
-      return inputs.setupAnchor === "start" ? inputs.timeRange.end : inputs.timeRange.start;
-    default:
-      return inputs.timestampRequest;
-  }
-};
 
 // src/cubing/twisty/model/props/timeline/PlayingInfoProp.ts
 var PlayingInfoProp = class extends TwistyPropSource {
@@ -3640,7 +3170,11 @@ var VisualizationStrategyProp = class extends TwistyPropDerived {
           case "3D":
             return "PG3D";
           case "experimental-2D-LL":
-            return "2D";
+            if (inputs.puzzleID === "4x4x4") {
+              return "experimental-2D-LL";
+            } else {
+              return "2D";
+            }
           default:
             return inputs.visualizationRequest;
         }
@@ -3672,7 +3206,12 @@ var SpriteProp = class extends TwistyPropDerived {
         resolve(null);
       };
       try {
-        (await loader()).load(textureURL.toString(), resolve, onLoadingError, onLoadingError);
+        (await loader()).load(
+          textureURL.toString(),
+          resolve,
+          onLoadingError,
+          onLoadingError
+        );
       } catch (e) {
         onLoadingError();
       }
@@ -3756,7 +3295,13 @@ var OrbitCoordinatesProp = class extends TwistyPropDerived {
     if (inputs.orbitCoordinatesRequest === "auto") {
       return defaultCameraOrbitCoordinates(inputs.puzzleID, inputs.strategy);
     }
-    const req = Object.assign(Object.assign({}, defaultCameraOrbitCoordinates(inputs.puzzleID, inputs.strategy), inputs.orbitCoordinatesRequest));
+    const req = Object.assign(
+      Object.assign(
+        {},
+        defaultCameraOrbitCoordinates(inputs.puzzleID, inputs.strategy),
+        inputs.orbitCoordinatesRequest
+      )
+    );
     if (Math.abs(req.latitude) <= inputs.latitudeLimit) {
       return req;
     } else {
@@ -3882,10 +3427,13 @@ var TwistyPlayerModel = class {
     this.title = new ArbitraryStringProp();
     this.videoURL = new URLProp();
     this.competitionID = new ArbitraryStringProp();
-    this.puzzleLoader = new PuzzleLoaderProp({
-      puzzleIDRequest: this.puzzleIDRequest,
-      puzzleDescriptionRequest: this.puzzleDescriptionRequest
-    }, this.userVisibleErrorTracker);
+    this.puzzleLoader = new PuzzleLoaderProp(
+      {
+        puzzleIDRequest: this.puzzleIDRequest,
+        puzzleDescriptionRequest: this.puzzleDescriptionRequest
+      },
+      this.userVisibleErrorTracker
+    );
     this.kpuzzle = new KPuzzleProp({ puzzleLoader: this.puzzleLoader });
     this.puzzleID = new PuzzleIDProp({ puzzleLoader: this.puzzleLoader });
     this.puzzleAlg = new PuzzleAlgProp({
@@ -3925,11 +3473,13 @@ var TwistyPlayerModel = class {
     this.timeRange = new TimeRangeProp({
       indexer: this.indexer
     });
-    this.detailedTimelineInfo = new DetailedTimelineInfoProp({
-      timestampRequest: this.timestampRequest,
-      timeRange: this.timeRange,
-      setupAnchor: this.setupAnchor
-    });
+    this.detailedTimelineInfo = new DetailedTimelineInfoProp(
+      {
+        timestampRequest: this.timestampRequest,
+        timeRange: this.timeRange,
+        setupAnchor: this.setupAnchor
+      }
+    );
     this.coarseTimelineInfo = new CoarseTimelineInfoProp({
       detailedTimelineInfo: this.detailedTimelineInfo,
       playingInfo: this.playingInfo
@@ -3976,7 +3526,9 @@ var TwistyPlayerModel = class {
       this.twistySceneModel.stickering.get()
     ]);
     const isExplorer = viewerLink === "experimental-twizzle-explorer";
-    const url = new URL(`https://alpha.twizzle.net/${isExplorer ? "explore" : "edit"}/`);
+    const url = new URL(
+      `https://alpha.twizzle.net/${isExplorer ? "explore" : "edit"}/`
+    );
     if (!alg.alg.experimentalIsEmpty()) {
       url.searchParams.set("alg", alg.alg.toString());
     }
@@ -3996,31 +3548,46 @@ var TwistyPlayerModel = class {
     }
     return url.toString();
   }
+  experimentalAddAlgLeaf(algLeaf, options = {}) {
+    const maybeMove = algLeaf.as(Move);
+    if (maybeMove) {
+      this.experimentalAddMove(maybeMove, options);
+    } else {
+      this.alg.set(
+        (async () => {
+          const alg = (await this.alg.get()).alg;
+          const newAlg = alg.concat(new Alg([algLeaf]));
+          this.timestampRequest.set("end");
+          return newAlg;
+        })()
+      );
+    }
+  }
   experimentalAddMove(flexibleMove, options = {}) {
     const move = typeof flexibleMove === "string" ? new Move(flexibleMove) : flexibleMove;
-    (async () => {
-      const alg = (await this.alg.get()).alg;
-      const newAlg = experimentalAppendMove(alg, move, {
-        coalesce: options?.coalesce,
-        mod: options?.mod
-      });
-      this.alg.set(newAlg);
-      this.timestampRequest.set("end");
-      this.catchUpMove.set({
-        move,
-        amount: 0
-      });
-    })();
-  }
-  get playingInfoProp() {
-    console.warn("Using deprecated prop: `playingInfoProp`. Please switch to: `playingInfo`");
-    return this.playingInfo;
+    this.alg.set(
+      (async () => {
+        const alg = (await this.alg.get()).alg;
+        const newAlg = experimentalAppendMove(alg, move, {
+          coalesce: options?.coalesce,
+          mod: options?.mod
+        });
+        this.timestampRequest.set("end");
+        this.catchUpMove.set({
+          move,
+          amount: 0
+        });
+        return newAlg;
+      })()
+    );
   }
 };
 
 // src/cubing/twisty/views/TwistyPlayerSettable.ts
 function err(propName) {
-  return new Error(`Cannot get \`.${propName}\` directly from a \`TwistyPlayer\`.`);
+  return new Error(
+    `Cannot get \`.${propName}\` directly from a \`TwistyPlayer\`.`
+  );
 }
 var TwistyPlayerSettable = class extends ManagedCustomElement {
   constructor() {
@@ -4231,23 +3798,32 @@ var twistyPlayerAttributeMap = {
   "experimental-sprite": "experimentalSprite",
   "experimental-hint-sprite": "experimentalHintSprite"
 };
-var configKeys = Object.fromEntries(Object.values(twistyPlayerAttributeMap).map((s) => [s, true]));
-var _controlsManager, _visualizationWrapperElem, _errorElem, _alreadyConnected, _flashLevel, _visualizationWrapper, _initial3DVisualizationWrapper, _visualizationStrategy, _setVisualizationWrapper, setVisualizationWrapper_fn;
+var configKeys = Object.fromEntries(
+  Object.values(twistyPlayerAttributeMap).map((s) => [s, true])
+);
 var TwistyPlayer = class extends TwistyPlayerSettable {
   constructor(config = {}) {
     super();
-    __privateAdd(this, _setVisualizationWrapper);
-    this.controller = new TwistyPlayerController(this.experimentalModel, this);
+    this.controller = new TwistyPlayerController(
+      this.experimentalModel,
+      this
+    );
     this.experimentalCanvasClickCallback = () => {
     };
-    __privateAdd(this, _controlsManager, new ClassListManager(this, "controls-", ["auto"].concat(Object.keys(controlsLocations))));
-    __privateAdd(this, _visualizationWrapperElem, document.createElement("div"));
-    __privateAdd(this, _errorElem, document.createElement("div"));
-    __privateAdd(this, _alreadyConnected, false);
-    __privateAdd(this, _flashLevel, "auto");
-    __privateAdd(this, _visualizationWrapper, null);
-    __privateAdd(this, _initial3DVisualizationWrapper, new InitialValueTracker());
-    __privateAdd(this, _visualizationStrategy, null);
+    this.#controlsManager = new ClassListManager(
+      this,
+      "controls-",
+      ["auto"].concat(
+        Object.keys(controlsLocations)
+      )
+    );
+    this.#visualizationWrapperElem = document.createElement("div");
+    this.#errorElem = document.createElement("div");
+    this.#alreadyConnected = false;
+    this.#flashLevel = "auto";
+    this.#visualizationWrapper = null;
+    this.#initial3DVisualizationWrapper = new InitialValueTracker();
+    this.#visualizationStrategy = null;
     for (const [propName, value] of Object.entries(config)) {
       if (!configKeys[propName]) {
         console.warn(`Invalid config passed to TwistyPlayer: ${propName}`);
@@ -4256,49 +3832,100 @@ var TwistyPlayer = class extends TwistyPlayerSettable {
       this[propName] = value;
     }
   }
+  #controlsManager;
+  #visualizationWrapperElem;
+  #errorElem;
+  #alreadyConnected;
   async connectedCallback() {
-    if (__privateGet(this, _alreadyConnected)) {
+    if (this.#alreadyConnected) {
       return;
     }
-    __privateSet(this, _alreadyConnected, true);
+    this.#alreadyConnected = true;
     this.addCSS(twistyPlayerCSS);
-    this.addElement(__privateGet(this, _visualizationWrapperElem)).classList.add("visualization-wrapper");
-    this.addElement(__privateGet(this, _errorElem)).classList.add("error-elem");
-    __privateGet(this, _errorElem).textContent = "Error";
-    this.experimentalModel.userVisibleErrorTracker.addFreshListener((userVisibleError) => {
-      const errorString = userVisibleError.errors[0] ?? null;
-      this.contentWrapper.classList.toggle("error", !!errorString);
-      if (errorString) {
-        __privateGet(this, _errorElem).textContent = errorString;
+    this.addElement(this.#visualizationWrapperElem).classList.add(
+      "visualization-wrapper"
+    );
+    this.addElement(this.#errorElem).classList.add("error-elem");
+    this.#errorElem.textContent = "Error";
+    this.experimentalModel.userVisibleErrorTracker.addFreshListener(
+      (userVisibleError) => {
+        const errorString = userVisibleError.errors[0] ?? null;
+        this.contentWrapper.classList.toggle("error", !!errorString);
+        if (errorString) {
+          this.#errorElem.textContent = errorString;
+        }
       }
-    });
+    );
     const scrubber = new TwistyScrubber(this.experimentalModel);
     this.contentWrapper.appendChild(scrubber);
-    this.buttons = new TwistyButtons(this.experimentalModel, this.controller, this);
+    this.buttons = new TwistyButtons(
+      this.experimentalModel,
+      this.controller,
+      this
+    );
     this.contentWrapper.appendChild(this.buttons);
-    this.experimentalModel.twistySceneModel.background.addFreshListener((backgroundTheme) => {
-      this.contentWrapper.classList.toggle("checkered", backgroundTheme !== "none");
-    });
-    this.experimentalModel.controlPanel.addFreshListener((controlPanel) => {
-      __privateGet(this, _controlsManager).setValue(controlPanel);
-    });
-    this.experimentalModel.visualizationStrategy.addFreshListener(__privateMethod(this, _setVisualizationWrapper, setVisualizationWrapper_fn).bind(this));
+    this.experimentalModel.twistySceneModel.background.addFreshListener(
+      (backgroundTheme) => {
+        this.contentWrapper.classList.toggle(
+          "checkered",
+          backgroundTheme !== "none"
+        );
+      }
+    );
+    this.experimentalModel.controlPanel.addFreshListener(
+      (controlPanel) => {
+        this.#controlsManager.setValue(controlPanel);
+      }
+    );
+    this.experimentalModel.visualizationStrategy.addFreshListener(
+      this.#setVisualizationWrapper.bind(this)
+    );
     this.experimentalModel.puzzleID.addFreshListener(this.flash.bind(this));
   }
+  #flashLevel;
   experimentalSetFlashLevel(newLevel) {
-    __privateSet(this, _flashLevel, newLevel);
+    this.#flashLevel = newLevel;
   }
   flash() {
-    if (__privateGet(this, _flashLevel) === "auto") {
-      __privateGet(this, _visualizationWrapper)?.animate([{ opacity: 0.25 }, { opacity: 1 }], {
+    if (this.#flashLevel === "auto") {
+      this.#visualizationWrapper?.animate([{ opacity: 0.25 }, { opacity: 1 }], {
         duration: 250,
         easing: "ease-out"
       });
     }
   }
+  #visualizationWrapper;
+  #initial3DVisualizationWrapper;
+  #visualizationStrategy;
+  #setVisualizationWrapper(strategy) {
+    if (strategy !== this.#visualizationStrategy) {
+      this.#visualizationWrapper?.remove();
+      this.#visualizationWrapper?.disconnect();
+      let newWrapper;
+      switch (strategy) {
+        case "2D":
+        case "experimental-2D-LL":
+          newWrapper = new Twisty2DSceneWrapper(
+            this.experimentalModel.twistySceneModel,
+            strategy
+          );
+          break;
+        case "Cube3D":
+        case "PG3D":
+          newWrapper = new Twisty3DSceneWrapper(this.experimentalModel);
+          this.#initial3DVisualizationWrapper.handleNewValue(newWrapper);
+          break;
+        default:
+          throw new Error("Invalid visualization");
+      }
+      this.#visualizationWrapperElem.appendChild(newWrapper);
+      this.#visualizationWrapper = newWrapper;
+      this.#visualizationStrategy = strategy;
+    }
+  }
   async experimentalCurrentVantages() {
     this.connectedCallback();
-    const wrapper = __privateGet(this, _visualizationWrapper);
+    const wrapper = this.#visualizationWrapper;
     if (wrapper instanceof Twisty3DSceneWrapper) {
       return wrapper.experimentalVantages();
     }
@@ -4314,7 +3941,7 @@ var TwistyPlayer = class extends TwistyPlayerSettable {
   }
   async experimentalCurrentThreeJSPuzzleObject(puzzleChangeCallback) {
     this.connectedCallback();
-    const sceneWrapper = await __privateGet(this, _initial3DVisualizationWrapper).promise;
+    const sceneWrapper = await this.#initial3DVisualizationWrapper.promise;
     const puzzleWrapper = await sceneWrapper.experimentalTwisty3DPuzzleWrapper();
     const twisty3DPuzzlePromise = puzzleWrapper.twisty3DPuzzle();
     const safeToCallback = (async () => {
@@ -4352,6 +3979,9 @@ var TwistyPlayer = class extends TwistyPlayerSettable {
   experimentalAddMove(flexibleMove, options = {}) {
     this.experimentalModel.experimentalAddMove(flexibleMove, options);
   }
+  experimentalAddAlgLeaf(algLeaf, options = {}) {
+    this.experimentalModel.experimentalAddAlgLeaf(algLeaf, options);
+  }
   static get observedAttributes() {
     const observed = [];
     for (const key of Object.keys(twistyPlayerAttributeMap)) {
@@ -4360,8 +3990,8 @@ var TwistyPlayer = class extends TwistyPlayerSettable {
     return observed;
   }
   attributeChangedCallback(attributeName, _oldValue, newValue) {
-    if (attributeName.startsWith("data-")) {
-      attributeName = attributeName.slice("data-".length);
+    if (attributeName.startsWith(DATA_ATTRIBUTE_PREFIX)) {
+      attributeName = attributeName.slice(DATA_ATTRIBUTE_PREFIX.length);
     }
     const setterName = twistyPlayerAttributeMap[attributeName];
     if (!setterName) {
@@ -4373,49 +4003,25 @@ var TwistyPlayer = class extends TwistyPlayerSettable {
     return (await screenshot(this.experimentalModel, options)).dataURL;
   }
   async experimentalDownloadScreenshot(filename) {
-    if (["2D", "experimental-2D-LL"].includes(await this.experimentalModel.visualizationStrategy.get())) {
-      const wrapper2D = __privateGet(this, _visualizationWrapper);
+    if (["2D", "experimental-2D-LL"].includes(
+      await this.experimentalModel.visualizationStrategy.get()
+    )) {
+      const wrapper2D = this.#visualizationWrapper;
       const twisty2DPuzzle = await wrapper2D.currentTwisty2DPuzzleWrapper().twisty2DPuzzle();
-      const str = new XMLSerializer().serializeToString(twisty2DPuzzle.svgWrapper.svgElement);
+      const str = new XMLSerializer().serializeToString(
+        twisty2DPuzzle.svgWrapper.svgElement
+      );
       const url = URL.createObjectURL(new Blob([str]));
-      downloadURL(url, filename ?? await getDefaultFilename(this.experimentalModel), "svg");
+      downloadURL(
+        url,
+        filename ?? await getDefaultFilename(this.experimentalModel),
+        "svg"
+      );
     } else {
       await (await screenshot(this.experimentalModel)).download(filename);
     }
   }
 };
-_controlsManager = new WeakMap();
-_visualizationWrapperElem = new WeakMap();
-_errorElem = new WeakMap();
-_alreadyConnected = new WeakMap();
-_flashLevel = new WeakMap();
-_visualizationWrapper = new WeakMap();
-_initial3DVisualizationWrapper = new WeakMap();
-_visualizationStrategy = new WeakMap();
-_setVisualizationWrapper = new WeakSet();
-setVisualizationWrapper_fn = function(strategy) {
-  if (strategy !== __privateGet(this, _visualizationStrategy)) {
-    __privateGet(this, _visualizationWrapper)?.remove();
-    __privateGet(this, _visualizationWrapper)?.disconnect();
-    let newWrapper;
-    switch (strategy) {
-      case "2D":
-      case "experimental-2D-LL":
-        newWrapper = new Twisty2DSceneWrapper(this.experimentalModel.twistySceneModel, strategy);
-        break;
-      case "Cube3D":
-      case "PG3D":
-        newWrapper = new Twisty3DSceneWrapper(this.experimentalModel);
-        __privateGet(this, _initial3DVisualizationWrapper).handleNewValue(newWrapper);
-        break;
-      default:
-        throw new Error("Invalid visualization");
-    }
-    __privateGet(this, _visualizationWrapperElem).appendChild(newWrapper);
-    __privateSet(this, _visualizationWrapper, newWrapper);
-    __privateSet(this, _visualizationStrategy, strategy);
-  }
-};
 customElementsShim.define("twisty-player", TwistyPlayer);
 
 // src/cubing/twisty/views/TwistyAlgViewer.css.ts
@@ -4456,15 +4062,22 @@ var TwistyAlgLeafElem = class extends ManagedCustomElement {
     this.classList.add(className);
     this.addCSS(twistyAlgViewerCSS);
     if (clickable) {
-      const anchor = this.contentWrapper.appendChild(document.createElement("a"));
+      const anchor = this.contentWrapper.appendChild(
+        document.createElement("a")
+      );
       anchor.href = "#";
       anchor.textContent = text;
       anchor.addEventListener("click", (e) => {
         e.preventDefault();
-        dataDown.twistyAlgViewer.jumpToIndex(dataDown.earliestMoveIndex, offsetIntoMove);
+        dataDown.twistyAlgViewer.jumpToIndex(
+          dataDown.earliestMoveIndex,
+          offsetIntoMove
+        );
       });
     } else {
-      this.contentWrapper.appendChild(document.createElement("span")).textContent = text;
+      this.contentWrapper.appendChild(
+        document.createElement("span")
+      ).textContent = text;
     }
   }
   pathToIndex(_index) {
@@ -4519,7 +4132,10 @@ var AlgToDOMTree = class extends TraversalDownUp {
     let moveCount = 0;
     const element = new TwistyAlgWrapperElem("twisty-alg-alg", alg);
     let first = true;
-    for (const algNode of direct(alg.childAlgNodes(), dataDown.direction)) {
+    for (const algNode of direct(
+      alg.childAlgNodes(),
+      dataDown.direction
+    )) {
       if (!first) {
         element.addString(" ");
       }
@@ -4528,11 +4144,13 @@ var AlgToDOMTree = class extends TraversalDownUp {
         element.addString("^(");
       }
       if (!algNode.as(Grouping)?.experimentalNISSPlaceholder) {
-        moveCount += element.addElem(this.traverseAlgNode(algNode, {
-          earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
-          twistyAlgViewer: dataDown.twistyAlgViewer,
-          direction: dataDown.direction
-        }));
+        moveCount += element.addElem(
+          this.traverseAlgNode(algNode, {
+            earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
+            twistyAlgViewer: dataDown.twistyAlgViewer,
+            direction: dataDown.direction
+          })
+        );
       }
       if (algNode.as(Pause)?.experimentalNISSGrouping) {
         element.addString(")");
@@ -4546,26 +4164,45 @@ var AlgToDOMTree = class extends TraversalDownUp {
   }
   traverseGrouping(grouping, dataDown) {
     const square1Tuple = grouping.experimentalAsSquare1Tuple();
-    const direction = updateDirectionByAmount(dataDown.direction, grouping.amount);
+    const direction = updateDirectionByAmount(
+      dataDown.direction,
+      grouping.amount
+    );
     let moveCount = 0;
     const element = new TwistyAlgWrapperElem("twisty-alg-grouping", grouping);
     element.addString("(");
     if (square1Tuple) {
       moveCount += element.addElem({
         moveCount: 1,
-        element: new TwistyAlgLeafElem("twisty-alg-move", square1Tuple[0].amount.toString(), dataDown, square1Tuple[0], true, true)
+        element: new TwistyAlgLeafElem(
+          "twisty-alg-move",
+          square1Tuple[0].amount.toString(),
+          dataDown,
+          square1Tuple[0],
+          true,
+          true
+        )
       });
       element.addString(", ");
       moveCount += element.addElem({
         moveCount: 1,
-        element: new TwistyAlgLeafElem("twisty-alg-move", square1Tuple[1].amount.toString(), dataDown, square1Tuple[1], true, true)
+        element: new TwistyAlgLeafElem(
+          "twisty-alg-move",
+          square1Tuple[1].amount.toString(),
+          dataDown,
+          square1Tuple[1],
+          true,
+          true
+        )
       });
     } else {
-      moveCount += element.addElem(this.traverseAlg(grouping.alg, {
-        earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
-        twistyAlgViewer: dataDown.twistyAlgViewer,
-        direction
-      }));
+      moveCount += element.addElem(
+        this.traverseAlg(grouping.alg, {
+          earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
+          twistyAlgViewer: dataDown.twistyAlgViewer,
+          direction
+        })
+      );
     }
     element.addString(")" + grouping.experimentalRepetitionSuffix);
     element.flushQueue();
@@ -4575,8 +4212,18 @@ var AlgToDOMTree = class extends TraversalDownUp {
     };
   }
   traverseMove(move, dataDown) {
-    const element = new TwistyAlgLeafElem("twisty-alg-move", move.toString(), dataDown, move, true, true);
-    dataDown.twistyAlgViewer.highlighter.addMove(move.startCharIndex, element);
+    const element = new TwistyAlgLeafElem(
+      "twisty-alg-move",
+      move.toString(),
+      dataDown,
+      move,
+      true,
+      true
+    );
+    dataDown.twistyAlgViewer.highlighter.addMove(
+      move.startCharIndex,
+      element
+    );
     return {
       moveCount: 1,
       element
@@ -4584,21 +4231,31 @@ var AlgToDOMTree = class extends TraversalDownUp {
   }
   traverseCommutator(commutator, dataDown) {
     let moveCount = 0;
-    const element = new TwistyAlgWrapperElem("twisty-alg-commutator", commutator);
+    const element = new TwistyAlgWrapperElem(
+      "twisty-alg-commutator",
+      commutator
+    );
     element.addString("[");
     element.flushQueue();
-    const [first, second] = maybeReverseList([commutator.A, commutator.B], dataDown.direction);
-    moveCount += element.addElem(this.traverseAlg(first, {
-      earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
-      twistyAlgViewer: dataDown.twistyAlgViewer,
-      direction: dataDown.direction
-    }));
+    const [first, second] = maybeReverseList(
+      [commutator.A, commutator.B],
+      dataDown.direction
+    );
+    moveCount += element.addElem(
+      this.traverseAlg(first, {
+        earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
+        twistyAlgViewer: dataDown.twistyAlgViewer,
+        direction: dataDown.direction
+      })
+    );
     element.addString(", ");
-    moveCount += element.addElem(this.traverseAlg(second, {
-      earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
-      twistyAlgViewer: dataDown.twistyAlgViewer,
-      direction: dataDown.direction
-    }));
+    moveCount += element.addElem(
+      this.traverseAlg(second, {
+        earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
+        twistyAlgViewer: dataDown.twistyAlgViewer,
+        direction: dataDown.direction
+      })
+    );
     element.flushQueue(dataDown.direction);
     element.addString("]");
     element.flushQueue();
@@ -4611,18 +4268,22 @@ var AlgToDOMTree = class extends TraversalDownUp {
     let moveCount = 0;
     const element = new TwistyAlgWrapperElem("twisty-alg-conjugate", conjugate);
     element.addString("[");
-    const aLen = element.addElem(this.traverseAlg(conjugate.A, {
-      earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
-      twistyAlgViewer: dataDown.twistyAlgViewer,
-      direction: dataDown.direction
-    }));
+    const aLen = element.addElem(
+      this.traverseAlg(conjugate.A, {
+        earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
+        twistyAlgViewer: dataDown.twistyAlgViewer,
+        direction: dataDown.direction
+      })
+    );
     moveCount += aLen;
     element.addString(": ");
-    moveCount += element.addElem(this.traverseAlg(conjugate.B, {
-      earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
-      twistyAlgViewer: dataDown.twistyAlgViewer,
-      direction: dataDown.direction
-    }));
+    moveCount += element.addElem(
+      this.traverseAlg(conjugate.B, {
+        earliestMoveIndex: dataDown.earliestMoveIndex + moveCount,
+        twistyAlgViewer: dataDown.twistyAlgViewer,
+        direction: dataDown.direction
+      })
+    );
     element.addString("]");
     element.flushQueue();
     return {
@@ -4636,7 +4297,14 @@ var AlgToDOMTree = class extends TraversalDownUp {
     }
     return {
       moveCount: 1,
-      element: new TwistyAlgLeafElem("twisty-alg-pause", ".", dataDown, pause, true, true)
+      element: new TwistyAlgLeafElem(
+        "twisty-alg-pause",
+        ".",
+        dataDown,
+        pause,
+        true,
+        true
+      )
     };
   }
   traverseNewline(newline, _dataDown) {
@@ -4650,12 +4318,21 @@ var AlgToDOMTree = class extends TraversalDownUp {
   traverseLineComment(lineComment, dataDown) {
     return {
       moveCount: 0,
-      element: new TwistyAlgLeafElem("twisty-alg-line-comment", `//${lineComment.text}`, dataDown, lineComment, false, false)
+      element: new TwistyAlgLeafElem(
+        "twisty-alg-line-comment",
+        `//${lineComment.text}`,
+        dataDown,
+        lineComment,
+        false,
+        false
+      )
     };
   }
 };
 var algToDOMTreeInstance = new AlgToDOMTree();
-var algToDOMTree = algToDOMTreeInstance.traverseAlg.bind(algToDOMTreeInstance);
+var algToDOMTree = algToDOMTreeInstance.traverseAlg.bind(
+  algToDOMTreeInstance
+);
 var MoveHighlighter = class {
   constructor() {
     this.moveCharIndexMap = /* @__PURE__ */ new Map();
@@ -4676,38 +4353,75 @@ var MoveHighlighter = class {
     this.currentElem = newElem;
   }
 };
-var _domTree, _twistyPlayer, _setTwistyPlayer, setTwistyPlayer_fn;
 var TwistyAlgViewer = class extends HTMLElementShim {
   constructor(options) {
     super();
-    __privateAdd(this, _setTwistyPlayer);
     this.highlighter = new MoveHighlighter();
-    __privateAdd(this, _domTree, void 0);
-    __privateAdd(this, _twistyPlayer, null);
+    this.#twistyPlayer = null;
     this.lastClickTimestamp = null;
     if (options?.twistyPlayer) {
       this.twistyPlayer = options?.twistyPlayer;
     }
   }
+  #domTree;
+  #twistyPlayer;
   connectedCallback() {
   }
   setAlg(alg) {
-    __privateSet(this, _domTree, algToDOMTree(alg, {
+    this.#domTree = algToDOMTree(alg, {
       earliestMoveIndex: 0,
       twistyAlgViewer: this,
       direction: 1 /* Forwards */
-    }).element);
+    }).element;
     this.textContent = "";
-    this.appendChild(__privateGet(this, _domTree));
+    this.appendChild(this.#domTree);
   }
   get twistyPlayer() {
-    return __privateGet(this, _twistyPlayer);
+    return this.#twistyPlayer;
   }
   set twistyPlayer(twistyPlayer) {
-    __privateMethod(this, _setTwistyPlayer, setTwistyPlayer_fn).call(this, twistyPlayer);
+    this.#setTwistyPlayer(twistyPlayer);
+  }
+  async #setTwistyPlayer(twistyPlayer) {
+    if (this.#twistyPlayer) {
+      console.warn("twisty-player reassignment is not supported");
+      return;
+    }
+    if (twistyPlayer === null) {
+      throw new Error("clearing twistyPlayer is not supported");
+    }
+    this.#twistyPlayer = twistyPlayer;
+    this.#twistyPlayer.experimentalModel.alg.addFreshListener(
+      (algWithIssues) => {
+        this.setAlg(algWithIssues.alg);
+      }
+    );
+    const sourceAlg = (await this.#twistyPlayer.experimentalModel.alg.get()).alg;
+    const parsedAlg = "startCharIndex" in sourceAlg ? sourceAlg : Alg.fromString(sourceAlg.toString());
+    this.setAlg(parsedAlg);
+    twistyPlayer.experimentalModel.currentMoveInfo.addFreshListener(
+      (currentMoveInfo) => {
+        let moveInfo = currentMoveInfo.currentMoves[0];
+        moveInfo ?? (moveInfo = currentMoveInfo.movesStarting[0]);
+        moveInfo ?? (moveInfo = currentMoveInfo.movesFinishing[0]);
+        if (!moveInfo) {
+          this.highlighter.set(null);
+        } else {
+          const mainCurrentMove = moveInfo.move;
+          this.highlighter.set(mainCurrentMove);
+        }
+      }
+    );
+    twistyPlayer.experimentalModel.detailedTimelineInfo.addFreshListener(
+      (detailedTimelineInfo) => {
+        if (detailedTimelineInfo.timestamp !== this.lastClickTimestamp) {
+          this.lastClickTimestamp = null;
+        }
+      }
+    );
   }
   async jumpToIndex(index, offsetIntoMove) {
-    const twistyPlayer = __privateGet(this, _twistyPlayer);
+    const twistyPlayer = this.#twistyPlayer;
     if (twistyPlayer) {
       twistyPlayer.pause();
       const timestampPromise = (async () => {
@@ -4715,7 +4429,9 @@ var TwistyAlgViewer = class extends HTMLElementShim {
         const offset = offsetIntoMove ? DEFAULT_OFFSET_MS : 0;
         return (indexer.indexToMoveStartTimestamp(index) ?? -offset) + offset;
       })();
-      twistyPlayer.experimentalModel.timestampRequest.set(await timestampPromise);
+      twistyPlayer.experimentalModel.timestampRequest.set(
+        await timestampPromise
+      );
       if (this.lastClickTimestamp === await timestampPromise) {
         twistyPlayer.play();
         this.lastClickTimestamp = null;
@@ -4743,41 +4459,6 @@ var TwistyAlgViewer = class extends HTMLElementShim {
     return ["for"];
   }
 };
-_domTree = new WeakMap();
-_twistyPlayer = new WeakMap();
-_setTwistyPlayer = new WeakSet();
-setTwistyPlayer_fn = async function(twistyPlayer) {
-  if (__privateGet(this, _twistyPlayer)) {
-    console.warn("twisty-player reassignment is not supported");
-    return;
-  }
-  if (twistyPlayer === null) {
-    throw new Error("clearing twistyPlayer is not supported");
-  }
-  __privateSet(this, _twistyPlayer, twistyPlayer);
-  __privateGet(this, _twistyPlayer).experimentalModel.alg.addFreshListener((algWithIssues) => {
-    this.setAlg(algWithIssues.alg);
-  });
-  const sourceAlg = (await __privateGet(this, _twistyPlayer).experimentalModel.alg.get()).alg;
-  const parsedAlg = "startCharIndex" in sourceAlg ? sourceAlg : Alg.fromString(sourceAlg.toString());
-  this.setAlg(parsedAlg);
-  twistyPlayer.experimentalModel.currentMoveInfo.addFreshListener((currentMoveInfo) => {
-    let moveInfo = currentMoveInfo.currentMoves[0];
-    moveInfo ?? (moveInfo = currentMoveInfo.movesStarting[0]);
-    moveInfo ?? (moveInfo = currentMoveInfo.movesFinishing[0]);
-    if (!moveInfo) {
-      this.highlighter.set(null);
-    } else {
-      const mainCurrentMove = moveInfo.move;
-      this.highlighter.set(mainCurrentMove);
-    }
-  });
-  twistyPlayer.experimentalModel.detailedTimelineInfo.addFreshListener((detailedTimelineInfo) => {
-    if (detailedTimelineInfo.timestamp !== this.lastClickTimestamp) {
-      this.lastClickTimestamp = null;
-    }
-  });
-};
 customElementsShim.define("twisty-alg-viewer", TwistyAlgViewer);
 
 // src/cubing/twisty/views/TwistyAlgEditor/LeafTokens.ts
@@ -4850,7 +4531,9 @@ var LeafTokens = class extends TraversalDownUp {
   }
 };
 var leafTokensInstance = new LeafTokens();
-var leafTokens = leafTokensInstance.traverseAlg.bind(leafTokensInstance);
+var leafTokens = leafTokensInstance.traverseAlg.bind(
+  leafTokensInstance
+);
 
 // src/cubing/twisty/views/TwistyAlgEditor/model.ts
 var TwistyAlgEditorValueProp = class extends SimpleTwistyPropSource {
@@ -5024,84 +4707,101 @@ textarea {
 var ATTRIBUTE_FOR_TWISTY_PLAYER = "for-twisty-player";
 var ATTRIBUTE_PLACEHOLDER = "placeholder";
 var ATTRIBUTE_TWISTY_PLAYER_PROP = "twisty-player-prop";
-var _textarea, _carbonCopy, _carbonCopyPrefix, _carbonCopyHighlight, _carbonCopySuffix, _textareaClassListValidForPuzzleManager, _twistyPlayer2, _twistyPlayerProp, _algProp, algProp_get, _onInputHasFired, _padSuffix, padSuffix_fn, _highlightedLeaf;
 var TwistyAlgEditor = class extends ManagedCustomElement {
   constructor(options) {
     super();
-    __privateAdd(this, _algProp);
-    __privateAdd(this, _padSuffix);
     this.model = new TwistyAlgEditorModel();
-    __privateAdd(this, _textarea, document.createElement("textarea"));
-    __privateAdd(this, _carbonCopy, document.createElement("div"));
-    __privateAdd(this, _carbonCopyPrefix, document.createElement("span"));
-    __privateAdd(this, _carbonCopyHighlight, document.createElement("span"));
-    __privateAdd(this, _carbonCopySuffix, document.createElement("span"));
-    __privateAdd(this, _textareaClassListValidForPuzzleManager, new ClassListManager(this, "valid-for-puzzle-", [
+    this.#textarea = document.createElement("textarea");
+    this.#carbonCopy = document.createElement("div");
+    this.#carbonCopyPrefix = document.createElement("span");
+    this.#carbonCopyHighlight = document.createElement("span");
+    this.#carbonCopySuffix = document.createElement("span");
+    this.#textareaClassListValidForPuzzleManager = new ClassListManager(this, "valid-for-puzzle-", [
       "none",
       "warning",
       "error"
-    ]));
-    __privateAdd(this, _twistyPlayer2, null);
-    __privateAdd(this, _twistyPlayerProp, void 0);
+    ]);
+    this.#twistyPlayer = null;
     this.debugNeverRequestTimestamp = false;
-    __privateAdd(this, _onInputHasFired, false);
-    __privateAdd(this, _highlightedLeaf, null);
-    __privateGet(this, _carbonCopy).classList.add("carbon-copy");
-    this.addElement(__privateGet(this, _carbonCopy));
-    __privateGet(this, _textarea).rows = 1;
-    this.addElement(__privateGet(this, _textarea));
-    __privateGet(this, _carbonCopyPrefix).classList.add("prefix");
-    __privateGet(this, _carbonCopy).appendChild(__privateGet(this, _carbonCopyPrefix));
-    __privateGet(this, _carbonCopyHighlight).classList.add("highlight");
-    __privateGet(this, _carbonCopy).appendChild(__privateGet(this, _carbonCopyHighlight));
-    __privateGet(this, _carbonCopySuffix).classList.add("suffix");
-    __privateGet(this, _carbonCopy).appendChild(__privateGet(this, _carbonCopySuffix));
-    __privateGet(this, _textarea).placeholder = "Alg";
-    __privateGet(this, _textarea).setAttribute("spellcheck", "false");
+    this.#onInputHasFired = false;
+    this.#highlightedLeaf = null;
+    this.#carbonCopy.classList.add("carbon-copy");
+    this.addElement(this.#carbonCopy);
+    this.#textarea.rows = 1;
+    this.addElement(this.#textarea);
+    this.#carbonCopyPrefix.classList.add("prefix");
+    this.#carbonCopy.appendChild(this.#carbonCopyPrefix);
+    this.#carbonCopyHighlight.classList.add("highlight");
+    this.#carbonCopy.appendChild(this.#carbonCopyHighlight);
+    this.#carbonCopySuffix.classList.add("suffix");
+    this.#carbonCopy.appendChild(this.#carbonCopySuffix);
+    this.#textarea.placeholder = "Alg";
+    this.#textarea.setAttribute("spellcheck", "false");
     this.addCSS(twistyAlgEditorCSS);
-    __privateGet(this, _textarea).addEventListener("input", () => {
-      __privateSet(this, _onInputHasFired, true);
+    this.#textarea.addEventListener("input", () => {
+      this.#onInputHasFired = true;
       this.onInput();
     });
-    __privateGet(this, _textarea).addEventListener("blur", () => this.onBlur());
-    document.addEventListener("selectionchange", () => this.onSelectionChange());
+    this.#textarea.addEventListener("blur", () => this.onBlur());
+    document.addEventListener(
+      "selectionchange",
+      () => this.onSelectionChange()
+    );
     if (options?.twistyPlayer) {
       this.twistyPlayer = options.twistyPlayer;
     }
-    __privateSet(this, _twistyPlayerProp, options?.twistyPlayerProp ?? "alg");
+    this.#twistyPlayerProp = options?.twistyPlayerProp ?? "alg";
     if (options?.twistyPlayerProp === "alg") {
-      this.model.leafToHighlight.addFreshListener((highlightInfo) => {
-        if (highlightInfo) {
-          this.highlightLeaf(highlightInfo.leafInfo.leaf);
+      this.model.leafToHighlight.addFreshListener(
+        (highlightInfo) => {
+          if (highlightInfo) {
+            this.highlightLeaf(highlightInfo.leafInfo.leaf);
+          }
         }
-      });
+      );
+    }
+  }
+  #textarea;
+  #carbonCopy;
+  #carbonCopyPrefix;
+  #carbonCopyHighlight;
+  #carbonCopySuffix;
+  #textareaClassListValidForPuzzleManager;
+  #twistyPlayer;
+  #twistyPlayerProp;
+  get #algProp() {
+    if (this.#twistyPlayer === null) {
+      return null;
+    } else {
+      return this.#twistyPlayer.experimentalModel[this.#twistyPlayerProp];
     }
   }
   set algString(s) {
-    __privateGet(this, _textarea).value = s;
+    this.#textarea.value = s;
     this.onInput();
   }
   get algString() {
-    return __privateGet(this, _textarea).value;
+    return this.#textarea.value;
   }
   set placeholder(placeholderText) {
-    __privateGet(this, _textarea).placeholder = placeholderText;
+    this.#textarea.placeholder = placeholderText;
   }
+  #onInputHasFired;
   onInput() {
-    __privateGet(this, _carbonCopyHighlight).hidden = true;
+    this.#carbonCopyHighlight.hidden = true;
     this.highlightLeaf(null);
-    const endTrimmed = __privateGet(this, _textarea).value.trimEnd();
+    const endTrimmed = this.#textarea.value.trimEnd();
     this.model.valueProp.set(endTrimmed);
-    __privateGet(this, _algProp, algProp_get)?.set(endTrimmed);
+    this.#algProp?.set(endTrimmed);
   }
   async onSelectionChange() {
-    if (document.activeElement !== this || this.shadow.activeElement !== __privateGet(this, _textarea)) {
+    if (document.activeElement !== this || this.shadow.activeElement !== this.#textarea) {
       return;
     }
-    if (__privateGet(this, _twistyPlayerProp) !== "alg") {
+    if (this.#twistyPlayerProp !== "alg") {
       return;
     }
-    const { selectionStart, selectionEnd } = __privateGet(this, _textarea);
+    const { selectionStart, selectionEnd } = this.#textarea;
     this.model.selectionProp.set({
       selectionStart,
       selectionEnd
@@ -5110,96 +4810,120 @@ var TwistyAlgEditor = class extends ManagedCustomElement {
   async onBlur() {
   }
   setAlgIssueClassForPuzzle(issues) {
-    __privateGet(this, _textareaClassListValidForPuzzleManager).setValue(issues);
+    this.#textareaClassListValidForPuzzleManager.setValue(issues);
   }
+  #padSuffix(s) {
+    return s.endsWith("\n") ? s + " " : s;
+  }
+  #highlightedLeaf;
   highlightLeaf(leaf) {
-    if (__privateGet(this, _twistyPlayerProp) !== "alg") {
+    if (this.#twistyPlayerProp !== "alg") {
       return;
     }
     if (leaf === null) {
-      __privateGet(this, _carbonCopyPrefix).textContent = "";
-      __privateGet(this, _carbonCopyHighlight).textContent = "";
-      __privateGet(this, _carbonCopySuffix).textContent = __privateMethod(this, _padSuffix, padSuffix_fn).call(this, __privateGet(this, _textarea).value);
+      this.#carbonCopyPrefix.textContent = "";
+      this.#carbonCopyHighlight.textContent = "";
+      this.#carbonCopySuffix.textContent = this.#padSuffix(
+        this.#textarea.value
+      );
       return;
     }
-    if (leaf === __privateGet(this, _highlightedLeaf)) {
+    if (leaf === this.#highlightedLeaf) {
       return;
     }
-    __privateSet(this, _highlightedLeaf, leaf);
-    __privateGet(this, _carbonCopyPrefix).textContent = __privateGet(this, _textarea).value.slice(0, leaf.startCharIndex);
-    __privateGet(this, _carbonCopyHighlight).textContent = __privateGet(this, _textarea).value.slice(leaf.startCharIndex, leaf.endCharIndex);
-    __privateGet(this, _carbonCopySuffix).textContent = __privateMethod(this, _padSuffix, padSuffix_fn).call(this, __privateGet(this, _textarea).value.slice(leaf.endCharIndex));
-    __privateGet(this, _carbonCopyHighlight).hidden = false;
+    this.#highlightedLeaf = leaf;
+    this.#carbonCopyPrefix.textContent = this.#textarea.value.slice(
+      0,
+      leaf.startCharIndex
+    );
+    this.#carbonCopyHighlight.textContent = this.#textarea.value.slice(
+      leaf.startCharIndex,
+      leaf.endCharIndex
+    );
+    this.#carbonCopySuffix.textContent = this.#padSuffix(
+      this.#textarea.value.slice(leaf.endCharIndex)
+    );
+    this.#carbonCopyHighlight.hidden = false;
   }
   get twistyPlayer() {
-    return __privateGet(this, _twistyPlayer2);
+    return this.#twistyPlayer;
   }
   set twistyPlayer(twistyPlayer) {
-    if (__privateGet(this, _twistyPlayer2)) {
+    if (this.#twistyPlayer) {
       console.warn("twisty-player reassignment/clearing is not supported");
       return;
     }
-    __privateSet(this, _twistyPlayer2, twistyPlayer);
+    this.#twistyPlayer = twistyPlayer;
     if (!twistyPlayer) {
       return;
     }
     (async () => {
-      this.algString = __privateGet(this, _algProp, algProp_get) ? (await __privateGet(this, _algProp, algProp_get).get()).alg.toString() : "";
+      this.algString = this.#algProp ? (await this.#algProp.get()).alg.toString() : "";
     })();
-    if (__privateGet(this, _twistyPlayerProp) === "alg") {
-      __privateGet(this, _twistyPlayer2)?.experimentalModel.puzzleAlg.addFreshListener((algWithIssues) => {
-        if (algWithIssues.issues.errors.length === 0) {
-          this.setAlgIssueClassForPuzzle(algWithIssues.issues.warnings.length === 0 ? "none" : "warning");
-          const newAlg = algWithIssues.alg;
-          const oldAlg = Alg.fromString(this.algString);
-          if (!newAlg.isIdentical(oldAlg)) {
-            this.algString = newAlg.toString();
-            this.onInput();
+    if (this.#twistyPlayerProp === "alg") {
+      this.#twistyPlayer?.experimentalModel.puzzleAlg.addFreshListener(
+        (algWithIssues) => {
+          if (algWithIssues.issues.errors.length === 0) {
+            this.setAlgIssueClassForPuzzle(
+              algWithIssues.issues.warnings.length === 0 ? "none" : "warning"
+            );
+            const newAlg = algWithIssues.alg;
+            const oldAlg = Alg.fromString(this.algString);
+            if (!newAlg.isIdentical(oldAlg)) {
+              this.algString = newAlg.toString();
+              this.onInput();
+            } else {
+            }
           } else {
+            this.setAlgIssueClassForPuzzle("error");
           }
-        } else {
-          this.setAlgIssueClassForPuzzle("error");
-        }
-      });
-      this.model.leafToHighlight.addFreshListener(async (highlightInfo) => {
-        if (highlightInfo === null) {
-          return;
         }
-        const [indexer, timestampRequest] = await Promise.all([
-          await twistyPlayer.experimentalModel.indexer.get(),
-          await twistyPlayer.experimentalModel.timestampRequest.get()
-        ]);
-        if (timestampRequest === "opposite-anchor" && !__privateGet(this, _onInputHasFired)) {
-          return;
-        }
-        const moveStartTimestamp = indexer.indexToMoveStartTimestamp(highlightInfo.leafInfo.idx);
-        const duration = indexer.moveDuration(highlightInfo.leafInfo.idx);
-        let newTimestamp;
-        switch (highlightInfo.where) {
-          case "before":
-            newTimestamp = moveStartTimestamp;
-            break;
-          case "start":
-          case "inside":
-            newTimestamp = moveStartTimestamp + duration / 4;
-            break;
-          case "end":
-          case "after":
-            newTimestamp = moveStartTimestamp + duration;
-            break;
-          default:
-            console.log("invalid where");
-            throw new Error("Invalid where!");
+      );
+      this.model.leafToHighlight.addFreshListener(
+        async (highlightInfo) => {
+          if (highlightInfo === null) {
+            return;
+          }
+          const [indexer, timestampRequest] = await Promise.all([
+            await twistyPlayer.experimentalModel.indexer.get(),
+            await twistyPlayer.experimentalModel.timestampRequest.get()
+          ]);
+          if (timestampRequest === "opposite-anchor" && !this.#onInputHasFired) {
+            return;
+          }
+          const moveStartTimestamp = indexer.indexToMoveStartTimestamp(
+            highlightInfo.leafInfo.idx
+          );
+          const duration = indexer.moveDuration(highlightInfo.leafInfo.idx);
+          let newTimestamp;
+          switch (highlightInfo.where) {
+            case "before":
+              newTimestamp = moveStartTimestamp;
+              break;
+            case "start":
+            case "inside":
+              newTimestamp = moveStartTimestamp + duration / 4;
+              break;
+            case "end":
+            case "after":
+              newTimestamp = moveStartTimestamp + duration;
+              break;
+            default:
+              console.log("invalid where");
+              throw new Error("Invalid where!");
+          }
+          if (!this.debugNeverRequestTimestamp) {
+            twistyPlayer.experimentalModel.timestampRequest.set(newTimestamp);
+          }
         }
-        if (!this.debugNeverRequestTimestamp) {
-          twistyPlayer.experimentalModel.timestampRequest.set(newTimestamp);
+      );
+      twistyPlayer.experimentalModel.currentLeavesSimplified.addFreshListener(
+        async (currentLeavesSimplified) => {
+          const indexer = await twistyPlayer.experimentalModel.indexer.get();
+          const leaf = indexer.getAnimLeaf(currentLeavesSimplified.stateIndex);
+          this.highlightLeaf(leaf);
         }
-      });
-      twistyPlayer.experimentalModel.currentLeavesSimplified.addFreshListener(async (currentLeavesSimplified) => {
-        const indexer = await twistyPlayer.experimentalModel.indexer.get();
-        const leaf = indexer.getAnimLeaf(currentLeavesSimplified.stateIndex);
-        this.highlightLeaf(leaf);
-      });
+      );
     }
   }
   attributeChangedCallback(attributeName, _oldValue, newValue) {
@@ -5221,11 +4945,11 @@ var TwistyAlgEditor = class extends ManagedCustomElement {
         this.placeholder = newValue;
         return;
       case ATTRIBUTE_TWISTY_PLAYER_PROP:
-        if (__privateGet(this, _twistyPlayer2)) {
+        if (this.#twistyPlayer) {
           console.log("cannot set prop");
           throw new Error("cannot set prop after twisty player");
         }
-        __privateSet(this, _twistyPlayerProp, newValue);
+        this.#twistyPlayerProp = newValue;
         return;
     }
   }
@@ -5237,28 +4961,6 @@ var TwistyAlgEditor = class extends ManagedCustomElement {
     ];
   }
 };
-_textarea = new WeakMap();
-_carbonCopy = new WeakMap();
-_carbonCopyPrefix = new WeakMap();
-_carbonCopyHighlight = new WeakMap();
-_carbonCopySuffix = new WeakMap();
-_textareaClassListValidForPuzzleManager = new WeakMap();
-_twistyPlayer2 = new WeakMap();
-_twistyPlayerProp = new WeakMap();
-_algProp = new WeakSet();
-algProp_get = function() {
-  if (__privateGet(this, _twistyPlayer2) === null) {
-    return null;
-  } else {
-    return __privateGet(this, _twistyPlayer2).experimentalModel[__privateGet(this, _twistyPlayerProp)];
-  }
-};
-_onInputHasFired = new WeakMap();
-_padSuffix = new WeakSet();
-padSuffix_fn = function(s) {
-  return s.endsWith("\n") ? s + " " : s;
-};
-_highlightedLeaf = new WeakMap();
 customElementsShim.define("twisty-alg-editor", TwistyAlgEditor);
 
 // src/cubing/twisty/views/twizzle/TwizzleLink.css.ts
@@ -5298,62 +5000,6 @@ twisty-player + .heading {
 `);
 
 // src/cubing/twisty/views/twizzle/url-params.ts
-function updateURL(url) {
-  window.history.replaceState("", "", url.toString());
-}
-var _prefix;
-var URLParamUpdater = class {
-  constructor(model, options) {
-    __privateAdd(this, _prefix, void 0);
-    __privateSet(this, _prefix, options?.prefix ?? "");
-    this.listenToAlgProp(model.alg, "alg");
-    this.listenToAlgProp(model.setupAlg, "setup-alg");
-    this.listenToStringSourceProp(model.twistySceneModel.stickering, "stickering");
-    this.listenToStringSourceProp(model.setupAnchor, "setup-anchor");
-    this.listenToStringOrNullProp(model.title, "title");
-    this.listenToStringOrNoValueProp(model.puzzleIDRequest, "puzzle", NO_VALUE);
-    this.listenToStringOrNoValueProp(model.puzzleDescriptionRequest, "puzzle-description", NO_VALUE);
-  }
-  setURLParam(unprefixedKey, value, defaultString) {
-    const prefixedKey = __privateGet(this, _prefix) + unprefixedKey;
-    const url = new URL(location.href);
-    if (value === defaultString) {
-      url.searchParams.delete(prefixedKey);
-    } else {
-      url.searchParams.set(prefixedKey, value);
-    }
-    updateURL(url);
-  }
-  async listenToStringSourceProp(prop, key, defaultString) {
-    const actualDefaultString = defaultString ?? await prop.getDefaultValue();
-    prop.addFreshListener((s) => {
-      this.setURLParam(key, s, actualDefaultString);
-    });
-  }
-  async listenToStringOrNullProp(prop, key, defaultString = "") {
-    prop.addFreshListener((s) => {
-      this.setURLParam(key, s ?? defaultString, defaultString);
-    });
-  }
-  async listenToStringOrNoValueProp(prop, key, defaultString) {
-    prop.addFreshListener((s) => {
-      if (s === NO_VALUE) {
-        s = defaultString;
-      }
-      if (s === NO_VALUE) {
-        this.setURLParam(key, "", "");
-      } else {
-        this.setURLParam(key, s, "");
-      }
-    });
-  }
-  listenToAlgProp(prop, key) {
-    prop.addFreshListener((algWithIssues) => {
-      this.setURLParam(key, algWithIssues.alg.toString(), "");
-    });
-  }
-};
-_prefix = new WeakMap();
 function getConfigFromURL(prefix = "", url = location.href) {
   const paramMapping = {
     "alg": "alg",
@@ -5379,28 +5025,29 @@ function getConfigFromURL(prefix = "", url = location.href) {
 }
 
 // src/cubing/twisty/views/twizzle/TwizzleLink.ts
-var _cssElem;
 var TwizzleLink = class extends ManagedCustomElement {
   constructor() {
     super({ mode: "open" });
     this.twistyPlayer = null;
     this.a = null;
-    __privateAdd(this, _cssElem, void 0);
   }
   fallback() {
     this.contentWrapper.textContent = "";
     if (this.a) {
-      const span = this.contentWrapper.appendChild(document.createElement("span"));
+      const span = this.contentWrapper.appendChild(
+        document.createElement("span")
+      );
       span.textContent = "\u2757\uFE0F";
       span.title = "Could not show a player for link";
       this.addElement(this.a);
     }
-    if (__privateGet(this, _cssElem)) {
-      __privateGet(this, _cssElem).remove();
+    if (this.#cssElem) {
+      this.#cssElem.remove();
     }
   }
+  #cssElem;
   async connectedCallback() {
-    __privateSet(this, _cssElem, this.addCSS(twizzleLinkCSS));
+    this.#cssElem = this.addCSS(twizzleLinkCSS);
     this.a = this.querySelector("a");
     if (!this.a) {
       return;
@@ -5419,10 +5066,12 @@ var TwizzleLink = class extends ManagedCustomElement {
         delete config.puzzle;
         config.experimentalPuzzleDescription = puzzleDescription;
       }
-      this.twistyPlayer = this.addElement(new TwistyPlayer({
-        ...config,
-        viewerLink: isExplorer ? "experimental-twizzle-explorer" : "auto"
-      }));
+      this.twistyPlayer = this.addElement(
+        new TwistyPlayer({
+          ...config,
+          viewerLink: isExplorer ? "experimental-twizzle-explorer" : "auto"
+        })
+      );
       if (config.experimentalTitle) {
         this.addHeading(config.experimentalTitle).classList.add("title");
       }
@@ -5430,10 +5079,14 @@ var TwizzleLink = class extends ManagedCustomElement {
         this.addHeading("Setup");
         const setupAlgDiv = this.addElement(document.createElement("div"));
         setupAlgDiv.classList.add("setup-alg");
-        setupAlgDiv.textContent = new Alg(config.experimentalSetupAlg).toString();
+        setupAlgDiv.textContent = new Alg(
+          config.experimentalSetupAlg
+        ).toString();
       }
       this.addHeading("Moves");
-      const twistyAlgViewer = this.addElement(new TwistyAlgViewer({ twistyPlayer: this.twistyPlayer }));
+      const twistyAlgViewer = this.addElement(
+        new TwistyAlgViewer({ twistyPlayer: this.twistyPlayer })
+      );
       twistyAlgViewer.part.add("twisty-alg-viewer");
     } else {
       this.fallback();
@@ -5446,7 +5099,6 @@ var TwizzleLink = class extends ManagedCustomElement {
     return headingDiv;
   }
 };
-_cssElem = new WeakMap();
 customElementsShim.define("twizzle-link", TwizzleLink);
 export {
   NO_VALUE as EXPERIMENTAL_PROP_NO_VALUE,
@@ -5458,7 +5110,6 @@ export {
   TwistyPlayer,
   TwizzleLink,
   backViewLayouts,
-  debugShowRenderStats as experimentalDebugShowRenderStats,
-  experimentalForceNewRendererSharing
+  setTwistyDebug
 };
 //# sourceMappingURL=index.js.map