cubing 0.20.0 → 0.21.0-pre10

package/dist/esm/chunk-EM5F24AO.js

@@ -0,0 +1,2511 @@
+import {
+  getFaceletAppearance,
+  puzzles
+} from "./chunk-BGFVB2OS.js";
+import {
+  areTransformationsEquivalent,
+  transformationForQuantumMove
+} from "./chunk-YV3RT5PX.js";
+import {
+  Alg
+} from "./chunk-BU5PUJK3.js";
+import {
+  __privateAdd,
+  __privateGet,
+  __privateMethod,
+  __privateSet
+} from "./chunk-WO2AXYFE.js";
+
+// src/cubing/twisty/views/3D/puzzles/Cube3D.ts
+import {
+  BackSide,
+  BoxGeometry,
+  BufferAttribute,
+  BufferGeometry,
+  DoubleSide,
+  Euler,
+  Group,
+  Matrix4,
+  Mesh,
+  MeshBasicMaterial,
+  Object3D,
+  Quaternion,
+  TextureLoader,
+  Vector2,
+  Vector3 as Vector32
+} from "three";
+
+// src/cubing/twisty/old/animation/easing.ts
+function smootherStep(x) {
+  return x * x * x * (10 - x * (15 - 6 * x));
+}
+
+// src/cubing/twisty/old/dom/TwistyPlayerConfig.ts
+import { Vector3 } from "three";
+
+// src/cubing/twisty/views/3D/TAU.ts
+var TAU = Math.PI * 2;
+var DEGREES_PER_RADIAN = 360 / TAU;
+
+// src/cubing/twisty/old/dom/element/ElementConfig.ts
+var AlgAttribute = class {
+  constructor(initialValue) {
+    if (initialValue) {
+      if (typeof initialValue === "string") {
+        this.setString(initialValue);
+      } else {
+        this.setValue(initialValue);
+      }
+    } else {
+      this.setValue(this.defaultValue());
+    }
+  }
+  setString(str) {
+    if (this.string === str) {
+      return false;
+    }
+    this.string = str;
+    this.value = this.toValue(str);
+    return true;
+  }
+  setValue(val) {
+    const str = this.toString(val);
+    if (this.string === str) {
+      return false;
+    }
+    this.string = str;
+    this.value = val;
+    return true;
+  }
+  defaultValue() {
+    return new Alg([]);
+  }
+  toValue(s) {
+    return Alg.fromString(s);
+  }
+  toString(val) {
+    return val.toString();
+  }
+};
+var StringEnumAttribute = class {
+  constructor(enumVal, initialValue) {
+    this.enumVal = enumVal;
+    this.setString(initialValue ?? this.defaultValue());
+  }
+  setString(str) {
+    if (this.string === str) {
+      return false;
+    }
+    if (!(str in this.enumVal)) {
+      throw new Error(`Invalid string for attribute!: ${str}`);
+    }
+    this.string = str;
+    this.value = this.toValue(str);
+    return true;
+  }
+  setValue(val) {
+    return this.setString(val);
+  }
+  defaultValue() {
+    return Object.keys(this.enumVal)[0];
+  }
+  toValue(s) {
+    return s;
+  }
+};
+var _defaultValue, _clampValue, clampValue_fn;
+var RangedFloatAttribute = class {
+  constructor(defaultValue, minValue, maxValue, initialValue) {
+    this.minValue = minValue;
+    this.maxValue = maxValue;
+    __privateAdd(this, _clampValue);
+    __privateAdd(this, _defaultValue, void 0);
+    __privateSet(this, _defaultValue, defaultValue === null ? null : __privateMethod(this, _clampValue, clampValue_fn).call(this, defaultValue));
+    this.setValue(initialValue ?? this.defaultValue());
+  }
+  setString(str) {
+    return this.setValue(str === "" ? null : this.toValue(str));
+  }
+  setValue(val) {
+    const str = this.toString(val);
+    if (this.string === str) {
+      return false;
+    }
+    this.string = str;
+    this.value = val;
+    return true;
+  }
+  defaultValue() {
+    return __privateGet(this, _defaultValue);
+  }
+  toValue(s) {
+    return parseFloat(s);
+  }
+  toString(v) {
+    return v === null ? "" : v.toString();
+  }
+};
+_defaultValue = new WeakMap();
+_clampValue = new WeakSet();
+clampValue_fn = function(val) {
+  return Math.max(Math.min(val, this.maxValue), this.minValue);
+};
+
+// src/cubing/twisty/old/dom/element/ClassListManager.ts
+var _currentClassName;
+var ClassListManager = class {
+  constructor(elem, prefix, validSuffixes) {
+    this.elem = elem;
+    this.prefix = prefix;
+    this.validSuffixes = validSuffixes;
+    __privateAdd(this, _currentClassName, null);
+  }
+  clearValue() {
+    if (__privateGet(this, _currentClassName)) {
+      this.elem.contentWrapper.classList.remove(__privateGet(this, _currentClassName));
+    }
+    __privateSet(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;
+    if (changed) {
+      this.clearValue();
+      this.elem.contentWrapper.classList.add(newClassName);
+      __privateSet(this, _currentClassName, newClassName);
+    }
+    return changed;
+  }
+};
+_currentClassName = new WeakMap();
+
+// src/cubing/twisty/old/dom/element/node-custom-element-shims.ts
+var HTMLElementStub = class {
+};
+var HTMLElementShim;
+if (typeof HTMLElement !== "undefined") {
+  HTMLElementShim = HTMLElement;
+} else {
+  HTMLElementShim = HTMLElementStub;
+}
+var CustomElementsStub = class {
+  define() {
+  }
+};
+var customElementsShim;
+if (typeof customElements !== "undefined") {
+  customElementsShim = customElements;
+} else {
+  customElementsShim = new CustomElementsStub();
+}
+
+// src/cubing/twisty/old/dom/element/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, 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) {
+    if (__privateGet(this, _cssSourceMap).get(cssSource)) {
+      return;
+    }
+    const cssElem = document.createElement("style");
+    cssElem.textContent = cssSource.getAsString();
+    __privateGet(this, _cssSourceMap).set(cssSource, cssElem);
+    this.shadow.appendChild(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/old/dom/viewers/TwistyViewerWrapper.css.ts
+var twistyViewerWrapperCSS = new CSSSource(`
+:host {
+  width: 384px;
+  height: 256px;
+  display: grid;
+}
+
+.wrapper {
+  width: 100%;
+  height: 100%;
+  display: grid;
+  overflow: hidden;
+}
+
+.wrapper > * {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+.wrapper.back-view-side-by-side {
+  grid-template-columns: 1fr 1fr;
+}
+
+.wrapper.back-view-top-right {
+  grid-template-columns: 3fr 1fr;
+  grid-template-rows: 1fr 3fr;
+}
+
+.wrapper.back-view-top-right > :nth-child(1) {
+  grid-row: 1 / 3;
+  grid-column: 1 / 3;
+}
+
+.wrapper.back-view-top-right > :nth-child(2) {
+  grid-row: 1 / 2;
+  grid-column: 2 / 3;
+}
+`);
+
+// src/cubing/twisty/old/dom/viewers/TwistyViewerWrapper.ts
+var backViewLayouts = {
+  "none": true,
+  "side-by-side": true,
+  "top-right": true
+};
+var _backViewClassListManager;
+var TwistyViewerWrapper = class extends ManagedCustomElement {
+  constructor(config = {}) {
+    super();
+    __privateAdd(this, _backViewClassListManager, new ClassListManager(this, "back-view-", [
+      "none",
+      "side-by-side",
+      "top-right"
+    ]));
+    this.addCSS(twistyViewerWrapperCSS);
+    if (config.backView && config.backView in backViewLayouts) {
+      __privateGet(this, _backViewClassListManager).setValue(config.backView);
+    }
+  }
+  setBackView(backView) {
+    return __privateGet(this, _backViewClassListManager).setValue(backView);
+  }
+  clear() {
+    this.contentWrapper.innerHTML = "";
+  }
+};
+_backViewClassListManager = new WeakMap();
+customElementsShim.define("twisty-viewer-wrapper", TwistyViewerWrapper);
+
+// src/cubing/twisty/old/dom/TwistyPlayerConfig.ts
+var centeredCameraOrbitCoordinates = {
+  latitude: 31.717474411461005,
+  longitude: 0,
+  distance: 5.877852522924731
+};
+var cubeCube3DCameraOrbitCoordinates = {
+  latitude: 35,
+  longitude: 30,
+  distance: 6
+};
+var cubePG3DCameraOrbitCoordinates = {
+  latitude: 35,
+  longitude: 30,
+  distance: 6.25
+};
+var megaminxCameraOrbitCoordinates = {
+  latitude: Math.atan(1 / 2) * DEGREES_PER_RADIAN,
+  longitude: 0,
+  distance: 6.7
+};
+var pyraminxCameraOrbitCoordinates = {
+  latitude: 26.56505117707799,
+  longitude: 0,
+  distance: 6
+};
+var pyraminxLookAt = new Vector3(0, 1 / 6, 0);
+function defaultCameraOrbitCoordinates(puzzleID, strategy) {
+  if (puzzleID[1] === "x") {
+    if (strategy === "Cube3D") {
+      return cubeCube3DCameraOrbitCoordinates;
+    } else {
+      return cubePG3DCameraOrbitCoordinates;
+    }
+  } else {
+    switch (puzzleID) {
+      case "megaminx":
+      case "gigaminx":
+        return megaminxCameraOrbitCoordinates;
+      case "pyraminx":
+      case "master_tetraminx":
+        return pyraminxCameraOrbitCoordinates;
+      case "skewb":
+        return cubePG3DCameraOrbitCoordinates;
+      default:
+        return centeredCameraOrbitCoordinates;
+    }
+  }
+}
+var setupToLocations = {
+  start: true,
+  end: true
+};
+var visualizationFormats = {
+  "3D": true,
+  "2D": true,
+  "experimental-2D-LL": true,
+  "PG3D": true
+};
+var backgroundThemes = {
+  checkered: true,
+  none: true
+};
+var hintFaceletStyles = {
+  floating: true,
+  none: true
+};
+var experimentalStickerings = {
+  "full": true,
+  "centers-only": true,
+  "PLL": true,
+  "CLS": true,
+  "OLL": true,
+  "COLL": true,
+  "OCLL": true,
+  "CLL": true,
+  "ELL": true,
+  "ELS": true,
+  "LL": true,
+  "F2L": true,
+  "ZBLL": true,
+  "ZBLS": true,
+  "WVLS": true,
+  "VLS": true,
+  "LS": true,
+  "EO": true,
+  "CMLL": true,
+  "L6E": true,
+  "L6EO": true,
+  "Daisy": true,
+  "Cross": true,
+  "2x2x2": true,
+  "2x2x3": true,
+  "Void Cube": true,
+  "invisible": true,
+  "picture": true,
+  "experimental-centers-U": true,
+  "experimental-centers-U-D": true,
+  "experimental-centers-U-L-D": true,
+  "experimental-centers-U-L-B-D": true,
+  "experimental-centers": true,
+  "experimental-fto-fc": true,
+  "experimental-fto-f2t": true,
+  "experimental-fto-sc": true,
+  "experimental-fto-l2c": true,
+  "experimental-fto-lbt": true,
+  "experimental-global-custom-1": true,
+  "experimental-global-custom-2": true
+};
+var controlsLocations = {
+  "bottom-row": true,
+  "none": true
+};
+var puzzleIDs = {
+  "3x3x3": true,
+  "custom": true,
+  "2x2x2": true,
+  "4x4x4": true,
+  "5x5x5": true,
+  "6x6x6": true,
+  "7x7x7": true,
+  "40x40x40": true,
+  "megaminx": true,
+  "pyraminx": true,
+  "square1": true,
+  "clock": true,
+  "skewb": true,
+  "fto": true,
+  "gigaminx": true,
+  "master_tetraminx": true
+};
+var viewerLinkPages = {
+  twizzle: true,
+  none: true
+};
+var cameraLatitudeLimits = {
+  auto: true,
+  none: true
+};
+var twistyPlayerAttributeMap = {
+  "alg": "alg",
+  "experimental-setup-alg": "experimentalSetupAlg",
+  "experimental-setup-anchor": "experimentalSetupAnchor",
+  "puzzle": "puzzle",
+  "visualization": "visualization",
+  "hint-facelets": "hintFacelets",
+  "experimental-stickering": "experimentalStickering",
+  "background": "background",
+  "control-panel": "controlPanel",
+  "back-view": "backView",
+  "experimental-camera-latitude": "experimentalCameraLatitude",
+  "experimental-camera-longitude": "experimentalCameraLongitude",
+  "experimental-camera-latitude-limits": "experimentalCameraLatitudeLimits",
+  "viewer-link": "viewerLink"
+};
+var TwistyPlayerConfig = class {
+  constructor(twistyPlayer, initialValues) {
+    this.twistyPlayer = twistyPlayer;
+    this.attributes = {
+      "alg": new AlgAttribute(initialValues.alg),
+      "experimental-setup-alg": new AlgAttribute(initialValues.experimentalSetupAlg),
+      "experimental-setup-anchor": new StringEnumAttribute(setupToLocations, initialValues.experimentalSetupAnchor),
+      "puzzle": new StringEnumAttribute(puzzleIDs, initialValues.puzzle),
+      "visualization": new StringEnumAttribute(visualizationFormats, initialValues.visualization),
+      "hint-facelets": new StringEnumAttribute(hintFaceletStyles, initialValues.hintFacelets),
+      "experimental-stickering": new StringEnumAttribute(experimentalStickerings, initialValues.experimentalStickering),
+      "background": new StringEnumAttribute(backgroundThemes, initialValues.background),
+      "control-panel": new StringEnumAttribute(controlsLocations, initialValues.controlPanel),
+      "back-view": new StringEnumAttribute(backViewLayouts, initialValues["backView"]),
+      "experimental-camera-latitude": new RangedFloatAttribute(null, -90, 90, initialValues["experimentalCameraLatitude"]),
+      "experimental-camera-longitude": new RangedFloatAttribute(null, -180, 180, initialValues["experimentalCameraLongitude"]),
+      "experimental-camera-latitude-limits": new StringEnumAttribute(cameraLatitudeLimits, initialValues["experimentalCameraLatitudeLimits"]),
+      "viewer-link": new StringEnumAttribute(viewerLinkPages, initialValues.viewerLink)
+    };
+  }
+  static get observedAttributes() {
+    return Object.keys(twistyPlayerAttributeMap);
+  }
+  attributeChangedCallback(attributeName, oldValue, newValue) {
+    const managedAttribute = this.attributes[attributeName];
+    if (managedAttribute) {
+      if (oldValue !== null && managedAttribute.string !== oldValue) {
+        console.warn("Attribute out of sync!", attributeName, managedAttribute.string, oldValue);
+      }
+      managedAttribute.setString(newValue);
+      const propertyName = twistyPlayerAttributeMap[attributeName];
+      this.twistyPlayer[propertyName] = managedAttribute.value;
+    }
+  }
+};
+
+// src/cubing/twisty/views/3D/puzzles/Cube3D.ts
+var svgLoader = new TextureLoader();
+var ignoredMaterial = new MeshBasicMaterial({
+  color: 4473924,
+  side: DoubleSide
+});
+var ignoredMaterialHint = new MeshBasicMaterial({
+  color: 13421772,
+  side: BackSide,
+  transparent: true,
+  opacity: 0.75
+});
+var invisibleMaterial = new MeshBasicMaterial({
+  visible: false
+});
+var orientedMaterial = new MeshBasicMaterial({
+  color: 16746751
+});
+var orientedMaterialHint = new MeshBasicMaterial({
+  color: 16746751,
+  side: BackSide,
+  transparent: true,
+  opacity: 0.5
+});
+var AxisInfo = class {
+  constructor(vector, fromZ, color, dimColor, hintOpacityScale, options) {
+    this.vector = vector;
+    this.fromZ = fromZ;
+    this.color = color;
+    this.dimColor = dimColor;
+    this.hintOpacityScale = hintOpacityScale;
+    this.stickerMaterial = {
+      regular: new MeshBasicMaterial({
+        color,
+        side: DoubleSide
+      }),
+      dim: new MeshBasicMaterial({
+        color: dimColor,
+        side: DoubleSide
+      }),
+      oriented: orientedMaterial,
+      ignored: ignoredMaterial,
+      invisible: invisibleMaterial
+    };
+    this.hintStickerMaterial = {
+      regular: new MeshBasicMaterial({
+        color: options?.hintColor ?? color,
+        side: BackSide,
+        transparent: true,
+        opacity: 0.5 * hintOpacityScale
+      }),
+      dim: new MeshBasicMaterial({
+        color: options?.hintDimColor ?? color,
+        side: BackSide,
+        transparent: true,
+        opacity: 0.5 * hintOpacityScale
+      }),
+      oriented: orientedMaterialHint,
+      ignored: ignoredMaterialHint,
+      invisible: invisibleMaterial
+    };
+  }
+};
+var axesInfo = [
+  new AxisInfo(new Vector32(0, 1, 0), new Euler(-TAU / 4, 0, 0), 16777215, 14540253, 1.25),
+  new AxisInfo(new Vector32(-1, 0, 0), new Euler(0, -TAU / 4, 0), 16746496, 8930304, 1),
+  new AxisInfo(new Vector32(0, 0, 1), new Euler(0, 0, 0), 65280, 34816, 1),
+  new AxisInfo(new Vector32(1, 0, 0), new Euler(0, TAU / 4, 0), 16711680, 6684672, 1),
+  new AxisInfo(new Vector32(0, 0, -1), new Euler(0, TAU / 2, 0), 255, 136, 0.75, { hintColor: 17663, hintDimColor: 8840 }),
+  new AxisInfo(new Vector32(0, -1, 0), new Euler(TAU / 4, 0, 0), 16776960, 8947712, 1.25)
+];
+var face = {
+  U: 0,
+  L: 1,
+  F: 2,
+  R: 3,
+  B: 4,
+  D: 5
+};
+var familyToAxis = {
+  U: face.U,
+  u: face.U,
+  Uw: face.U,
+  Uv: face.U,
+  y: face.U,
+  L: face.L,
+  l: face.L,
+  Lw: face.L,
+  Lv: face.L,
+  M: face.L,
+  F: face.F,
+  f: face.F,
+  Fw: face.F,
+  Fv: face.F,
+  S: face.F,
+  z: face.F,
+  R: face.R,
+  r: face.R,
+  Rw: face.R,
+  Rv: face.R,
+  x: face.R,
+  B: face.B,
+  b: face.B,
+  Bw: face.B,
+  Bv: face.B,
+  D: face.D,
+  d: face.D,
+  Dw: face.D,
+  Dv: face.D,
+  E: face.D
+};
+var cubieDimensions = {
+  stickerWidth: 0.85,
+  stickerElevation: 0.503,
+  foundationWidth: 1,
+  hintStickerElevation: 1.45
+};
+var EXPERIMENTAL_PICTURE_CUBE_HINT_ELEVATION = 2;
+var cube3DOptionsDefaults = {
+  showMainStickers: true,
+  hintFacelets: "floating",
+  showFoundation: true,
+  experimentalStickering: "full",
+  foundationSprite: null,
+  hintSprite: null
+};
+var blackMesh = new MeshBasicMaterial({
+  color: 0,
+  opacity: 1,
+  transparent: true
+});
+var blackTranslucentMesh = new MeshBasicMaterial({
+  color: 0,
+  opacity: 0.3,
+  transparent: true
+});
+var CubieDef = class {
+  constructor(orbit, stickerFaceNames, q) {
+    this.orbit = orbit;
+    const individualStickerFaceNames = typeof stickerFaceNames === "string" ? stickerFaceNames.split("") : stickerFaceNames;
+    this.stickerFaces = individualStickerFaceNames.map((s) => face[s]);
+    this.matrix = new Matrix4();
+    this.matrix.setPosition(firstPiecePosition[orbit]);
+    this.matrix.premultiply(new Matrix4().makeRotationFromQuaternion(q));
+  }
+};
+function t(v, t4) {
+  return new Quaternion().setFromAxisAngle(v, TAU * t4 / 4);
+}
+var r = {
+  O: new Vector32(0, 0, 0),
+  U: new Vector32(0, -1, 0),
+  L: new Vector32(1, 0, 0),
+  F: new Vector32(0, 0, -1),
+  R: new Vector32(-1, 0, 0),
+  B: new Vector32(0, 0, 1),
+  D: new Vector32(0, 1, 0)
+};
+var firstPiecePosition = {
+  EDGES: new Vector32(0, 1, 1),
+  CORNERS: new Vector32(1, 1, 1),
+  CENTERS: new Vector32(0, 1, 0)
+};
+var orientationRotation = {
+  EDGES: [0, 1].map((i) => new Matrix4().makeRotationAxis(firstPiecePosition.EDGES.clone().normalize(), -i * TAU / 2)),
+  CORNERS: [0, 1, 2].map((i) => new Matrix4().makeRotationAxis(firstPiecePosition.CORNERS.clone().normalize(), -i * TAU / 3)),
+  CENTERS: [0, 1, 2, 3].map((i) => new Matrix4().makeRotationAxis(firstPiecePosition.CENTERS.clone().normalize(), -i * TAU / 4))
+};
+var cubieStickerOrder = [face.U, face.F, face.R];
+var pieceDefs = {
+  EDGES: [
+    new CubieDef("EDGES", "UF", t(r.O, 0)),
+    new CubieDef("EDGES", "UR", t(r.U, 3)),
+    new CubieDef("EDGES", "UB", t(r.U, 2)),
+    new CubieDef("EDGES", "UL", t(r.U, 1)),
+    new CubieDef("EDGES", "DF", t(r.F, 2)),
+    new CubieDef("EDGES", "DR", t(r.F, 2).premultiply(t(r.D, 1))),
+    new CubieDef("EDGES", "DB", t(r.F, 2).premultiply(t(r.D, 2))),
+    new CubieDef("EDGES", "DL", t(r.F, 2).premultiply(t(r.D, 3))),
+    new CubieDef("EDGES", "FR", t(r.U, 3).premultiply(t(r.R, 3))),
+    new CubieDef("EDGES", "FL", t(r.U, 1).premultiply(t(r.R, 3))),
+    new CubieDef("EDGES", "BR", t(r.U, 3).premultiply(t(r.R, 1))),
+    new CubieDef("EDGES", "BL", t(r.U, 1).premultiply(t(r.R, 1)))
+  ],
+  CORNERS: [
+    new CubieDef("CORNERS", "UFR", t(r.O, 0)),
+    new CubieDef("CORNERS", "URB", t(r.U, 3)),
+    new CubieDef("CORNERS", "UBL", t(r.U, 2)),
+    new CubieDef("CORNERS", "ULF", t(r.U, 1)),
+    new CubieDef("CORNERS", "DRF", t(r.F, 2).premultiply(t(r.D, 1))),
+    new CubieDef("CORNERS", "DFL", t(r.F, 2).premultiply(t(r.D, 0))),
+    new CubieDef("CORNERS", "DLB", t(r.F, 2).premultiply(t(r.D, 3))),
+    new CubieDef("CORNERS", "DBR", t(r.F, 2).premultiply(t(r.D, 2)))
+  ],
+  CENTERS: [
+    new CubieDef("CENTERS", "U", t(r.O, 0)),
+    new CubieDef("CENTERS", "L", t(r.R, 3).premultiply(t(r.U, 1))),
+    new CubieDef("CENTERS", "F", t(r.R, 3)),
+    new CubieDef("CENTERS", "R", t(r.R, 3).premultiply(t(r.D, 1))),
+    new CubieDef("CENTERS", "B", t(r.R, 3).premultiply(t(r.D, 2))),
+    new CubieDef("CENTERS", "D", t(r.R, 2))
+  ]
+};
+var CUBE_SCALE = 1 / 3;
+var pictureStickerCoords = {
+  EDGES: [
+    [
+      [0, 4, 6],
+      [0, 4, 5]
+    ],
+    [
+      [3, 5, 7],
+      [0, 7, 5]
+    ],
+    [
+      [2, 4, 8],
+      [0, 10, 5]
+    ],
+    [
+      [1, 3, 7],
+      [0, 1, 5]
+    ],
+    [
+      [2, 4, 2],
+      [2, 4, 3]
+    ],
+    [
+      [3, 5, 1],
+      [2, 7, 3]
+    ],
+    [
+      [0, 4, 0],
+      [2, 10, 3]
+    ],
+    [
+      [1, 3, 1],
+      [2, 1, 3]
+    ],
+    [
+      [3, 5, 4],
+      [3, 6, 4]
+    ],
+    [
+      [1, 3, 4],
+      [1, 2, 4]
+    ],
+    [
+      [1, 9, 4],
+      [1, 8, 4]
+    ],
+    [
+      [3, 11, 4],
+      [3, 0, 4]
+    ]
+  ],
+  CORNERS: [
+    [
+      [0, 5, 6],
+      [0, 5, 5],
+      [0, 6, 5]
+    ],
+    [
+      [3, 5, 8],
+      [0, 8, 5],
+      [0, 9, 5]
+    ],
+    [
+      [2, 3, 8],
+      [0, 11, 5],
+      [0, 0, 5]
+    ],
+    [
+      [1, 3, 6],
+      [0, 2, 5],
+      [0, 3, 5]
+    ],
+    [
+      [3, 5, 2],
+      [2, 6, 3],
+      [2, 5, 3]
+    ],
+    [
+      [2, 3, 2],
+      [2, 3, 3],
+      [2, 2, 3]
+    ],
+    [
+      [1, 3, 0],
+      [2, 0, 3],
+      [2, 11, 3]
+    ],
+    [
+      [0, 5, 0],
+      [2, 9, 3],
+      [2, 8, 3]
+    ]
+  ],
+  CENTERS: [
+    [[0, 4, 7]],
+    [[0, 1, 4]],
+    [[0, 4, 4]],
+    [[0, 7, 4]],
+    [[0, 10, 4]],
+    [[0, 4, 1]]
+  ]
+};
+var sharedCubieFoundationGeometryCache = null;
+function sharedCubieFoundationGeometry() {
+  return sharedCubieFoundationGeometryCache ?? (sharedCubieFoundationGeometryCache = new BoxGeometry(cubieDimensions.foundationWidth, cubieDimensions.foundationWidth, cubieDimensions.foundationWidth));
+}
+function newStickerGeometry() {
+  const r2 = new BufferGeometry();
+  const half = 0.5 * cubieDimensions.stickerWidth;
+  r2.setAttribute("position", new BufferAttribute(new Float32Array([
+    half,
+    half,
+    0,
+    -half,
+    half,
+    0,
+    half,
+    -half,
+    0,
+    -half,
+    half,
+    0,
+    -half,
+    -half,
+    0,
+    half,
+    -half,
+    0
+  ]), 3));
+  r2.setAttribute("uv", new BufferAttribute(new Float32Array([
+    1,
+    1,
+    0,
+    1,
+    1,
+    0,
+    0,
+    1,
+    0,
+    0,
+    1,
+    0,
+    0,
+    1,
+    0,
+    0,
+    1,
+    1,
+    0,
+    0,
+    1,
+    0,
+    1,
+    1
+  ]), 2));
+  return r2;
+}
+var sharedStickerGeometryCache = null;
+function sharedStickerGeometry() {
+  return sharedStickerGeometryCache ?? (sharedStickerGeometryCache = newStickerGeometry());
+}
+var Cube3D = class extends Object3D {
+  constructor(def, cursor, scheduleRenderCallback, options = {}) {
+    super();
+    this.def = def;
+    this.scheduleRenderCallback = scheduleRenderCallback;
+    this.pieces = {};
+    this.experimentalHintStickerMeshes = [];
+    this.experimentalFoundationMeshes = [];
+    this.sprite = new Promise((resolve) => {
+      this.setSpriteURL = (url) => {
+        svgLoader.load(url, resolve);
+      };
+    });
+    this.hintSprite = new Promise((resolve) => {
+      this.setHintSpriteURL = (url) => {
+        svgLoader.load(url, resolve);
+      };
+    });
+    this.options = { ...cube3DOptionsDefaults };
+    Object.assign(this.options, options);
+    if (this.def.name !== "3x3x3") {
+      throw new Error(`Invalid puzzle for this Cube3D implementation: ${this.def.name}`);
+    }
+    if (options.foundationSprite) {
+      this.setSprite(options.foundationSprite);
+    }
+    if (options.hintSprite) {
+      this.setHintSprite(options.hintSprite);
+    }
+    this.kpuzzleFaceletInfo = {};
+    for (const orbit in pieceDefs) {
+      const orbitFaceletInfo = [];
+      this.kpuzzleFaceletInfo[orbit] = orbitFaceletInfo;
+      this.pieces[orbit] = pieceDefs[orbit].map(this.createCubie.bind(this, orbit, orbitFaceletInfo));
+    }
+    this.scale.set(CUBE_SCALE, CUBE_SCALE, CUBE_SCALE);
+    if (this.options.experimentalStickering) {
+      this.setStickering(this.options.experimentalStickering);
+    }
+    cursor?.addPositionListener(this);
+  }
+  setSprite(texture) {
+    this.sprite = texture;
+  }
+  setHintSprite(texture) {
+    this.hintSprite = texture;
+  }
+  experimentalSetStickerSpriteURL(stickerSpriteURL) {
+    this.setSpriteURL(stickerSpriteURL);
+  }
+  experimentalSetHintStickerSpriteURL(hintStickerSpriteURL) {
+    this.setHintSpriteURL(hintStickerSpriteURL);
+  }
+  setStickering(stickering) {
+    (async () => {
+      const appearance = await puzzles["3x3x3"].appearance(stickering ?? "full");
+      this.setAppearance(appearance ?? await puzzles["3x3x3"].appearance("full"));
+    })();
+  }
+  setAppearance(appearance) {
+    for (const [orbitName, orbitAppearance] of Object.entries(appearance.orbits)) {
+      for (let pieceIdx = 0; pieceIdx < orbitAppearance.pieces.length; pieceIdx++) {
+        const pieceAppearance = orbitAppearance.pieces[pieceIdx];
+        if (pieceAppearance) {
+          const pieceInfo = this.kpuzzleFaceletInfo[orbitName][pieceIdx];
+          for (let faceletIdx = 0; faceletIdx < pieceInfo.length; faceletIdx++) {
+            const faceletAppearance = pieceAppearance.facelets[faceletIdx];
+            if (faceletAppearance) {
+              const faceletInfo = pieceInfo[faceletIdx];
+              const appearance2 = typeof faceletAppearance === "string" ? faceletAppearance : faceletAppearance?.appearance;
+              faceletInfo.facelet.material = axesInfo[faceletInfo.faceIdx].stickerMaterial[appearance2];
+              const hintAppearance = typeof faceletAppearance === "string" ? appearance2 : faceletAppearance.hintAppearance ?? appearance2;
+              if (faceletInfo.hintFacelet) {
+                faceletInfo.hintFacelet.material = axesInfo[faceletInfo.faceIdx].hintStickerMaterial[hintAppearance];
+              }
+            }
+          }
+        }
+      }
+    }
+    if (this.scheduleRenderCallback) {
+      this.scheduleRenderCallback();
+    }
+  }
+  experimentalUpdateOptions(options) {
+    if ("showMainStickers" in options) {
+      throw new Error("Unimplemented");
+    }
+    const showFoundation = options.showFoundation;
+    if (typeof showFoundation !== "undefined" && this.options.showFoundation !== showFoundation) {
+      this.options.showFoundation = showFoundation;
+      for (const foundation of this.experimentalFoundationMeshes) {
+        foundation.visible = showFoundation;
+      }
+    }
+    const hintFacelets = options.hintFacelets;
+    if (typeof hintFacelets !== "undefined" && this.options.hintFacelets !== hintFacelets && hintFaceletStyles[hintFacelets]) {
+      this.options.hintFacelets = hintFacelets;
+      for (const hintSticker of this.experimentalHintStickerMeshes) {
+        hintSticker.visible = hintFacelets === "floating";
+      }
+      this.scheduleRenderCallback();
+    }
+    const experimentalStickering = options.experimentalStickering;
+    if (typeof experimentalStickering !== "undefined" && this.options.experimentalStickering !== experimentalStickering && experimentalStickerings[experimentalStickering]) {
+      this.options.experimentalStickering = experimentalStickering;
+      this.setStickering(experimentalStickering);
+      this.scheduleRenderCallback();
+    }
+  }
+  onPositionChange(p) {
+    const reid333 = p.state;
+    for (const orbit in pieceDefs) {
+      const pieces = pieceDefs[orbit];
+      for (let i = 0; i < pieces.length; i++) {
+        const j = reid333[orbit].permutation[i];
+        this.pieces[orbit][j].matrix.copy(pieceDefs[orbit][i].matrix);
+        this.pieces[orbit][j].matrix.multiply(orientationRotation[orbit][reid333[orbit].orientation[i]]);
+      }
+      for (const moveProgress of p.movesInProgress) {
+        const move = moveProgress.move;
+        const turnNormal = axesInfo[familyToAxis[move.family]].vector;
+        const moveMatrix = new Matrix4().makeRotationAxis(turnNormal, -this.ease(moveProgress.fraction) * moveProgress.direction * move.amount * TAU / 4);
+        for (let i = 0; i < pieces.length; i++) {
+          const k = this.def.moves[move.family][orbit].permutation[i];
+          if (i !== k || this.def.moves[move.family][orbit].orientation[i] !== 0) {
+            const j = reid333[orbit].permutation[i];
+            this.pieces[orbit][j].matrix.premultiply(moveMatrix);
+          }
+        }
+      }
+    }
+    this.scheduleRenderCallback();
+  }
+  createCubie(orbit, orbitFacelets, piece, orbitPieceIdx) {
+    const cubieFaceletInfo = [];
+    orbitFacelets.push(cubieFaceletInfo);
+    const cubie = new Group();
+    if (this.options.showFoundation) {
+      const foundation = this.createCubieFoundation();
+      cubie.add(foundation);
+      this.experimentalFoundationMeshes.push(foundation);
+    }
+    for (let i = 0; i < piece.stickerFaces.length; i++) {
+      const sticker = this.createSticker(axesInfo[cubieStickerOrder[i]], axesInfo[piece.stickerFaces[i]], false);
+      const faceletInfo = {
+        faceIdx: piece.stickerFaces[i],
+        facelet: sticker
+      };
+      cubie.add(sticker);
+      if (this.options.hintFacelets === "floating") {
+        const hintSticker = this.createSticker(axesInfo[cubieStickerOrder[i]], axesInfo[piece.stickerFaces[i]], true);
+        cubie.add(hintSticker);
+        faceletInfo.hintFacelet = hintSticker;
+        this.experimentalHintStickerMeshes.push(hintSticker);
+      }
+      if (this.options.experimentalStickering === "picture" && pictureStickerCoords[orbit] && pictureStickerCoords[orbit][orbitPieceIdx] && pictureStickerCoords[orbit][orbitPieceIdx][i]) {
+        const [rotate, offsetX, offsetY] = pictureStickerCoords[orbit][orbitPieceIdx][i];
+        (async () => {
+          const addImageSticker = async (hint) => {
+            const texture = await (hint ? this.hintSprite : this.sprite);
+            const mesh = this.createSticker(axesInfo[cubieStickerOrder[i]], axesInfo[piece.stickerFaces[i]], hint);
+            mesh.material = new MeshBasicMaterial({
+              map: texture,
+              side: hint ? BackSide : DoubleSide,
+              transparent: true
+            });
+            const x1 = offsetX / 12;
+            const x2 = (offsetX + 1) / 12;
+            const y1 = offsetY / 9;
+            const y2 = (offsetY + 1) / 9;
+            let v1 = new Vector2(x1, y1);
+            let v2 = new Vector2(x1, y2);
+            let v3 = new Vector2(x2, y2);
+            let v4 = new Vector2(x2, y1);
+            switch (rotate) {
+              case 1:
+                [v1, v2, v3, v4] = [v2, v3, v4, v1];
+                break;
+              case 2:
+                [v1, v2, v3, v4] = [v3, v4, v1, v2];
+                break;
+              case 3:
+                [v1, v2, v3, v4] = [v4, v1, v2, v3];
+                break;
+            }
+            mesh.geometry.setAttribute("uv", new BufferAttribute(new Float32Array([
+              v3.x,
+              v3.y,
+              v2.x,
+              v2.y,
+              v4.x,
+              v4.y,
+              v2.x,
+              v2.y,
+              v1.x,
+              v1.y,
+              v4.x,
+              v4.y
+            ]), 2));
+            cubie.add(mesh);
+          };
+          addImageSticker(true);
+          addImageSticker(false);
+        })();
+      }
+      cubieFaceletInfo.push(faceletInfo);
+    }
+    cubie.matrix.copy(piece.matrix);
+    cubie.matrixAutoUpdate = false;
+    this.add(cubie);
+    return cubie;
+  }
+  createCubieFoundation() {
+    const box = sharedCubieFoundationGeometry();
+    return new Mesh(box, this.options.experimentalStickering === "picture" ? blackMesh : blackTranslucentMesh);
+  }
+  createSticker(posAxisInfo, materialAxisInfo, isHint) {
+    const geo = this.options.experimentalStickering === "picture" ? newStickerGeometry() : sharedStickerGeometry();
+    const stickerMesh = new Mesh(geo, isHint ? materialAxisInfo.hintStickerMaterial.regular : materialAxisInfo.stickerMaterial.regular);
+    stickerMesh.setRotationFromEuler(posAxisInfo.fromZ);
+    stickerMesh.position.copy(posAxisInfo.vector);
+    stickerMesh.position.multiplyScalar(isHint ? this.options.experimentalStickering === "picture" ? EXPERIMENTAL_PICTURE_CUBE_HINT_ELEVATION : cubieDimensions.hintStickerElevation : cubieDimensions.stickerElevation);
+    return stickerMesh;
+  }
+  experimentalSetFoundationOpacity(opacity) {
+    this.experimentalFoundationMeshes[0].material.opacity = opacity;
+  }
+  experimentalSetStickerWidth(width) {
+    for (const orbitInfo of Object.values(this.kpuzzleFaceletInfo)) {
+      for (const pieceInfo of orbitInfo) {
+        for (const faceletInfo of pieceInfo) {
+          faceletInfo.facelet.scale.setScalar(width / cubieDimensions.stickerWidth);
+        }
+      }
+    }
+  }
+  experimentalSetCenterStickerWidth(width) {
+    for (const orbitInfo of [this.kpuzzleFaceletInfo["CENTERS"]]) {
+      for (const pieceInfo of orbitInfo) {
+        for (const faceletInfo of pieceInfo) {
+          faceletInfo.facelet.scale.setScalar(width / cubieDimensions.stickerWidth);
+        }
+      }
+    }
+  }
+  ease(fraction) {
+    return smootherStep(fraction);
+  }
+};
+
+// src/cubing/twisty/views/3D/puzzles/PG3D.ts
+import {
+  BufferAttribute as BufferAttribute2,
+  BufferGeometry as BufferGeometry2,
+  Color,
+  DoubleSide as DoubleSide2,
+  Euler as Euler2,
+  FrontSide,
+  Group as Group2,
+  Mesh as Mesh2,
+  MeshBasicMaterial as MeshBasicMaterial2,
+  Object3D as Object3D2,
+  Vector3 as Vector33
+} from "three";
+var foundationMaterial = new MeshBasicMaterial2({
+  side: DoubleSide2,
+  color: 0
+});
+var invisMaterial = new MeshBasicMaterial2({
+  visible: false
+});
+var basicStickerMaterial = new MeshBasicMaterial2({
+  vertexColors: true
+});
+function dist(coords, a, b) {
+  return Math.hypot(coords[3 * a] - coords[3 * b], coords[3 * a + 1] - coords[3 * b + 1], coords[3 * a + 2] - coords[3 * b + 2]);
+}
+function triarea(coords, a, b, c) {
+  const ab = dist(coords, a, b);
+  const bc = dist(coords, b, c);
+  const ac = dist(coords, a, c);
+  const p = (ab + bc + ac) / 2;
+  return Math.sqrt(p * (p - ab) * (p - bc) * (p - ac));
+}
+function polyarea(coords) {
+  let sum = 0;
+  for (let i = 2; 3 * i < coords.length; i++) {
+    sum += triarea(coords, 0, 1, i);
+  }
+  return sum;
+}
+function normalize(r2) {
+  const m = Math.hypot(r2[0], r2[1], r2[2]);
+  r2[0] /= m;
+  r2[1] /= m;
+  r2[2] /= m;
+  return r2;
+}
+function cross(a, b) {
+  const r2 = new Array(3);
+  r2[0] = a[1] * b[2] - a[2] * b[1];
+  r2[1] = a[2] * b[0] - a[0] * b[2];
+  r2[2] = a[0] * b[1] - a[1] * b[0];
+  return r2;
+}
+function normal(c) {
+  const a = [c[3] - c[0], c[4] - c[1], c[5] - c[2]];
+  const b = [c[6] - c[3], c[7] - c[4], c[8] - c[5]];
+  const r2 = cross(a, b);
+  return normalize(r2);
+}
+function trimEdges(face2, tr) {
+  const r2 = [];
+  const A = new Array(3);
+  const B = new Array(3);
+  for (let iter = 1; iter < 10; iter++) {
+    for (let i = 0; i < face2.length; i += 3) {
+      const pi = (i + face2.length - 3) % face2.length;
+      const ni = (i + 3) % face2.length;
+      for (let k = 0; k < 3; k++) {
+        A[k] = face2[pi + k] - face2[i + k];
+        B[k] = face2[ni + k] - face2[i + k];
+      }
+      const alen = Math.hypot(A[0], A[1], A[2]);
+      const blen = Math.hypot(B[0], B[1], B[2]);
+      for (let k = 0; k < 3; k++) {
+        A[k] /= alen;
+        B[k] /= blen;
+      }
+      const d = A[0] * B[0] + A[1] * B[1] + A[2] * B[2];
+      const m = tr / Math.sqrt(1 - d * d);
+      for (let k = 0; k < 3; k++) {
+        r2[i + k] = face2[i + k] + (A[k] + B[k]) * m;
+      }
+    }
+    let good = true;
+    for (let i = 0; good && i < r2.length; i += 3) {
+      const ni = (i + 3) % face2.length;
+      let t2 = 0;
+      for (let k = 0; k < 3; k++) {
+        const a = face2[ni + k] - face2[i + k];
+        const b = r2[ni + k] - r2[i + k];
+        t2 += a * b;
+      }
+      if (t2 <= 0) {
+        good = false;
+      }
+    }
+    if (good) {
+      return r2;
+    }
+    tr /= 2;
+  }
+  return face2;
+}
+var Filler = class {
+  constructor(sz, tm) {
+    this.sz = sz;
+    this.tm = tm;
+    this.vertices = new Float32Array(9 * sz);
+    this.uvs = void 0;
+    this.colors = new Uint8Array(18 * sz);
+    this.ind = new Uint8Array(sz);
+    this.pos = 0;
+    this.ipos = 0;
+  }
+  add(pt, i, c) {
+    this.vertices[this.pos] = pt[3 * i + 0];
+    this.vertices[this.pos + 1] = pt[3 * i + 1];
+    this.vertices[this.pos + 2] = pt[3 * i + 2];
+    this.colors[this.pos] = c >> 16;
+    this.colors[this.pos + 1] = c >> 8 & 255;
+    this.colors[this.pos + 2] = c & 255;
+    this.pos += 3;
+  }
+  addUncolored(pt, i) {
+    this.vertices[this.pos] = pt[3 * i + 0];
+    this.vertices[this.pos + 1] = pt[3 * i + 1];
+    this.vertices[this.pos + 2] = pt[3 * i + 2];
+    this.pos += 3;
+  }
+  setind(i) {
+    this.ind[this.ipos++] = i;
+  }
+  makePoly(coords, color, ind) {
+    const ncoords = coords;
+    for (let g = 1; 3 * (g + 1) < ncoords.length; g++) {
+      this.add(ncoords, 0, color);
+      this.add(ncoords, g, color);
+      this.add(ncoords, g + 1, color);
+      this.setind(ind);
+    }
+  }
+  setAttributes(geo) {
+    geo.setAttribute("position", new BufferAttribute2(this.vertices, 3));
+    const sa2 = this.colors.subarray(0, 9 * this.sz);
+    geo.setAttribute("color", new BufferAttribute2(sa2, 3, true));
+  }
+  makeGroups(geo) {
+    geo.clearGroups();
+    for (let i = 0; i < this.ipos; ) {
+      const si = i++;
+      const iv = this.ind[si];
+      while (this.ind[i] === iv) {
+        i++;
+      }
+      geo.addGroup(3 * si, 3 * (i - si), iv);
+    }
+  }
+  saveOriginalColors() {
+    this.colors.copyWithin(this.pos, 0, this.pos);
+  }
+};
+var StickerDef = class {
+  constructor(filler, stickerDat, trim, options) {
+    this.texturePtr = void 0;
+    this.twistVal = -1;
+    this.isDup = !!stickerDat.isDup;
+    this.faceNum = stickerDat.face;
+    this.stickerStart = filler.ipos;
+    const sdColor = new Color(stickerDat.color).getHex();
+    this.origColor = sdColor;
+    this.origColorAppearance = sdColor;
+    if (options?.appearance) {
+      this.setAppearance(filler, options.appearance);
+    }
+    this.faceColor = sdColor;
+    const coords = this.stickerCoords(stickerDat.coords, trim);
+    filler.makePoly(coords, this.faceColor, this.isDup ? 4 : 0);
+    this.stickerEnd = filler.ipos;
+  }
+  stickerCoords(coords, trim) {
+    return trimEdges(coords.slice(), trim);
+  }
+  hintCoords(coords, hintStickerHeightScale, trim, normal2) {
+    coords = this.stickerCoords(coords, trim);
+    normal2 = normal2.slice();
+    for (let i = 0; i < 3; i++) {
+      normal2[i] *= 0.5 * hintStickerHeightScale;
+    }
+    const hCoords = new Array(coords.length);
+    for (let i = 0; 3 * i < coords.length; i++) {
+      const j = coords.length / 3 - 1 - i;
+      hCoords[3 * i] = coords[3 * j] + normal2[0];
+      hCoords[3 * i + 1] = coords[3 * j + 1] + normal2[1];
+      hCoords[3 * i + 2] = coords[3 * j + 2] + normal2[2];
+    }
+    return hCoords;
+  }
+  foundationCoords(coords) {
+    const ncoords = coords.slice();
+    for (let i = 0; i < coords.length; i++) {
+      ncoords[i] = coords[i] * 0.999;
+    }
+    return ncoords;
+  }
+  addHint(filler, stickerDat, hintStickers, hintStickerHeightScale, trim, normal2) {
+    this.hintStart = filler.ipos;
+    const coords = this.hintCoords(stickerDat.coords, hintStickerHeightScale, trim, normal2);
+    filler.makePoly(coords, this.faceColor, hintStickers && !this.isDup ? 2 : 4);
+    this.hintEnd = filler.ipos;
+  }
+  addFoundation(filler, stickerDat, black) {
+    this.foundationStart = filler.ipos;
+    const coords = this.foundationCoords(stickerDat.coords);
+    filler.makePoly(coords, black, this.isDup ? 4 : 6);
+    this.foundationEnd = filler.ipos;
+  }
+  setHintStickers(filler, hintStickers) {
+    const indv = this.isDup || !hintStickers ? 4 : 2;
+    for (let i = this.hintStart; i < this.hintEnd; i++) {
+      filler.ind[i] = indv | filler.ind[i] & 1;
+    }
+  }
+  setAppearance(filler, faceletMeshAppearance) {
+    let c = 0;
+    switch (faceletMeshAppearance) {
+      case "regular":
+        c = this.origColor;
+        break;
+      case "dim":
+        if (this.origColor === 16777215) {
+          c = 14540253;
+        } else {
+          c = new Color(this.origColor).multiplyScalar(0.5).getHex();
+        }
+        break;
+      case "oriented":
+        c = 16746751;
+        break;
+      case "ignored":
+        c = 4473924;
+        break;
+      case "invisible":
+        c = this.origColor;
+    }
+    this.origColorAppearance = c;
+    for (let i = 9 * this.stickerStart; i < 9 * this.stickerEnd; i += 3) {
+      filler.colors[filler.pos + i] = c >> 16;
+      filler.colors[filler.pos + i + 1] = c >> 8 & 255;
+      filler.colors[filler.pos + i + 2] = c & 255;
+    }
+    for (let i = 9 * this.hintStart; i < 9 * this.hintEnd; i += 3) {
+      filler.colors[filler.pos + i] = c >> 16;
+      filler.colors[filler.pos + i + 1] = c >> 8 & 255;
+      filler.colors[filler.pos + i + 2] = c & 255;
+    }
+    this.setHintStickers(filler, faceletMeshAppearance !== "invisible" && !this.isDup);
+  }
+  addUVs(filler) {
+    const uvs = filler.uvs;
+    const vert = filler.vertices;
+    const coords = new Array(3);
+    for (let i = 3 * this.stickerStart; i < 3 * this.stickerEnd; i++) {
+      coords[0] = vert[3 * i];
+      coords[1] = vert[3 * i + 1];
+      coords[2] = vert[3 * i + 2];
+      const uv = filler.tm.getuv(this.faceNum, coords);
+      uvs[2 * i] = uv[0];
+      uvs[2 * i + 1] = uv[1];
+    }
+    for (let i = 3 * this.hintStart; i < 3 * this.hintEnd; i++) {
+      coords[0] = vert[3 * i];
+      coords[1] = vert[3 * i + 1];
+      coords[2] = vert[3 * i + 2];
+      const uv = filler.tm.getuv(this.faceNum, coords);
+      uvs[2 * i] = uv[0];
+      uvs[2 * i + 1] = uv[1];
+    }
+  }
+  setTexture(filler, sd) {
+    if (this.texturePtr === sd) {
+      return 0;
+    }
+    this.texturePtr = sd;
+    const sz = 6 * filler.sz;
+    filler.uvs.copyWithin(6 * this.stickerStart, 6 * sd.stickerStart + sz, 6 * sd.stickerEnd + sz);
+    filler.uvs.copyWithin(6 * this.hintStart, 6 * sd.hintStart + sz, 6 * sd.hintEnd + sz);
+    return 1;
+  }
+  setColor(filler, sd) {
+    const c = sd.origColorAppearance;
+    if (this.faceColor !== c) {
+      this.faceColor = c;
+      const sz = filler.pos;
+      filler.colors.copyWithin(9 * this.stickerStart, 9 * sd.stickerStart + sz, 9 * sd.stickerEnd + sz);
+      filler.colors.copyWithin(9 * this.hintStart, 9 * sd.hintStart + sz, 9 * sd.hintEnd + sz);
+      return 1;
+    } else {
+      return 0;
+    }
+  }
+};
+var HitPlaneDef = class {
+  constructor(hitface, tm) {
+    this.cubie = new Group2();
+    const coords = hitface.coords;
+    const filler = new Filler(coords.length / 3 - 2, tm);
+    for (let g = 1; 3 * g + 3 < coords.length; g++) {
+      filler.addUncolored(coords, 0);
+      filler.addUncolored(coords, g);
+      filler.addUncolored(coords, g + 1);
+    }
+    this.geo = new BufferGeometry2();
+    filler.setAttributes(this.geo);
+    const obj = new Mesh2(this.geo, invisMaterial);
+    obj.userData.name = hitface.name;
+    this.cubie.scale.setScalar(0.99);
+    this.cubie.add(obj);
+  }
+};
+var AxisInfo2 = class {
+  constructor(axisDat) {
+    const vec = axisDat[0];
+    this.axis = new Vector33(vec[0], vec[1], vec[2]);
+    this.order = axisDat[2];
+  }
+};
+var DEFAULT_COLOR_FRACTION = 0.71;
+var PG_SCALE = 0.5;
+var _pendingStickeringUpdate;
+var PG3D = class extends Object3D2 {
+  constructor(cursor, scheduleRenderCallback, definition, pgdat, showFoundation = false, showHintStickers = false, hintStickerHeightScale = 1, params = {}) {
+    super();
+    this.scheduleRenderCallback = scheduleRenderCallback;
+    this.definition = definition;
+    this.pgdat = pgdat;
+    this.showFoundation = showFoundation;
+    this.showHintStickers = showHintStickers;
+    this.params = params;
+    this.stickerTargets = [];
+    this.controlTargets = [];
+    this.textured = false;
+    __privateAdd(this, _pendingStickeringUpdate, false);
+    if (pgdat.stickers.length === 0) {
+      throw Error("Reuse of stickerdat from pg; please don't do that.");
+    }
+    this.hintMaterial = new MeshBasicMaterial2({
+      vertexColors: true,
+      transparent: true,
+      opacity: 0.5
+    });
+    this.hintMaterialDisposable = true;
+    this.stickerMaterial = basicStickerMaterial;
+    this.stickerMaterialDisposable = false;
+    this.axesInfo = {};
+    const axesDef = this.pgdat.axis;
+    for (const axis of axesDef) {
+      this.axesInfo[axis[1]] = new AxisInfo2(axis);
+    }
+    const stickers = this.pgdat.stickers;
+    this.stickers = {};
+    this.materialArray1 = new Array(8);
+    this.materialArray2 = new Array(8);
+    this.enableFoundation(showFoundation);
+    this.updateMaterialArrays();
+    let triangleCount = 0;
+    const multiplier = 3;
+    for (const sticker of stickers) {
+      const sides = sticker.coords.length / 3;
+      triangleCount += multiplier * (sides - 2);
+    }
+    const filler = new Filler(triangleCount, pgdat.textureMapper);
+    const black = 0;
+    const normals = [];
+    let totArea = 0;
+    for (const f of pgdat.faces) {
+      normals.push(normal(f.coords));
+      totArea += polyarea(f.coords);
+    }
+    const colorfrac = DEFAULT_COLOR_FRACTION;
+    let nonDupStickers = 0;
+    for (const sticker of stickers) {
+      if (!sticker.isDup) {
+        nonDupStickers++;
+      }
+    }
+    const trim = Math.sqrt(totArea / nonDupStickers) * (1 - Math.sqrt(colorfrac)) / 2;
+    for (const sticker of stickers) {
+      const orbit = sticker.orbit;
+      const ord = sticker.ord;
+      const ori = sticker.ori;
+      if (!this.stickers[orbit]) {
+        this.stickers[orbit] = [];
+      }
+      if (!this.stickers[orbit][ori]) {
+        this.stickers[orbit][ori] = [];
+      }
+      const options = {};
+      if (params.appearance) {
+        options.appearance = getFaceletAppearance(params.appearance, orbit, ord, ori, false);
+      }
+      const stickerdef = new StickerDef(filler, sticker, trim, options);
+      this.stickers[orbit][ori][ord] = stickerdef;
+    }
+    for (const sticker of stickers) {
+      const orbit = sticker.orbit;
+      const ord = sticker.ord;
+      const ori = sticker.ori;
+      this.stickers[orbit][ori][ord].addHint(filler, sticker, showHintStickers, hintStickerHeightScale, trim, normals[sticker.face]);
+    }
+    this.foundationBound = filler.ipos;
+    for (const sticker of stickers) {
+      const orbit = sticker.orbit;
+      const ord = sticker.ord;
+      const ori = sticker.ori;
+      this.stickers[orbit][ori][ord].addFoundation(filler, sticker, black);
+    }
+    const fixedGeo = new BufferGeometry2();
+    filler.setAttributes(fixedGeo);
+    filler.makeGroups(fixedGeo);
+    const obj = new Mesh2(fixedGeo, this.materialArray1);
+    obj.scale.set(PG_SCALE, PG_SCALE, PG_SCALE);
+    this.add(obj);
+    const obj2 = new Mesh2(fixedGeo, this.materialArray2);
+    obj2.scale.set(PG_SCALE, PG_SCALE, PG_SCALE);
+    this.add(obj2);
+    const hitfaces = this.pgdat.faces;
+    this.movingObj = obj2;
+    this.fixedGeo = fixedGeo;
+    this.filler = filler;
+    for (const hitface of hitfaces) {
+      const facedef = new HitPlaneDef(hitface, pgdat.textureMapper);
+      facedef.cubie.scale.set(PG_SCALE, PG_SCALE, PG_SCALE);
+      this.add(facedef.cubie);
+      this.controlTargets.push(facedef.cubie.children[0]);
+    }
+    filler.saveOriginalColors();
+    cursor.addPositionListener(this);
+    pgdat.stickers = [];
+  }
+  dispose() {
+    if (this.fixedGeo) {
+      this.fixedGeo.dispose();
+    }
+    if (this.stickerMaterialDisposable) {
+      this.stickerMaterial.dispose();
+      this.stickerMaterial = basicStickerMaterial;
+      this.stickerMaterialDisposable = false;
+    }
+    if (this.hintMaterialDisposable) {
+      this.hintMaterial.dispose();
+      this.hintMaterial = basicStickerMaterial;
+      this.hintMaterialDisposable = false;
+    }
+  }
+  experimentalGetStickerTargets() {
+    return this.stickerTargets;
+  }
+  experimentalGetControlTargets() {
+    return this.controlTargets;
+  }
+  experimentalSetAppearance(appearance) {
+    this.params.appearance = appearance;
+    for (const orbitName in this.definition.orbits) {
+      const { numPieces, orientations } = this.definition.orbits[orbitName];
+      for (let pieceIdx = 0; pieceIdx < numPieces; pieceIdx++) {
+        for (let faceletIdx = 0; faceletIdx < orientations; faceletIdx++) {
+          const faceletAppearance = getFaceletAppearance(appearance, orbitName, pieceIdx, faceletIdx, false);
+          const stickerDef = this.stickers[orbitName][faceletIdx][pieceIdx];
+          stickerDef.setAppearance(this.filler, faceletAppearance);
+        }
+      }
+    }
+    if (this.scheduleRenderCallback) {
+      __privateSet(this, _pendingStickeringUpdate, true);
+      if (this.lastPos) {
+        this.onPositionChange(this.lastPos);
+      }
+      this.scheduleRenderCallback();
+    }
+  }
+  onPositionChange(p) {
+    const state = p.state;
+    const noRotation = new Euler2();
+    this.movingObj.rotation.copy(noRotation);
+    let colormods = 0;
+    const filler = this.filler;
+    const ind = filler.ind;
+    if (!this.lastPos || __privateGet(this, _pendingStickeringUpdate) || !areTransformationsEquivalent(this.definition, this.lastPos.state, state)) {
+      for (const orbit in this.stickers) {
+        const pieces = this.stickers[orbit];
+        const pos2 = state[orbit];
+        const orin = pieces.length;
+        if (orin === 1) {
+          const pieces2 = pieces[0];
+          for (let i = 0; i < pieces2.length; i++) {
+            const ni = pos2.permutation[i];
+            if (this.textured) {
+              colormods += pieces2[i].setTexture(filler, pieces2[ni]);
+            } else {
+              colormods += pieces2[i].setColor(filler, pieces2[ni]);
+            }
+          }
+        } else {
+          for (let ori = 0; ori < orin; ori++) {
+            const pieces2 = pieces[ori];
+            for (let i = 0; i < pieces2.length; i++) {
+              const nori = (ori + orin - pos2.orientation[i]) % orin;
+              const ni = pos2.permutation[i];
+              if (this.textured) {
+                colormods += pieces2[i].setTexture(filler, pieces[nori][ni]);
+              } else {
+                colormods += pieces2[i].setColor(filler, pieces[nori][ni]);
+              }
+            }
+          }
+        }
+      }
+      this.lastPos = p;
+      __privateSet(this, _pendingStickeringUpdate, false);
+    }
+    let vismods = 0;
+    for (const moveProgress of p.movesInProgress) {
+      const externalMove = moveProgress.move;
+      const unswizzled = this.pgdat.unswizzle(externalMove);
+      const move = this.pgdat.notationMapper.notationToInternal(externalMove);
+      if (move === null) {
+        throw Error("Bad blockmove " + externalMove.family);
+      }
+      const quantumTransformation = transformationForQuantumMove(this.definition, externalMove.quantum);
+      const ax = this.axesInfo[unswizzled];
+      const turnNormal = ax.axis;
+      const angle = -this.ease(moveProgress.fraction) * moveProgress.direction * move.amount * TAU / ax.order;
+      this.movingObj.rotateOnAxis(turnNormal, angle);
+      if (this.lastMove !== quantumTransformation) {
+        for (const orbit in this.stickers) {
+          const pieces = this.stickers[orbit];
+          const orin = pieces.length;
+          const bmv = quantumTransformation[orbit];
+          for (let ori = 0; ori < orin; ori++) {
+            const pieces2 = pieces[ori];
+            for (let i = 0; i < pieces2.length; i++) {
+              const p2 = pieces2[i];
+              const ni = bmv.permutation[i];
+              let tv = 0;
+              if (ni !== i || bmv.orientation[i] !== 0) {
+                tv = 1;
+              }
+              if (tv !== p2.twistVal) {
+                if (tv) {
+                  for (let j = p2.stickerStart; j < p2.stickerEnd; j++) {
+                    ind[j] |= 1;
+                  }
+                  for (let j = p2.hintStart; j < p2.hintEnd; j++) {
+                    ind[j] |= 1;
+                  }
+                  for (let j = p2.foundationStart; j < p2.foundationEnd; j++) {
+                    ind[j] |= 1;
+                  }
+                } else {
+                  for (let j = p2.stickerStart; j < p2.stickerEnd; j++) {
+                    ind[j] &= ~1;
+                  }
+                  for (let j = p2.hintStart; j < p2.hintEnd; j++) {
+                    ind[j] &= ~1;
+                  }
+                  for (let j = p2.foundationStart; j < p2.foundationEnd; j++) {
+                    ind[j] &= ~1;
+                  }
+                }
+                p2.twistVal = tv;
+                vismods++;
+              }
+            }
+          }
+        }
+        this.lastMove = quantumTransformation;
+      }
+    }
+    if (vismods) {
+      this.filler.makeGroups(this.fixedGeo);
+    }
+    if (colormods) {
+      if (this.textured) {
+        this.fixedGeo.getAttribute("uv").updateRange = {
+          offset: 0,
+          count: 6 * this.foundationBound
+        };
+        this.fixedGeo.getAttribute("uv").needsUpdate = true;
+      } else {
+        this.fixedGeo.getAttribute("color").updateRange = {
+          offset: 0,
+          count: 9 * this.foundationBound
+        };
+        this.fixedGeo.getAttribute("color").needsUpdate = true;
+      }
+    }
+    this.scheduleRenderCallback();
+  }
+  ease(fraction) {
+    return smootherStep(fraction);
+  }
+  enableHintFacelets(v) {
+    this.showHintStickers = v;
+    this.updateMaterialArrays();
+  }
+  updateMaterialArrays() {
+    for (let i = 0; i < 8; i++) {
+      this.materialArray1[i] = invisMaterial;
+      this.materialArray2[i] = invisMaterial;
+    }
+    this.materialArray1[0] = this.stickerMaterial;
+    this.materialArray2[1] = this.stickerMaterial;
+    if (this.showHintStickers) {
+      this.materialArray1[2] = this.hintMaterial;
+      this.materialArray2[3] = this.hintMaterial;
+    } else {
+      this.materialArray1[2] = invisMaterial;
+      this.materialArray2[3] = invisMaterial;
+    }
+    if (this.showFoundation) {
+      this.materialArray1[6] = foundationMaterial;
+      this.materialArray2[7] = foundationMaterial;
+    } else {
+      this.materialArray1[6] = invisMaterial;
+      this.materialArray2[7] = invisMaterial;
+    }
+  }
+  enableFoundation(v) {
+    this.showFoundation = v;
+    this.updateMaterialArrays();
+  }
+  setHintStickerOpacity(v) {
+    if (this.hintMaterialDisposable) {
+      this.hintMaterial.dispose();
+      this.hintMaterialDisposable = false;
+    }
+    if (v === 0) {
+      this.hintMaterial = invisMaterial;
+    } else if (v === 1) {
+      this.hintMaterial = this.stickerMaterial;
+    } else {
+      this.hintMaterial = new MeshBasicMaterial2({
+        vertexColors: true,
+        transparent: true,
+        opacity: 0.5
+      });
+      this.hintMaterialDisposable = true;
+    }
+  }
+  experimentalUpdateOptions(options) {
+    if (options.hintFacelets !== void 0) {
+      this.enableHintFacelets(options.hintFacelets !== "none");
+    }
+    if (options.showFoundation !== void 0) {
+      this.enableFoundation(options.showFoundation);
+    }
+    if (options.hintStickerOpacity !== void 0) {
+      this.setHintStickerOpacity(options.hintStickerOpacity);
+    }
+    __privateSet(this, _pendingStickeringUpdate, true);
+    if (this.lastPos) {
+      this.onPositionChange(this.lastPos);
+    }
+    this.scheduleRenderCallback();
+  }
+  adduvs() {
+    const filler = this.filler;
+    if (filler.uvs) {
+      return;
+    }
+    this.filler.uvs = new Float32Array(12 * filler.sz);
+    for (const orbit in this.stickers) {
+      const pieces = this.stickers[orbit];
+      const orin = pieces.length;
+      for (let ori = 0; ori < orin; ori++) {
+        const pieces2 = pieces[ori];
+        for (const piece2 of pieces2) {
+          piece2.addUVs(this.filler);
+        }
+      }
+    }
+    filler.uvs.copyWithin(6 * filler.sz, 0, 6 * filler.sz);
+    const sa1 = filler.uvs.subarray(0, 6 * filler.sz);
+    this.fixedGeo.setAttribute("uv", new BufferAttribute2(sa1, 2, true));
+  }
+  experimentalUpdateTexture(enabled, stickerTexture, hintTexture) {
+    if (!stickerTexture) {
+      enabled = false;
+    } else if (!hintTexture) {
+      hintTexture = stickerTexture;
+    }
+    if (enabled && !this.filler.uvs) {
+      this.adduvs();
+    }
+    this.textured = enabled;
+    if (this.stickerMaterialDisposable) {
+      this.stickerMaterial.dispose();
+      this.stickerMaterialDisposable = false;
+    }
+    if (enabled) {
+      this.stickerMaterial = new MeshBasicMaterial2({
+        map: stickerTexture,
+        side: FrontSide,
+        transparent: false
+      });
+      this.stickerMaterialDisposable = true;
+    } else {
+      this.stickerMaterial = basicStickerMaterial;
+    }
+    if (this.hintMaterialDisposable) {
+      this.hintMaterial.dispose();
+      this.hintMaterialDisposable = false;
+    }
+    if (enabled) {
+      this.hintMaterial = new MeshBasicMaterial2({
+        map: hintTexture,
+        side: FrontSide,
+        transparent: false
+      });
+      this.hintMaterialDisposable = true;
+    } else {
+      this.hintMaterial = basicStickerMaterial;
+    }
+    this.updateMaterialArrays();
+    __privateSet(this, _pendingStickeringUpdate, true);
+    if (this.lastPos) {
+      this.onPositionChange(this.lastPos);
+    }
+    this.scheduleRenderCallback();
+  }
+};
+_pendingStickeringUpdate = new WeakMap();
+
+// src/cubing/twisty/old/dom/viewers/Twisty3DCanvas.ts
+import { PerspectiveCamera, Vector3 as Vector35, WebGLRenderer } from "three";
+
+// src/cubing/twisty/old/animation/RenderScheduler.ts
+var RenderScheduler = class {
+  constructor(callback) {
+    this.callback = callback;
+    this.animFrameID = null;
+    this.animFrame = this.animFrameWrapper.bind(this);
+  }
+  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);
+  }
+};
+
+// src/cubing/twisty/old/dom/viewers/canvas.ts
+var globalPixelRatioOverride = null;
+function pixelRatio() {
+  return globalPixelRatioOverride ?? (devicePixelRatio || 1);
+}
+
+// src/cubing/twisty/old/dom/viewers/Twisty3DCanvas.css.ts
+var twisty3DCanvasCSS = new CSSSource(`
+:host {
+  width: 384px;
+  height: 256px;
+  display: grid;
+}
+
+.wrapper {
+  width: 100%;
+  height: 100%;
+  display: grid;
+  overflow: hidden;
+}
+
+/* TODO: This is due to stats hack. Replace with \`canvas\`. */
+.wrapper > canvas {
+  max-width: 100%;
+  max-height: 100%;
+}
+
+.wrapper.invisible {
+  opacity: 0;
+}
+`);
+
+// src/cubing/twisty/old/dom/viewers/TwistyOrbitControls.ts
+import { Spherical, Vector3 as Vector34 } from "three";
+var EPSILON = 1e-8;
+var INERTIA_DEFAULT = true;
+var LATITUDE_LIMITS_DEFAULT = "auto";
+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 _spherical, _lookAt, _adjust, adjust_fn, _acceptPropagation, _propagateSpherical, propagateSpherical_fn;
+var TwistyOrbitControls = class {
+  constructor(camera, canvas, scheduleRender) {
+    this.camera = camera;
+    this.canvas = canvas;
+    this.scheduleRender = scheduleRender;
+    __privateAdd(this, _adjust);
+    __privateAdd(this, _propagateSpherical);
+    __privateAdd(this, _spherical, new Spherical());
+    __privateAdd(this, _lookAt, new Vector34(0, 0, 0));
+    this.experimentalInertia = INERTIA_DEFAULT;
+    this.experimentalLatitudeLimits = LATITUDE_LIMITS_DEFAULT;
+    this.lastTouchClientX = 0;
+    this.lastTouchClientY = 0;
+    this.currentTouchID = null;
+    this.onMoveBound = this.onMove.bind(this);
+    this.onMouseMoveBound = this.onMouseMove.bind(this);
+    this.onMouseEndBound = this.onMouseEnd.bind(this);
+    this.onTouchMoveBound = this.onTouchMove.bind(this);
+    this.onTouchEndBound = this.onTouchEnd.bind(this);
+    this.lastTouchTimestamp = 0;
+    this.lastTouchMoveMomentumX = 0;
+    this.lastTouchMoveMomentumY = 0;
+    this.lastMouseTimestamp = 0;
+    this.lastMouseMoveMomentumX = 0;
+    this.lastMouseMoveMomentumY = 0;
+    this.experimentalHasBeenMoved = false;
+    __privateAdd(this, _acceptPropagation, true);
+    __privateGet(this, _spherical).setFromVector3(camera.position);
+    __privateMethod(this, _propagateSpherical, propagateSpherical_fn).call(this);
+    canvas.addEventListener("mousedown", this.onMouseStart.bind(this));
+    canvas.addEventListener("touchstart", this.onTouchStart.bind(this));
+  }
+  lookAt(v) {
+    if (!__privateGet(this, _acceptPropagation)) {
+      return;
+    }
+    __privateSet(this, _lookAt, v);
+    __privateSet(this, _acceptPropagation, false);
+    __privateMethod(this, _adjust, adjust_fn).call(this);
+    this.scheduleRender();
+    try {
+      if (this.mirrorControls) {
+        this.mirrorControls.lookAt(v);
+      }
+    } finally {
+      __privateSet(this, _acceptPropagation, true);
+    }
+  }
+  set latitude(newLatitude) {
+    __privateGet(this, _spherical).phi = (90 - newLatitude) / DEGREES_PER_RADIAN;
+    __privateMethod(this, _propagateSpherical, propagateSpherical_fn).call(this);
+  }
+  get latitude() {
+    return 90 - __privateGet(this, _spherical).phi * DEGREES_PER_RADIAN;
+  }
+  set longitude(newLongitude) {
+    __privateGet(this, _spherical).theta = newLongitude / DEGREES_PER_RADIAN;
+    __privateMethod(this, _propagateSpherical, propagateSpherical_fn).call(this);
+  }
+  get longitude() {
+    return __privateGet(this, _spherical).theta * DEGREES_PER_RADIAN;
+  }
+  set distance(newDistance) {
+    __privateGet(this, _spherical).radius = newDistance;
+    __privateMethod(this, _propagateSpherical, propagateSpherical_fn).call(this);
+  }
+  get distance() {
+    return __privateGet(this, _spherical).radius;
+  }
+  get orbitCoordinates() {
+    return {
+      latitude: this.latitude,
+      longitude: this.longitude,
+      distance: this.distance
+    };
+  }
+  set orbitCoordinates(orbitCoordinates) {
+    this.latitude = orbitCoordinates.latitude;
+    this.longitude = orbitCoordinates.longitude;
+    this.distance = orbitCoordinates.distance;
+  }
+  temperMovement(f) {
+    return Math.sign(f) * Math.log(Math.abs(f * 10) + 1) / 6;
+  }
+  onMouseStart(e) {
+    this.experimentalHasBeenMoved = true;
+    window.addEventListener("mousemove", this.onMouseMoveBound);
+    window.addEventListener("mouseup", this.onMouseEndBound);
+    this.onStart(e);
+    this.lastMouseTimestamp = e.timeStamp;
+  }
+  onMouseMove(e) {
+    if (e.buttons === 0) {
+      this.onMouseEnd(e);
+      return;
+    }
+    if (e.movementX === 0 && e.movementY === 0) {
+      console.log("short-circuit mouse!");
+      return;
+    }
+    const minDim = Math.min(this.canvas.offsetWidth, this.canvas.offsetHeight);
+    const movementX = this.temperMovement(e.movementX / minDim);
+    const movementY = this.temperMovement(e.movementY / minDim * VERTICAL_MOVEMENT_BASE_SCALE);
+    this.onMove(movementX, movementY);
+    const deltaMs = e.timeStamp - this.lastMouseTimestamp;
+    if (deltaMs > 0) {
+      this.lastMouseMoveMomentumX = movementX / deltaMs;
+      this.lastMouseMoveMomentumY = movementY / deltaMs;
+      this.lastMouseTimestamp = e.timeStamp;
+    }
+  }
+  onMouseEnd(e) {
+    window.removeEventListener("mousemove", this.onMouseMoveBound);
+    window.removeEventListener("mouseup", this.onMouseEndBound);
+    this.onEnd(e);
+    if (this.experimentalInertia) {
+      new Inertia(this.lastMouseTimestamp, this.lastMouseMoveMomentumX, this.lastMouseMoveMomentumY, this.onMoveBound);
+    }
+  }
+  onTouchStart(e) {
+    this.experimentalHasBeenMoved = true;
+    if (this.currentTouchID === null) {
+      if (e.touches[0].clientX === 0 && e.touches[0].clientY === 0) {
+        console.log("short-circuit touch!");
+        return;
+      }
+      this.currentTouchID = e.changedTouches[0].identifier;
+      this.lastTouchClientX = e.touches[0].clientX;
+      this.lastTouchClientY = e.touches[0].clientY;
+      window.addEventListener("touchmove", this.onTouchMoveBound);
+      window.addEventListener("touchend", this.onTouchEndBound);
+      window.addEventListener("touchcancel", this.onTouchEndBound);
+      this.onStart(e);
+      this.lastTouchTimestamp = e.timeStamp;
+    }
+  }
+  onTouchMove(e) {
+    for (let i = 0; i < e.changedTouches.length; i++) {
+      const touch = e.changedTouches[i];
+      if (touch.identifier === this.currentTouchID) {
+        const minDim = Math.min(this.canvas.offsetWidth, this.canvas.offsetHeight);
+        const movementX = this.temperMovement((touch.clientX - this.lastTouchClientX) / minDim);
+        const movementY = this.temperMovement((touch.clientY - this.lastTouchClientY) / minDim * VERTICAL_MOVEMENT_BASE_SCALE);
+        this.onMove(movementX, movementY);
+        this.lastTouchClientX = touch.clientX;
+        this.lastTouchClientY = touch.clientY;
+        const deltaMs = e.timeStamp - this.lastTouchTimestamp;
+        if (deltaMs > 0) {
+          this.lastTouchMoveMomentumX = movementX / deltaMs;
+          this.lastTouchMoveMomentumY = movementY / deltaMs;
+          this.lastTouchTimestamp = e.timeStamp;
+        }
+      }
+    }
+  }
+  onTouchEnd(e) {
+    for (let i = 0; i < e.changedTouches.length; i++) {
+      const touch = e.changedTouches[i];
+      if (touch.identifier === this.currentTouchID) {
+        this.currentTouchID = null;
+        window.removeEventListener("touchmove", this.onTouchMoveBound);
+        window.removeEventListener("touchend", this.onTouchEndBound);
+        window.removeEventListener("touchcancel", this.onTouchEndBound);
+        this.onEnd(e);
+      }
+    }
+    if (this.experimentalInertia) {
+      new Inertia(this.lastTouchTimestamp, this.lastTouchMoveMomentumX, this.lastTouchMoveMomentumY, this.onMoveBound);
+    }
+  }
+  onStart(e) {
+    e.preventDefault();
+  }
+  onMove(movementX, movementY) {
+    const newSpherical = new Spherical();
+    newSpherical.copy(__privateGet(this, _spherical));
+    newSpherical.theta += -2 * movementX;
+    newSpherical.phi += -2 * movementY;
+    if (this.experimentalLatitudeLimits !== "none") {
+      newSpherical.phi = Math.max(newSpherical.phi, Math.PI * 0.3);
+      newSpherical.phi = Math.min(newSpherical.phi, Math.PI * 0.7);
+    } else {
+      newSpherical.phi = Math.max(newSpherical.phi, EPSILON);
+      newSpherical.phi = Math.min(newSpherical.phi, Math.PI - EPSILON);
+    }
+    if (isNaN(newSpherical.theta) || newSpherical.theta === Infinity || newSpherical.theta === -Infinity) {
+      return;
+    }
+    if (isNaN(newSpherical.phi) || newSpherical.phi === Infinity || newSpherical.phi === -Infinity) {
+      return;
+    }
+    __privateSet(this, _spherical, newSpherical);
+    __privateMethod(this, _propagateSpherical, propagateSpherical_fn).call(this);
+  }
+  onEnd(e) {
+    e.preventDefault();
+  }
+  setMirror(m) {
+    this.mirrorControls = m;
+  }
+  updateMirroredCamera(orbitCoordinates) {
+    if (__privateGet(this, _acceptPropagation)) {
+      this.latitude = -orbitCoordinates.latitude;
+      this.longitude = orbitCoordinates.longitude + 180;
+      this.distance = orbitCoordinates.distance;
+      __privateMethod(this, _adjust, adjust_fn).call(this);
+      this.scheduleRender();
+    }
+  }
+};
+_spherical = new WeakMap();
+_lookAt = new WeakMap();
+_adjust = new WeakSet();
+adjust_fn = function() {
+  __privateGet(this, _spherical).makeSafe();
+  this.camera.position.setFromSpherical(__privateGet(this, _spherical));
+  this.camera.lookAt(__privateGet(this, _lookAt));
+};
+_acceptPropagation = new WeakMap();
+_propagateSpherical = new WeakSet();
+propagateSpherical_fn = function() {
+  __privateSet(this, _acceptPropagation, false);
+  try {
+    __privateMethod(this, _adjust, adjust_fn).call(this);
+    this.scheduleRender();
+    this.mirrorControls?.updateMirroredCamera({
+      latitude: this.latitude,
+      longitude: this.longitude,
+      distance: this.distance
+    });
+  } finally {
+    __privateSet(this, _acceptPropagation, true);
+  }
+};
+
+// src/cubing/vendor/three/examples/jsm/libs/stats.modified.module.ts
+var performance = globalThis.performance;
+var Stats = class {
+  constructor() {
+    this.mode = 0;
+    this.dom = document.createElement("div");
+    this.beginTime = (performance || 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 = performance?.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 = (performance || Date).now();
+  }
+  end() {
+    this.frames++;
+    const time = (performance || 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 = performance.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/old/dom/viewers/Twisty3DCanvas.ts
+var SHOW_STATS = false;
+function experimentalShowRenderStats(show) {
+  SHOW_STATS = show;
+}
+var shareAllNewRenderers = false;
+var sharedRenderer = null;
+function newRenderer() {
+  return new WebGLRenderer({
+    antialias: true,
+    alpha: true
+  });
+}
+function newSharedRenderer() {
+  return sharedRenderer ?? (sharedRenderer = newRenderer());
+}
+var _invisible, _onRenderFinish, _resize, resize_fn;
+var Twisty3DCanvas = class extends ManagedCustomElement {
+  constructor(scene, options = {}) {
+    super();
+    __privateAdd(this, _resize);
+    this.legacyExperimentalShift = 0;
+    this.scheduler = new RenderScheduler(this.render.bind(this));
+    this.resizePending = false;
+    this.stats = null;
+    __privateAdd(this, _invisible, false);
+    __privateAdd(this, _onRenderFinish, null);
+    this.addCSS(twisty3DCanvasCSS);
+    this.scene = scene;
+    this.scene?.addRenderTarget(this);
+    if (SHOW_STATS) {
+      this.stats = new Stats();
+      this.stats.dom.style.position = "absolute";
+      this.addElement(this.stats.dom);
+    }
+    this.rendererIsShared = shareAllNewRenderers;
+    this.renderer = this.rendererIsShared ? newSharedRenderer() : newRenderer();
+    this.canvas = this.rendererIsShared ? document.createElement("canvas") : this.renderer.domElement;
+    this.canvas2DContext = this.canvas.getContext("2d");
+    this.addElement(this.canvas);
+    this.camera = new PerspectiveCamera(20, 1, 0.1, 20);
+    this.camera.position.copy(new Vector35(2, 4, 4));
+    this.orbitControls = new TwistyOrbitControls(this.camera, this.canvas, this.scheduleRender.bind(this));
+    if (options.orbitCoordinates) {
+      this.orbitControls.latitude = options.orbitCoordinates.latitude * (options.negateCameraPosition ? -1 : 1);
+    }
+    if (options.orbitCoordinates) {
+      this.orbitControls.longitude = options.orbitCoordinates.longitude + (options.negateCameraPosition ? 180 : 0);
+    }
+    if (options.orbitCoordinates) {
+      this.orbitControls.distance = options.orbitCoordinates.distance;
+    }
+    this.camera.lookAt(new Vector35(0, 0, 0));
+    const observer = new ResizeObserver(this.onResize.bind(this));
+    observer.observe(this.contentWrapper);
+  }
+  setMirror(partner) {
+    this.orbitControls.setMirror(partner.orbitControls);
+    partner.orbitControls.setMirror(this.orbitControls);
+  }
+  experimentalSetLatitudeLimits(limits) {
+    this.orbitControls.experimentalLatitudeLimits = limits;
+  }
+  connectedCallback() {
+    __privateMethod(this, _resize, resize_fn).call(this);
+    this.render();
+  }
+  scheduleRender() {
+    this.scheduler.requestAnimFrame();
+  }
+  makeInvisibleUntilRender() {
+    this.contentWrapper.classList.add("invisible");
+    __privateSet(this, _invisible, true);
+  }
+  experimentalSetOnRenderFinish(f) {
+    __privateSet(this, _onRenderFinish, f);
+  }
+  render() {
+    this.stats?.begin();
+    this.scheduler.cancelAnimFrame();
+    if (this.resizePending) {
+      __privateMethod(this, _resize, resize_fn).call(this);
+    }
+    if (this.rendererIsShared) {
+      this.renderer.setSize(this.canvas.width, this.canvas.height, false);
+      this.canvas2DContext.clearRect(0, 0, this.canvas.width, this.canvas.height);
+    }
+    if (this.scene) {
+      this.renderer.render(this.scene, this.camera);
+    }
+    if (this.rendererIsShared) {
+      this.canvas2DContext.drawImage(this.renderer.domElement, 0, 0);
+    }
+    if (__privateGet(this, _invisible)) {
+      this.contentWrapper.classList.remove("invisible");
+    }
+    this.stats?.end();
+    if (__privateGet(this, _onRenderFinish)) {
+      __privateGet(this, _onRenderFinish).call(this);
+    }
+  }
+  onResize() {
+    this.resizePending = true;
+    this.scheduleRender();
+  }
+  renderToDataURL(options = {}) {
+    __privateMethod(this, _resize, resize_fn).call(this, options.minWidth, options.minHeight);
+    this.render();
+    let url;
+    if (!options.squareCrop || this.canvas.width === this.canvas.height) {
+      url = this.canvas.toDataURL();
+    } else {
+      const tempCanvas = document.createElement("canvas");
+      const squareSize = Math.min(this.canvas.width, this.canvas.height);
+      tempCanvas.width = squareSize;
+      tempCanvas.height = squareSize;
+      const tempCtx = tempCanvas.getContext("2d");
+      tempCtx.drawImage(this.canvas, -(this.canvas.width - squareSize) / 2, -(this.canvas.height - squareSize) / 2);
+      url = tempCanvas.toDataURL();
+    }
+    __privateMethod(this, _resize, resize_fn).call(this);
+    return url;
+  }
+};
+_invisible = new WeakMap();
+_onRenderFinish = new WeakMap();
+_resize = new WeakSet();
+resize_fn = function(minWidth = 0, minHeight = 0) {
+  this.resizePending = false;
+  const w = Math.max(this.contentWrapper.clientWidth, minWidth);
+  const h = Math.max(this.contentWrapper.clientHeight, minHeight);
+  let off = 0;
+  if (this.legacyExperimentalShift > 0) {
+    off = Math.max(0, Math.floor((w - h) * 0.5));
+  } else if (this.legacyExperimentalShift < 0) {
+    off = -Math.max(0, Math.floor((w - h) * 0.5));
+  }
+  let yoff = 0;
+  let excess = 0;
+  if (h > w) {
+    excess = h - w;
+    yoff = -Math.floor(0.5 * excess);
+  }
+  this.camera.aspect = w / h;
+  this.camera.setViewOffset(w, h - excess, off, yoff, w, h);
+  this.camera.updateProjectionMatrix();
+  if (this.rendererIsShared) {
+    this.canvas.width = w * pixelRatio();
+    this.canvas.height = h * pixelRatio();
+    this.canvas.style.width = w.toString();
+    this.canvas.style.height = w.toString();
+  } else {
+    this.renderer.setPixelRatio(pixelRatio());
+    this.renderer.setSize(w, h, true);
+  }
+  this.scheduleRender();
+};
+customElementsShim.define("twisty-3d-canvas", Twisty3DCanvas);
+
+// src/cubing/twisty/views/3D/Twisty3DScene.ts
+import { Scene as ThreeScene } from "three";
+var Twisty3DScene = class extends ThreeScene {
+  constructor() {
+    super();
+    this.renderTargets = new Set();
+    this.twisty3Ds = new Set();
+  }
+  addRenderTarget(renderTarget) {
+    this.renderTargets.add(renderTarget);
+  }
+  scheduleRender() {
+    for (const renderTarget of this.renderTargets) {
+      renderTarget.scheduleRender();
+    }
+  }
+  addTwisty3DPuzzle(twisty3DPuzzle) {
+    this.twisty3Ds.add(twisty3DPuzzle);
+    this.add(twisty3DPuzzle);
+  }
+  removeTwisty3DPuzzle(twisty3DPuzzle) {
+    this.twisty3Ds.delete(twisty3DPuzzle);
+    this.remove(twisty3DPuzzle);
+  }
+  clearPuzzles() {
+    for (const puz of this.twisty3Ds) {
+      this.remove(puz);
+    }
+    this.twisty3Ds.clear();
+  }
+};
+
+export {
+  RenderScheduler,
+  ClassListManager,
+  HTMLElementShim,
+  customElementsShim,
+  CSSSource,
+  ManagedCustomElement,
+  DEGREES_PER_RADIAN,
+  twistyViewerWrapperCSS,
+  TwistyViewerWrapper,
+  pyraminxLookAt,
+  defaultCameraOrbitCoordinates,
+  controlsLocations,
+  TwistyPlayerConfig,
+  Cube3D,
+  PG3D,
+  pixelRatio,
+  twisty3DCanvasCSS,
+  Stats,
+  experimentalShowRenderStats,
+  Twisty3DCanvas,
+  Twisty3DScene
+};
+//# sourceMappingURL=chunk-EM5F24AO.js.map