relly-ui 0.0.0-stage → 1.0.0

package/dist/relly-ui.es.js

@@ -0,0 +1,2607 @@
+var pe = Object.defineProperty;
+var ue = (y, i, e) => i in y ? pe(y, i, { enumerable: !0, configurable: !0, writable: !0, value: e }) : y[i] = e;
+var a = (y, i, e) => ue(y, typeof i != "symbol" ? i + "" : i, e);
+class C {
+  constructor(i, e, t, n, s) {
+    a(this, "element");
+    a(this, "labelEl");
+    a(this, "controlEl");
+    a(this, "label");
+    a(this, "tooltipText");
+    a(this, "tooltipEl");
+    a(this, "conditionPredicate");
+    a(this, "targetObject");
+    a(this, "property");
+    a(this, "initialValue");
+    a(this, "prevValue");
+    a(this, "onChangeCallback");
+    a(this, "isListening", !1);
+    a(this, "contextMenuItems");
+    a(this, "disabled", !1);
+    if (this.bindingEngine = n, this.presetManager = s, this.label = i, this.targetObject = e, this.property = t, this.targetObject && this.property) {
+      this.prevValue = this.targetObject[this.property];
+      try {
+        this.initialValue = JSON.parse(JSON.stringify(this.prevValue));
+      } catch {
+        this.initialValue = this.prevValue;
+      }
+    }
+    this.element = document.createElement("div"), this.element.className = "relly-row", this.element.__rellyComponent = this, this.labelEl = document.createElement("div"), this.labelEl.className = "relly-row-label", this.labelEl.textContent = i, this.element.appendChild(this.labelEl), this.controlEl = document.createElement("div"), this.controlEl.className = "relly-row-control", this.element.appendChild(this.controlEl), this.presetManager && this.getSerializableKey() && this.presetManager.register(this);
+  }
+  setLabel(i) {
+    return this.label = i, this.labelEl.textContent = i, this;
+  }
+  getLabel() {
+    return this.label;
+  }
+  setTooltip(i) {
+    return this.tooltipText = i, this.tooltipEl || (this.tooltipEl = document.createElement("div"), this.tooltipEl.className = "relly-tooltip", this.element.appendChild(this.tooltipEl)), this.tooltipEl.textContent = i, this;
+  }
+  getTooltip() {
+    return this.tooltipText;
+  }
+  showIf(i) {
+    return this.conditionPredicate = i, this.checkVisibility(), this.bindingEngine && !this.isListening && this.bindingEngine.register(this), this;
+  }
+  checkVisibility() {
+    if (!this.conditionPredicate) return !0;
+    const i = this.conditionPredicate();
+    return this.element.style.display = i ? "" : "none", i;
+  }
+  setContextMenu(i) {
+    return this.contextMenuItems = i, this;
+  }
+  getContextMenu() {
+    return this.contextMenuItems;
+  }
+  reset() {
+    if (this.initialValue !== void 0)
+      try {
+        this.setValue(JSON.parse(JSON.stringify(this.initialValue)));
+      } catch {
+        this.setValue(this.initialValue);
+      }
+    return this;
+  }
+  onChange(i) {
+    return this.onChangeCallback = i, this;
+  }
+  listen() {
+    return !this.isListening && this.bindingEngine && this.targetObject && this.property && (this.isListening = !0, this.bindingEngine.register(this)), this;
+  }
+  getValue() {
+    return this.targetObject && this.property ? this.targetObject[this.property] : this.prevValue;
+  }
+  setValue(i) {
+    var t;
+    const e = this.getValue();
+    return this.targetObject && this.property && (this.targetObject[this.property] = i), this.prevValue = i, this.update(), e !== i && (this.triggerChange(i, e), (t = this.presetManager) == null || t.notifyChange()), this;
+  }
+  setDisabled(i) {
+    return this.disabled = i, this.disabled ? (this.element.classList.add("relly-disabled"), this.element.querySelectorAll("input, button, select").forEach((t) => t.disabled = !0)) : (this.element.classList.remove("relly-disabled"), this.element.querySelectorAll("input, button, select").forEach((t) => t.disabled = !1)), this;
+  }
+  isDisabled() {
+    return this.disabled;
+  }
+  checkDirty() {
+    if (this.checkVisibility(), !this.targetObject || !this.property) return;
+    const i = this.targetObject[this.property];
+    if (i !== this.prevValue) {
+      const e = this.prevValue;
+      this.prevValue = i, this.update(), this.triggerChange(i, e);
+    }
+  }
+  triggerChange(i, e) {
+    this.onChangeCallback && this.onChangeCallback(i, e);
+  }
+  getSerializableKey() {
+    return this.property ? this.property : this.label || null;
+  }
+  destroy() {
+    this.isListening && this.bindingEngine && (this.bindingEngine.unregister(this), this.isListening = !1), this.presetManager && this.presetManager.unregister(this), this.element.remove();
+  }
+}
+class L extends C {
+  constructor(e, t, n, s, r, l) {
+    super(e, t, n, s, r);
+    a(this, "wrapperEl");
+    a(this, "boxEl");
+    a(this, "soundEngine");
+    this.soundEngine = l, this.wrapperEl = document.createElement("div"), this.wrapperEl.className = "relly-checkbox-wrapper", this.wrapperEl.setAttribute("role", "checkbox"), this.wrapperEl.setAttribute("tabindex", "0"), this.boxEl = document.createElement("div"), this.boxEl.className = "relly-checkbox-box", this.boxEl.innerHTML = `
+      <svg class="relly-checkbox-icon" viewBox="0 0 12 10">
+        <polyline points="1.5 5 4.5 8.5 10.5 1.5"></polyline>
+      </svg>
+    `, this.wrapperEl.appendChild(this.boxEl), this.controlEl.appendChild(this.wrapperEl), this.wrapperEl.addEventListener("click", () => {
+      var h;
+      const o = !this.getValue();
+      (h = this.soundEngine) == null || h.playToggle(o), this.setValue(o);
+    }), this.wrapperEl.addEventListener("keydown", (o) => {
+      var h;
+      if (o.key === " " || o.key === "Enter") {
+        o.preventDefault();
+        const c = !this.getValue();
+        (h = this.soundEngine) == null || h.playToggle(c), this.setValue(c);
+      }
+    }), this.update();
+  }
+  setSoundEngine(e) {
+    return this.soundEngine = e, this;
+  }
+  update() {
+    if (!this.wrapperEl) return this;
+    const e = !!this.getValue();
+    return this.wrapperEl.setAttribute("aria-checked", e ? "true" : "false"), e ? this.wrapperEl.classList.add("relly-checked") : this.wrapperEl.classList.remove("relly-checked"), this;
+  }
+}
+class V extends C {
+  constructor(e, t, n, s, r, l) {
+    super(e, t, n, s, r);
+    a(this, "containerEl");
+    a(this, "rangeInput");
+    a(this, "numberInput");
+    a(this, "soundEngine");
+    a(this, "lastSoundTime", 0);
+    a(this, "min", 0);
+    a(this, "max", 100);
+    a(this, "step", 1);
+    this.soundEngine = l, this.containerEl = document.createElement("div"), this.containerEl.className = "relly-slider-container", this.rangeInput = document.createElement("input"), this.rangeInput.type = "range", this.rangeInput.className = "relly-slider-range", this.numberInput = document.createElement("input"), this.numberInput.type = "number", this.numberInput.className = "relly-slider-number", this.numberInput.title = "Drag horizontally to scrub value, or type directly", this.containerEl.appendChild(this.rangeInput), this.containerEl.appendChild(this.numberInput), this.controlEl.appendChild(this.containerEl), this.applyConstraints(), this.rangeInput.addEventListener("input", () => {
+      const o = parseFloat(this.rangeInput.value);
+      this.triggerSound(), this.setValue(o);
+    }), this.numberInput.addEventListener("change", () => {
+      let o = parseFloat(this.numberInput.value);
+      isNaN(o) && (o = this.min), o = Math.max(this.min, Math.min(this.max, o)), this.triggerSound(), this.setValue(o);
+    }), this.setupJogScrubbing(), this.update();
+  }
+  setupJogScrubbing() {
+    let e = !1, t = 0, n = 0;
+    const s = (l) => {
+      const o = l.clientX - t;
+      if (!e && Math.abs(o) > 3 && (e = !0, typeof document < "u" && document.body.classList.add("relly-jog-scrubbing")), e) {
+        const h = l.shiftKey ? 10 : l.altKey ? 0.1 : 1, c = this.step * h, u = o * c;
+        let p = n + u;
+        p = Math.max(this.min, Math.min(this.max, p));
+        const d = (this.step.toString().split(".")[1] || "").length;
+        p = parseFloat(p.toFixed(Math.max(d, 2))), this.triggerSound(), this.setValue(p), l.preventDefault();
+      }
+    }, r = () => {
+      e && typeof document < "u" && document.body.classList.remove("relly-jog-scrubbing"), typeof window < "u" && (window.removeEventListener("mousemove", s), window.removeEventListener("mouseup", r));
+    };
+    this.numberInput.addEventListener("mousedown", (l) => {
+      t = l.clientX, n = parseFloat(this.numberInput.value) || 0, e = !1, typeof window < "u" && (window.addEventListener("mousemove", s), window.addEventListener("mouseup", r));
+    });
+  }
+  triggerSound() {
+    var t;
+    const e = Date.now();
+    e - this.lastSoundTime > 35 && (this.lastSoundTime = e, (t = this.soundEngine) == null || t.playTick());
+  }
+  setSoundEngine(e) {
+    return this.soundEngine = e, this;
+  }
+  setMin(e) {
+    return this.min = e, this.applyConstraints(), this;
+  }
+  setMax(e) {
+    return this.max = e, this.applyConstraints(), this;
+  }
+  setStep(e) {
+    return this.step = e, this.applyConstraints(), this;
+  }
+  applyConstraints() {
+    this.rangeInput.min = this.min.toString(), this.rangeInput.max = this.max.toString(), this.rangeInput.step = this.step.toString(), this.numberInput.min = this.min.toString(), this.numberInput.max = this.max.toString(), this.numberInput.step = this.step.toString();
+  }
+  update() {
+    if (!this.rangeInput || !this.numberInput) return this;
+    const e = Number(this.getValue()) || 0;
+    return this.rangeInput.value = e.toString(), this.numberInput.value = e.toString(), this;
+  }
+}
+class A extends C {
+  constructor(e, t, n) {
+    super(e);
+    a(this, "buttonEl");
+    a(this, "clickHandler");
+    a(this, "soundEngine");
+    this.soundEngine = n, this.labelEl.style.display = "none", this.controlEl.style.flex = "1", this.buttonEl = document.createElement("button"), this.buttonEl.className = "relly-btn", this.buttonEl.textContent = e, this.controlEl.appendChild(this.buttonEl), t && this.onClick(t), this.buttonEl.addEventListener("click", (s) => {
+      var r;
+      (r = this.soundEngine) == null || r.playClick(), this.clickHandler && this.clickHandler(s);
+    });
+  }
+  setSoundEngine(e) {
+    return this.soundEngine = e, this;
+  }
+  setLabel(e) {
+    return super.setLabel(e), this.buttonEl.textContent = e, this;
+  }
+  onClick(e) {
+    return this.clickHandler = e, this;
+  }
+  update() {
+    return this;
+  }
+}
+class z extends C {
+  constructor(e, t, n, s, r, l) {
+    super(e, t, n, r, l);
+    a(this, "selectEl");
+    a(this, "optionsMap", /* @__PURE__ */ new Map());
+    this.selectEl = document.createElement("select"), this.selectEl.className = "relly-select-input", this.controlEl.appendChild(this.selectEl), s && this.setOptions(s), this.selectEl.addEventListener("change", () => {
+      const o = this.selectEl.value, h = this.optionsMap.has(o) ? this.optionsMap.get(o) : o;
+      this.setValue(h);
+    }), this.update();
+  }
+  setOptions(e) {
+    if (this.selectEl.innerHTML = "", this.optionsMap.clear(), Array.isArray(e))
+      for (const t of e) {
+        const n = String(t);
+        this.optionsMap.set(n, t);
+        const s = document.createElement("option");
+        s.value = n, s.textContent = n, this.selectEl.appendChild(s);
+      }
+    else if (typeof e == "object" && e !== null)
+      for (const [t, n] of Object.entries(e)) {
+        this.optionsMap.set(t, n);
+        const s = document.createElement("option");
+        s.value = t, s.textContent = t, this.selectEl.appendChild(s);
+      }
+    return this.update(), this;
+  }
+  update() {
+    if (!this.selectEl) return this;
+    const e = this.getValue();
+    for (const [t, n] of this.optionsMap.entries())
+      if (n === e || String(n) === String(e))
+        return this.selectEl.value = t, this;
+    return this.selectEl.value = String(e), this;
+  }
+}
+class B extends C {
+  constructor(e, t, n, s) {
+    super(e, t, n, s);
+    a(this, "valueBadge");
+    a(this, "formatter", (e) => String(e ?? ""));
+    this.valueBadge = document.createElement("span"), this.valueBadge.className = "relly-dynamic-value", this.controlEl.appendChild(this.valueBadge), this.update();
+  }
+  setFormat(e) {
+    return this.formatter = e, this.update(), this;
+  }
+  update() {
+    const e = this.getValue();
+    return this.valueBadge.textContent = this.formatter(e), this;
+  }
+}
+class N extends C {
+  constructor(e, t, n, s, r) {
+    super(e, t, n, s);
+    a(this, "canvasContainer");
+    a(this, "canvas");
+    a(this, "ctx", null);
+    a(this, "statsEl");
+    a(this, "graphTooltipEl");
+    a(this, "legendEl");
+    a(this, "primarySeries");
+    a(this, "seriesList", []);
+    a(this, "seriesMap", /* @__PURE__ */ new Map());
+    a(this, "bufferSize", 60);
+    a(this, "min", 0);
+    a(this, "max", 100);
+    a(this, "autoRange", !0);
+    a(this, "smoothCurves", !0);
+    a(this, "isPaused", !1);
+    a(this, "formatter", (e) => typeof e == "number" && !isNaN(e) ? e.toFixed(1) : "0");
+    a(this, "cssWidth", 280);
+    a(this, "cssHeight", 90);
+    a(this, "sampleInterval", 50);
+    a(this, "lastSampleTime", 0);
+    a(this, "hoverIndex", null);
+    a(this, "resizeObserver", null);
+    a(this, "mediaQueryList", null);
+    a(this, "soundEngine");
+    a(this, "onResolutionChange", () => {
+      this.updateDPRListener(), this.resizeCanvas(), this.draw();
+    });
+    a(this, "onMouseMove", (e) => {
+      const t = this.canvas.getBoundingClientRect(), n = e.clientX - t.left, s = this.cssWidth;
+      if (s <= 0) return;
+      const r = s / Math.max(1, this.bufferSize - 1), l = Math.round(n / r), o = Math.max(0, Math.min(this.bufferSize - 1, l));
+      o !== this.hoverIndex && (this.hoverIndex = o, this.updateTooltip(n), this.draw());
+    });
+    a(this, "onMouseLeave", () => {
+      this.hoverIndex = null, this.graphTooltipEl.classList.remove("relly-tooltip-show"), this.draw();
+    });
+    a(this, "onCanvasClick", () => {
+      var e;
+      (e = this.soundEngine) == null || e.playClick(), this.isPaused = !this.isPaused, this.isPaused ? this.canvasContainer.classList.add("relly-graph-paused") : this.canvasContainer.classList.remove("relly-graph-paused"), this.updateStats(), this.draw();
+    });
+    this.soundEngine = r, this.element.className = "relly-graph-row", this.element.innerHTML = "";
+    const l = document.createElement("div");
+    l.className = "relly-graph-header", this.labelEl = document.createElement("span"), this.labelEl.className = "relly-graph-label", this.labelEl.textContent = e, this.statsEl = document.createElement("div"), this.statsEl.className = "relly-graph-stats", this.statsEl.innerHTML = '<span class="relly-graph-val">0</span>', l.appendChild(this.labelEl), l.appendChild(this.statsEl), this.element.appendChild(l), this.legendEl = document.createElement("div"), this.legendEl.className = "relly-graph-legend", this.element.appendChild(this.legendEl), this.canvasContainer = document.createElement("div"), this.canvasContainer.className = "relly-graph-canvas-container", this.canvasContainer.title = "Click to pause/freeze data stream for inspection", this.canvas = document.createElement("canvas"), this.canvas.className = "relly-graph-canvas", this.canvasContainer.appendChild(this.canvas), this.graphTooltipEl = document.createElement("div"), this.graphTooltipEl.className = "relly-graph-tooltip", this.canvasContainer.appendChild(this.graphTooltipEl), this.element.appendChild(this.canvasContainer), this.ctx = this.canvas.getContext("2d"), this.primarySeries = {
+      id: "default",
+      label: e,
+      color: "#38bdf8",
+      fillColor: "rgba(56, 189, 248, 0.25)",
+      buffer: []
+    }, this.seriesList.push(this.primarySeries), this.seriesMap.set("default", this.primarySeries), this.initCanvasSize(), this.setupListeners(), this.update(), this.bindingEngine && this.targetObject && this.property && this.listen();
+  }
+  setupListeners() {
+    typeof window > "u" || (typeof ResizeObserver < "u" && (this.resizeObserver = new ResizeObserver(() => {
+      this.resizeCanvas(), this.draw();
+    }), this.resizeObserver.observe(this.canvasContainer)), this.updateDPRListener(), this.canvas.addEventListener("mousemove", this.onMouseMove), this.canvas.addEventListener("mouseleave", this.onMouseLeave), this.canvas.addEventListener("click", this.onCanvasClick));
+  }
+  updateDPRListener() {
+    var t;
+    if (typeof window > "u" || !window.matchMedia) return;
+    const e = window.devicePixelRatio || 1;
+    (t = this.mediaQueryList) == null || t.removeEventListener("change", this.onResolutionChange), this.mediaQueryList = window.matchMedia(`(resolution: ${e}dppx)`), this.mediaQueryList.addEventListener("change", this.onResolutionChange);
+  }
+  initCanvasSize() {
+    this.resizeCanvas();
+  }
+  resizeCanvas() {
+    if (!this.canvas || !this.canvasContainer) return;
+    const e = this.canvasContainer.getBoundingClientRect(), t = typeof window < "u" && window.devicePixelRatio || 1, n = Math.max(10, Math.floor(e.width || 280)), s = Math.max(10, Math.floor(e.height || 80));
+    this.cssWidth = n, this.cssHeight = s, this.canvas.width = Math.round(n * t), this.canvas.height = Math.round(s * t), this.ctx && (typeof this.ctx.resetTransform == "function" ? this.ctx.resetTransform() : this.ctx.setTransform(1, 0, 0, 1, 0, 0), this.ctx.scale(t, t));
+  }
+  updateTooltip(e) {
+    if (this.hoverIndex === null) return;
+    let t = "";
+    for (const r of this.seriesList) {
+      const l = this.bufferSize - r.buffer.length, o = this.hoverIndex - l;
+      if (o >= 0 && o < r.buffer.length) {
+        const h = r.buffer[o];
+        t += `<div><span style="display:inline-block;width:6px;height:6px;border-radius:50%;background:${r.color};margin-right:4px;"></span>${r.label}: <b>${this.formatter(h)}</b></div>`;
+      }
+    }
+    if (!t) {
+      this.graphTooltipEl.classList.remove("relly-tooltip-show");
+      return;
+    }
+    this.graphTooltipEl.innerHTML = t, this.graphTooltipEl.classList.add("relly-tooltip-show");
+    const n = this.graphTooltipEl.offsetWidth || 80;
+    let s = e;
+    s - n / 2 < 4 ? s = 4 + n / 2 : s + n / 2 > this.cssWidth - 4 && (s = this.cssWidth - 4 - n / 2), this.graphTooltipEl.style.left = `${s}px`, this.graphTooltipEl.style.top = "14px";
+  }
+  setSoundEngine(e) {
+    return this.soundEngine = e, this;
+  }
+  togglePause() {
+    return this.onCanvasClick(), this;
+  }
+  setPaused(e) {
+    return this.isPaused !== e && this.onCanvasClick(), this;
+  }
+  isGraphPaused() {
+    return this.isPaused;
+  }
+  setSampleInterval(e) {
+    return this.sampleInterval = Math.max(10, e), this;
+  }
+  getSampleInterval() {
+    return this.sampleInterval;
+  }
+  checkDirty() {
+    if (this.checkVisibility(), !this.targetObject || !this.property || this.isPaused) return;
+    const e = this.targetObject[this.property], t = typeof performance < "u" ? performance.now() : Date.now();
+    (t - this.lastSampleTime >= this.sampleInterval || e !== this.prevValue) && (this.lastSampleTime = t, this.prevValue = e, this.update(), this.triggerChange(e, this.prevValue));
+  }
+  setSmooth(e) {
+    return this.smoothCurves = e, this.draw(), this;
+  }
+  setFormat(e) {
+    return this.formatter = e, this.updateStats(), this;
+  }
+  setRange(e, t) {
+    return this.min = e, this.max = t, this.autoRange = !1, this.draw(), this;
+  }
+  setAutoRange(e) {
+    return this.autoRange = e, this.draw(), this;
+  }
+  setColor(e, t) {
+    return this.primarySeries.color = e, this.primarySeries.fillColor = t || `${e}33`, this.draw(), this;
+  }
+  setBufferSize(e) {
+    this.bufferSize = Math.max(10, e);
+    for (const t of this.seriesList)
+      for (; t.buffer.length > this.bufferSize; )
+        t.buffer.shift();
+    return this.draw(), this;
+  }
+  setHeight(e) {
+    return this.cssHeight = e, this.canvasContainer.style.height = `${e}px`, this.resizeCanvas(), this.draw(), this;
+  }
+  addSeries(e, t) {
+    const n = {
+      id: e,
+      label: t.label || e,
+      color: t.color,
+      fillColor: t.fillColor || `${t.color}33`,
+      buffer: []
+    };
+    return this.seriesList.push(n), this.seriesMap.set(e, n), this.updateLegend(), this.draw(), this;
+  }
+  updateLegend() {
+    if (this.seriesList.length <= 1) {
+      this.legendEl.style.display = "none";
+      return;
+    }
+    this.legendEl.style.display = "flex", this.legendEl.innerHTML = "";
+    for (const e of this.seriesList) {
+      const t = document.createElement("div");
+      t.className = "relly-graph-legend-item", t.innerHTML = `
+        <span class="relly-graph-legend-dot" style="background-color: ${e.color}"></span>
+        <span class="relly-graph-legend-label">${e.label}</span>
+      `, this.legendEl.appendChild(t);
+    }
+  }
+  push(e) {
+    if (this.isPaused) return this;
+    if (typeof e == "number") {
+      if (isNaN(e) || !isFinite(e)) return this;
+      this.primarySeries.buffer.push(e), this.primarySeries.buffer.length > this.bufferSize && this.primarySeries.buffer.shift();
+    } else if (typeof e == "object" && e !== null)
+      for (const [t, n] of Object.entries(e))
+        typeof n == "number" && !isNaN(n) && isFinite(n) && this.pushSeries(t, n);
+    return this.updateStats(), this.draw(), this;
+  }
+  pushSeries(e, t) {
+    if (this.isPaused) return this;
+    if (typeof t != "number" || isNaN(t) || !isFinite(t)) return this;
+    const n = this.seriesMap.get(e);
+    return n ? (n.buffer.push(t), n.buffer.length > this.bufferSize && n.buffer.shift(), this) : (this.addSeries(e, { color: "#ec4899", label: e }), this.pushSeries(e, t));
+  }
+  updateStats() {
+    const e = this.primarySeries.buffer.length > 0 ? this.primarySeries.buffer[this.primarySeries.buffer.length - 1] : 0;
+    let t = this.min, n = this.max, s = [];
+    for (const l of this.seriesList)
+      s = s.concat(l.buffer);
+    s.length > 0 && (t = Math.min(...s), n = Math.max(...s));
+    const r = this.isPaused ? '<span class="relly-graph-badge relly-graph-badge--paused">PAUSED</span>' : "";
+    this.statsEl.innerHTML = `
+      ${r}
+      <span class="relly-graph-badge relly-graph-badge--min">min: ${this.formatter(t)}</span>
+      <span class="relly-graph-badge relly-graph-badge--max">max: ${this.formatter(n)}</span>
+      <span class="relly-graph-val">${this.formatter(e)}</span>
+    `;
+  }
+  update() {
+    const e = this.getValue();
+    if (typeof e == "number" ? this.push(e) : typeof e == "object" && e !== null && this.push(e), this.targetObject)
+      for (const t of this.seriesList)
+        t.id !== "default" && typeof this.targetObject[t.id] == "number" && this.pushSeries(t.id, this.targetObject[t.id]);
+    return this;
+  }
+  draw() {
+    if (!this.ctx) return;
+    const e = this.ctx, t = this.cssWidth, n = this.cssHeight;
+    e.clearRect(0, 0, t, n), e.save(), e.setLineDash([2, 4]), e.strokeStyle = "rgba(255, 255, 255, 0.08)", e.lineWidth = 1;
+    for (let d of [0.25, 0.5, 0.75]) {
+      const g = Math.round(n * d);
+      e.beginPath(), e.moveTo(0, g), e.lineTo(t, g), e.stroke();
+    }
+    e.restore();
+    let s = [];
+    for (const d of this.seriesList)
+      s = s.concat(d.buffer);
+    if (s.length === 0) return;
+    const r = Math.min(...s), l = Math.max(...s);
+    let o = this.autoRange ? r : this.min, h = this.autoRange ? l : this.max;
+    l > h && (h = l), r < o && (o = r), o === h && (o -= 1, h += 1);
+    const c = (h - o) * 0.16 || 1;
+    o -= c, h += c;
+    const u = h - o || 1, p = t / Math.max(1, this.bufferSize - 1);
+    for (const d of this.seriesList) {
+      if (d.buffer.length === 0) continue;
+      const g = d.buffer.length === 1 ? [d.buffer[0], d.buffer[0]] : d.buffer, b = this.bufferSize - g.length, m = [];
+      for (let f = 0; f < g.length; f++) {
+        const x = (b + f) * p, w = Math.max(0, Math.min(1, (g[f] - o) / u)), M = Math.max(4, Math.min(n - 4, n - 6 - w * (n - 12)));
+        m.push({ x, y: M });
+      }
+      if (e.beginPath(), e.moveTo(m[0].x, n), e.lineTo(m[0].x, m[0].y), this.smoothCurves && m.length > 2)
+        for (let f = 0; f < m.length - 1; f++) {
+          const x = m[f], w = m[f + 1], M = (x.x + w.x) / 2;
+          e.bezierCurveTo(M, x.y, M, w.y, w.x, w.y);
+        }
+      else
+        for (let f = 1; f < m.length; f++)
+          e.lineTo(m[f].x, m[f].y);
+      e.lineTo(m[m.length - 1].x, n), e.closePath();
+      const v = e.createLinearGradient(0, 0, 0, n);
+      if (v.addColorStop(0, d.fillColor || `${d.color}40`), v.addColorStop(1, "rgba(0, 0, 0, 0)"), e.fillStyle = v, e.fill(), e.beginPath(), e.moveTo(m[0].x, m[0].y), this.smoothCurves && m.length > 2)
+        for (let f = 0; f < m.length - 1; f++) {
+          const x = m[f], w = m[f + 1], M = (x.x + w.x) / 2;
+          e.bezierCurveTo(M, x.y, M, w.y, w.x, w.y);
+        }
+      else
+        for (let f = 1; f < m.length; f++)
+          e.lineTo(m[f].x, m[f].y);
+      e.save(), e.strokeStyle = d.color, e.lineWidth = 2, e.shadowColor = d.color, e.shadowBlur = 5, e.stroke(), e.restore();
+      const E = m[m.length - 1];
+      E && (e.beginPath(), e.arc(E.x, E.y, 4, 0, Math.PI * 2), e.fillStyle = d.color, e.globalAlpha = 0.35, e.fill(), e.globalAlpha = 1, e.beginPath(), e.arc(E.x, E.y, 2, 0, Math.PI * 2), e.fillStyle = "#ffffff", e.fill());
+    }
+    if (this.hoverIndex !== null) {
+      const d = Math.round(this.hoverIndex * p);
+      e.save(), e.setLineDash([3, 3]), e.strokeStyle = "rgba(255, 255, 255, 0.45)", e.lineWidth = 1, e.beginPath(), e.moveTo(d, 0), e.lineTo(d, n), e.stroke(), e.restore();
+      for (const g of this.seriesList) {
+        const b = this.bufferSize - g.buffer.length, m = this.hoverIndex - b;
+        if (m >= 0 && m < g.buffer.length) {
+          const v = g.buffer[m], E = Math.max(0, Math.min(1, (v - o) / u)), f = Math.max(4, Math.min(n - 4, n - 6 - E * (n - 12)));
+          e.beginPath(), e.arc(d, f, 4.5, 0, Math.PI * 2), e.fillStyle = g.color, e.fill(), e.beginPath(), e.arc(d, f, 2, 0, Math.PI * 2), e.fillStyle = "#ffffff", e.fill();
+        }
+      }
+    }
+  }
+  destroy() {
+    this.resizeObserver && (this.resizeObserver.disconnect(), this.resizeObserver = null), this.mediaQueryList && (this.mediaQueryList.removeEventListener("change", this.onResolutionChange), this.mediaQueryList = null), this.canvas.removeEventListener("mousemove", this.onMouseMove), this.canvas.removeEventListener("mouseleave", this.onMouseLeave), this.canvas.removeEventListener("click", this.onCanvasClick), super.destroy();
+  }
+}
+class R extends C {
+  constructor(e, t, n, s, r, l) {
+    super(e, t, n, s, r);
+    a(this, "wrapperEl");
+    a(this, "previewEl");
+    a(this, "hexTextEl");
+    a(this, "nativeColorInput");
+    a(this, "eyeDropperBtn");
+    a(this, "swatchesContainer");
+    a(this, "swatches", []);
+    a(this, "swatchButtons", /* @__PURE__ */ new Map());
+    a(this, "soundEngine");
+    this.soundEngine = l, this.wrapperEl = document.createElement("div"), this.wrapperEl.className = "relly-color-wrapper", this.previewEl = document.createElement("div"), this.previewEl.className = "relly-color-preview", this.previewEl.title = "Click to open color palette", this.hexTextEl = document.createElement("span"), this.hexTextEl.className = "relly-color-text", this.nativeColorInput = document.createElement("input"), this.nativeColorInput.type = "color", this.nativeColorInput.className = "relly-color-native", this.wrapperEl.appendChild(this.previewEl), this.wrapperEl.appendChild(this.hexTextEl), this.wrapperEl.appendChild(this.nativeColorInput), typeof window < "u" && "EyeDropper" in window && (this.eyeDropperBtn = document.createElement("button"), this.eyeDropperBtn.type = "button", this.eyeDropperBtn.className = "relly-eyedropper-btn", this.eyeDropperBtn.title = "Pick color from screen", this.eyeDropperBtn.innerHTML = `
+        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+          <path d="m14 7 3 3m-1-5a2.83 2.83 0 0 1 4 4L7 22H3v-4L16 5Z"></path>
+        </svg>
+      `, this.eyeDropperBtn.addEventListener("click", async () => {
+      try {
+        const h = await new window.EyeDropper().open();
+        h && h.sRGBHex && this.setValue(h.sRGBHex);
+      } catch {
+      }
+    }), this.wrapperEl.appendChild(this.eyeDropperBtn)), this.controlEl.appendChild(this.wrapperEl), this.previewEl.addEventListener("click", () => {
+      this.nativeColorInput.click();
+    }), this.nativeColorInput.addEventListener("input", () => {
+      const o = this.nativeColorInput.value;
+      this.setValue(o);
+    }), this.update();
+  }
+  setSoundEngine(e) {
+    return this.soundEngine = e, this;
+  }
+  setSwatches(e) {
+    this.swatches = e, this.swatchesContainer || (this.swatchesContainer = document.createElement("div"), this.swatchesContainer.className = "relly-color-swatches", this.wrapperEl.insertBefore(this.swatchesContainer, this.previewEl)), this.swatchesContainer.innerHTML = "", this.swatchButtons.clear();
+    for (const t of this.swatches) {
+      const n = document.createElement("button");
+      n.type = "button", n.className = "relly-color-swatch", n.style.backgroundColor = t, n.title = t.toUpperCase(), n.addEventListener("click", () => {
+        var s;
+        this.setValue(t), (s = this.soundEngine) == null || s.playClick();
+      }), this.swatchesContainer.appendChild(n), this.swatchButtons.set(t.toLowerCase(), n);
+    }
+    return this.update(), this;
+  }
+  getSwatches() {
+    return [...this.swatches];
+  }
+  update() {
+    if (!this.previewEl || !this.hexTextEl) return this;
+    const e = String(this.getValue() || "#000000");
+    this.previewEl.style.backgroundColor = e, this.hexTextEl.textContent = e.toUpperCase(), e.startsWith("#") && (e.length === 7 || e.length === 4) && (this.nativeColorInput.value = e.length === 4 ? `#${e[1]}${e[1]}${e[2]}${e[2]}${e[3]}${e[3]}` : e);
+    const t = e.toLowerCase();
+    for (const [n, s] of this.swatchButtons.entries())
+      n === t ? s.classList.add("relly-swatch-active") : s.classList.remove("relly-swatch-active");
+    return this;
+  }
+}
+class P extends C {
+  constructor(e, t, n, s, r) {
+    super(e, t, n, s, r);
+    a(this, "containerEl");
+    a(this, "xInput");
+    a(this, "yInput");
+    a(this, "min");
+    a(this, "max");
+    a(this, "step", 0.1);
+    this.containerEl = document.createElement("div"), this.containerEl.className = "relly-point2d-container";
+    const l = document.createElement("div");
+    l.className = "relly-point2d-item";
+    const o = document.createElement("span");
+    o.className = "relly-point2d-tag", o.textContent = "X", this.xInput = document.createElement("input"), this.xInput.type = "number", this.xInput.className = "relly-point2d-input", this.xInput.step = String(this.step), l.appendChild(o), l.appendChild(this.xInput);
+    const h = document.createElement("div");
+    h.className = "relly-point2d-item";
+    const c = document.createElement("span");
+    c.className = "relly-point2d-tag", c.textContent = "Y", this.yInput = document.createElement("input"), this.yInput.type = "number", this.yInput.className = "relly-point2d-input", this.yInput.step = String(this.step), h.appendChild(c), h.appendChild(this.yInput), this.containerEl.appendChild(l), this.containerEl.appendChild(h), this.controlEl.appendChild(this.containerEl), this.xInput.addEventListener("change", () => this.handleInputChange()), this.yInput.addEventListener("change", () => this.handleInputChange()), this.setupInputScrubbing(this.xInput, "x"), this.setupInputScrubbing(this.yInput, "y"), this.update();
+  }
+  setupInputScrubbing(e, t) {
+    let n = !1, s = 0, r = 0;
+    const l = (h) => {
+      const c = h.clientX - s;
+      if (!n && Math.abs(c) > 3 && (n = !0, typeof document < "u" && document.body.classList.add("relly-jog-scrubbing")), n) {
+        const u = h.shiftKey ? 10 : h.altKey ? 0.1 : 1, p = this.step * u;
+        let d = r + c * p;
+        this.min !== void 0 && (d = Math.max(this.min, d)), this.max !== void 0 && (d = Math.min(this.max, d));
+        const g = (this.step.toString().split(".")[1] || "").length;
+        d = parseFloat(d.toFixed(Math.max(g, 2)));
+        const b = this.getValue();
+        if (Array.isArray(b)) {
+          const m = [b[0], b[1]];
+          m[t === "x" ? 0 : 1] = d, this.setValue(m);
+        } else
+          this.setValue({ ...b, [t]: d });
+        h.preventDefault();
+      }
+    }, o = () => {
+      n && typeof document < "u" && document.body.classList.remove("relly-jog-scrubbing"), typeof window < "u" && (window.removeEventListener("mousemove", l), window.removeEventListener("mouseup", o));
+    };
+    e.addEventListener("mousedown", (h) => {
+      s = h.clientX, r = parseFloat(e.value) || 0, n = !1, typeof window < "u" && (window.addEventListener("mousemove", l), window.addEventListener("mouseup", o));
+    });
+  }
+  setMin(e) {
+    return this.min = e, this.xInput.min = String(e), this.yInput.min = String(e), this;
+  }
+  setMax(e) {
+    return this.max = e, this.xInput.max = String(e), this.yInput.max = String(e), this;
+  }
+  setStep(e) {
+    return this.step = e, this.xInput.step = String(e), this.yInput.step = String(e), this;
+  }
+  getValue() {
+    return this.targetObject && this.property && this.targetObject[this.property] !== void 0 ? this.targetObject[this.property] : this.targetObject && "x" in this.targetObject && "y" in this.targetObject ? this.targetObject : this.prevValue || { x: 0, y: 0 };
+  }
+  setValue(e) {
+    const t = this.getValue(), n = Array.isArray(t) ? [...t] : typeof t == "object" && t !== null ? { ...t } : t;
+    return this.targetObject && this.property && this.targetObject[this.property] !== void 0 ? this.targetObject[this.property] = e : this.targetObject && "x" in this.targetObject && "y" in this.targetObject && typeof e == "object" && !Array.isArray(e) && (this.targetObject.x = e.x, this.targetObject.y = e.y), this.prevValue = e, this.update(), this.triggerChange(e, n), this;
+  }
+  handleInputChange() {
+    let e = parseFloat(this.xInput.value) || 0, t = parseFloat(this.yInput.value) || 0;
+    this.min !== void 0 && (e = Math.max(this.min, e), t = Math.max(this.min, t)), this.max !== void 0 && (e = Math.min(this.max, e), t = Math.min(this.max, t));
+    const n = this.getValue();
+    Array.isArray(n) ? this.setValue([e, t]) : this.setValue({ ...n, x: e, y: t });
+  }
+  update() {
+    if (!this.xInput || !this.yInput) return this;
+    const e = this.getValue();
+    let t = 0, n = 0;
+    return Array.isArray(e) ? (t = e[0] || 0, n = e[1] || 0) : typeof e == "object" && e !== null && (t = e.x || 0, n = e.y || 0), this.xInput.value = String(t), this.yInput.value = String(n), this;
+  }
+}
+class D extends C {
+  constructor(e, t, n, s, r) {
+    super(e, t, n, s, r);
+    a(this, "containerEl");
+    a(this, "xInput");
+    a(this, "yInput");
+    a(this, "zInput");
+    a(this, "min");
+    a(this, "max");
+    a(this, "step", 0.1);
+    this.containerEl = document.createElement("div"), this.containerEl.className = "relly-point3d-container";
+    const l = document.createElement("div");
+    l.className = "relly-point3d-item";
+    const o = document.createElement("span");
+    o.className = "relly-point3d-tag relly-point3d-tag--x", o.textContent = "X", this.xInput = document.createElement("input"), this.xInput.type = "number", this.xInput.className = "relly-point3d-input", this.xInput.step = String(this.step), l.appendChild(o), l.appendChild(this.xInput);
+    const h = document.createElement("div");
+    h.className = "relly-point3d-item";
+    const c = document.createElement("span");
+    c.className = "relly-point3d-tag relly-point3d-tag--y", c.textContent = "Y", this.yInput = document.createElement("input"), this.yInput.type = "number", this.yInput.className = "relly-point3d-input", this.yInput.step = String(this.step), h.appendChild(c), h.appendChild(this.yInput);
+    const u = document.createElement("div");
+    u.className = "relly-point3d-item";
+    const p = document.createElement("span");
+    p.className = "relly-point3d-tag relly-point3d-tag--z", p.textContent = "Z", this.zInput = document.createElement("input"), this.zInput.type = "number", this.zInput.className = "relly-point3d-input", this.zInput.step = String(this.step), u.appendChild(p), u.appendChild(this.zInput), this.containerEl.appendChild(l), this.containerEl.appendChild(h), this.containerEl.appendChild(u), this.controlEl.appendChild(this.containerEl), this.xInput.addEventListener("change", () => this.handleInputChange()), this.yInput.addEventListener("change", () => this.handleInputChange()), this.zInput.addEventListener("change", () => this.handleInputChange()), this.setupInputScrubbing(this.xInput, "x"), this.setupInputScrubbing(this.yInput, "y"), this.setupInputScrubbing(this.zInput, "z"), this.update();
+  }
+  setupInputScrubbing(e, t) {
+    let n = !1, s = 0, r = 0;
+    const l = (h) => {
+      const c = h.clientX - s;
+      if (!n && Math.abs(c) > 3 && (n = !0, typeof document < "u" && document.body.classList.add("relly-jog-scrubbing")), n) {
+        const u = h.shiftKey ? 10 : h.altKey ? 0.1 : 1, p = this.step * u;
+        let d = r + c * p;
+        this.min !== void 0 && (d = Math.max(this.min, d)), this.max !== void 0 && (d = Math.min(this.max, d));
+        const g = (this.step.toString().split(".")[1] || "").length;
+        d = parseFloat(d.toFixed(Math.max(g, 2)));
+        const b = this.getValue();
+        if (Array.isArray(b)) {
+          const m = [
+            b[0] ?? 0,
+            b[1] ?? 0,
+            b[2] ?? 0
+          ], v = t === "x" ? 0 : t === "y" ? 1 : 2;
+          m[v] = d, this.setValue(m);
+        } else
+          this.setValue({ ...b, [t]: d });
+        h.preventDefault();
+      }
+    }, o = () => {
+      window.removeEventListener("mousemove", l), window.removeEventListener("mouseup", o), n && (n = !1, typeof document < "u" && document.body.classList.remove("relly-jog-scrubbing"));
+    };
+    e.addEventListener("mousedown", (h) => {
+      h.button === 0 && (s = h.clientX, r = parseFloat(e.value) || 0, window.addEventListener("mousemove", l), window.addEventListener("mouseup", o));
+    });
+  }
+  handleInputChange() {
+    const e = parseFloat(this.xInput.value) || 0, t = parseFloat(this.yInput.value) || 0, n = parseFloat(this.zInput.value) || 0, s = this.getValue();
+    Array.isArray(s) ? this.setValue([e, t, n]) : this.setValue({
+      ...typeof s == "object" && s !== null ? s : {},
+      x: e,
+      y: t,
+      z: n
+    });
+  }
+  setMin(e) {
+    return this.min = e, e !== void 0 ? (this.xInput.min = e.toString(), this.yInput.min = e.toString(), this.zInput.min = e.toString()) : (this.xInput.removeAttribute("min"), this.yInput.removeAttribute("min"), this.zInput.removeAttribute("min")), this;
+  }
+  setMax(e) {
+    return this.max = e, e !== void 0 ? (this.xInput.max = e.toString(), this.yInput.max = e.toString(), this.zInput.max = e.toString()) : (this.xInput.removeAttribute("max"), this.yInput.removeAttribute("max"), this.zInput.removeAttribute("max")), this;
+  }
+  setStep(e) {
+    return this.step = e, this.xInput.step = e.toString(), this.yInput.step = e.toString(), this.zInput.step = e.toString(), this;
+  }
+  update() {
+    if (!this.xInput || !this.yInput || !this.zInput) return this;
+    const e = this.getValue();
+    let t = 0, n = 0, s = 0;
+    return Array.isArray(e) ? (t = e[0] || 0, n = e[1] || 0, s = e[2] || 0) : typeof e == "object" && e !== null && (t = e.x || 0, n = e.y || 0, s = e.z || 0), this.xInput.value = String(t), this.yInput.value = String(n), this.zInput.value = String(s), this;
+  }
+}
+class H extends C {
+  constructor(e, t, n, s, r, l) {
+    super(e, t, n, s, r);
+    a(this, "wrapperEl");
+    a(this, "trackEl");
+    a(this, "barEl");
+    a(this, "thumbMin");
+    a(this, "thumbMax");
+    a(this, "inputMin");
+    a(this, "inputMax");
+    a(this, "min", 0);
+    a(this, "max", 100);
+    a(this, "step", 1);
+    a(this, "soundEngine");
+    a(this, "formatter", (e, t) => `[${e.toFixed(1)}, ${t.toFixed(1)}]`);
+    this.soundEngine = l, this.wrapperEl = document.createElement("div"), this.wrapperEl.className = "relly-range-wrapper", this.inputMin = document.createElement("input"), this.inputMin.type = "number", this.inputMin.className = "relly-range-input relly-range-input--min", this.trackEl = document.createElement("div"), this.trackEl.className = "relly-range-track", this.barEl = document.createElement("div"), this.barEl.className = "relly-range-bar", this.thumbMin = document.createElement("div"), this.thumbMin.className = "relly-range-thumb relly-range-thumb--min", this.thumbMin.title = "Drag min", this.thumbMax = document.createElement("div"), this.thumbMax.className = "relly-range-thumb relly-range-thumb--max", this.thumbMax.title = "Drag max", this.trackEl.appendChild(this.barEl), this.trackEl.appendChild(this.thumbMin), this.trackEl.appendChild(this.thumbMax), this.inputMax = document.createElement("input"), this.inputMax.type = "number", this.inputMax.className = "relly-range-input relly-range-input--max", this.wrapperEl.appendChild(this.inputMin), this.wrapperEl.appendChild(this.trackEl), this.wrapperEl.appendChild(this.inputMax), this.controlEl.appendChild(this.wrapperEl), this.setupListeners(), this.update();
+  }
+  setupListeners() {
+    this.inputMin.addEventListener("change", () => {
+      const e = parseFloat(this.inputMin.value) || this.min, [t, n] = this.getCurrentRange();
+      this.setRangeValue(Math.min(e, n), n);
+    }), this.inputMax.addEventListener("change", () => {
+      const e = parseFloat(this.inputMax.value) || this.max, [t, n] = this.getCurrentRange();
+      this.setRangeValue(t, Math.max(e, t));
+    }), this.setupThumbDrag(this.thumbMin, "min"), this.setupThumbDrag(this.thumbMax, "max"), this.setupBarDrag();
+  }
+  setupThumbDrag(e, t) {
+    let n = !1;
+    const s = (l) => {
+      var g, b;
+      if (!n) return;
+      const o = this.trackEl.getBoundingClientRect(), h = Math.max(0, Math.min(1, (l.clientX - o.left) / o.width)), c = this.min + h * (this.max - this.min), u = this.applyStep(c), [p, d] = this.getCurrentRange();
+      if (t === "min") {
+        const m = Math.min(u, d);
+        m !== p && ((g = this.soundEngine) == null || g.playTick(), this.setRangeValue(m, d));
+      } else {
+        const m = Math.max(u, p);
+        m !== d && ((b = this.soundEngine) == null || b.playTick(), this.setRangeValue(p, m));
+      }
+    }, r = () => {
+      n && (n = !1, window.removeEventListener("mousemove", s), window.removeEventListener("mouseup", r));
+    };
+    e.addEventListener("mousedown", (l) => {
+      l.button === 0 && (l.preventDefault(), l.stopPropagation(), n = !0, window.addEventListener("mousemove", s), window.addEventListener("mouseup", r));
+    });
+  }
+  setupBarDrag() {
+    let e = !1, t = 0, n = 0, s = 0;
+    const r = (o) => {
+      var v;
+      if (!e) return;
+      const h = this.trackEl.getBoundingClientRect(), u = (o.clientX - t) / h.width * (this.max - this.min), p = s - n;
+      let d = Math.max(this.min, Math.min(this.max - p, n + u));
+      d = this.applyStep(d);
+      const g = this.applyStep(d + p), [b, m] = this.getCurrentRange();
+      (d !== b || g !== m) && ((v = this.soundEngine) == null || v.playTick(), this.setRangeValue(d, g));
+    }, l = () => {
+      e && (e = !1, window.removeEventListener("mousemove", r), window.removeEventListener("mouseup", l));
+    };
+    this.barEl.addEventListener("mousedown", (o) => {
+      if (o.button !== 0) return;
+      o.preventDefault(), o.stopPropagation(), e = !0, t = o.clientX;
+      const [h, c] = this.getCurrentRange();
+      n = h, s = c, window.addEventListener("mousemove", r), window.addEventListener("mouseup", l);
+    });
+  }
+  applyStep(e) {
+    const t = Math.round(e / this.step) * this.step, n = (this.step.toString().split(".")[1] || "").length;
+    return parseFloat(t.toFixed(n));
+  }
+  getCurrentRange() {
+    const e = this.getValue();
+    return Array.isArray(e) ? [e[0] ?? this.min, e[1] ?? this.max] : typeof e == "object" && e !== null ? [e.min ?? this.min, e.max ?? this.max] : [this.min, this.max];
+  }
+  setRangeValue(e, t) {
+    const n = Math.max(this.min, Math.min(e, this.max)), s = Math.max(this.min, Math.min(t, this.max)), r = this.getValue();
+    Array.isArray(r) ? this.setValue([n, s]) : this.setValue({
+      ...typeof r == "object" && r !== null ? r : {},
+      min: n,
+      max: s
+    });
+  }
+  setMin(e) {
+    return this.min = e, this.update(), this;
+  }
+  setMax(e) {
+    return this.max = e, this.update(), this;
+  }
+  setStep(e) {
+    return this.step = e, this.inputMin.step = e.toString(), this.inputMax.step = e.toString(), this;
+  }
+  setFormat(e) {
+    return this.formatter = e, this.update(), this;
+  }
+  setSoundEngine(e) {
+    return this.soundEngine = e, this;
+  }
+  update() {
+    if (!this.trackEl || !this.thumbMin || !this.thumbMax) return this;
+    const [e, t] = this.getCurrentRange(), n = this.max - this.min || 1, s = Math.max(0, Math.min(100, (e - this.min) / n * 100)), r = Math.max(0, Math.min(100, (t - this.min) / n * 100));
+    return this.thumbMin.style.left = `${s}%`, this.thumbMax.style.left = `${r}%`, this.barEl.style.left = `${s}%`, this.barEl.style.width = `${Math.max(0, r - s)}%`, this.barEl.title = this.formatter(e, t), this.inputMin.value = String(e), this.inputMax.value = String(t), this;
+  }
+}
+class j extends C {
+  constructor(e, t, n, s = [], r, l, o) {
+    super(e, t, n, r, l);
+    a(this, "containerEl");
+    a(this, "gliderEl");
+    a(this, "buttons", /* @__PURE__ */ new Map());
+    a(this, "optionsMap", /* @__PURE__ */ new Map());
+    a(this, "soundEngine");
+    this.soundEngine = o, this.containerEl = document.createElement("div"), this.containerEl.className = "relly-segmented-container", this.gliderEl = document.createElement("div"), this.gliderEl.className = "relly-segmented-glider", this.containerEl.appendChild(this.gliderEl), this.controlEl.appendChild(this.containerEl), this.setOptions(s);
+  }
+  setOptions(e) {
+    if (this.optionsMap.clear(), this.buttons.clear(), this.containerEl.innerHTML = "", this.containerEl.appendChild(this.gliderEl), Array.isArray(e))
+      for (const t of e) {
+        const n = String(t);
+        this.optionsMap.set(n, t), this.createButton(n, n, t);
+      }
+    else if (typeof e == "object" && e !== null)
+      for (const [t, n] of Object.entries(e))
+        this.optionsMap.set(t, n), this.createButton(t, t, n);
+    return this.update(), this;
+  }
+  createButton(e, t, n) {
+    const s = document.createElement("button");
+    s.type = "button", s.className = "relly-segmented-btn", s.textContent = t, s.addEventListener("click", () => {
+      var r;
+      (r = this.soundEngine) == null || r.playClick(), this.setValue(n);
+    }), this.containerEl.appendChild(s), this.buttons.set(e, s);
+  }
+  setSoundEngine(e) {
+    return this.soundEngine = e, this;
+  }
+  update() {
+    if (!this.containerEl || this.buttons.size === 0) return this;
+    const e = this.getValue();
+    let t = null;
+    for (const [n, s] of this.optionsMap.entries()) {
+      const r = this.buttons.get(n);
+      r && (s === e || String(s) === String(e) ? (r.classList.add("relly-segmented-btn--active"), t = r) : r.classList.remove("relly-segmented-btn--active"));
+    }
+    if (t) {
+      const n = t.offsetLeft, s = t.offsetWidth;
+      this.gliderEl.style.transform = `translateX(${n}px)`, this.gliderEl.style.width = `${s}px`, this.gliderEl.style.opacity = "1";
+    } else
+      this.gliderEl.style.opacity = "0";
+    return this;
+  }
+}
+class F extends C {
+  constructor(e, t, n, s) {
+    super(e, t, n, s);
+    a(this, "wrapperEl");
+    a(this, "ledEl");
+    a(this, "badgeEl");
+    a(this, "detailEl");
+    a(this, "currentStatus", "online");
+    a(this, "customBadge");
+    a(this, "customDetail");
+    this.wrapperEl = document.createElement("div"), this.wrapperEl.className = "relly-status-wrapper", this.ledEl = document.createElement("div"), this.ledEl.className = "relly-status-led relly-status-led--online", this.ledEl.innerHTML = `
+      <span class="relly-status-pulse-ring"></span>
+      <span class="relly-status-led-core"></span>
+    `, this.badgeEl = document.createElement("span"), this.badgeEl.className = "relly-status-badge relly-status-badge--online", this.badgeEl.textContent = "ONLINE", this.detailEl = document.createElement("span"), this.detailEl.className = "relly-status-detail", this.wrapperEl.appendChild(this.ledEl), this.wrapperEl.appendChild(this.badgeEl), this.wrapperEl.appendChild(this.detailEl), this.controlEl.appendChild(this.wrapperEl), this.update();
+  }
+  setStatus(e, t, n) {
+    return this.currentStatus = e, t !== void 0 && (this.customBadge = t), n !== void 0 && (this.customDetail = n), this.targetObject && this.property && (this.targetObject[this.property] = e), this.update(), this;
+  }
+  setBadge(e) {
+    return this.customBadge = e, this.update(), this;
+  }
+  setDetail(e) {
+    return this.customDetail = e, this.update(), this;
+  }
+  update() {
+    if (!this.wrapperEl || !this.ledEl) return this;
+    const e = this.getValue();
+    let t = this.currentStatus;
+    if (typeof e == "string" && e) {
+      const n = e.toLowerCase();
+      ["online", "busy", "offline", "info", "ready"].includes(n) && (t = n);
+    }
+    return this.ledEl.className = `relly-status-led relly-status-led--${t}`, this.badgeEl.className = `relly-status-badge relly-status-badge--${t}`, this.badgeEl.textContent = this.customBadge || t.toUpperCase(), this.customDetail ? (this.detailEl.textContent = this.customDetail, this.detailEl.style.display = "inline-block") : this.detailEl.style.display = "none", this;
+  }
+}
+class T {
+  constructor(i, e, t, n) {
+    a(this, "children", []);
+    a(this, "accordion", !1);
+    this.contentEl = i, this.bindingEngine = e, this.presetManager = t, this.soundEngine = n;
+  }
+  setAccordion(i) {
+    return this.accordion = i, this;
+  }
+  isAccordion() {
+    return this.accordion;
+  }
+  onSectionExpanded(i) {
+    if (this.accordion)
+      for (const e of this.children)
+        e instanceof q && e !== i && e.setCollapsed(!0);
+  }
+  addCheckbox(i, e) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const s = i, r = s.label || s.property.charAt(0).toUpperCase() + s.property.slice(1), l = new L(
+        r,
+        s.object,
+        s.property,
+        this.bindingEngine,
+        this.presetManager,
+        this.soundEngine
+      );
+      return s.tooltip && l.setTooltip(s.tooltip), (s.onChange || s.onToggle) && l.onChange(s.onChange || s.onToggle), s.listen && l.listen(), s.showIf && l.showIf(s.showIf), this.contentEl.appendChild(l.element), this.children.push(l), l;
+    }
+    const t = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", n = new L(
+      t,
+      i,
+      e,
+      this.bindingEngine,
+      this.presetManager,
+      this.soundEngine
+    );
+    return this.contentEl.appendChild(n.element), this.children.push(n), n;
+  }
+  createCheckbox(i, e) {
+    return this.addCheckbox(i, e);
+  }
+  addSlider(i, e) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const s = i, r = s.label || s.property.charAt(0).toUpperCase() + s.property.slice(1), l = new V(
+        r,
+        s.object,
+        s.property,
+        this.bindingEngine,
+        this.presetManager,
+        this.soundEngine
+      );
+      return s.min !== void 0 && l.setMin(s.min), s.max !== void 0 && l.setMax(s.max), s.step !== void 0 && l.setStep(s.step), s.tooltip && l.setTooltip(s.tooltip), s.onChange && l.onChange(s.onChange), s.listen && l.listen(), s.showIf && l.showIf(s.showIf), this.contentEl.appendChild(l.element), this.children.push(l), l;
+    }
+    const t = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", n = new V(
+      t,
+      i,
+      e,
+      this.bindingEngine,
+      this.presetManager,
+      this.soundEngine
+    );
+    return this.contentEl.appendChild(n.element), this.children.push(n), n;
+  }
+  createSlider(i, e) {
+    return this.addSlider(i, e);
+  }
+  addButton(i, e) {
+    if (typeof i == "object" && i !== null) {
+      const n = i, s = n.label || "Button", r = new A(s, n.onClick || e, this.soundEngine);
+      return n.tooltip && r.setTooltip(n.tooltip), n.showIf && r.showIf(n.showIf), this.contentEl.appendChild(r.element), this.children.push(r), r;
+    }
+    const t = new A(i, e, this.soundEngine);
+    return this.contentEl.appendChild(t.element), this.children.push(t), t;
+  }
+  createButton(i, e) {
+    return this.addButton(i, e);
+  }
+  addSelect(i, e, t) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const r = i, l = r.label || r.property.charAt(0).toUpperCase() + r.property.slice(1), o = new z(l, r.object, r.property, r.options, this.bindingEngine, this.presetManager);
+      return r.tooltip && o.setTooltip(r.tooltip), r.onChange && o.onChange(r.onChange), r.listen && o.listen(), r.showIf && o.showIf(r.showIf), this.contentEl.appendChild(o.element), this.children.push(o), o;
+    }
+    const n = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", s = new z(
+      n,
+      i,
+      e,
+      t,
+      this.bindingEngine,
+      this.presetManager
+    );
+    return this.contentEl.appendChild(s.element), this.children.push(s), s;
+  }
+  createSelect(i, e, t) {
+    return this.addSelect(i, e, t);
+  }
+  addDynamicLabel(i, e) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const s = i, r = s.label || s.property.charAt(0).toUpperCase() + s.property.slice(1), l = new B(r, s.object, s.property, this.bindingEngine);
+      return s.format && l.setFormat(s.format), s.tooltip && l.setTooltip(s.tooltip), s.showIf && l.showIf(s.showIf), this.contentEl.appendChild(l.element), this.children.push(l), l;
+    }
+    const t = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", n = new B(t, i, e, this.bindingEngine);
+    return this.contentEl.appendChild(n.element), this.children.push(n), n;
+  }
+  createDynamicLabel(i, e) {
+    return this.addDynamicLabel(i, e);
+  }
+  addGraph(i, e) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const s = i, r = s.label || s.property.charAt(0).toUpperCase() + s.property.slice(1), l = new N(r, s.object, s.property, this.bindingEngine, this.soundEngine);
+      return s.range && l.setRange(s.range[0], s.range[1]), s.color && l.setColor(s.color, s.fillColor), s.bufferSize && l.setBufferSize(s.bufferSize), s.smooth !== void 0 && l.setSmooth(s.smooth), s.height && l.setHeight(s.height), s.format && l.setFormat(s.format), s.tooltip && l.setTooltip(s.tooltip), s.showIf && l.showIf(s.showIf), this.contentEl.appendChild(l.element), this.children.push(l), l;
+    }
+    const t = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", n = new N(t, i, e, this.bindingEngine, this.soundEngine);
+    return this.contentEl.appendChild(n.element), this.children.push(n), n;
+  }
+  createGraph(i, e) {
+    return this.addGraph(i, e);
+  }
+  addFPSGraph(i = "FPS") {
+    const e = { fps: 60 };
+    let t = 0, n = typeof performance < "u" ? performance.now() : Date.now(), s;
+    const r = (h) => {
+      t++, h >= n + 1e3 && (e.fps = Math.round(t * 1e3 / (h - n)), t = 0, n = h), s = requestAnimationFrame(r);
+    };
+    typeof requestAnimationFrame < "u" && (s = requestAnimationFrame(r));
+    const l = this.addGraph(e, "fps").setLabel(i).setRange(0, 120).setColor("#22c55e", "rgba(34, 197, 94, 0.25)").setFormat((h) => `${Math.round(h)} FPS`), o = l.destroy.bind(l);
+    return l.destroy = () => {
+      typeof cancelAnimationFrame < "u" && s && cancelAnimationFrame(s), o();
+    }, l;
+  }
+  createFPSGraph(i = "FPS") {
+    return this.addFPSGraph(i);
+  }
+  addMemoryGraph(i = "Memory") {
+    const e = { mem: 0 };
+    let t;
+    const n = () => {
+      if (typeof performance < "u" && performance.memory) {
+        const l = performance.memory.usedJSHeapSize / 1048576;
+        e.mem = Number(l.toFixed(1));
+      } else
+        e.mem = Number((Math.sin(Date.now() / 2500) * 8 + 48).toFixed(1));
+    };
+    n(), typeof setInterval < "u" && (t = setInterval(n, 1e3));
+    const s = this.addGraph(e, "mem").setLabel(i).setAutoRange(!0).setColor("#a855f7", "rgba(168, 85, 247, 0.25)").setFormat((l) => `${l.toFixed(1)} MB`), r = s.destroy.bind(s);
+    return s.destroy = () => {
+      t && clearInterval(t), r();
+    }, s;
+  }
+  createMemoryGraph(i = "Memory") {
+    return this.addMemoryGraph(i);
+  }
+  addColor(i, e) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const s = i, r = s.label || s.property.charAt(0).toUpperCase() + s.property.slice(1), l = new R(
+        r,
+        s.object,
+        s.property,
+        this.bindingEngine,
+        this.presetManager,
+        this.soundEngine
+      );
+      return s.tooltip && l.setTooltip(s.tooltip), s.swatches && l.setSwatches(s.swatches), s.onChange && l.onChange(s.onChange), s.listen && l.listen(), s.showIf && l.showIf(s.showIf), this.contentEl.appendChild(l.element), this.children.push(l), l;
+    }
+    const t = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", n = new R(
+      t,
+      i,
+      e,
+      this.bindingEngine,
+      this.presetManager,
+      this.soundEngine
+    );
+    return this.contentEl.appendChild(n.element), this.children.push(n), n;
+  }
+  createColor(i, e) {
+    return this.addColor(i, e);
+  }
+  addPoint2D(i, e, t) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const r = i, l = r.label || r.property.charAt(0).toUpperCase() + r.property.slice(1), o = new P(l, r.object, r.property, this.bindingEngine, this.presetManager);
+      return r.min !== void 0 && o.setMin(r.min), r.max !== void 0 && o.setMax(r.max), r.step !== void 0 && o.setStep(r.step), r.tooltip && o.setTooltip(r.tooltip), r.onChange && o.onChange(r.onChange), r.listen && o.listen(), r.showIf && o.showIf(r.showIf), this.contentEl.appendChild(o.element), this.children.push(o), o;
+    }
+    const n = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", s = new P(n, i, e, this.bindingEngine, this.presetManager);
+    return (t == null ? void 0 : t.min) !== void 0 && s.setMin(t.min), (t == null ? void 0 : t.max) !== void 0 && s.setMax(t.max), (t == null ? void 0 : t.step) !== void 0 && s.setStep(t.step), this.contentEl.appendChild(s.element), this.children.push(s), s;
+  }
+  createPoint2D(i, e, t) {
+    return this.addPoint2D(i, e, t);
+  }
+  addPoint3D(i, e, t) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const r = i, l = r.label || r.property.charAt(0).toUpperCase() + r.property.slice(1), o = new D(l, r.object, r.property, this.bindingEngine, this.presetManager);
+      return r.min !== void 0 && o.setMin(r.min), r.max !== void 0 && o.setMax(r.max), r.step !== void 0 && o.setStep(r.step), r.tooltip && o.setTooltip(r.tooltip), r.contextMenu && o.setContextMenu(r.contextMenu), r.onChange && o.onChange(r.onChange), r.listen && o.listen(), r.showIf && o.showIf(r.showIf), this.contentEl.appendChild(o.element), this.children.push(o), o;
+    }
+    const n = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", s = new D(n, i, e, this.bindingEngine, this.presetManager);
+    return (t == null ? void 0 : t.min) !== void 0 && s.setMin(t.min), (t == null ? void 0 : t.max) !== void 0 && s.setMax(t.max), (t == null ? void 0 : t.step) !== void 0 && s.setStep(t.step), this.contentEl.appendChild(s.element), this.children.push(s), s;
+  }
+  createPoint3D(i, e, t) {
+    return this.addPoint3D(i, e, t);
+  }
+  addVector3(i, e, t) {
+    return this.addPoint3D(i, e, t);
+  }
+  createVector3(i, e, t) {
+    return this.addPoint3D(i, e, t);
+  }
+  addRange(i, e, t) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const r = i, l = r.label || r.property.charAt(0).toUpperCase() + r.property.slice(1), o = new H(
+        l,
+        r.object,
+        r.property,
+        this.bindingEngine,
+        this.presetManager,
+        this.soundEngine
+      );
+      return r.min !== void 0 && o.setMin(r.min), r.max !== void 0 && o.setMax(r.max), r.step !== void 0 && o.setStep(r.step), r.tooltip && o.setTooltip(r.tooltip), r.contextMenu && o.setContextMenu(r.contextMenu), r.onChange && o.onChange(r.onChange), r.listen && o.listen(), r.showIf && o.showIf(r.showIf), this.contentEl.appendChild(o.element), this.children.push(o), o;
+    }
+    const n = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", s = new H(
+      n,
+      i,
+      e,
+      this.bindingEngine,
+      this.presetManager,
+      this.soundEngine
+    );
+    return (t == null ? void 0 : t.min) !== void 0 && s.setMin(t.min), (t == null ? void 0 : t.max) !== void 0 && s.setMax(t.max), (t == null ? void 0 : t.step) !== void 0 && s.setStep(t.step), this.contentEl.appendChild(s.element), this.children.push(s), s;
+  }
+  createRange(i, e, t) {
+    return this.addRange(i, e, t);
+  }
+  addSegmented(i, e, t) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const r = i, l = r.label || r.property.charAt(0).toUpperCase() + r.property.slice(1), o = new j(
+        l,
+        r.object,
+        r.property,
+        r.options || [],
+        this.bindingEngine,
+        this.presetManager,
+        this.soundEngine
+      );
+      return r.tooltip && o.setTooltip(r.tooltip), r.contextMenu && o.setContextMenu(r.contextMenu), r.onChange && o.onChange(r.onChange), r.listen && o.listen(), r.showIf && o.showIf(r.showIf), this.contentEl.appendChild(o.element), this.children.push(o), o;
+    }
+    const n = e ? e.charAt(0).toUpperCase() + e.slice(1) : "", s = new j(
+      n,
+      i,
+      e,
+      t || [],
+      this.bindingEngine,
+      this.presetManager,
+      this.soundEngine
+    );
+    return this.contentEl.appendChild(s.element), this.children.push(s), s;
+  }
+  createSegmented(i, e, t) {
+    return this.addSegmented(i, e, t);
+  }
+  addStatus(i, e, t = "online", n, s) {
+    if (typeof i == "object" && i !== null && e === void 0 && "object" in i && "property" in i) {
+      const c = i, u = c.label || c.property.charAt(0).toUpperCase() + c.property.slice(1), p = new F(
+        u,
+        c.object,
+        c.property,
+        this.bindingEngine
+      );
+      return c.status && p.setStatus(c.status, c.badge, c.detail), c.badge && p.setBadge(c.badge), c.detail && p.setDetail(c.detail), c.tooltip && p.setTooltip(c.tooltip), c.contextMenu && p.setContextMenu(c.contextMenu), c.listen && p.listen(), c.showIf && p.showIf(c.showIf), this.contentEl.appendChild(p.element), this.children.push(p), p;
+    }
+    const r = e ? e.charAt(0).toUpperCase() + e.slice(1) : typeof i == "string" ? i : "Status", l = typeof i == "string" ? void 0 : i, o = typeof i == "string" ? void 0 : e, h = new F(
+      r,
+      l,
+      o,
+      this.bindingEngine
+    );
+    return h.setStatus(t, n, s), this.contentEl.appendChild(h.element), this.children.push(h), h;
+  }
+  createStatus(i, e, t = "online", n, s) {
+    return this.addStatus(i, e, t, n, s);
+  }
+  addRow() {
+    const i = new K(this.bindingEngine, this.presetManager, this.soundEngine);
+    return this.contentEl.appendChild(i.element), this.children.push(i), i;
+  }
+  createRow() {
+    return this.addRow();
+  }
+  addSection(i = "Section", e = !1) {
+    let t = "", n = e;
+    typeof i == "object" && i !== null ? (t = i.label || i.title || "Section", i.collapsed !== void 0 && (n = i.collapsed)) : t = i || "Section";
+    const s = new q(t, this.bindingEngine, this.presetManager, n, this.soundEngine);
+    return s.setParentContainer(this), this.contentEl.appendChild(s.element), this.children.push(s), s;
+  }
+  addFolder(i = "Folder", e = !1) {
+    return this.addSection(i, e);
+  }
+  createSection(i = "Section", e = !1) {
+    return this.addSection(i, e);
+  }
+  createFolder(i = "Folder", e = !1) {
+    return this.addSection(i, e);
+  }
+  createComponent(i) {
+    let e;
+    const t = i.label || (i.property ? i.property : i.type);
+    switch (i.type) {
+      case "checkbox":
+        e = this.addCheckbox(i.object, i.property);
+        break;
+      case "slider": {
+        const n = this.addSlider(i.object, i.property);
+        i.min !== void 0 && n.setMin(i.min), i.max !== void 0 && n.setMax(i.max), i.step !== void 0 && n.setStep(i.step), e = n;
+        break;
+      }
+      case "button":
+        e = this.addButton(t, i.onClick);
+        break;
+      case "select":
+        e = this.addSelect(i.object, i.property, i.options);
+        break;
+      case "dynamicLabel": {
+        const n = this.addDynamicLabel(i.object, i.property);
+        i.format && n.setFormat(i.format), e = n;
+        break;
+      }
+      case "graph": {
+        const n = this.addGraph(i.object, i.property);
+        i.range && n.setRange(i.range[0], i.range[1]), i.color && n.setColor(i.color, i.fillColor), i.bufferSize && n.setBufferSize(i.bufferSize), e = n;
+        break;
+      }
+      case "color": {
+        const n = this.addColor(i.object, i.property);
+        i.swatches && n.setSwatches(i.swatches), e = n;
+        break;
+      }
+      case "point2d": {
+        const n = this.addPoint2D(i.object, i.property);
+        i.min !== void 0 && n.setMin(i.min), i.max !== void 0 && n.setMax(i.max), i.step !== void 0 && n.setStep(i.step), e = n;
+        break;
+      }
+      case "point3d":
+      case "vector3": {
+        const n = this.addPoint3D(i.object, i.property);
+        i.min !== void 0 && n.setMin(i.min), i.max !== void 0 && n.setMax(i.max), i.step !== void 0 && n.setStep(i.step), e = n;
+        break;
+      }
+      case "range": {
+        const n = this.addRange(i.object, i.property);
+        i.min !== void 0 && n.setMin(i.min), i.max !== void 0 && n.setMax(i.max), i.step !== void 0 && n.setStep(i.step), e = n;
+        break;
+      }
+      case "segmented": {
+        e = this.addSegmented(i.object, i.property, i.options);
+        break;
+      }
+      case "status": {
+        e = this.addStatus(i.object, i.property, i.status, i.badge, i.detail);
+        break;
+      }
+      case "section":
+      case "folder": {
+        e = this.addSection(t, i.collapsed || !1);
+        break;
+      }
+      default:
+        throw new Error(`[RellyUI] Unknown component type: ${i.type}`);
+    }
+    return t && e.setLabel && e.setLabel(t), i.tooltip && e.setTooltip && e.setTooltip(i.tooltip), i.contextMenu && e.setContextMenu && e.setContextMenu(i.contextMenu), (i.onChange || i.onToggle) && e.onChange && e.onChange(i.onChange || i.onToggle), i.listen && e.listen && e.listen(), i.showIf && e.showIf && e.showIf(i.showIf), i.disabled && e.setDisabled && e.setDisabled(!0), e;
+  }
+  destroyChildren() {
+    for (const i of this.children)
+      i.destroy();
+    this.children = [];
+  }
+}
+class K extends T {
+  constructor(e, t, n) {
+    const s = document.createElement("div");
+    s.className = "relly-multi-row";
+    super(s, e, t, n);
+    a(this, "element");
+    a(this, "disabled", !1);
+    this.element = s;
+  }
+  setDisabled(e) {
+    return this.disabled = e, this.disabled ? this.element.classList.add("relly-disabled") : this.element.classList.remove("relly-disabled"), this;
+  }
+  isDisabled() {
+    return this.disabled;
+  }
+  destroy() {
+    this.destroyChildren(), this.element.remove();
+  }
+}
+class q extends T {
+  constructor(e, t, n, s = !1, r) {
+    const l = document.createElement("div");
+    l.className = "relly-section-content";
+    super(l, t, n, r);
+    a(this, "element");
+    a(this, "headerEl");
+    a(this, "titleEl");
+    a(this, "arrowEl");
+    a(this, "isCollapsed", !1);
+    a(this, "conditionPredicate");
+    a(this, "parentContainer");
+    a(this, "disabled", !1);
+    this.label = e, this.element = document.createElement("div"), this.element.className = "relly-section", this.headerEl = document.createElement("div"), this.headerEl.className = "relly-section-header";
+    const o = document.createElement("div");
+    o.className = "relly-section-title-wrap", this.arrowEl = document.createElement("span"), this.arrowEl.innerHTML = `
+      <svg class="relly-section-arrow" viewBox="0 0 10 10">
+        <polygon points="2,1 8,5 2,9"></polygon>
+      </svg>
+    `, this.titleEl = document.createElement("span"), this.titleEl.textContent = e, o.appendChild(this.arrowEl), o.appendChild(this.titleEl), this.headerEl.appendChild(o), this.element.appendChild(this.headerEl), this.element.appendChild(this.contentEl), this.headerEl.addEventListener("click", () => {
+      var h;
+      this.disabled || ((h = this.soundEngine) == null || h.playClick(), this.toggle());
+    }), s && this.setCollapsed(!0);
+  }
+  setParentContainer(e) {
+    return this.parentContainer = e, this;
+  }
+  setDisabled(e) {
+    return this.disabled = e, this.disabled ? this.element.classList.add("relly-disabled") : this.element.classList.remove("relly-disabled"), this;
+  }
+  isDisabled() {
+    return this.disabled;
+  }
+  setLabel(e) {
+    return this.label = e, this.titleEl.textContent = e, this;
+  }
+  getLabel() {
+    return this.label;
+  }
+  toggle() {
+    return this.setCollapsed(!this.isCollapsed);
+  }
+  setCollapsed(e) {
+    return this.isCollapsed = e, this.isCollapsed ? this.element.classList.add("relly-section--collapsed") : (this.element.classList.remove("relly-section--collapsed"), this.parentContainer && this.parentContainer.onSectionExpanded(this)), this;
+  }
+  showIf(e) {
+    return this.conditionPredicate = e, this.checkVisibility(), this.bindingEngine.register(this), this;
+  }
+  checkVisibility() {
+    if (!this.conditionPredicate) return !0;
+    const e = this.conditionPredicate();
+    return this.element.style.display = e ? "" : "none", e;
+  }
+  checkDirty() {
+    this.checkVisibility();
+  }
+  destroy() {
+    this.conditionPredicate && this.bindingEngine.unregister(this), this.destroyChildren(), this.element.remove();
+  }
+}
+class G {
+  constructor() {
+    a(this, "listeners", /* @__PURE__ */ new Set());
+    a(this, "rafId", null);
+    a(this, "isRunning", !1);
+    a(this, "isPaused", !1);
+  }
+  register(i) {
+    this.listeners.add(i), !this.isRunning && !this.isPaused && this.start();
+  }
+  unregister(i) {
+    this.listeners.delete(i), this.listeners.size === 0 && this.stop();
+  }
+  pause() {
+    this.isPaused = !0, this.stop();
+  }
+  resume() {
+    this.isPaused = !1, this.listeners.size > 0 && !this.isRunning && this.start();
+  }
+  start() {
+    if (typeof window > "u") return;
+    this.isRunning = !0;
+    const i = () => {
+      if (this.isRunning) {
+        for (const e of this.listeners)
+          e.checkDirty();
+        this.rafId = requestAnimationFrame(i);
+      }
+    };
+    this.rafId = requestAnimationFrame(i);
+  }
+  stop() {
+    this.isRunning = !1, this.rafId !== null && typeof window < "u" && (cancelAnimationFrame(this.rafId), this.rafId = null);
+  }
+  destroy() {
+    this.stop(), this.listeners.clear();
+  }
+}
+class W {
+  constructor() {
+    a(this, "components", /* @__PURE__ */ new Set());
+    a(this, "pendingValues", {});
+    a(this, "changeCallback");
+  }
+  setOnChange(i) {
+    this.changeCallback = i;
+  }
+  notifyChange() {
+    var i;
+    (i = this.changeCallback) == null || i.call(this);
+  }
+  register(i) {
+    this.components.add(i);
+    const e = i.getSerializableKey();
+    e && e in this.pendingValues && i.setValue(this.pendingValues[e]);
+  }
+  setPendingValues(i) {
+    this.pendingValues = { ...this.pendingValues, ...i };
+    for (const e of this.components) {
+      const t = e.getSerializableKey();
+      t && t in this.pendingValues && e.setValue(this.pendingValues[t]);
+    }
+  }
+  getPendingValues() {
+    return { ...this.pendingValues };
+  }
+  unregister(i) {
+    this.components.delete(i);
+  }
+  export() {
+    const i = { ...this.pendingValues };
+    for (const e of this.components) {
+      const t = e.getSerializableKey();
+      t && (i[t] = e.getValue());
+    }
+    return i;
+  }
+  import(i) {
+    !i || typeof i != "object" || this.setPendingValues(i);
+  }
+  save(i = "relly-ui-preset") {
+    if (!(typeof window > "u" || !window.localStorage))
+      try {
+        const e = this.export();
+        window.localStorage.setItem(i, JSON.stringify(e));
+      } catch (e) {
+        console.warn("[RellyUI] Failed to save preset to localStorage", e);
+      }
+  }
+  load(i = "relly-ui-preset") {
+    if (!(typeof window > "u" || !window.localStorage))
+      try {
+        const e = window.localStorage.getItem(i);
+        if (e) {
+          const t = JSON.parse(e);
+          this.import(t);
+        }
+      } catch (e) {
+        console.warn("[RellyUI] Failed to load preset from localStorage", e);
+      }
+  }
+  clear() {
+    this.components.clear(), this.pendingValues = {};
+  }
+}
+const U = {
+  bg: "#1c1d22",
+  fg: "#d1d5db",
+  headerBg: "#141518",
+  headerFg: "#f3f4f6",
+  accent: "#6366f1",
+  accentHover: "#4f46e5",
+  border: "rgba(255, 255, 255, 0.08)",
+  inputBg: "#26272e",
+  inputHover: "#2f3039",
+  radius: "6px",
+  font: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
+  fontSize: "11px",
+  rowHeight: "26px"
+}, X = {
+  bg: "#ffffff",
+  fg: "#374151",
+  headerBg: "#f3f4f6",
+  headerFg: "#111827",
+  accent: "#4f46e5",
+  accentHover: "#4338ca",
+  border: "#e5e7eb",
+  inputBg: "#f9fafb",
+  inputHover: "#f3f4f6",
+  radius: "6px",
+  font: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif',
+  fontSize: "11px",
+  rowHeight: "26px"
+}, J = {
+  bg: "#0f051d",
+  fg: "#e0f2fe",
+  headerBg: "#180a33",
+  headerFg: "#00f0ff",
+  accent: "#00f0ff",
+  accentHover: "#ff007f",
+  border: "rgba(0, 240, 255, 0.25)",
+  inputBg: "#1e0d3d",
+  inputHover: "#2d145c",
+  radius: "4px",
+  font: '"JetBrains Mono", Consolas, monospace',
+  fontSize: "11px",
+  rowHeight: "26px"
+}, Y = {
+  bg: "#2e3440",
+  fg: "#d8dee9",
+  headerBg: "#242933",
+  headerFg: "#eceff4",
+  accent: "#88c0d0",
+  accentHover: "#81a1c1",
+  border: "#3b4252",
+  inputBg: "#3b4252",
+  inputHover: "#434c5e",
+  radius: "6px",
+  font: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+  fontSize: "11px",
+  rowHeight: "26px"
+}, _ = {
+  bg: "#282a36",
+  fg: "#f8f8f2",
+  headerBg: "#1e1f29",
+  headerFg: "#bd93f9",
+  accent: "#bd93f9",
+  accentHover: "#ff79c6",
+  border: "#44475a",
+  inputBg: "#44475a",
+  inputHover: "#6272a4",
+  radius: "6px",
+  font: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+  fontSize: "11px",
+  rowHeight: "26px"
+}, Q = {
+  bg: "#1a1b26",
+  fg: "#a9b1d6",
+  headerBg: "#16161e",
+  headerFg: "#7aa2f7",
+  accent: "#7aa2f7",
+  accentHover: "#bb9af7",
+  border: "rgba(122, 162, 247, 0.18)",
+  inputBg: "#24283b",
+  inputHover: "#2f3549",
+  radius: "6px",
+  font: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+  fontSize: "11px",
+  rowHeight: "26px"
+}, Z = {
+  bg: "#0a0f0d",
+  fg: "#00ff66",
+  headerBg: "#050a08",
+  headerFg: "#00ff66",
+  accent: "#00ff66",
+  accentHover: "#33ff88",
+  border: "rgba(0, 255, 102, 0.25)",
+  inputBg: "#0d1812",
+  inputHover: "#13241b",
+  radius: "3px",
+  font: '"JetBrains Mono", Consolas, monospace',
+  fontSize: "11px",
+  rowHeight: "26px"
+}, O = {
+  bg: "#241b2f",
+  fg: "#f8f8f2",
+  headerBg: "#191322",
+  headerFg: "#ff71ce",
+  accent: "#ff71ce",
+  accentHover: "#01cdfe",
+  border: "rgba(255, 113, 206, 0.25)",
+  inputBg: "#2f233f",
+  inputHover: "#3c2c51",
+  radius: "6px",
+  font: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+  fontSize: "11px",
+  rowHeight: "26px"
+};
+class ee {
+  constructor(i, e) {
+    a(this, "currentTheme");
+    a(this, "currentThemeName");
+    this.panelElement = i, this.currentTheme = { ...U }, this.currentThemeName = "dark", e ? this.applyTheme(e) : this.applyToDOM(this.currentTheme);
+  }
+  applyTheme(i) {
+    typeof i == "string" && (this.currentThemeName = i), i === "light" ? this.currentTheme = { ...X } : i === "dark" ? this.currentTheme = { ...U } : i === "cyberpunk" ? this.currentTheme = { ...J } : i === "nord" ? this.currentTheme = { ...Y } : i === "dracula" ? this.currentTheme = { ..._ } : i === "tokyo-night" ? this.currentTheme = { ...Q } : i === "matrix" ? this.currentTheme = { ...Z } : i === "synthwave" ? this.currentTheme = { ...O } : typeof i == "object" && (this.currentTheme = { ...this.currentTheme, ...i }, this.currentThemeName = "custom"), this.applyToDOM(this.currentTheme);
+  }
+  getCurrentThemeName() {
+    return this.currentThemeName;
+  }
+  applyToDOM(i) {
+    const e = this.panelElement;
+    e.style.setProperty("--relly-bg", i.bg), e.style.setProperty("--relly-fg", i.fg), e.style.setProperty("--relly-header-bg", i.headerBg), e.style.setProperty("--relly-header-fg", i.headerFg), e.style.setProperty("--relly-accent", i.accent), e.style.setProperty("--relly-accent-hover", i.accentHover), e.style.setProperty("--relly-border", i.border), e.style.setProperty("--relly-input-bg", i.inputBg), e.style.setProperty("--relly-input-hover", i.inputHover), e.style.setProperty("--relly-radius", i.radius), e.style.setProperty("--relly-font", i.font), e.style.setProperty("--relly-font-size", i.fontSize), e.style.setProperty("--relly-row-height", i.rowHeight);
+  }
+  getTheme() {
+    return { ...this.currentTheme };
+  }
+}
+class te {
+  constructor(i, e, t) {
+    a(this, "isDragging", !1);
+    a(this, "startX", 0);
+    a(this, "startY", 0);
+    a(this, "initialLeft", 0);
+    a(this, "initialTop", 0);
+    a(this, "wasSnapped", !1);
+    a(this, "snapThreshold", 18);
+    a(this, "magneticSnap", !0);
+    a(this, "onMouseDownBound");
+    a(this, "onMouseMoveBound");
+    a(this, "onMouseUpBound");
+    a(this, "onResizeBound");
+    this.handle = i, this.panel = e, this.soundEngine = t, this.onMouseDownBound = this.onMouseDown.bind(this), this.onMouseMoveBound = this.onMouseMove.bind(this), this.onMouseUpBound = this.onMouseUp.bind(this), this.onResizeBound = this.onResize.bind(this), this.handle.addEventListener("mousedown", this.onMouseDownBound), typeof window < "u" && window.addEventListener("resize", this.onResizeBound);
+  }
+  clampToViewport() {
+    if (typeof window > "u") return;
+    const i = this.panel.getBoundingClientRect(), e = i.width, t = i.height, n = Math.max(0, window.innerWidth - e), s = Math.max(0, window.innerHeight - t);
+    let r = i.left, l = i.top;
+    r > n && (r = n), r < 0 && (r = 0), l > s && (l = s), l < 0 && (l = 0), this.panel.style.left = `${Math.round(r)}px`, this.panel.style.top = `${Math.round(l)}px`, this.panel.style.right = "auto", this.panel.style.bottom = "auto";
+  }
+  onResize() {
+    this.clampToViewport();
+  }
+  onMouseDown(i) {
+    if (i.button !== 0 || i.target.closest(".relly-header-btn")) return;
+    this.isDragging = !0, this.startX = i.clientX, this.startY = i.clientY;
+    const e = this.panel.getBoundingClientRect();
+    this.initialLeft = e.left, this.initialTop = e.top, this.panel.style.right = "auto", this.panel.style.bottom = "auto", this.panel.style.left = `${this.initialLeft}px`, this.panel.style.top = `${this.initialTop}px`, window.addEventListener("mousemove", this.onMouseMoveBound), window.addEventListener("mouseup", this.onMouseUpBound), i.preventDefault();
+  }
+  onMouseMove(i) {
+    var p;
+    if (!this.isDragging) return;
+    const e = i.clientX - this.startX, t = i.clientY - this.startY;
+    let n = this.initialLeft + e, s = this.initialTop + t;
+    const r = this.panel.getBoundingClientRect(), l = r.width, o = r.height, h = Math.max(0, window.innerWidth - l), c = Math.max(0, window.innerHeight - o);
+    let u = !1;
+    this.magneticSnap && (Math.abs(n) < this.snapThreshold ? (n = 0, u = !0) : Math.abs(n - h) < this.snapThreshold && (n = h, u = !0), Math.abs(s) < this.snapThreshold ? (s = 0, u = !0) : Math.abs(s - c) < this.snapThreshold && (s = c, u = !0), u && !this.wasSnapped && ((p = this.soundEngine) == null || p.playSnap()), this.wasSnapped = u), n = Math.max(0, Math.min(n, h)), s = Math.max(0, Math.min(s, c)), this.panel.style.left = `${n}px`, this.panel.style.top = `${s}px`;
+  }
+  onMouseUp() {
+    this.isDragging = !1, this.wasSnapped = !1, window.removeEventListener("mousemove", this.onMouseMoveBound), window.removeEventListener("mouseup", this.onMouseUpBound);
+  }
+  destroy() {
+    this.handle.removeEventListener("mousedown", this.onMouseDownBound), typeof window < "u" && (window.removeEventListener("mousemove", this.onMouseMoveBound), window.removeEventListener("mouseup", this.onMouseUpBound), window.removeEventListener("resize", this.onResizeBound));
+  }
+}
+class ie {
+  constructor(i, e = 240, t = 120) {
+    a(this, "handleEl");
+    a(this, "isResizing", !1);
+    a(this, "startX", 0);
+    a(this, "startY", 0);
+    a(this, "initialWidth", 0);
+    a(this, "initialHeight", 0);
+    a(this, "onMouseDownBound");
+    a(this, "onMouseMoveBound");
+    a(this, "onMouseUpBound");
+    a(this, "onResizeBound");
+    this.panel = i, this.minWidth = e, this.minHeight = t, this.handleEl = document.createElement("div"), this.handleEl.className = "relly-resize-handle", this.handleEl.title = "Drag to resize panel", this.handleEl.innerHTML = `
+      <svg viewBox="0 0 10 10">
+        <line x1="8" y1="2" x2="2" y2="8"></line>
+        <line x1="8" y1="5" x2="5" y2="8"></line>
+        <line x1="8" y1="8" x2="8" y2="8"></line>
+      </svg>
+    `, this.panel.appendChild(this.handleEl), this.onMouseDownBound = this.onMouseDown.bind(this), this.onMouseMoveBound = this.onMouseMove.bind(this), this.onMouseUpBound = this.onMouseUp.bind(this), this.onResizeBound = this.onWindowResize.bind(this), this.handleEl.addEventListener("mousedown", this.onMouseDownBound), typeof window < "u" && window.addEventListener("resize", this.onResizeBound);
+  }
+  clampToViewport() {
+    if (typeof window > "u") return;
+    const i = this.panel.getBoundingClientRect(), e = Math.max(this.minWidth, window.innerWidth - 16), t = Math.max(this.minHeight, window.innerHeight - 16);
+    let n = i.width, s = i.height;
+    n > e && (n = e, this.panel.style.width = `${Math.round(n)}px`), s > t && (s = t, this.panel.style.height = `${Math.round(s)}px`);
+  }
+  onWindowResize() {
+    this.clampToViewport();
+  }
+  onMouseDown(i) {
+    if (i.button !== 0) return;
+    this.isResizing = !0, this.startX = i.clientX, this.startY = i.clientY;
+    const e = this.panel.getBoundingClientRect();
+    this.initialWidth = e.width, this.initialHeight = e.height, window.addEventListener("mousemove", this.onMouseMoveBound), window.addEventListener("mouseup", this.onMouseUpBound), i.preventDefault(), i.stopPropagation();
+  }
+  onMouseMove(i) {
+    if (!this.isResizing) return;
+    const e = i.clientX - this.startX, t = i.clientY - this.startY, n = this.panel.getBoundingClientRect(), s = Math.max(this.minWidth, window.innerWidth - n.left - 8), r = Math.max(this.minHeight, window.innerHeight - n.top - 8), l = Math.max(this.minWidth, Math.min(s, this.initialWidth + e)), o = Math.max(
+      this.minHeight,
+      Math.min(r, this.initialHeight + t)
+    );
+    this.panel.style.width = `${Math.round(l)}px`, this.panel.style.height = `${Math.round(o)}px`;
+    const h = this.panel.querySelector(".relly-body");
+    h && (h.style.maxHeight = "none", h.style.flex = "1");
+  }
+  onMouseUp() {
+    this.isResizing = !1, window.removeEventListener("mousemove", this.onMouseMoveBound), window.removeEventListener("mouseup", this.onMouseUpBound);
+  }
+  destroy() {
+    this.handleEl.removeEventListener("mousedown", this.onMouseDownBound), typeof window < "u" && (window.removeEventListener("mousemove", this.onMouseMoveBound), window.removeEventListener("mouseup", this.onMouseUpBound), window.removeEventListener("resize", this.onResizeBound)), this.handleEl.remove();
+  }
+}
+class ne {
+  constructor(i, e) {
+    a(this, "onKeyDownBound");
+    this.hotkey = i, this.onToggle = e, this.onKeyDownBound = this.onKeyDown.bind(this), this.hotkey && typeof window < "u" && window.addEventListener("keydown", this.onKeyDownBound);
+  }
+  onKeyDown(i) {
+    var n;
+    if (!this.hotkey) return;
+    const e = typeof i.composedPath == "function" ? i.composedPath() : [];
+    for (const s of e)
+      if (s instanceof HTMLElement) {
+        const r = s.tagName;
+        if (r === "INPUT" || r === "TEXTAREA" || r === "SELECT" || s.isContentEditable || s.classList.contains("relly-search-input"))
+          return;
+      }
+    let t = document.activeElement;
+    for (; t && t.shadowRoot && t.shadowRoot.activeElement; )
+      t = t.shadowRoot.activeElement;
+    t && (t.tagName === "INPUT" || t.tagName === "TEXTAREA" || t.tagName === "SELECT" || t.isContentEditable || (n = t == null ? void 0 : t.classList) != null && n.contains("relly-search-input")) || (i.code === this.hotkey || i.key.toLowerCase() === this.hotkey.toLowerCase()) && (i.preventDefault(), this.onToggle());
+  }
+  setHotkey(i) {
+    this.hotkey = i;
+  }
+  destroy() {
+    typeof window < "u" && window.removeEventListener("keydown", this.onKeyDownBound);
+  }
+}
+class se {
+  constructor(i, e = {}) {
+    a(this, "element");
+    a(this, "inputEl");
+    a(this, "clearBtn");
+    a(this, "ignoreCase");
+    a(this, "onGlobalKeyDownBound");
+    this.bodyEl = i, this.ignoreCase = e.ignoreCase !== !1, this.element = document.createElement("div"), this.element.className = "relly-search-bar", this.inputEl = document.createElement("input"), this.inputEl.type = "text", this.inputEl.className = "relly-search-input", this.inputEl.placeholder = e.placeholder || 'Filter settings... (Press "/" to focus)', this.clearBtn = document.createElement("button"), this.clearBtn.className = "relly-search-clear", this.clearBtn.textContent = "✕", this.clearBtn.title = "Clear search", this.clearBtn.style.display = "none", this.element.appendChild(this.inputEl), this.element.appendChild(this.clearBtn), this.inputEl.addEventListener("input", () => {
+      this.filter(this.inputEl.value);
+    }), this.inputEl.addEventListener("keydown", (t) => {
+      t.stopPropagation(), t.key === "Escape" && (this.clear(), this.inputEl.blur());
+    }), this.inputEl.addEventListener("keyup", (t) => {
+      t.stopPropagation();
+    }), this.inputEl.addEventListener("keypress", (t) => {
+      t.stopPropagation();
+    }), this.clearBtn.addEventListener("click", () => {
+      this.clear(), this.inputEl.focus();
+    }), this.onGlobalKeyDownBound = this.onGlobalKeyDown.bind(this), typeof window < "u" && window.addEventListener("keydown", this.onGlobalKeyDownBound);
+  }
+  onGlobalKeyDown(i) {
+    var e;
+    if (i.key === "/") {
+      const t = typeof i.composedPath == "function" ? i.composedPath() : [];
+      for (const r of t)
+        if (r instanceof HTMLElement) {
+          const l = r.tagName;
+          if (l === "INPUT" || l === "TEXTAREA" || l === "SELECT" || r.isContentEditable || r.classList.contains("relly-search-input"))
+            return;
+        }
+      let n = document.activeElement;
+      for (; n && n.shadowRoot && n.shadowRoot.activeElement; )
+        n = n.shadowRoot.activeElement;
+      n instanceof HTMLInputElement || n instanceof HTMLTextAreaElement || n instanceof HTMLSelectElement || (n == null ? void 0 : n.isContentEditable) || ((e = n == null ? void 0 : n.classList) == null ? void 0 : e.contains("relly-search-input")) || (i.preventDefault(), this.focus());
+    }
+  }
+  focus() {
+    return this.inputEl.focus(), this.inputEl.select(), this;
+  }
+  getInput() {
+    return this.inputEl;
+  }
+  filter(i) {
+    const e = i.trim();
+    if (!e) {
+      this.clearBtn.style.display = "none", this.resetFilter();
+      return;
+    }
+    this.clearBtn.style.display = "block";
+    const t = this.ignoreCase ? e.toLowerCase() : e;
+    this.bodyEl.querySelectorAll(".relly-row, .relly-graph-row").forEach((r) => {
+      const l = r.querySelector(".relly-row-label, .relly-graph-header span"), o = (l == null ? void 0 : l.textContent) || "";
+      if ((this.ignoreCase ? o.toLowerCase() : o).includes(t)) {
+        r.classList.remove("relly-search-hidden");
+        const u = r.closest(".relly-section");
+        u && (u.classList.remove("relly-section--collapsed"), u.classList.remove("relly-search-hidden"));
+      } else
+        r.classList.add("relly-search-hidden");
+    }), this.bodyEl.querySelectorAll(".relly-section").forEach((r) => {
+      const l = r.querySelector(".relly-section-title-wrap span:last-child"), o = (l == null ? void 0 : l.textContent) || "";
+      (this.ignoreCase ? o.toLowerCase() : o).includes(t) ? (r.classList.remove("relly-search-hidden"), r.classList.remove("relly-section--collapsed"), r.querySelectorAll(".relly-row, .relly-graph-row").forEach((c) => {
+        c.classList.remove("relly-search-hidden");
+      })) : r.querySelectorAll(
+        ".relly-row:not(.relly-search-hidden), .relly-graph-row:not(.relly-search-hidden)"
+      ).length === 0 && r.classList.add("relly-search-hidden");
+    });
+  }
+  clear() {
+    this.inputEl.value = "", this.clearBtn.style.display = "none", this.resetFilter();
+  }
+  resetFilter() {
+    this.bodyEl.querySelectorAll(".relly-search-hidden").forEach((e) => {
+      e.classList.remove("relly-search-hidden");
+    });
+  }
+  destroy() {
+    typeof window < "u" && window.removeEventListener("keydown", this.onGlobalKeyDownBound), this.element.remove();
+  }
+}
+class re {
+  constructor(i = !0, e = "synth") {
+    a(this, "ctx", null);
+    a(this, "enabled", !0);
+    a(this, "volume", 1);
+    a(this, "soundPack", "synth");
+    this.enabled = i, this.soundPack = e;
+  }
+  setEnabled(i) {
+    this.enabled = i;
+  }
+  isEnabled() {
+    return this.enabled;
+  }
+  setVolume(i) {
+    this.volume = Math.max(0, Math.min(1, i));
+  }
+  getVolume() {
+    return this.volume;
+  }
+  setSoundPack(i) {
+    return this.soundPack = i, this;
+  }
+  getSoundPack() {
+    return this.soundPack;
+  }
+  initCtx() {
+    if (!this.enabled || this.volume <= 0 || typeof window > "u") return null;
+    if (!this.ctx) {
+      const i = window.AudioContext || window.webkitAudioContext;
+      i && (this.ctx = new i());
+    }
+    return this.ctx && this.ctx.state === "suspended" && this.ctx.resume().catch(() => {
+    }), this.ctx;
+  }
+  playClick() {
+    const i = this.initCtx();
+    if (i)
+      try {
+        const e = i.currentTime, t = i.createOscillator(), n = i.createGain();
+        this.soundPack === "mechanical" ? (t.type = "triangle", t.frequency.setValueAtTime(2400, e), t.frequency.exponentialRampToValueAtTime(450, e + 0.012), n.gain.setValueAtTime(0.06 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.012), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.013)) : this.soundPack === "bubble" ? (t.type = "sine", t.frequency.setValueAtTime(320, e), t.frequency.exponentialRampToValueAtTime(1250, e + 0.022), n.gain.setValueAtTime(0.045 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.022), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.024)) : this.soundPack === "arcade" ? (t.type = "square", t.frequency.setValueAtTime(987.77, e), t.frequency.setValueAtTime(1318.51, e + 0.01), n.gain.setValueAtTime(0.028 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.02), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.022)) : (t.type = "sine", t.frequency.setValueAtTime(800, e), t.frequency.exponentialRampToValueAtTime(350, e + 0.015), n.gain.setValueAtTime(0.04 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.015), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.016));
+      } catch {
+      }
+  }
+  playToggle(i) {
+    const e = this.initCtx();
+    if (e)
+      try {
+        const t = e.currentTime, n = e.createOscillator(), s = e.createGain();
+        if (this.soundPack === "mechanical") {
+          n.type = "triangle";
+          const r = i ? 2800 : 1800, l = i ? 900 : 400;
+          n.frequency.setValueAtTime(r, t), n.frequency.exponentialRampToValueAtTime(l, t + 0.018), s.gain.setValueAtTime(0.055 * this.volume, t), s.gain.exponentialRampToValueAtTime(1e-4, t + 0.018), n.connect(s), s.connect(e.destination), n.start(t), n.stop(t + 0.02);
+        } else if (this.soundPack === "bubble") {
+          n.type = "sine";
+          const r = i ? 380 : 900, l = i ? 1100 : 280;
+          n.frequency.setValueAtTime(r, t), n.frequency.exponentialRampToValueAtTime(l, t + 0.028), s.gain.setValueAtTime(0.045 * this.volume, t), s.gain.exponentialRampToValueAtTime(1e-4, t + 0.028), n.connect(s), s.connect(e.destination), n.start(t), n.stop(t + 0.03);
+        } else if (this.soundPack === "arcade") {
+          n.type = "square";
+          const r = i ? 523.25 : 659.25, l = i ? 783.99 : 392;
+          n.frequency.setValueAtTime(r, t), n.frequency.setValueAtTime(l, t + 0.015), s.gain.setValueAtTime(0.025 * this.volume, t), s.gain.exponentialRampToValueAtTime(1e-4, t + 0.03), n.connect(s), s.connect(e.destination), n.start(t), n.stop(t + 0.032);
+        } else {
+          n.type = "triangle";
+          const r = i ? 650 : 450;
+          n.frequency.setValueAtTime(r, t), n.frequency.exponentialRampToValueAtTime(r * 1.1, t + 0.025), s.gain.setValueAtTime(0.035 * this.volume, t), s.gain.exponentialRampToValueAtTime(1e-4, t + 0.025), n.connect(s), s.connect(e.destination), n.start(t), n.stop(t + 0.026);
+        }
+      } catch {
+      }
+  }
+  playNotify() {
+    const i = this.initCtx();
+    if (i)
+      try {
+        const e = i.currentTime;
+        if (this.soundPack === "arcade") {
+          const t = i.createOscillator(), n = i.createGain();
+          t.type = "square", t.frequency.setValueAtTime(523.25, e), t.frequency.setValueAtTime(659.25, e + 0.04), t.frequency.setValueAtTime(783.99, e + 0.08), t.frequency.setValueAtTime(1046.5, e + 0.12), n.gain.setValueAtTime(0.03 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.18), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.19);
+        } else if (this.soundPack === "bubble") {
+          const t = i.createOscillator(), n = i.createGain();
+          t.type = "sine", t.frequency.setValueAtTime(400, e), t.frequency.exponentialRampToValueAtTime(950, e + 0.05), n.gain.setValueAtTime(0.04 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.05), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.06);
+          const s = i.createOscillator(), r = i.createGain();
+          s.type = "sine", s.frequency.setValueAtTime(550, e + 0.05), s.frequency.exponentialRampToValueAtTime(1400, e + 0.11), r.gain.setValueAtTime(0.04 * this.volume, e + 0.05), r.gain.exponentialRampToValueAtTime(1e-4, e + 0.11), s.connect(r), r.connect(i.destination), s.start(e + 0.05), s.stop(e + 0.12);
+        } else {
+          const t = i.createOscillator(), n = i.createGain();
+          t.type = this.soundPack === "mechanical" ? "triangle" : "sine", t.frequency.setValueAtTime(523.25, e), n.gain.setValueAtTime(0.04 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.06), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.07);
+          const s = i.createOscillator(), r = i.createGain();
+          s.type = this.soundPack === "mechanical" ? "triangle" : "sine", s.frequency.setValueAtTime(783.99, e + 0.05), r.gain.setValueAtTime(0.04 * this.volume, e + 0.05), r.gain.exponentialRampToValueAtTime(1e-4, e + 0.12), s.connect(r), r.connect(i.destination), s.start(e + 0.05), s.stop(e + 0.13);
+        }
+      } catch {
+      }
+  }
+  playSnap() {
+    const i = this.initCtx();
+    if (i)
+      try {
+        const e = i.currentTime, t = i.createOscillator(), n = i.createGain();
+        this.soundPack === "mechanical" ? (t.type = "triangle", t.frequency.setValueAtTime(450, e), t.frequency.exponentialRampToValueAtTime(120, e + 0.025), n.gain.setValueAtTime(0.06 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.025)) : this.soundPack === "bubble" ? (t.type = "sine", t.frequency.setValueAtTime(260, e), t.frequency.exponentialRampToValueAtTime(650, e + 0.035), n.gain.setValueAtTime(0.05 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.035)) : this.soundPack === "arcade" ? (t.type = "square", t.frequency.setValueAtTime(220, e), t.frequency.setValueAtTime(110, e + 0.015), n.gain.setValueAtTime(0.035 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.035)) : (t.type = "sine", t.frequency.setValueAtTime(260, e), t.frequency.exponentialRampToValueAtTime(80, e + 0.03), n.gain.setValueAtTime(0.04 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.03)), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.038);
+      } catch {
+      }
+  }
+  playMiniHud(i = !0) {
+    const e = this.initCtx();
+    if (e)
+      try {
+        const t = e.currentTime, n = e.createOscillator(), s = e.createGain();
+        n.type = this.soundPack === "arcade" ? "square" : "sine";
+        const r = i ? 380 : 640, l = i ? 680 : 340;
+        n.frequency.setValueAtTime(r, t), n.frequency.exponentialRampToValueAtTime(l, t + 0.05), s.gain.setValueAtTime(0.03 * this.volume, t), s.gain.exponentialRampToValueAtTime(1e-4, t + 0.05), n.connect(s), s.connect(e.destination), n.start(t), n.stop(t + 0.055);
+      } catch {
+      }
+  }
+  playTick() {
+    const i = this.initCtx();
+    if (i)
+      try {
+        const e = i.currentTime, t = i.createOscillator(), n = i.createGain();
+        this.soundPack === "mechanical" ? (t.type = "triangle", t.frequency.setValueAtTime(3200, e), t.frequency.exponentialRampToValueAtTime(800, e + 6e-3), n.gain.setValueAtTime(0.03 * this.volume, e)) : this.soundPack === "bubble" ? (t.type = "sine", t.frequency.setValueAtTime(850, e), t.frequency.exponentialRampToValueAtTime(1350, e + 0.01), n.gain.setValueAtTime(0.02 * this.volume, e)) : this.soundPack === "arcade" ? (t.type = "square", t.frequency.setValueAtTime(1174.66, e), n.gain.setValueAtTime(0.018 * this.volume, e)) : (t.type = "sine", t.frequency.setValueAtTime(1800, e), t.frequency.exponentialRampToValueAtTime(800, e + 8e-3), n.gain.setValueAtTime(0.015 * this.volume, e)), n.gain.exponentialRampToValueAtTime(1e-4, e + 9e-3), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.01);
+      } catch {
+      }
+  }
+  playTab() {
+    const i = this.initCtx();
+    if (i)
+      try {
+        const e = i.currentTime, t = i.createOscillator(), n = i.createGain();
+        this.soundPack === "mechanical" ? (t.type = "triangle", t.frequency.setValueAtTime(1900, e), t.frequency.exponentialRampToValueAtTime(600, e + 0.014), n.gain.setValueAtTime(0.045 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.014), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.016)) : this.soundPack === "bubble" ? (t.type = "sine", t.frequency.setValueAtTime(450, e), t.frequency.exponentialRampToValueAtTime(1100, e + 0.02), n.gain.setValueAtTime(0.04 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.02), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.022)) : this.soundPack === "arcade" ? (t.type = "square", t.frequency.setValueAtTime(659.25, e), n.gain.setValueAtTime(0.025 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.018), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.02)) : (t.type = "triangle", t.frequency.setValueAtTime(700, e), t.frequency.exponentialRampToValueAtTime(500, e + 0.018), n.gain.setValueAtTime(0.03 * this.volume, e), n.gain.exponentialRampToValueAtTime(1e-4, e + 0.018), t.connect(n), n.connect(i.destination), t.start(e), t.stop(e + 0.02));
+      } catch {
+      }
+  }
+}
+class ae {
+  constructor(i, e) {
+    a(this, "element");
+    a(this, "textareaEl");
+    a(this, "errorEl");
+    a(this, "dropzoneEl");
+    a(this, "fileInput");
+    this.parentEl = i, this.onApply = e, this.element = document.createElement("div"), this.element.className = "relly-modal-backdrop";
+    const t = document.createElement("div");
+    t.className = "relly-modal";
+    const n = document.createElement("div");
+    n.className = "relly-modal-header";
+    const s = document.createElement("span");
+    s.className = "relly-modal-title", s.textContent = "Import JSON Config";
+    const r = document.createElement("button");
+    r.className = "relly-header-btn", r.textContent = "✕", r.addEventListener("click", () => this.hide()), n.appendChild(s), n.appendChild(r), t.appendChild(n), this.dropzoneEl = document.createElement("div"), this.dropzoneEl.className = "relly-dropzone", this.dropzoneEl.innerHTML = `
+      <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+        <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
+        <polyline points="17 8 12 3 7 8"></polyline>
+        <line x1="12" y1="3" x2="12" y2="15"></line>
+      </svg>
+      <span>Drag & drop a <strong>.json</strong> file here, or click to browse</span>
+    `, this.fileInput = document.createElement("input"), this.fileInput.type = "file", this.fileInput.accept = ".json,application/json", this.fileInput.style.display = "none", this.dropzoneEl.addEventListener("click", () => this.fileInput.click()), this.fileInput.addEventListener("change", (c) => this.handleFileSelect(c)), this.dropzoneEl.addEventListener("dragover", (c) => {
+      c.preventDefault(), this.dropzoneEl.classList.add("relly-dropzone-drag");
+    }), this.dropzoneEl.addEventListener("dragleave", () => {
+      this.dropzoneEl.classList.remove("relly-dropzone-drag");
+    }), this.dropzoneEl.addEventListener("drop", (c) => {
+      c.preventDefault(), this.dropzoneEl.classList.remove("relly-dropzone-drag"), c.dataTransfer && c.dataTransfer.files.length > 0 && this.readFile(c.dataTransfer.files[0]);
+    }), t.appendChild(this.dropzoneEl), t.appendChild(this.fileInput), this.textareaEl = document.createElement("textarea"), this.textareaEl.className = "relly-import-textarea", this.textareaEl.placeholder = "Paste JSON configuration here...", t.appendChild(this.textareaEl), this.errorEl = document.createElement("div"), this.errorEl.className = "relly-import-error", t.appendChild(this.errorEl);
+    const l = document.createElement("div");
+    l.className = "relly-modal-actions";
+    const o = document.createElement("button");
+    o.className = "relly-btn", o.textContent = "Cancel", o.style.flex = "1", o.addEventListener("click", () => this.hide());
+    const h = document.createElement("button");
+    h.className = "relly-btn relly-btn-primary", h.textContent = "Apply & Load", h.style.flex = "2", h.addEventListener("click", () => this.apply()), l.appendChild(o), l.appendChild(h), t.appendChild(l), this.element.appendChild(t), this.element.addEventListener("click", (c) => {
+      c.target === this.element && this.hide();
+    }), this.parentEl.appendChild(this.element);
+  }
+  handleFileSelect(i) {
+    const e = i.target;
+    e.files && e.files.length > 0 && this.readFile(e.files[0]);
+  }
+  readFile(i) {
+    const e = new FileReader();
+    e.onload = () => {
+      typeof e.result == "string" && (this.textareaEl.value = e.result, this.errorEl.textContent = "");
+    }, e.readAsText(i);
+  }
+  show() {
+    this.errorEl.textContent = "", this.element.classList.add("relly-modal-show"), this.textareaEl.focus();
+  }
+  hide() {
+    this.element.classList.remove("relly-modal-show");
+  }
+  apply() {
+    const i = this.textareaEl.value.trim();
+    if (!i) {
+      this.errorEl.textContent = "Please paste JSON or drop a file.";
+      return;
+    }
+    try {
+      const e = JSON.parse(i);
+      if (typeof e != "object" || e === null)
+        throw new Error("JSON root must be an object.");
+      this.onApply(e), this.hide(), this.textareaEl.value = "", this.errorEl.textContent = "";
+    } catch (e) {
+      this.errorEl.textContent = `Invalid JSON: ${e.message || "Syntax error"}`;
+    }
+  }
+  destroy() {
+    this.element.remove();
+  }
+}
+class le {
+  static load(i, e) {
+    const t = e.target, n = (s, r) => {
+      for (const l of r) {
+        const o = l.children || l.controls;
+        if (l.type === "section") {
+          const h = s.addSection(
+            l.label || "Section",
+            l.collapsed
+          );
+          l.showIf && h.showIf && h.showIf(l.showIf), o && Array.isArray(o) && n(h, o);
+        } else if (l.type === "row") {
+          const h = s.addRow();
+          o && Array.isArray(o) && n(h, o);
+        } else {
+          const h = {
+            ...l,
+            object: l.object !== void 0 ? l.object : t
+          };
+          s.createComponent(h);
+        }
+      }
+    };
+    e.controls && Array.isArray(e.controls) && n(i, e.controls);
+  }
+}
+class oe {
+  constructor(i, e) {
+    a(this, "containerEl");
+    this.parentEl = i, this.soundEngine = e, this.containerEl = document.createElement("div"), this.containerEl.className = "relly-toast-container", this.parentEl.appendChild(this.containerEl);
+  }
+  notify(i, e = "info", t = 2600) {
+    var h;
+    (h = this.soundEngine) == null || h.playNotify();
+    const n = document.createElement("div");
+    n.className = `relly-toast relly-toast--${e}`;
+    const s = document.createElement("span");
+    s.className = "relly-toast-icon", s.innerHTML = this.getIconSvg(e);
+    const r = document.createElement("span");
+    r.className = "relly-toast-msg", r.textContent = i;
+    const l = document.createElement("button");
+    l.className = "relly-toast-close", l.innerHTML = "✕", l.title = "Dismiss", n.appendChild(s), n.appendChild(r), n.appendChild(l);
+    const o = () => {
+      n.classList.contains("relly-toast-leave") || (n.classList.add("relly-toast-leave"), setTimeout(() => {
+        n.parentElement && n.parentElement.removeChild(n);
+      }, 200));
+    };
+    return l.addEventListener("click", (c) => {
+      c.stopPropagation(), o();
+    }), n.addEventListener("click", o), this.containerEl.appendChild(n), requestAnimationFrame(() => {
+      n.classList.add("relly-toast-enter");
+    }), t > 0 && setTimeout(o, t), n;
+  }
+  getIconSvg(i) {
+    switch (i) {
+      case "success":
+        return '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><polyline points="20 6 9 17 4 12"></polyline></svg>';
+      case "warning":
+        return '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>';
+      case "error":
+        return '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><circle cx="12" cy="12" r="10"></circle><line x1="15" y1="9" x2="9" y2="15"></line><line x1="9" y1="9" x2="15" y2="15"></line></svg>';
+      case "info":
+      default:
+        return '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></svg>';
+    }
+  }
+  destroy() {
+    this.containerEl.parentElement && this.containerEl.parentElement.removeChild(this.containerEl);
+  }
+}
+class he {
+  constructor(i, e) {
+    a(this, "menuEl");
+    a(this, "currentComponent");
+    a(this, "onDocClickBound");
+    a(this, "onKeyDownBound");
+    a(this, "onContextMenu", (i) => {
+      let e = i.target, t = e == null ? void 0 : e.closest(".relly-row, .relly-graph-row");
+      if (!t) return;
+      const n = t.__rellyComponent, s = n == null ? void 0 : n.getContextMenu();
+      !s || s.length === 0 || (i.preventDefault(), i.stopPropagation(), this.currentComponent = n, this.show(s, i.clientX, i.clientY));
+    });
+    this.panelEl = i, this.soundEngine = e, this.menuEl = document.createElement("div"), this.menuEl.className = "relly-context-menu", this.menuEl.style.display = "none", this.panelEl.appendChild(this.menuEl), this.onDocClickBound = (t) => {
+      this.menuEl.contains(t.target) || this.hide();
+    }, this.onKeyDownBound = (t) => {
+      t.key === "Escape" && this.hide();
+    }, typeof window < "u" && (window.addEventListener("click", this.onDocClickBound), window.addEventListener("keydown", this.onKeyDownBound)), this.panelEl.addEventListener("contextmenu", this.onContextMenu);
+  }
+  show(i, e, t) {
+    this.menuEl.innerHTML = "";
+    for (const h of i) {
+      if (h.separator) {
+        const p = document.createElement("div");
+        p.className = "relly-context-separator", this.menuEl.appendChild(p);
+        continue;
+      }
+      const c = document.createElement("button");
+      c.type = "button", c.className = "relly-context-item", h.danger && c.classList.add("relly-context-item--danger"), h.disabled && (c.disabled = !0);
+      let u = "";
+      h.icon && (u = `<span class="relly-context-icon">${h.icon}</span>`), c.innerHTML = `${u}<span class="relly-context-label">${h.label}</span>`, c.addEventListener("click", (p) => {
+        var d;
+        p.stopPropagation(), (d = this.soundEngine) == null || d.playClick(), this.hide(), h.action(this.currentComponent);
+      }), this.menuEl.appendChild(c);
+    }
+    this.menuEl.style.display = "flex";
+    const n = this.panelEl.getBoundingClientRect();
+    let s = e - n.left, r = t - n.top;
+    const l = 160, o = this.menuEl.offsetHeight || 120;
+    s + l > n.width && (s = Math.max(4, n.width - l - 4)), r + o > n.height && (r = Math.max(4, n.height - o - 4)), this.menuEl.style.left = `${s}px`, this.menuEl.style.top = `${r}px`;
+  }
+  hide() {
+    this.menuEl.style.display = "none", this.currentComponent = void 0;
+  }
+  destroy() {
+    typeof window < "u" && (window.removeEventListener("click", this.onDocClickBound), window.removeEventListener("keydown", this.onKeyDownBound)), this.panelEl.removeEventListener("contextmenu", this.onContextMenu), this.menuEl.parentElement && this.menuEl.parentElement.removeChild(this.menuEl);
+  }
+}
+class ce extends T {
+  constructor(e, t, n, s) {
+    const r = document.createElement("div");
+    r.className = "relly-tab-content";
+    super(r, t, n, s);
+    a(this, "contentEl");
+    a(this, "buttonEl");
+    this.label = e, this.contentEl = r, this.buttonEl = document.createElement("button"), this.buttonEl.className = "relly-tab-btn", this.buttonEl.textContent = e;
+  }
+  getLabel() {
+    return this.label;
+  }
+  setActive(e) {
+    e ? (this.buttonEl.classList.add("relly-tab-active"), this.contentEl.classList.add("relly-tab-content--active")) : (this.buttonEl.classList.remove("relly-tab-active"), this.contentEl.classList.remove("relly-tab-content--active"));
+  }
+  destroy() {
+    this.destroyChildren(), this.buttonEl.remove(), this.contentEl.remove();
+  }
+}
+class de {
+  constructor(i, e, t, n, s) {
+    a(this, "barEl");
+    a(this, "bodyEl");
+    a(this, "tabs", []);
+    a(this, "activeTab", null);
+    this.bindingEngine = t, this.presetManager = n, this.soundEngine = s, this.barEl = document.createElement("div"), this.barEl.className = "relly-tabs-bar", this.barEl.style.display = "none", this.bodyEl = e, i.insertAdjacentElement("afterend", this.barEl);
+  }
+  addTab(i) {
+    this.barEl.style.display = "flex";
+    const e = new ce(i, this.bindingEngine, this.presetManager, this.soundEngine);
+    return this.tabs.push(e), this.barEl.appendChild(e.buttonEl), this.bodyEl.appendChild(e.contentEl), e.buttonEl.addEventListener("click", () => {
+      this.switchTab(e);
+    }), this.tabs.length === 1 && this.switchTab(e, !1), e;
+  }
+  switchTab(i, e = !0) {
+    var t;
+    this.activeTab !== i && e && ((t = this.soundEngine) == null || t.playTab()), this.activeTab = i;
+    for (const n of this.tabs)
+      n.setActive(n === i);
+  }
+  getActiveTab() {
+    return this.activeTab;
+  }
+  destroy() {
+    for (const i of this.tabs)
+      i.destroy();
+    this.tabs = [], this.barEl.remove();
+  }
+}
+const me = ':root{--relly-bg: #1c1d22;--relly-fg: #d1d5db;--relly-header-bg: #141518;--relly-header-fg: #f3f4f6;--relly-accent: #6366f1;--relly-accent-hover: #4f46e5;--relly-border: rgba(255, 255, 255, .08);--relly-input-bg: #26272e;--relly-input-hover: #2f3039;--relly-radius: 6px;--relly-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--relly-font-size: 11px;--relly-row-height: 26px;--relly-ease: cubic-bezier(.16, 1, .3, 1);--relly-transition: all .2s var(--relly-ease)}.relly-host{position:fixed;z-index:999999;pointer-events:none}.relly-panel{position:fixed;z-index:999999;background-color:var(--relly-bg);color:var(--relly-fg);border:1px solid var(--relly-border);border-radius:var(--relly-radius);box-shadow:0 10px 25px -5px #00000080,0 8px 10px -6px #0006;font-family:var(--relly-font);font-size:var(--relly-font-size);-webkit-user-select:none;user-select:none;box-sizing:border-box;overflow:hidden!important;overflow-x:hidden!important;display:flex;flex-direction:column;pointer-events:auto;opacity:1;transform:scale(1) translateY(0);transition:opacity .22s var(--relly-ease),transform .22s var(--relly-ease);min-width:240px;min-height:120px;max-width:calc(100vw - 16px);max-height:calc(100vh - 16px);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}.relly-panel.relly-mini-hud{width:auto!important;height:auto!important;min-width:0!important;min-height:0!important;border-radius:9999px!important;box-shadow:0 4px 20px #0006,0 0 0 1px var(--relly-accent)}.relly-panel.relly-mini-hud .relly-header{border-bottom:none;padding:5px 12px;border-radius:9999px;background-color:var(--relly-bg)}.relly-panel.relly-mini-hud .relly-body,.relly-panel.relly-mini-hud .relly-search-bar,.relly-panel.relly-mini-hud .relly-tabs-bar,.relly-panel.relly-mini-hud .relly-resize-handle,.relly-panel.relly-mini-hud .relly-header-btn:not(.relly-minihud-btn){display:none!important}.relly-panel.relly-mini-hud .relly-header-title:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background-color:var(--relly-accent);box-shadow:0 0 6px var(--relly-accent);margin-right:6px;animation:relly-pulse 2s infinite ease-in-out}@keyframes relly-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}.relly-panel *{box-sizing:border-box}.relly-panel,.relly-panel *,.relly-body,.relly-tabs-bar,.relly-search-bar{scrollbar-width:none!important;-ms-overflow-style:none!important}.relly-panel *::-webkit-scrollbar,.relly-panel::-webkit-scrollbar,.relly-body::-webkit-scrollbar,.relly-tabs-bar::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}.relly-panel.relly-hidden{opacity:0!important;transform:scale(.95) translateY(-6px)!important;pointer-events:none!important}.relly-header{display:flex;align-items:center;justify-content:space-between;background-color:var(--relly-header-bg);color:var(--relly-header-fg);padding:6px 10px;font-weight:600;border-bottom:1px solid var(--relly-border);cursor:grab;transition:background-color .2s var(--relly-ease);flex-shrink:0}.relly-header:active{cursor:grabbing}.relly-header-title{display:flex;align-items:center;gap:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.relly-header-title svg{width:14px;height:14px;color:var(--relly-accent);transition:transform .2s var(--relly-ease)}.relly-header-title:hover svg{transform:rotate(15deg)}.relly-header-actions{display:flex;align-items:center;gap:4px}.relly-header-btn{background:transparent;border:none;color:var(--relly-fg);opacity:.7;padding:2px 6px;border-radius:4px;cursor:pointer;font-family:inherit;font-size:11px;line-height:1;display:flex;align-items:center;justify-content:center;transition:opacity .15s,background-color .15s,transform .1s var(--relly-ease)}.relly-header-btn:hover{opacity:1;background-color:#ffffff1a;transform:scale(1.08)}.relly-header-btn:active{transform:scale(.92)}.relly-resize-handle{position:absolute;bottom:0;right:0;width:14px;height:14px;cursor:se-resize;display:flex;align-items:center;justify-content:center;opacity:.4;transition:opacity .15s var(--relly-ease);z-index:100}.relly-resize-handle svg{width:9px;height:9px;stroke:var(--relly-fg);stroke-width:1.5}.relly-resize-handle:hover{opacity:1}.relly-search-bar{display:flex;align-items:center;padding:4px 8px;background-color:#0003;border-bottom:1px solid var(--relly-border);gap:6px;flex-shrink:0}.relly-search-input{width:100%;background:var(--relly-input-bg);border:1px solid var(--relly-border);border-radius:4px;color:var(--relly-fg);font-family:inherit;font-size:11px;padding:3px 6px;outline:none;transition:border-color .15s var(--relly-ease),background-color .15s}.relly-search-input:focus{border-color:var(--relly-accent);background-color:var(--relly-input-hover)}.relly-search-clear{background:none;border:none;color:var(--relly-fg);cursor:pointer;opacity:.5;font-size:10px;padding:0 4px;transition:opacity .15s}.relly-search-clear:hover{opacity:1}.relly-tabs-bar{display:flex;background-color:var(--relly-header-bg);border-bottom:1px solid var(--relly-border);overflow-x:auto;overflow-y:hidden;flex-shrink:0;scrollbar-width:none!important;-ms-overflow-style:none!important}.relly-tabs-bar::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}.relly-tab-btn{flex:1;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--relly-fg);opacity:.6;padding:5px 8px;font-family:inherit;font-size:11px;cursor:pointer;white-space:nowrap;transition:all .2s var(--relly-ease)}.relly-tab-btn:hover{opacity:.9;background-color:#ffffff08}.relly-tab-btn.relly-tab-active{opacity:1;color:var(--relly-accent);border-bottom-color:var(--relly-accent)}.relly-tab-content{display:none}.relly-tab-content.relly-tab-content--active{display:flex;flex-direction:column}.relly-body{display:flex;flex-direction:column;overflow-y:auto!important;overflow-x:hidden!important;max-height:80vh;flex:1;transition:max-height .25s var(--relly-ease);scrollbar-width:none!important;-ms-overflow-style:none!important}.relly-body::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}.relly-panel.relly-collapsed .relly-body{display:none}.relly-copy-toast{position:absolute;top:36px;right:10px;background:var(--relly-accent);color:#fff;padding:3px 8px;border-radius:4px;font-size:10px;font-weight:600;box-shadow:0 4px 12px #0000004d;pointer-events:none;opacity:0;transform:translateY(-6px);transition:opacity .2s var(--relly-ease),transform .2s var(--relly-ease);z-index:9999999}.relly-copy-toast.relly-toast-show{opacity:1;transform:translateY(0)}.relly-modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:999999;display:flex;align-items:center;justify-content:center;padding:12px;opacity:0;pointer-events:none;transition:opacity .2s var(--relly-ease)}.relly-modal-backdrop.relly-modal-show{opacity:1;pointer-events:auto}.relly-modal{width:100%;max-width:320px;background:var(--relly-bg);border:1px solid var(--relly-border);border-radius:var(--relly-radius);box-shadow:0 12px 30px #0009;padding:12px;display:flex;flex-direction:column;gap:8px;transform:scale(.95);transition:transform .2s var(--relly-ease)}.relly-modal-backdrop.relly-modal-show .relly-modal{transform:scale(1)}.relly-modal-header{display:flex;justify-content:space-between;align-items:center;font-weight:600;color:var(--relly-header-fg);font-size:12px}.relly-dropzone{border:1.5px dashed var(--relly-border);border-radius:4px;padding:12px;text-align:center;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--relly-fg);opacity:.8;font-size:11px;background:#00000026;transition:all .2s var(--relly-ease)}.relly-dropzone:hover,.relly-dropzone.relly-dropzone-drag{border-color:var(--relly-accent);opacity:1;background:#6366f114}.relly-import-textarea{width:100%;height:90px;background:var(--relly-input-bg);border:1px solid var(--relly-border);border-radius:4px;color:var(--relly-fg);font-family:monospace;font-size:10px;padding:6px;outline:none;resize:vertical}.relly-import-textarea:focus{border-color:var(--relly-accent)}.relly-import-error{color:#ef4444;font-size:10px;min-height:12px}.relly-modal-actions{display:flex;gap:6px}.relly-btn-primary{background:var(--relly-accent)!important;color:#fff!important;border-color:var(--relly-accent)!important}.relly-btn-primary:hover{background:var(--relly-accent-hover)!important}.relly-toast-container{position:absolute;top:36px;right:8px;display:flex;flex-direction:column;gap:6px;z-index:9999999;pointer-events:none;max-width:240px}.relly-toast{display:flex;align-items:center;gap:6px;padding:6px 8px;background:var(--relly-bg);border:1px solid var(--relly-border);border-radius:4px;color:var(--relly-fg);font-size:11px;box-shadow:0 4px 16px #00000073;pointer-events:auto;opacity:0;transform:translateY(-8px) scale(.96);transition:opacity .2s var(--relly-ease),transform .2s var(--relly-ease);cursor:pointer}.relly-toast.relly-toast-enter{opacity:1;transform:translateY(0) scale(1)}.relly-toast.relly-toast-leave{opacity:0;transform:translateY(-6px) scale(.95)}.relly-toast-icon svg{width:14px;height:14px;display:block}.relly-toast--success{border-left:3px solid #22c55e}.relly-toast--success .relly-toast-icon{color:#22c55e}.relly-toast--warning{border-left:3px solid #f59e0b}.relly-toast--warning .relly-toast-icon{color:#f59e0b}.relly-toast--error{border-left:3px solid #ef4444}.relly-toast--error .relly-toast-icon{color:#ef4444}.relly-toast--info{border-left:3px solid var(--relly-accent)}.relly-toast--info .relly-toast-icon{color:var(--relly-accent)}.relly-toast-msg{flex:1;line-height:1.3;overflow:hidden;text-overflow:ellipsis}.relly-toast-close{background:transparent;border:none;color:var(--relly-fg);opacity:.5;cursor:pointer;padding:0 2px;font-size:11px}.relly-toast-close:hover{opacity:1}.relly-context-menu{position:absolute;background:var(--relly-bg);border:1px solid var(--relly-border);border-radius:var(--relly-radius);box-shadow:0 8px 24px #0000008c;padding:4px;display:flex;flex-direction:column;min-width:140px;z-index:99999999;animation:relly-menu-in .15s var(--relly-ease)}@keyframes relly-menu-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.relly-context-item{display:flex;align-items:center;gap:6px;background:transparent;border:none;color:var(--relly-fg);font-family:inherit;font-size:11px;padding:5px 8px;border-radius:3px;cursor:pointer;text-align:left;transition:background-color .12s var(--relly-ease),color .12s}.relly-context-item:hover:not(:disabled){background-color:var(--relly-accent);color:#fff}.relly-context-item:disabled{opacity:.4;cursor:not-allowed}.relly-context-item--danger:hover:not(:disabled){background-color:#ef4444!important;color:#fff!important}.relly-context-separator{height:1px;background-color:var(--relly-border);margin:3px 0}.relly-row{display:flex;align-items:center;justify-content:space-between;min-height:var(--relly-row-height);padding:3px 10px;border-bottom:1px solid var(--relly-border);position:relative;transition:background-color .15s var(--relly-ease),opacity .2s var(--relly-ease)}.relly-row:hover{background-color:#ffffff08}.relly-row.relly-search-hidden{display:none!important}.relly-row-label{flex:0 0 40%;max-width:40%;color:var(--relly-fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--relly-font-size);cursor:default;position:relative}.relly-row-control{flex:1;display:flex;align-items:center;justify-content:flex-end;gap:6px;min-width:0}.relly-multi-row{display:flex;align-items:stretch;width:100%;border-bottom:1px solid var(--relly-border)}.relly-multi-row .relly-row{flex:1;border-bottom:none;border-right:1px solid var(--relly-border);padding:3px 6px}.relly-multi-row .relly-row:last-child{border-right:none}.relly-multi-row .relly-row-label{flex:0 0 auto;max-width:none;margin-right:4px}.relly-tooltip{position:absolute;bottom:calc(100% + 4px);left:10px;background-color:#111216;color:#f3f4f6;padding:4px 8px;border-radius:4px;font-size:10px;line-height:1.3;white-space:nowrap;box-shadow:0 4px 12px #00000080;border:1px solid var(--relly-border);pointer-events:none;opacity:0;transform:translateY(4px);transition:opacity .18s var(--relly-ease),transform .18s var(--relly-ease);z-index:99999999}.relly-row:hover .relly-tooltip{opacity:1;transform:translateY(0)}.relly-checkbox-wrapper{display:flex;align-items:center;cursor:pointer;gap:6px}.relly-checkbox-box{width:16px;height:16px;border-radius:4px;background-color:var(--relly-input-bg);border:1px solid var(--relly-border);display:flex;align-items:center;justify-content:center;transition:background-color .18s var(--relly-ease),border-color .18s var(--relly-ease),transform .15s var(--relly-ease)}.relly-checkbox-wrapper:hover .relly-checkbox-box{border-color:var(--relly-accent);transform:scale(1.05)}.relly-checkbox-wrapper:active .relly-checkbox-box{transform:scale(.95)}.relly-checkbox-wrapper.relly-checked .relly-checkbox-box{background-color:var(--relly-accent);border-color:var(--relly-accent);animation:relly-pop .25s var(--relly-ease)}@keyframes relly-pop{0%{transform:scale(.85)}60%{transform:scale(1.15)}to{transform:scale(1)}}.relly-checkbox-icon{display:none;width:10px;height:10px;stroke:#fff;stroke-width:2.5;fill:none}.relly-checkbox-wrapper.relly-checked .relly-checkbox-icon{display:block}.relly-slider-container{display:flex;align-items:center;gap:8px;width:100%}.relly-slider-range{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;border-radius:2px;background:var(--relly-input-bg);outline:none;cursor:pointer;transition:background-color .15s var(--relly-ease)}.relly-slider-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:12px;height:12px;border-radius:50%;background:var(--relly-accent);cursor:pointer;box-shadow:0 1px 3px #0000004d;transition:transform .15s var(--relly-ease),background-color .15s}.relly-slider-range::-webkit-slider-thumb:hover{transform:scale(1.25);background:var(--relly-accent-hover)}.relly-slider-range::-webkit-slider-thumb:active{transform:scale(1.35)}.relly-slider-number{width:50px;background:var(--relly-input-bg);border:1px solid var(--relly-border);border-radius:4px;color:var(--relly-fg);font-family:inherit;font-size:11px;padding:2px 4px;text-align:right;outline:none;transition:border-color .15s var(--relly-ease),background-color .15s}.relly-slider-number:focus{border-color:var(--relly-accent);background:var(--relly-input-hover)}.relly-btn{width:100%;background:var(--relly-input-bg);border:1px solid var(--relly-border);border-radius:4px;color:var(--relly-fg);font-family:inherit;font-size:11px;font-weight:500;padding:4px 10px;cursor:pointer;transition:background-color .15s var(--relly-ease),border-color .15s,color .15s,transform .1s var(--relly-ease);text-align:center}.relly-btn:hover{background-color:var(--relly-input-hover);border-color:var(--relly-accent);color:#fff;transform:translateY(-1px)}.relly-btn:active{transform:translateY(1px) scale(.98)}.relly-select-input{width:100%;background:var(--relly-input-bg);border:1px solid var(--relly-border);border-radius:4px;color:var(--relly-fg);font-family:inherit;font-size:11px;padding:3px 6px;outline:none;cursor:pointer;transition:border-color .15s var(--relly-ease),background-color .15s}.relly-select-input:focus{border-color:var(--relly-accent);background:var(--relly-input-hover)}.relly-dynamic-value{color:var(--relly-accent);font-weight:500;font-family:monospace;font-size:11px;background:#6366f11a;padding:2px 6px;border-radius:4px;border:1px solid rgba(99,102,241,.2);transition:all .2s var(--relly-ease)}.relly-color-wrapper{display:flex;align-items:center;gap:6px;width:100%;justify-content:flex-end}.relly-color-preview{width:20px;height:20px;border-radius:4px;border:1px solid var(--relly-border);cursor:pointer;box-shadow:inset 0 0 2px #0006;transition:transform .15s var(--relly-ease),border-color .15s}.relly-color-preview:hover{transform:scale(1.15);border-color:#fff}.relly-eyedropper-btn{background:transparent;border:none;color:var(--relly-fg);cursor:pointer;opacity:.7;padding:2px 4px;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:opacity .15s var(--relly-ease),transform .1s var(--relly-ease)}.relly-eyedropper-btn svg{width:13px;height:13px}.relly-eyedropper-btn:hover{opacity:1;color:var(--relly-accent);transform:scale(1.15)}.relly-color-native{position:absolute;opacity:0;width:0;height:0;pointer-events:none}.relly-color-text{font-family:monospace;font-size:11px;color:var(--relly-fg)}.relly-color-swatches{display:flex;align-items:center;gap:3px;flex-wrap:wrap;margin-right:4px}.relly-color-swatch{width:14px;height:14px;border-radius:3px;border:1px solid rgba(255,255,255,.2);cursor:pointer;padding:0;box-sizing:border-box;transition:transform .12s var(--relly-ease),border-color .12s;box-shadow:inset 0 0 2px #00000059}.relly-color-swatch:hover{transform:scale(1.25);border-color:#fff;z-index:2}.relly-color-swatch.relly-swatch-active{border:1.5px solid #fff;box-shadow:0 0 4px var(--relly-accent)}.relly-point2d-container{display:flex;align-items:center;gap:4px;width:100%}.relly-point2d-item{display:flex;align-items:center;gap:2px;flex:1}.relly-point2d-tag{font-size:10px;font-weight:600;color:var(--relly-accent);font-family:monospace}.relly-point2d-input{width:100%;background:var(--relly-input-bg);border:1px solid var(--relly-border);border-radius:4px;color:var(--relly-fg);font-family:inherit;font-size:11px;padding:2px 4px;text-align:right;outline:none;transition:border-color .15s var(--relly-ease)}.relly-point2d-input:focus{border-color:var(--relly-accent)}.relly-graph-row{display:flex;flex-direction:column;padding:6px 10px;border-bottom:1px solid var(--relly-border);gap:5px;transition:opacity .2s var(--relly-ease)}.relly-graph-row.relly-search-hidden{display:none!important}.relly-graph-header{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:var(--relly-fg)}.relly-graph-label{font-weight:500;opacity:.85}.relly-graph-stats{display:flex;align-items:center;gap:5px;font-family:monospace;font-size:10px}.relly-graph-badge{opacity:.55;font-size:9px}.relly-graph-badge--paused{opacity:1!important;color:#f59e0b;background:#f59e0b2e;font-weight:700;border-radius:3px;padding:1px 4px;border:1px solid rgba(245,158,11,.4);letter-spacing:.5px}.relly-graph-val{color:var(--relly-accent);font-weight:600;background:#6366f11f;padding:1px 4px;border-radius:3px;border:1px solid rgba(99,102,241,.2)}.relly-graph-legend{display:none;align-items:center;gap:8px;font-size:9px;font-family:monospace;opacity:.75;margin-top:-2px}.relly-graph-legend-item{display:flex;align-items:center;gap:4px}.relly-graph-legend-dot{width:6px;height:6px;border-radius:50%;display:inline-block}.relly-graph-canvas-container{width:100%;height:90px;background:var(--relly-input-bg);border-radius:4px;border:1px solid var(--relly-border);overflow:hidden;position:relative;box-shadow:inset 0 2px 6px #00000040;cursor:crosshair;transition:border-color .2s ease,box-shadow .2s ease}.relly-graph-canvas-container.relly-graph-paused{border-color:#f59e0b;box-shadow:inset 0 2px 6px #00000040,0 0 10px #f59e0b40}.relly-graph-canvas{width:100%;height:100%;display:block}.relly-graph-tooltip{position:absolute;pointer-events:none;background:#0f172aeb;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border:1px solid var(--relly-border);border-radius:4px;padding:3px 6px;font-size:9px;font-family:monospace;color:#fff;white-space:nowrap;z-index:10;transform:translate(-50%);opacity:0;transition:opacity .12s ease;box-shadow:0 4px 12px #00000080}.relly-graph-tooltip.relly-tooltip-show{opacity:1}.relly-section{display:flex;flex-direction:column;border-bottom:1px solid var(--relly-border);transition:opacity .2s var(--relly-ease)}.relly-section.relly-search-hidden{display:none!important}.relly-section-header{display:flex;align-items:center;justify-content:space-between;padding:5px 10px;background-color:#ffffff05;cursor:pointer;font-weight:600;color:var(--relly-header-fg);transition:background-color .15s var(--relly-ease)}.relly-section-header:hover{background-color:#ffffff0d}.relly-section-title-wrap{display:flex;align-items:center;gap:6px}.relly-section-arrow{width:12px;height:12px;transition:transform .22s var(--relly-ease);fill:currentColor}.relly-section.relly-section--collapsed .relly-section-arrow{transform:rotate(-90deg)}.relly-section-content{display:flex;flex-direction:column;padding-left:6px;border-left:2px solid var(--relly-accent);transition:opacity .2s var(--relly-ease)}.relly-section.relly-section--collapsed .relly-section-content{display:none}.relly-disabled,.relly-component-row.relly-disabled,.relly-section.relly-disabled{opacity:.42!important;pointer-events:none!important;-webkit-user-select:none!important;user-select:none!important;filter:grayscale(.5)}.relly-jog-scrubbing,.relly-jog-scrubbing *{cursor:ew-resize!important;-webkit-user-select:none!important;user-select:none!important}.relly-mini-sparkline{width:48px;height:16px;display:inline-block;vertical-align:middle;margin-left:6px;border-radius:3px;background:#00000040}.relly-point3d-container{display:flex;align-items:center;gap:4px;width:100%}.relly-point3d-item{display:flex;align-items:center;gap:2px;flex:1;min-width:0}.relly-point3d-tag{font-size:9px;font-weight:700;line-height:1;padding:2px 4px;border-radius:3px;text-transform:uppercase}.relly-point3d-tag--x{background-color:#ef444433;color:#ef4444;border:1px solid rgba(239,68,68,.4)}.relly-point3d-tag--y{background-color:#22c55e33;color:#22c55e;border:1px solid rgba(34,197,94,.4)}.relly-point3d-tag--z{background-color:#3b82f633;color:#3b82f6;border:1px solid rgba(59,130,246,.4)}.relly-point3d-input{width:100%;min-width:24px;background:var(--relly-input-bg);border:1px solid var(--relly-border);border-radius:3px;color:var(--relly-fg);font-family:inherit;font-size:11px;padding:2px 4px;text-align:right;cursor:ew-resize}.relly-range-wrapper{display:flex;align-items:center;gap:6px;width:100%}.relly-range-track{flex:1;height:6px;background:var(--relly-input-bg);border-radius:9999px;position:relative;cursor:pointer;box-shadow:inset 0 1px 2px #0000004d}.relly-range-bar{position:absolute;top:0;bottom:0;background:var(--relly-accent);border-radius:9999px;cursor:grab;transition:background-color .15s}.relly-range-bar:active{cursor:grabbing;background:var(--relly-accent-hover)}.relly-range-thumb{position:absolute;top:50%;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--relly-accent);transform:translate(-50%,-50%);cursor:grab;z-index:2;transition:transform .1s var(--relly-ease),box-shadow .15s;box-shadow:0 1px 4px #0006}.relly-range-thumb:hover{transform:translate(-50%,-50%) scale(1.2);box-shadow:0 0 6px var(--relly-accent)}.relly-range-thumb:active{cursor:grabbing;transform:translate(-50%,-50%) scale(1.25)}.relly-range-input{width:38px;background:var(--relly-input-bg);border:1px solid var(--relly-border);border-radius:3px;color:var(--relly-fg);font-family:inherit;font-size:11px;padding:2px 4px;text-align:right}.relly-segmented-container{display:flex;position:relative;background:var(--relly-input-bg);border-radius:4px;border:1px solid var(--relly-border);padding:2px;width:100%;overflow:hidden}.relly-segmented-glider{position:absolute;top:2px;bottom:2px;background:var(--relly-accent);border-radius:3px;box-shadow:0 1px 4px #00000059;transition:transform .2s var(--relly-ease),width .2s var(--relly-ease),opacity .15s;pointer-events:none;z-index:1}.relly-segmented-btn{flex:1;position:relative;background:transparent;border:none;color:var(--relly-fg);font-family:inherit;font-size:11px;padding:3px 6px;cursor:pointer;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;z-index:2;transition:color .15s var(--relly-ease)}.relly-segmented-btn:hover{color:#fff}.relly-segmented-btn.relly-segmented-btn--active{color:#fff;font-weight:600}.relly-status-wrapper{display:flex;align-items:center;gap:8px;width:100%;justify-content:flex-end}.relly-status-led{position:relative;width:8px;height:8px;display:flex;align-items:center;justify-content:center}.relly-status-led-core{width:7px;height:7px;border-radius:50%;background-color:#22c55e;position:relative;z-index:2}.relly-status-pulse-ring{position:absolute;width:100%;height:100%;border-radius:50%;background-color:inherit;opacity:.75;animation:relly-status-pulse 2s cubic-bezier(.24,0,.38,1) infinite;z-index:1}@keyframes relly-status-pulse{0%{transform:scale(.95);opacity:.8}70%{transform:scale(2.4);opacity:0}to{transform:scale(2.4);opacity:0}}.relly-status-led--online .relly-status-led-core,.relly-status-led--online .relly-status-pulse-ring{background-color:#22c55e}.relly-status-led--busy .relly-status-led-core,.relly-status-led--busy .relly-status-pulse-ring{background-color:#f59e0b}.relly-status-led--offline .relly-status-led-core,.relly-status-led--offline .relly-status-pulse-ring{background-color:#ef4444}.relly-status-led--info .relly-status-led-core,.relly-status-led--info .relly-status-pulse-ring{background-color:#3b82f6}.relly-status-led--ready .relly-status-led-core,.relly-status-led--ready .relly-status-pulse-ring{background-color:#a855f7}.relly-status-badge{font-size:10px;font-weight:700;padding:1px 6px;border-radius:9999px;text-transform:uppercase;letter-spacing:.04em;background:#ffffff14}.relly-status-badge--online{color:#22c55e;background:#22c55e26}.relly-status-badge--busy{color:#f59e0b;background:#f59e0b26}.relly-status-badge--offline{color:#ef4444;background:#ef444426}.relly-status-badge--info{color:#3b82f6;background:#3b82f626}.relly-status-badge--ready{color:#a855f7;background:#a855f726}.relly-status-detail{font-size:10px;color:var(--relly-fg);opacity:.7;font-family:monospace}', I = "relly-ui-stylesheet";
+function $(y) {
+  const i = y || (typeof document < "u" ? document : null);
+  if (!i || "getElementById" in i && i.getElementById(I) || "querySelector" in i && i.querySelector(`#${I}`)) return;
+  const e = document.createElement("style");
+  e.id = I, e.textContent = me, "head" in i && i.head ? i.head.appendChild(e) : i.appendChild(e);
+}
+const S = class S extends T {
+  constructor(e = {}) {
+    const t = e.shadowDOM !== !1, n = new G(), s = new W(), r = new re(e.sound !== !1, e.soundPack || "synth"), l = document.createElement("div");
+    l.className = "relly-panel";
+    const o = e.width ?? 280;
+    if (l.style.width = typeof o == "number" ? `${o}px` : o, e.height) {
+      const x = e.height;
+      l.style.height = typeof x == "number" ? `${x}px` : x;
+    }
+    const h = document.createElement("div");
+    h.className = "relly-header";
+    const c = document.createElement("div");
+    c.className = "relly-header-title", c.innerHTML = `
+      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+        <rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect>
+        <line x1="3" y1="9" x2="21" y2="9"></line>
+        <line x1="9" y1="21" x2="9" y2="9"></line>
+      </svg>
+    `;
+    const u = document.createElement("span");
+    u.textContent = e.title || "RellyUI", c.appendChild(u);
+    const p = document.createElement("div");
+    p.className = "relly-header-actions";
+    const d = document.createElement("button");
+    d.className = "relly-header-btn", d.title = "Copy settings as JSON", d.innerHTML = `
+      <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+        <rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
+        <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
+      </svg>
+    `, p.appendChild(d);
+    const g = document.createElement("button");
+    g.className = "relly-header-btn", g.title = "Import settings from JSON", g.innerHTML = `
+      <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+        <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
+        <polyline points="7 10 12 15 17 10"></polyline>
+        <line x1="12" y1="15" x2="12" y2="3"></line>
+      </svg>
+    `, p.appendChild(g);
+    const b = document.createElement("button");
+    b.className = "relly-header-btn relly-minihud-btn", b.title = "Toggle Mini-HUD pill (or double-click header)", b.textContent = "⤢", p.appendChild(b);
+    const m = document.createElement("button");
+    m.className = "relly-header-btn", m.title = "Collapse/Expand", m.textContent = "_", p.appendChild(m), h.appendChild(c), h.appendChild(p), l.appendChild(h);
+    const v = document.createElement("div");
+    v.className = "relly-copy-toast", v.textContent = "JSON Copied!", l.appendChild(v);
+    const E = document.createElement("div");
+    E.className = "relly-body", e.height && (E.style.maxHeight = "none", E.style.flex = "1"), l.appendChild(E);
+    super(E, n, s, r);
+    a(this, "hostEl");
+    a(this, "shadowRoot", null);
+    a(this, "panelEl");
+    a(this, "headerEl");
+    a(this, "titleEl");
+    a(this, "collapseBtn");
+    a(this, "copyToastEl");
+    a(this, "themeManager");
+    a(this, "soundEngine");
+    a(this, "draggableInstance");
+    a(this, "resizableInstance");
+    a(this, "hotkeyInstance");
+    a(this, "searchBarInstance");
+    a(this, "tabsManagerInstance");
+    a(this, "importModalInstance");
+    a(this, "toastManager");
+    a(this, "contextMenuManager");
+    a(this, "isPanelCollapsed", !1);
+    a(this, "isPanelHidden", !1);
+    a(this, "isMiniHud", !1);
+    a(this, "ghostOnIdle", !1);
+    a(this, "idleOpacity", 0.38);
+    a(this, "onResizeBound");
+    a(this, "autoSave", !1);
+    a(this, "autoSaveKey", "relly-ui-session");
+    a(this, "autoSaveTimeout", null);
+    a(this, "sparklineCtx");
+    a(this, "sparklineData", [12, 14, 15, 18, 16, 20, 22, 21, 24, 25, 28, 30]);
+    a(this, "sparklineAnimId");
+    this.panelEl = l, this.headerEl = h, this.titleEl = u, this.collapseBtn = m, this.copyToastEl = v, this.soundEngine = r, this.onResizeBound = () => this.clampToViewport(), e.searchBar && (this.searchBarInstance = new se(E, e.searchOptions), h.insertAdjacentElement("afterend", this.searchBarInstance.element)), this.themeManager = new ee(this.panelEl, e.theme), this.mount(e, t), e.autoInjectStyles !== !1 && (this.shadowRoot ? $(this.shadowRoot) : $()), e.draggable !== !1 && (this.draggableInstance = new te(this.headerEl, this.panelEl, this.soundEngine)), e.resizable !== !1 && (this.resizableInstance = new ie(this.panelEl)), this.toastManager = new oe(this.panelEl, this.soundEngine), this.contextMenuManager = new he(this.panelEl, this.soundEngine), this.importModalInstance = new ae(this.panelEl, (x) => {
+      this.importJSON(x);
+    });
+    const f = e.hotkey === void 0 ? "KeyH" : e.hotkey;
+    f && (this.hotkeyInstance = new ne(f, () => {
+      this.toggle();
+    })), b.addEventListener("click", (x) => {
+      x.stopPropagation(), this.toggleMiniHud();
+    }), this.headerEl.addEventListener("dblclick", (x) => {
+      x.target.closest(".relly-header-btn") || this.toggleMiniHud();
+    }), this.collapseBtn.addEventListener("click", (x) => {
+      x.stopPropagation(), this.soundEngine.playClick(), this.toggleCollapse();
+    }), d.addEventListener("click", (x) => {
+      x.stopPropagation(), this.soundEngine.playClick(), this.copyJSON();
+    }), g.addEventListener("click", (x) => {
+      var w;
+      x.stopPropagation(), this.soundEngine.playClick(), (w = this.importModalInstance) == null || w.show();
+    }), e.soundVolume !== void 0 && this.soundEngine.setVolume(e.soundVolume), e.accordion && this.setAccordion(!0), e.ghostOnIdle && this.setGhostMode(!0, e.idleOpacity), this.initSparkline(c), this.panelEl.addEventListener("mouseenter", () => {
+      this.ghostOnIdle && (this.panelEl.style.opacity = "1");
+    }), this.panelEl.addEventListener("mouseleave", () => {
+      this.ghostOnIdle && (this.panelEl.style.opacity = `${this.idleOpacity}`);
+    }), e.collapsed && this.setCollapsed(!0), this.autoSave = e.autoSave ?? !1, this.autoSaveKey = e.autoSaveKey ?? "relly-ui-session", this.presetManager.setOnChange(() => {
+      this.autoSave && this.queueAutoSave();
+    }), this.panelEl.addEventListener("mouseup", () => {
+      this.autoSave && this.queueAutoSave();
+    }), this.autoSave && this.loadSession();
+  }
+  mount(e, t) {
+    if (typeof document > "u") return;
+    const n = e.position || {};
+    this.panelEl.style.top = n.top !== void 0 ? `${n.top}px` : "20px", n.left !== void 0 ? this.panelEl.style.left = `${n.left}px` : this.panelEl.style.right = n.right !== void 0 ? `${n.right}px` : "20px", n.bottom !== void 0 && (this.panelEl.style.bottom = `${n.bottom}px`);
+    const s = e.container ? typeof e.container == "string" ? document.querySelector(e.container) : e.container : document.body;
+    if (s) {
+      if (t && typeof s.attachShadow == "function") {
+        const r = document.createElement("div");
+        r.className = "relly-host", this.hostEl = r, this.shadowRoot = r.attachShadow({ mode: "open" }), this.shadowRoot.appendChild(this.panelEl), s.appendChild(r);
+      } else
+        s.appendChild(this.panelEl), e.container && (this.panelEl.style.position = "relative");
+      typeof window < "u" && (window.addEventListener("resize", this.onResizeBound), setTimeout(() => {
+        this.clampToViewport();
+      }, 0));
+    }
+  }
+  addTab(e) {
+    return this.tabsManagerInstance || (this.tabsManagerInstance = new de(
+      this.headerEl,
+      this.contentEl,
+      this.bindingEngine,
+      this.presetManager,
+      this.soundEngine
+    )), this.tabsManagerInstance.addTab(e);
+  }
+  createTab(e) {
+    return this.addTab(e);
+  }
+  copyJSON() {
+    const e = this.export(), t = JSON.stringify(e, null, 2);
+    return typeof navigator < "u" && navigator.clipboard && navigator.clipboard.writeText(t).catch(() => {
+    }), this.copyToastEl.textContent = "JSON Copied!", this.copyToastEl.classList.add("relly-toast-show"), this.soundEngine.playNotify(), setTimeout(() => {
+      this.copyToastEl.classList.remove("relly-toast-show");
+    }, 1500), t;
+  }
+  notify(e, t = "info", n = 2600) {
+    return this.toastManager.notify(e, t, n);
+  }
+  getToastManager() {
+    return this.toastManager;
+  }
+  getContextMenuManager() {
+    return this.contextMenuManager;
+  }
+  importJSON(e) {
+    try {
+      const t = typeof e == "string" ? JSON.parse(e) : e;
+      this.import(t), this.copyToastEl.textContent = "JSON Loaded!", this.copyToastEl.classList.add("relly-toast-show"), this.soundEngine.playNotify(), setTimeout(() => {
+        this.copyToastEl.classList.remove("relly-toast-show");
+      }, 1500);
+    } catch (t) {
+      console.warn("[RellyUI] Failed to import JSON", t);
+    }
+    return this;
+  }
+  loadSchema(e) {
+    return e.title && this.setTitle(e.title), le.load(this, e), this;
+  }
+  setTitle(e) {
+    return this.titleEl.textContent = e, this;
+  }
+  setTheme(e) {
+    return this.themeManager.applyTheme(e), this.autoSave && this.queueAutoSave(), this;
+  }
+  setSoundPack(e) {
+    return this.soundEngine.setSoundPack(e), this;
+  }
+  getSoundPack() {
+    return this.soundEngine.getSoundPack();
+  }
+  getSoundEngine() {
+    return this.soundEngine;
+  }
+  toggleMiniHud() {
+    return this.setMiniHud(!this.isMiniHud);
+  }
+  setMiniHud(e) {
+    return this.isMiniHud = e, this.isMiniHud ? (this.panelEl.classList.add("relly-mini-hud"), this.soundEngine.playMiniHud(!0)) : (this.panelEl.classList.remove("relly-mini-hud"), this.soundEngine.playMiniHud(!1), this.clampToViewport()), this.autoSave && this.queueAutoSave(), this;
+  }
+  isMiniHudMode() {
+    return this.isMiniHud;
+  }
+  setGhostMode(e, t = 0.38) {
+    return this.ghostOnIdle = e, this.idleOpacity = Math.max(0.05, Math.min(1, t)), this.panelEl.style.opacity = e ? `${this.idleOpacity}` : "1", this;
+  }
+  isGhostMode() {
+    return this.ghostOnIdle;
+  }
+  setSoundVolume(e) {
+    return this.soundEngine.setVolume(e), this;
+  }
+  getSoundVolume() {
+    return this.soundEngine.getVolume();
+  }
+  initSparkline(e) {
+    const t = document.createElement("canvas");
+    t.className = "relly-mini-sparkline", t.width = 48, t.height = 16, e.appendChild(t), this.sparklineCtx = t.getContext("2d");
+    const n = () => {
+      this.isMiniHud && this.sparklineCtx && this.drawSparkline(), typeof requestAnimationFrame < "u" && (this.sparklineAnimId = requestAnimationFrame(n));
+    };
+    typeof requestAnimationFrame < "u" && (this.sparklineAnimId = requestAnimationFrame(n));
+  }
+  drawSparkline() {
+    const e = this.sparklineCtx;
+    if (!e) return;
+    const t = 48, n = 16;
+    e.clearRect(0, 0, t, n);
+    const s = this.sparklineData[this.sparklineData.length - 1], r = Math.max(8, Math.min(26, s + (Math.random() - 0.48) * 3));
+    this.sparklineData.push(r), this.sparklineData.length > 14 && this.sparklineData.shift();
+    const l = Math.min(...this.sparklineData) - 1, h = Math.max(...this.sparklineData) + 1 - l || 1, c = t / (this.sparklineData.length - 1);
+    e.beginPath(), e.moveTo(0, n);
+    for (let u = 0; u < this.sparklineData.length; u++) {
+      const p = u * c, d = n - (this.sparklineData[u] - l) / h * (n - 2) - 1;
+      e.lineTo(p, d);
+    }
+    e.lineTo(t, n), e.closePath(), e.fillStyle = "rgba(56, 189, 248, 0.25)", e.fill(), e.beginPath();
+    for (let u = 0; u < this.sparklineData.length; u++) {
+      const p = u * c, d = n - (this.sparklineData[u] - l) / h * (n - 2) - 1;
+      u === 0 ? e.moveTo(p, d) : e.lineTo(p, d);
+    }
+    e.strokeStyle = "#38bdf8", e.lineWidth = 1.4, e.stroke();
+  }
+  clampToViewport() {
+    var e, t;
+    return (e = this.draggableInstance) == null || e.clampToViewport(), (t = this.resizableInstance) == null || t.clampToViewport(), this;
+  }
+  toggleCollapse() {
+    return this.setCollapsed(!this.isPanelCollapsed);
+  }
+  setCollapsed(e) {
+    return this.isPanelCollapsed = e, this.isPanelCollapsed ? (this.panelEl.classList.add("relly-collapsed"), this.collapseBtn.textContent = "+", this.bindingEngine.pause()) : (this.panelEl.classList.remove("relly-collapsed"), this.collapseBtn.textContent = "_", this.bindingEngine.resume()), this.autoSave && this.queueAutoSave(), this;
+  }
+  queueAutoSave() {
+    this.autoSave && (this.autoSaveTimeout && clearTimeout(this.autoSaveTimeout), this.autoSaveTimeout = setTimeout(() => {
+      this.saveSession();
+    }, 250));
+  }
+  saveSession(e) {
+    if (typeof window > "u" || !window.localStorage) return;
+    const t = e || this.autoSaveKey;
+    try {
+      const n = {
+        left: this.panelEl.style.left ? parseFloat(this.panelEl.style.left) : void 0,
+        top: this.panelEl.style.top ? parseFloat(this.panelEl.style.top) : void 0,
+        right: this.panelEl.style.right ? parseFloat(this.panelEl.style.right) : void 0,
+        bottom: this.panelEl.style.bottom ? parseFloat(this.panelEl.style.bottom) : void 0
+      }, s = {
+        version: S.version,
+        timestamp: Date.now(),
+        isCollapsed: this.isPanelCollapsed,
+        isMiniHud: this.isMiniHud,
+        theme: this.themeManager.getCurrentThemeName(),
+        position: n,
+        width: this.panelEl.style.width,
+        height: this.panelEl.style.height,
+        components: this.presetManager.export()
+      };
+      window.localStorage.setItem(t, JSON.stringify(s));
+    } catch (n) {
+      console.warn("[RellyUI] Failed to save session", n);
+    }
+  }
+  loadSession(e) {
+    if (typeof window > "u" || !window.localStorage) return !1;
+    const t = e || this.autoSaveKey;
+    try {
+      const n = window.localStorage.getItem(t);
+      if (!n) return !1;
+      const s = JSON.parse(n);
+      return !s || typeof s != "object" ? !1 : (s.position && (s.position.left !== void 0 ? (this.panelEl.style.left = `${s.position.left}px`, this.panelEl.style.right = "") : s.position.right !== void 0 && (this.panelEl.style.right = `${s.position.right}px`, this.panelEl.style.left = ""), s.position.top !== void 0 ? (this.panelEl.style.top = `${s.position.top}px`, this.panelEl.style.bottom = "") : s.position.bottom !== void 0 && (this.panelEl.style.bottom = `${s.position.bottom}px`, this.panelEl.style.top = "")), s.width && (this.panelEl.style.width = s.width), s.height && (this.panelEl.style.height = s.height), s.theme && s.theme !== "custom" && this.setTheme(s.theme), s.isCollapsed !== void 0 && s.isCollapsed !== this.isPanelCollapsed && this.setCollapsed(s.isCollapsed), s.isMiniHud !== void 0 && s.isMiniHud !== this.isMiniHud && this.setMiniHud(s.isMiniHud), s.components && this.presetManager.import(s.components), !0);
+    } catch (n) {
+      return console.warn("[RellyUI] Failed to load session", n), !1;
+    }
+  }
+  clearSession(e) {
+    if (typeof window > "u" || !window.localStorage) return;
+    const t = e || this.autoSaveKey;
+    try {
+      window.localStorage.removeItem(t);
+    } catch {
+    }
+  }
+  setAutoSave(e, t) {
+    return this.autoSave = e, t && (this.autoSaveKey = t), this.autoSave && this.loadSession(), this;
+  }
+  toggle() {
+    return this.isPanelHidden ? this.show() : this.hide();
+  }
+  show() {
+    return this.isPanelHidden = !1, this.panelEl.classList.remove("relly-hidden"), this.isPanelCollapsed || this.bindingEngine.resume(), this;
+  }
+  hide() {
+    return this.isPanelHidden = !0, this.panelEl.classList.add("relly-hidden"), this.bindingEngine.pause(), this;
+  }
+  save(e) {
+    return this.presetManager.save(e), this;
+  }
+  load(e) {
+    return this.presetManager.load(e), this;
+  }
+  export() {
+    return this.presetManager.export();
+  }
+  import(e) {
+    return this.presetManager.import(e), this;
+  }
+  getElement() {
+    return this.panelEl;
+  }
+  getShadowRoot() {
+    return this.shadowRoot;
+  }
+  getHost() {
+    return this.hostEl || null;
+  }
+  destroy() {
+    typeof window < "u" && (window.removeEventListener("resize", this.onResizeBound), this.sparklineAnimId && cancelAnimationFrame(this.sparklineAnimId)), this.draggableInstance && this.draggableInstance.destroy(), this.resizableInstance && this.resizableInstance.destroy(), this.hotkeyInstance && this.hotkeyInstance.destroy(), this.searchBarInstance && this.searchBarInstance.destroy(), this.tabsManagerInstance && this.tabsManagerInstance.destroy(), this.importModalInstance && this.importModalInstance.destroy(), this.toastManager.destroy(), this.contextMenuManager.destroy(), this.bindingEngine.destroy(), this.destroyChildren(), this.hostEl ? this.hostEl.remove() : this.panelEl.remove();
+  }
+};
+a(S, "version", "1.0.0");
+let k = S;
+Object.assign(k, {
+  Checkbox: L,
+  Slider: V,
+  Button: A,
+  Select: z,
+  DynamicLabel: B,
+  Graph: N,
+  ColorPicker: R,
+  Point2D: P,
+  Point3D: D,
+  RangeSlider: H,
+  Segmented: j,
+  StatusIndicator: F,
+  Section: q,
+  Row: K,
+  Tab: ce,
+  TabsManager: de,
+  BaseComponent: C,
+  BindingEngine: G,
+  PresetManager: W,
+  ThemeManager: ee,
+  DARK_THEME: U,
+  LIGHT_THEME: X,
+  CYBERPUNK_THEME: J,
+  NORD_THEME: Y,
+  DRACULA_THEME: _,
+  TOKYO_NIGHT_THEME: Q,
+  MATRIX_THEME: Z,
+  SYNTHWAVE_THEME: O,
+  Draggable: te,
+  Resizable: ie,
+  HotkeyManager: ne,
+  SearchBar: se,
+  SoundEngine: re,
+  ImportModal: ae,
+  ToastManager: oe,
+  ContextMenuManager: he,
+  SchemaLoader: le,
+  ContainerHelper: T,
+  RellyUI: k
+});
+typeof window < "u" && (window.RellyUI = k);
+export {
+  C as BaseComponent,
+  G as BindingEngine,
+  A as Button,
+  J as CYBERPUNK_THEME,
+  L as Checkbox,
+  R as ColorPicker,
+  T as ContainerHelper,
+  he as ContextMenuManager,
+  U as DARK_THEME,
+  _ as DRACULA_THEME,
+  te as Draggable,
+  B as DynamicLabel,
+  N as Graph,
+  ne as HotkeyManager,
+  ae as ImportModal,
+  X as LIGHT_THEME,
+  Z as MATRIX_THEME,
+  Y as NORD_THEME,
+  P as Point2D,
+  D as Point3D,
+  W as PresetManager,
+  H as RangeSlider,
+  k as RellyUI,
+  ie as Resizable,
+  K as Row,
+  O as SYNTHWAVE_THEME,
+  le as SchemaLoader,
+  se as SearchBar,
+  q as Section,
+  j as Segmented,
+  z as Select,
+  V as Slider,
+  re as SoundEngine,
+  F as StatusIndicator,
+  Q as TOKYO_NIGHT_THEME,
+  ce as Tab,
+  de as TabsManager,
+  ee as ThemeManager,
+  oe as ToastManager,
+  k as default
+};
+//# sourceMappingURL=relly-ui.es.js.map