diff --git a/.zed/settings.json b/.zed/settings.json
index 30b1b1a4b..0ec3f89ec 100644
--- a/.zed/settings.json
+++ b/.zed/settings.json
@@ -16,7 +16,7 @@
     "**/solidjs-signals/*/dist/prod.js",
     "uFuzzy.mjs",
     "lightweight-charts.standalone.production.mjs",
-    "scripts/packages",
+    // "scripts/packages",
     "dist"
   ]
 }
diff --git a/docs/TODO.md b/docs/TODO.md
index 21c893e16..3bf607596 100644
--- a/docs/TODO.md
+++ b/docs/TODO.md
@@ -1,14 +1,13 @@
 # TODO
 
 - __CRATES__
+  - _BUNDLER_
   - _CLI_
     - launch
       - if first, test read/write speed, add warning if too low (<2gb/s)
       - check available disk space
       - pull latest version and notify if out of date
     - add custom path support for config.toml
-    - maybe add bitcoind download and launch support
-      - via: https://github.com/rust-bitcoin/corepc/blob/master/node
   - _COMPUTER_
     - **add rollback of states (in stateful)**
     - add support for per index computation
@@ -39,6 +38,8 @@
       - https://checkonchain.com
       - https://researchbitcoin.net/exciting-update-coming-to-the-bitcoin-lab/
       - https://mempool.space/research
+  - _ERROR_
+  - _FETCHER_
   - _INDEXER_
     - parse only the needed block number instead the last 100 blocks
       - maybe using https://developer.bitcoin.org/reference/rpc/getblockhash.html
@@ -65,9 +66,8 @@
       - example: from -10,000 count 10, won’t work if underlying vec isn’t 10k or more long
   - _LOGGER_
     - remove colors from file
+  - _MCP_
   - _PARSER_
-    - Stateless
-    - if less than X (10 maybe ?) get block using rpc instead of parsing the block files
   - _SERVER_
     - api
       - copy mempool's rest api
@@ -93,7 +93,6 @@
   - _STORE_
     - save height and version in one file
   - _STRUCTS_
-    - remove `checked_sub` trait ? (checked with the `dev` profile)
 - __DOCS__
   - _README_
     - add a comparison table with alternatives
@@ -102,7 +101,6 @@
     - add faq
 - __WEBSITES__
   - _PACKAGES_
-    - move packages from `bitview` to `/packages` or `/websites/packages` or else
     - move the fetching logic from `bitview` website to an independent `brk` package which could be published to npm
       - https://www.npmjs.com/package/@mempool/mempool.js
       - auto publish with github actions
@@ -145,9 +143,8 @@
         - by having a global state
       - font:
         - https://fonts.google.com/specimen/Space+Mono
-
     - keep as many files as possible [under 14kb](https://endtimes.dev/why-your-website-should-be-under-14kb-in-size/)
-    - No classes: https://news.ycombinator.com/item?id=45287155
+    - [No classes](https://news.ycombinator.com/item?id=45287155)
 - __GLOBAL__
   - check `TODO`s in codebase
   - rename `output` to `txout` or `vout`, `input` to `txin` or `vin`
diff --git a/websites/bitview/scripts/chart.js b/websites/bitview/scripts/chart.js
index 7a563745a..b0f8733cc 100644
--- a/websites/bitview/scripts/chart.js
+++ b/websites/bitview/scripts/chart.js
@@ -1,585 +1,1153 @@
 // @ts-check
 
-const keyPrefix = "chart";
-const ONE_BTC_IN_SATS = 100_000_000;
-const AUTO = "auto";
-const LINE = "line";
-const CANDLE = "candle";
+/** @import { IChartApi, ISeriesApi as _ISeriesApi, SeriesDefinition, SingleValueData as _SingleValueData, CandlestickData as _CandlestickData, BaselineData as _BaselineData, HistogramData as _HistogramData, SeriesType, IPaneApi, LineSeriesPartialOptions as _LineSeriesPartialOptions, HistogramSeriesPartialOptions as _HistogramSeriesPartialOptions, BaselineSeriesPartialOptions as _BaselineSeriesPartialOptions, CandlestickSeriesPartialOptions as _CandlestickSeriesPartialOptions, WhitespaceData, DeepPartial, ChartOptions, Time, LineData as _LineData } from './packages/lightweight-charts/5.0.8/dist/typings' */
 
 /**
- * @typedef {"timestamp" | "date" | "week" | "d.epoch" | "month" | "quarter" | "semester" | "year" | "decade" } SerializedChartableIndex
+ * @typedef {[number, number, number, number]} OHLCTuple
+ *
+ * @typedef {Object} Valued
+ * @property {number} value
+ *
+ * @typedef {Object} Indexed
+ * @property {number} index
+ *
+ * @typedef {_ISeriesApi<SeriesType, number>} ISeries
+ * @typedef {_ISeriesApi<'Candlestick', number>} CandlestickISeries
+ * @typedef {_ISeriesApi<'Histogram', number>} HistogramISeries
+ * @typedef {_ISeriesApi<'Line', number>} LineISeries
+ * @typedef {_ISeriesApi<'Baseline', number>} BaselineISeries
+ *
+ * @typedef {_LineSeriesPartialOptions} LineSeriesPartialOptions
+ * @typedef {_HistogramSeriesPartialOptions} HistogramSeriesPartialOptions
+ * @typedef {_BaselineSeriesPartialOptions} BaselineSeriesPartialOptions
+ * @typedef {_CandlestickSeriesPartialOptions} CandlestickSeriesPartialOptions
+ *
+ * @typedef {Object} Series
+ * @property {ISeries} inner
+ * @property {string} id
+ * @property {Signal<boolean>} active
+ * @property {Signal<boolean>} hasData
+ * @property {Signal<string | null>} url
+ * @property {VoidFunction} remove
+ *
+ * @typedef {_SingleValueData<number>} SingleValueData
+ * @typedef {_CandlestickData<number>} CandlestickData
+ * @typedef {_LineData<number>} LineData
+ * @typedef {_BaselineData<number>} BaselineData
+ * @typedef {_HistogramData<number>} HistogramData
+ *
+ * @typedef {function({ iseries: ISeries; unit: Unit; index: Index }): void} SetDataCallback
  */
 
+import {
+  createChart,
+  CandlestickSeries,
+  HistogramSeries,
+  LineSeries,
+  BaselineSeries,
+  // } from "./5.0.8/dist/lightweight-charts.standalone.development.mjs";
+} from "./packages/lightweight-charts/5.0.8/dist/lightweight-charts.standalone.production.mjs";
+
+const oklchToRGBA = createOklchToRGBA();
+
+const lineWidth = /** @type {any} */ (1.5);
+
 /**
  * @param {Object} args
- * @param {Colors} args.colors
- * @param {LightweightCharts} args.lightweightCharts
- * @param {Accessor<ChartOption>} args.option
+ * @param {string} args.id
+ * @param {HTMLElement} args.parent
  * @param {Signals} args.signals
+ * @param {Colors} args.colors
  * @param {Utilities} args.utils
- * @param {WebSockets} args.webSockets
  * @param {Elements} args.elements
- * @param {Env} args.env
  * @param {VecsResources} args.vecsResources
- * @param {VecIdToIndexes} args.vecIdToIndexes
- * @param {Packages} args.packages
+ * @param {Accessor<Index>} args.index
+ * @param {((unknownTimeScaleCallback: VoidFunction) => void)} [args.timeScaleSetCallback]
+ * @param {true} [args.fitContent]
+ * @param {{unit: Unit; blueprints: AnySeriesBlueprint[]}[]} [args.config]
  */
-export function init({
-  colors,
-  elements,
-  lightweightCharts,
-  option,
+function createChartElement({
+  parent,
   signals,
+  colors,
   utils,
-  env,
-  webSockets,
+  elements,
+  id: chartId,
+  index,
   vecsResources,
-  vecIdToIndexes,
-  packages,
+  timeScaleSetCallback,
+  fitContent,
+  config,
 }) {
-  elements.charts.append(utils.dom.createShadow("left"));
-  elements.charts.append(utils.dom.createShadow("right"));
+  const div = window.document.createElement("div");
+  div.classList.add("chart");
+  parent.append(div);
 
-  const { headerElement, headingElement } = utils.dom.createHeader();
-  elements.charts.append(headerElement);
-
-  const { index, fieldset } = createIndexSelector({
-    option,
-    vecIdToIndexes,
-    signals,
+  const legendTop = createLegend({
     utils,
-  });
-
-  const TIMERANGE_LS_KEY = signals.createMemo(
-    () => `chart-timerange-${index()}`,
-  );
-
-  let firstRun = true;
-
-  const from = signals.createSignal(/** @type {number | null} */ (null), {
-    save: {
-      ...utils.serde.optNumber,
-      keyPrefix: TIMERANGE_LS_KEY,
-      key: "from",
-      serializeParam: firstRun,
-    },
-  });
-  const to = signals.createSignal(/** @type {number | null} */ (null), {
-    save: {
-      ...utils.serde.optNumber,
-      keyPrefix: TIMERANGE_LS_KEY,
-      key: "to",
-      serializeParam: firstRun,
-    },
-  });
-
-  const chart = lightweightCharts.createChartElement({
-    parent: elements.charts,
     signals,
-    colors,
-    id: "charts",
+  });
+  div.append(legendTop.element);
+
+  const chartDiv = window.document.createElement("div");
+  chartDiv.classList.add("lightweight-chart");
+  div.append(chartDiv);
+
+  const legendBottom = createLegend({
     utils,
-    vecsResources,
-    elements,
-    index,
-    timeScaleSetCallback: (unknownTimeScaleCallback) => {
-      // TODO: Although it mostly works in practice, need to make it more robust, there is no guarantee that this runs in order and wait for `from` and `to` to update when `index` and thus `TIMERANGE_LS_KEY` is updated
-      // Need to have the right values before the update
-
-      const from_ = from();
-      const to_ = to();
-      if (from_ !== null && to_ !== null) {
-        chart.inner.timeScale().setVisibleLogicalRange({
-          from: from_,
-          to: to_,
-        });
-      } else {
-        unknownTimeScaleCallback();
-      }
-    },
+    signals,
   });
+  div.append(legendBottom.element);
 
-  console.log(env.ios, "canShare" in navigator);
-  if (!(env.ios && !("canShare" in navigator))) {
-    const chartBottomRightCanvas = Array.from(
-      chart.inner.chartElement().getElementsByTagName("tr"),
-    ).at(-1)?.lastChild?.firstChild?.firstChild;
-    if (chartBottomRightCanvas) {
-      const charts = elements.charts;
-      const domain = window.document.createElement("p");
-      domain.innerText = `${window.location.host}`;
-      domain.id = "domain";
-      const screenshotButton = window.document.createElement("button");
-      screenshotButton.id = "screenshot";
-      const camera = "[ ◉¯]";
-      screenshotButton.innerHTML = camera;
-      screenshotButton.title = "Screenshot";
-      chartBottomRightCanvas.replaceWith(screenshotButton);
-      screenshotButton.addEventListener("click", () => {
-        packages.modernScreenshot().then(async ({ screenshot }) => {
-          charts.dataset.screenshot = "true";
-          charts.append(domain);
-          seriesTypeField.hidden = true;
-          try {
-            await screenshot({
-              element: charts,
-              env,
-              name: option().path.join("-"),
-              title: option().title,
-            });
-          } catch {}
-          charts.removeChild(domain);
-          seriesTypeField.hidden = false;
-          charts.dataset.screenshot = "false";
-        });
-      });
-    }
-  }
-
-  chart.inner.timeScale().subscribeVisibleLogicalRangeChange(
-    utils.throttle((t) => {
-      if (!t) return;
-      from.set(t.from);
-      to.set(t.to);
-    }, 250),
-  );
-
-  elements.charts.append(fieldset);
-
-  const { field: seriesTypeField, selected: topSeriesType_ } =
-    utils.dom.createHorizontalChoiceField({
-      defaultValue: CANDLE,
-      keyPrefix,
-      key: "seriestype-0",
-      choices: /** @type {const} */ ([AUTO, CANDLE, LINE]),
-      signals,
-    });
-
-  const topSeriesType = signals.createMemo(() => {
-    const topSeriesType = topSeriesType_();
-    if (topSeriesType === AUTO) {
-      const t = to();
-      const f = from();
-      if (!t || !f) return null;
-      const diff = t - f;
-      if (diff / chart.inner.paneSize().width <= 0.5) {
-        return CANDLE;
-      } else {
-        return LINE;
-      }
-    } else {
-      return topSeriesType;
-    }
-  });
-
-  const { field: topUnitField, selected: topUnit } =
-    utils.dom.createHorizontalChoiceField({
-      defaultValue: "usd",
-      keyPrefix,
-      key: "unit-0",
-      choices: /** @type {const} */ ([
-        /** @satisfies {Unit} */ ("usd"),
-        /** @satisfies {Unit} */ ("sats"),
-      ]),
-      signals,
-      sorted: true,
-    });
-
-  chart.addFieldsetIfNeeded({
-    id: "charts-unit-0",
-    paneIndex: 0,
-    position: "nw",
-    createChild() {
-      return topUnitField;
-    },
-  });
-
-  const seriesListTop = /** @type {Series[]} */ ([]);
-  const seriesListBottom = /** @type {Series[]} */ ([]);
-
-  /**
-   * @param {Object} params
-   * @param {ISeries} params.iseries
-   * @param {Unit} params.unit
-   * @param {Index} params.index
-   */
-  function printLatest({ iseries, unit, index }) {
-    const _latest = webSockets.kraken1dCandle.latest();
-
-    if (!_latest) return;
-
-    const latest = { ..._latest };
-
-    if (unit === "sats") {
-      latest.open = Math.floor(ONE_BTC_IN_SATS / latest.open);
-      latest.high = Math.floor(ONE_BTC_IN_SATS / latest.high);
-      latest.low = Math.floor(ONE_BTC_IN_SATS / latest.low);
-      latest.close = Math.floor(ONE_BTC_IN_SATS / latest.close);
-    }
-
-    const last_ = iseries.data().at(-1);
-    if (!last_) return;
-    const last = { ...last_ };
-
-    if ("close" in last) {
-      last.close = latest.close;
-    }
-    if ("value" in last) {
-      last.value = latest.close;
-    }
-    const date = new Date(latest.time * 1000);
-
-    switch (index) {
-      case /** @satisfies {Height} */ (5):
-      case /** @satisfies {DifficultyEpoch} */ (2):
-      case /** @satisfies {HalvingEpoch} */ (4): {
-        if ("close" in last) {
-          last.low = Math.min(last.low, latest.close);
-          last.high = Math.max(last.high, latest.close);
-        }
-        iseries.update(last);
-        break;
-      }
-      case /** @satisfies {DateIndex} */ (0): {
-        iseries.update(last);
-        break;
-      }
-      default: {
-        if (index === /** @satisfies {WeekIndex} */ (23)) {
-          date.setUTCDate(date.getUTCDate() - ((date.getUTCDay() + 6) % 7));
-        } else if (index === /** @satisfies {MonthIndex} */ (7)) {
-          date.setUTCDate(1);
-        } else if (index === /** @satisfies {QuarterIndex} */ (19)) {
-          const month = date.getUTCMonth();
-          date.setUTCMonth(month - (month % 3), 1);
-        } else if (index === /** @satisfies {SemesterIndex} */ (20)) {
-          const month = date.getUTCMonth();
-          date.setUTCMonth(month - (month % 6), 1);
-        } else if (index === /** @satisfies {YearIndex} */ (24)) {
-          date.setUTCMonth(0, 1);
-        } else if (index === /** @satisfies {DecadeIndex} */ (1)) {
-          date.setUTCFullYear(
-            Math.floor(date.getUTCFullYear() / 10) * 10,
-            0,
-            1,
-          );
-        } else {
-          throw Error("Unsupported");
-        }
-
-        const time = date.valueOf() / 1000;
-
-        if (time === last.time) {
-          if ("close" in last) {
-            last.low = Math.min(last.low, latest.low);
-            last.high = Math.max(last.high, latest.high);
+  /** @type {IChartApi} */
+  const ichart = createChart(
+    chartDiv,
+    /** @satisfies {DeepPartial<ChartOptions>} */ ({
+      autoSize: true,
+      layout: {
+        fontFamily: elements.style.fontFamily,
+        background: { color: "transparent" },
+        attributionLogo: false,
+        colorSpace: "display-p3",
+        colorParsers: [oklchToRGBA],
+      },
+      grid: {
+        vertLines: { visible: false },
+        horzLines: { visible: false },
+      },
+      rightPriceScale: {
+        borderVisible: false,
+      },
+      timeScale: {
+        borderVisible: false,
+        ...(fitContent
+          ? {
+              minBarSpacing: 0.001,
+            }
+          : {}),
+      },
+      localization: {
+        priceFormatter: numberToShortUSFormat,
+        locale: "en-us",
+      },
+      crosshair: {
+        mode: 3,
+      },
+      ...(fitContent
+        ? {
+            handleScale: false,
+            handleScroll: false,
           }
-          iseries.update(last);
-        } else {
-          latest.time = time;
-          iseries.update(last);
-        }
-      }
-    }
-  }
+        : {}),
+      // ..._options,
+    }),
+  );
 
-  signals.createEffect(option, (option) => {
-    headingElement.innerHTML = option.title;
+  // Takes a bit more space sometimes but it's better UX than having the scale being resized on option change
+  ichart.priceScale("right").applyOptions({
+    minimumWidth: 80,
+  });
 
-    const bottomUnits = /** @type {readonly Unit[]} */ (
-      Object.keys(option.bottom)
-    );
-    const { field: bottomUnitField, selected: bottomUnit } =
-      utils.dom.createHorizontalChoiceField({
-        defaultValue: bottomUnits.at(0) || "",
-        keyPrefix,
-        key: "unit-1",
-        choices: bottomUnits,
-        signals,
-        sorted: true,
-      });
+  ichart.panes().at(0)?.setStretchFactor(1);
 
-    if (bottomUnits.length) {
-      chart.addFieldsetIfNeeded({
-        id: "charts-unit-1",
-        paneIndex: 1,
-        position: "nw",
-        createChild() {
-          return bottomUnitField;
+  signals.createEffect(
+    () => ({
+      defaultColor: colors.default(),
+      offColor: colors.gray(),
+      borderColor: colors.border(),
+    }),
+    ({ defaultColor, offColor, borderColor }) => {
+      ichart.applyOptions({
+        layout: {
+          textColor: offColor,
+          panes: {
+            separatorColor: borderColor,
+          },
+        },
+        crosshair: {
+          horzLine: {
+            color: offColor,
+            labelBackgroundColor: defaultColor,
+          },
+          vertLine: {
+            color: offColor,
+            labelBackgroundColor: defaultColor,
+          },
         },
       });
-    }
+    },
+  );
 
-    chart.addFieldsetIfNeeded({
-      id: "charts-seriestype-0",
-      paneIndex: 0,
-      position: "ne",
-      createChild() {
-        return seriesTypeField;
+  signals.createEffect(index, (index) => {
+    const minBarSpacing =
+      index === /** @satisfies {MonthIndex} */ (7)
+        ? 1
+        : index === /** @satisfies {QuarterIndex} */ (19)
+          ? 2
+          : index === /** @satisfies {SemesterIndex} */ (20)
+            ? 3
+            : index === /** @satisfies {YearIndex} */ (24)
+              ? 6
+              : index === /** @satisfies {DecadeIndex} */ (1)
+                ? 60
+                : 0.5;
+
+    ichart.applyOptions({
+      timeScale: {
+        timeVisible:
+          index === /** @satisfies {Height} */ (5) ||
+          index === /** @satisfies {DifficultyEpoch} */ (2) ||
+          index === /** @satisfies {HalvingEpoch} */ (4),
+        ...(!fitContent
+          ? {
+              minBarSpacing,
+            }
+          : {}),
       },
     });
+  });
 
-    signals.createEffect(index, (index) => {
-      signals.createEffect(
-        () => ({
-          topUnit: topUnit(),
-          topSeriesType: topSeriesType(),
-        }),
-        ({ topUnit, topSeriesType }) => {
-          /** @type {Series | undefined} */
-          let series;
+  const activeResources = /** @type {Set<VecResource>} */ (new Set());
+  ichart.subscribeCrosshairMove(
+    utils.throttle(() => {
+      activeResources.forEach((v) => {
+        v.fetch();
+      });
+    }),
+  );
 
-          console.log({ topUnit, topSeriesType });
+  if (fitContent) {
+    new ResizeObserver(() => ichart.timeScale().fitContent()).observe(chartDiv);
+  }
 
-          switch (topUnit) {
-            case "usd": {
-              switch (topSeriesType) {
-                case null:
-                case CANDLE: {
-                  series = chart.addCandlestickSeries({
-                    vecId: "price_ohlc",
-                    name: "Price",
-                    unit: topUnit,
-                    setDataCallback: printLatest,
-                    order: 0,
-                  });
-                  break;
-                }
-                case LINE: {
-                  series = chart.addLineSeries({
-                    vecId: "price_close",
-                    name: "Price",
-                    unit: topUnit,
-                    color: colors.default,
-                    setDataCallback: printLatest,
-                    options: {
-                      priceLineVisible: true,
-                      lastValueVisible: true,
-                    },
-                    order: 0,
-                  });
-                }
-              }
-              break;
-            }
-            case "sats": {
-              switch (topSeriesType) {
-                case null:
-                case CANDLE: {
-                  series = chart.addCandlestickSeries({
-                    vecId: "price_ohlc_in_sats",
-                    name: "Price",
-                    unit: topUnit,
-                    inverse: true,
-                    setDataCallback: printLatest,
-                    order: 0,
-                  });
-                  break;
-                }
-                case LINE: {
-                  series = chart.addLineSeries({
-                    vecId: "price_close_in_sats",
-                    name: "Price",
-                    unit: topUnit,
-                    color: colors.default,
-                    setDataCallback: printLatest,
-                    options: {
-                      priceLineVisible: true,
-                      lastValueVisible: true,
-                    },
-                    order: 0,
-                  });
-                }
-              }
-              break;
-            }
+  /**
+   * @param {Object} args
+   * @param {string} args.id
+   * @param {number} args.paneIndex
+   * @param {"nw" | "ne" | "se" | "sw"} args.position
+   * @param {number} [args.timeout]
+   * @param {(pane: IPaneApi<Time>) => HTMLElement} args.createChild
+   */
+  function addFieldsetIfNeeded({ paneIndex, id, position, createChild }) {
+    const owner = signals.getOwner();
+
+    setTimeout(
+      () =>
+        signals.runWithOwner(owner, () => {
+          const parent = ichart
+            ?.panes()
+            .at(paneIndex)
+            ?.getHTMLElement()
+            ?.children?.item(1)?.firstChild;
+
+          if (!parent) throw Error("Parent should exist");
+
+          const children = Array.from(parent.childNodes).filter(
+            (element) =>
+              /** @type {HTMLElement} */ (element).dataset.position ===
+              position,
+          );
+
+          if (children.length === 1) {
+            children[0].remove();
+          } else if (children.length > 1) {
+            throw Error("Untraceable");
           }
 
-          if (!series) throw Error("Unreachable");
+          const fieldset = window.document.createElement("fieldset");
+          fieldset.dataset.size = "xs";
+          fieldset.dataset.position = position;
+          fieldset.id = `${id}-${paneIndex}`;
+          const pane = ichart.panes().at(paneIndex);
+          if (!pane) throw Error("Expect pane");
+          pane
+            .getHTMLElement()
+            ?.children?.item(1)
+            ?.firstChild?.appendChild(fieldset);
 
-          seriesListTop[0]?.remove();
-          seriesListTop[0] = series;
+          fieldset.append(createChild(pane));
+        }),
+      paneIndex ? 50 : 0,
+    );
+  }
 
-          signals.createEffect(
-            () => ({
-              latest: webSockets.kraken1dCandle.latest(),
-              hasData: series.hasData(),
-            }),
-            ({ latest, hasData }) => {
-              if (!series || !latest || !hasData) return;
-              printLatest({ iseries: series.inner, unit: topUnit, index });
-            },
+  /**
+   * @param {Object} args
+   * @param {Unit} args.unit
+   * @param {SeriesType} args.seriesType
+   * @param {number} args.paneIndex
+   */
+  function addPriceScaleSelectorIfNeeded({ unit, paneIndex, seriesType }) {
+    const id = `${chartId}-scale`;
+
+    addFieldsetIfNeeded({
+      id,
+      paneIndex,
+      position: "sw",
+      createChild(pane) {
+        const { field, selected } = utils.dom.createHorizontalChoiceField({
+          choices: /** @type {const} */ (["lin", "log"]),
+          id: utils.stringToId(`${id} ${paneIndex} ${unit}`),
+          defaultValue:
+            unit === "usd" && seriesType !== "Baseline" ? "log" : "lin",
+          key: `${id}-price-scale-${paneIndex}`,
+          signals,
+        });
+
+        signals.createEffect(selected, (selected) => {
+          try {
+            pane.priceScale("right").applyOptions({
+              mode: selected === "lin" ? 0 : 1,
+            });
+          } catch {}
+        });
+
+        return field;
+      },
+    });
+  }
+
+  /**
+   * @param {Object} args
+   * @param {ISeries} args.iseries
+   * @param {string} args.name
+   * @param {Unit} args.unit
+   * @param {number} args.order
+   * @param {Color[]} args.colors
+   * @param {SeriesType} args.seriesType
+   * @param {VecId} [args.vecId]
+   * @param {SetDataCallback} [args.setDataCallback]
+   * @param {Accessor<WhitespaceData<number>[]>} [args.data]
+   * @param {number} args.paneIndex
+   * @param {boolean} [args.defaultActive]
+   */
+  function addSeries({
+    iseries,
+    vecId,
+    name,
+    unit,
+    order,
+    seriesType,
+    setDataCallback,
+    paneIndex,
+    defaultActive,
+    colors,
+    data,
+  }) {
+    return signals.createRoot((dispose) => {
+      const id = `${utils.stringToId(name)}-${paneIndex}`;
+
+      const active = signals.createSignal(defaultActive ?? true, {
+        save: {
+          keyPrefix: "",
+          key: id,
+          ...utils.serde.boolean,
+        },
+      });
+
+      const hasData = signals.createSignal(false);
+
+      signals.createEffect(active, (active) =>
+        // Or remove ?
+        iseries.applyOptions({
+          visible: active,
+        }),
+      );
+
+      iseries.setSeriesOrder(order);
+
+      /** @type {VecResource | undefined} */
+      let _valuesResource;
+
+      /** @type {Series} */
+      const series = {
+        inner: iseries,
+        active,
+        hasData,
+        id,
+        url: signals.createSignal(/** @type {string | null} */ (null)),
+        remove() {
+          dispose();
+          // @ts-ignore
+          chart.inner.removeSeries(iseries);
+          if (_valuesResource) {
+            activeResources.delete(_valuesResource);
+          }
+        },
+      };
+
+      if (vecId) {
+        signals.createEffect(index, (index) => {
+          const timeResource = vecsResources.getOrCreate(
+            index,
+            index === /** @satisfies {Height} */ (5)
+              ? "timestamp_fixed"
+              : "timestamp",
           );
-        },
-      );
+          timeResource.fetch();
 
-      [
-        {
-          blueprints: option.top,
-          paneIndex: 0,
-          unit: topUnit,
-          seriesList: seriesListTop,
-          orderStart: 1,
-          legend: chart.legendTop,
-        },
-        {
-          blueprints: option.bottom,
-          paneIndex: 1,
-          unit: bottomUnit,
-          seriesList: seriesListBottom,
-          orderStart: 0,
-          legend: chart.legendBottom,
-        },
-      ].forEach(
-        ({ blueprints, paneIndex, unit, seriesList, orderStart, legend }) => {
-          signals.createEffect(unit, (unit) => {
-            legend.removeFrom(orderStart);
+          const valuesResource = vecsResources.getOrCreate(index, vecId);
+          _valuesResource = valuesResource;
 
-            seriesList.splice(orderStart).forEach((series) => {
-              series.remove();
-            });
+          series.url.set(() => valuesResource.url);
 
-            blueprints[unit]?.forEach((blueprint, order) => {
-              order += orderStart;
+          signals.createEffect(active, (active) => {
+            if (active) {
+              valuesResource.fetch();
+              activeResources.add(valuesResource);
 
-              const indexes = /** @type {readonly number[]} */ (
-                vecIdToIndexes[blueprint.key]
+              const fetchedKey = vecsResources.defaultFetchedKey;
+              signals.createEffect(
+                () => ({
+                  _indexes: timeResource.fetched().get(fetchedKey)?.vec(),
+                  values: valuesResource.fetched().get(fetchedKey)?.vec(),
+                }),
+                ({ _indexes, values }) => {
+                  if (!_indexes?.length || !values?.length) return;
+
+                  const indexes = /** @type {number[]} */ (_indexes);
+
+                  let length = Math.min(indexes.length, values.length);
+
+                  // TODO: Don't create new Array if data already present, update instead
+                  const data = /** @type {LineData[] | CandlestickData[]} */ (
+                    Array.from({ length })
+                  );
+
+                  let prevTime = null;
+                  let timeOffset = 0;
+
+                  for (let i = 0; i < length; i++) {
+                    const time = indexes[i];
+                    const sameTime = prevTime === time;
+                    if (sameTime) {
+                      timeOffset += 1;
+                    }
+                    const v = values[i];
+                    const offsetedI = i - timeOffset;
+                    if (v === null) {
+                      data[offsetedI] = {
+                        time,
+                        value: NaN,
+                      };
+                    } else if (typeof v === "number") {
+                      data[offsetedI] = {
+                        time,
+                        value: v,
+                      };
+                    } else {
+                      // if (sameTime) {
+                      //   console.log(data[offsetedI]);
+                      // }
+                      let [open, high, low, close] = v;
+                      data[offsetedI] = {
+                        time,
+                        // @ts-ignore
+                        open: sameTime ? data[offsetedI].open : open,
+                        high: sameTime
+                          ? // @ts-ignore
+                            Math.max(data[offsetedI].high, high)
+                          : high,
+                        low: sameTime
+                          ? // @ts-ignore
+                            Math.min(data[offsetedI].low, low)
+                          : low,
+                        close,
+                      };
+                    }
+                    prevTime = time;
+                  }
+
+                  data.length -= timeOffset;
+
+                  hasData.set(true);
+
+                  const seriesData = series.inner.data();
+                  if (!seriesData.length) {
+                    iseries.setData(data);
+
+                    if (fitContent) {
+                      ichart.timeScale().fitContent();
+                    }
+
+                    timeScaleSetCallback?.(() => {
+                      if (
+                        index === /** @satisfies {QuarterIndex} */ (19) ||
+                        index === /** @satisfies {SemesterIndex} */ (20) ||
+                        index === /** @satisfies {YearIndex} */ (24) ||
+                        index === /** @satisfies {DecadeIndex} */ (1)
+                      ) {
+                        ichart.timeScale().setVisibleLogicalRange({
+                          from: -1,
+                          to: data.length,
+                        });
+                      }
+                    });
+                  } else {
+                    const last = seriesData.at(-1);
+                    if (!last) throw Error("Unreachable");
+                    for (let i = 0; i < data.length; i++) {
+                      if (data[i].time >= last.time) {
+                        iseries.update(data[i]);
+                      }
+                    }
+                  }
+
+                  setDataCallback?.({
+                    iseries,
+                    index,
+                    unit,
+                  });
+                },
               );
-
-              if (indexes.includes(index)) {
-                switch (blueprint.type) {
-                  case "Baseline": {
-                    seriesList.push(
-                      chart.addBaselineSeries({
-                        vecId: blueprint.key,
-                        name: blueprint.title,
-                        unit,
-                        defaultActive: blueprint.defaultActive,
-                        paneIndex,
-                        options: {
-                          ...blueprint.options,
-                          topLineColor:
-                            blueprint.color?.() ?? blueprint.colors?.[0](),
-                          bottomLineColor:
-                            blueprint.color?.() ?? blueprint.colors?.[1](),
-                        },
-                        order,
-                      }),
-                    );
-                    break;
-                  }
-                  case "Histogram": {
-                    seriesList.push(
-                      chart.addHistogramSeries({
-                        vecId: blueprint.key,
-                        name: blueprint.title,
-                        unit,
-                        color: blueprint.color,
-                        defaultActive: blueprint.defaultActive,
-                        paneIndex,
-                        options: blueprint.options,
-                        order,
-                      }),
-                    );
-                    break;
-                  }
-                  case "Candlestick": {
-                    throw Error("TODO");
-                  }
-                  case "Line":
-                  case undefined:
-                    seriesList.push(
-                      chart.addLineSeries({
-                        vecId: blueprint.key,
-                        color: blueprint.color,
-                        name: blueprint.title,
-                        unit,
-                        defaultActive: blueprint.defaultActive,
-                        paneIndex,
-                        options: blueprint.options,
-                        order,
-                      }),
-                    );
-                }
-              }
-            });
+            } else {
+              activeResources.delete(valuesResource);
+            }
           });
-        },
+        });
+      } else if (data) {
+        signals.createEffect(data, (data) => {
+          iseries.setData(data);
+          hasData.set(true);
+          setDataCallback?.({
+            iseries,
+            index: index(),
+            unit,
+          });
+
+          if (fitContent) {
+            ichart.timeScale().fitContent();
+          }
+        });
+      }
+
+      (paneIndex ? legendBottom : legendTop).addOrReplace({
+        series,
+        name,
+        colors,
+        order,
+      });
+
+      addPriceScaleSelectorIfNeeded({
+        paneIndex,
+        seriesType,
+        unit,
+      });
+
+      return series;
+    });
+  }
+
+  const chart = {
+    inner: ichart,
+    legendTop,
+    legendBottom,
+
+    addFieldsetIfNeeded,
+
+    /**
+     * @param {Object} args
+     * @param {string} args.name
+     * @param {Unit} args.unit
+     * @param {number} args.order
+     * @param {VecId} [args.vecId]
+     * @param {Accessor<CandlestickData[]>} [args.data]
+     * @param {number} [args.paneIndex]
+     * @param {boolean} [args.defaultActive]
+     * @param {boolean} [args.inverse]
+     * @param {SetDataCallback} [args.setDataCallback]
+     * @param {CandlestickSeriesPartialOptions} [args.options]
+     */
+    addCandlestickSeries({
+      vecId,
+      name,
+      unit,
+      order,
+      paneIndex = 0,
+      defaultActive,
+      setDataCallback,
+      data,
+      inverse,
+      options,
+    }) {
+      const green = inverse ? colors.red : colors.green;
+      const red = inverse ? colors.green : colors.red;
+
+      /** @type {CandlestickISeries} */
+      const iseries = /** @type {any} */ (
+        ichart.addSeries(
+          /** @type {SeriesDefinition<'Candlestick'>} */ (CandlestickSeries),
+          {
+            upColor: green(),
+            downColor: red(),
+            wickUpColor: green(),
+            wickDownColor: red(),
+            borderVisible: false,
+            visible: defaultActive !== false,
+            ...options,
+          },
+          paneIndex,
+        )
       );
 
-      firstRun = false;
+      return addSeries({
+        colors: [green, red],
+        iseries,
+        name,
+        order,
+        paneIndex,
+        seriesType: "Candlestick",
+        unit,
+        data,
+        setDataCallback,
+        defaultActive,
+        vecId,
+      });
+    },
+    /**
+     * @param {Object} args
+     * @param {string} args.name
+     * @param {Unit} args.unit
+     * @param {number} args.order
+     * @param {Color} args.color
+     * @param {VecId} [args.vecId]
+     * @param {Accessor<HistogramData[]>} [args.data]
+     * @param {number} [args.paneIndex]
+     * @param {boolean} [args.defaultActive]
+     * @param {SetDataCallback} [args.setDataCallback]
+     * @param {HistogramSeriesPartialOptions} [args.options]
+     */
+    addHistogramSeries({
+      vecId,
+      name,
+      unit,
+      color,
+      order,
+      paneIndex = 0,
+      defaultActive,
+      setDataCallback,
+      data,
+      options,
+    }) {
+      /** @type {HistogramISeries} */
+      const iseries = /** @type {any} */ (
+        ichart.addSeries(
+          /** @type {SeriesDefinition<'Histogram'>} */ (HistogramSeries),
+          {
+            color: color(),
+            visible: defaultActive !== false,
+            priceLineVisible: false,
+          },
+          paneIndex,
+        )
+      );
+
+      return addSeries({
+        colors: [color],
+        iseries,
+        name,
+        order,
+        paneIndex,
+        seriesType: "Bar",
+        unit,
+        data,
+        setDataCallback,
+        defaultActive,
+        vecId,
+      });
+    },
+    /**
+     * @param {Object} args
+     * @param {string} args.name
+     * @param {Unit} args.unit
+     * @param {number} args.order
+     * @param {Accessor<LineData[]>} [args.data]
+     * @param {VecId} [args.vecId]
+     * @param {Color} [args.color]
+     * @param {SetDataCallback} [args.setDataCallback]
+     * @param {number} [args.paneIndex]
+     * @param {boolean} [args.defaultActive]
+     * @param {LineSeriesPartialOptions} [args.options]
+     */
+    addLineSeries({
+      vecId,
+      name,
+      unit,
+      order,
+      setDataCallback,
+      color,
+      paneIndex = 0,
+      defaultActive,
+      data,
+      options,
+    }) {
+      color ||= unit === "usd" ? colors.green : colors.orange;
+
+      /** @type {LineISeries} */
+      const iseries = /** @type {any} */ (
+        ichart.addSeries(
+          /** @type {SeriesDefinition<'Line'>} */ (LineSeries),
+          {
+            lineWidth,
+            visible: defaultActive !== false,
+            priceLineVisible: false,
+            color: color(),
+            // lineVisible: false,
+            // pointMarkersVisible: true,
+            // pointMarkersRadius: 1,
+            ...options,
+          },
+          paneIndex,
+        )
+      );
+
+      return addSeries({
+        colors: [color],
+        iseries,
+        name,
+        order,
+        paneIndex,
+        seriesType: "Line",
+        unit,
+        setDataCallback,
+        data,
+        defaultActive,
+        vecId,
+      });
+    },
+    /**
+     * @param {Object} args
+     * @param {string} args.name
+     * @param {Unit} args.unit
+     * @param {number} args.order
+     * @param {Accessor<BaselineData[]>} [args.data]
+     * @param {VecId} [args.vecId]
+     * @param {SetDataCallback} [args.setDataCallback]
+     * @param {number} [args.paneIndex]
+     * @param {boolean} [args.defaultActive]
+     * @param {BaselineSeriesPartialOptions} [args.options]
+     */
+    addBaselineSeries({
+      vecId,
+      name,
+      unit,
+      order,
+      paneIndex: _paneIndex,
+      setDataCallback,
+      defaultActive,
+      data,
+      options,
+    }) {
+      const paneIndex = _paneIndex ?? 0;
+
+      /** @type {BaselineISeries} */
+      const iseries = /** @type {any} */ (
+        ichart.addSeries(
+          /** @type {SeriesDefinition<'Baseline'>} */ (BaselineSeries),
+          {
+            lineWidth,
+            visible: defaultActive !== false,
+            baseValue: {
+              price: options?.baseValue?.price ?? 0,
+            },
+            ...options,
+            topLineColor: options?.topLineColor ?? colors.green(),
+            bottomLineColor: options?.bottomLineColor ?? colors.red(),
+            priceLineVisible: false,
+            bottomFillColor1: "transparent",
+            bottomFillColor2: "transparent",
+            topFillColor1: "transparent",
+            topFillColor2: "transparent",
+            lineVisible: true,
+          },
+          paneIndex,
+        )
+      );
+
+      return addSeries({
+        colors: [
+          () => options?.topLineColor ?? colors.green(),
+          () => options?.bottomLineColor ?? colors.red(),
+        ],
+        iseries,
+        name,
+        order,
+        paneIndex,
+        seriesType: "Baseline",
+        setDataCallback,
+        unit,
+        data,
+        defaultActive,
+        vecId,
+      });
+    },
+  };
+
+  config?.forEach(({ unit, blueprints }, paneIndex) => {
+    blueprints.forEach((blueprint, order) => {
+      if (blueprint.type === "Candlestick") {
+        chart.addCandlestickSeries({
+          name: blueprint.title,
+          unit,
+          data: blueprint.data,
+          defaultActive: blueprint.defaultActive,
+          paneIndex,
+          order,
+        });
+      } else if (blueprint.type === "Baseline") {
+        chart.addBaselineSeries({
+          name: blueprint.title,
+          unit,
+          data: blueprint.data,
+          defaultActive: blueprint.defaultActive,
+          paneIndex,
+          order,
+        });
+      } else if (blueprint.type === "Histogram") {
+        chart.addHistogramSeries({
+          name: blueprint.title,
+          unit,
+          color: blueprint.color,
+          data: blueprint.data,
+          defaultActive: blueprint.defaultActive,
+          paneIndex,
+          order,
+        });
+      } else {
+        chart.addLineSeries({
+          name: blueprint.title,
+          unit,
+          data: blueprint.data,
+          defaultActive: blueprint.defaultActive,
+          paneIndex,
+          color: blueprint.color,
+          order,
+        });
+      }
     });
   });
+
+  return chart;
 }
 
 /**
  * @param {Object} args
- * @param {Accessor<ChartOption>} args.option
- * @param {VecIdToIndexes} args.vecIdToIndexes
  * @param {Signals} args.signals
  * @param {Utilities} args.utils
  */
-function createIndexSelector({ option, vecIdToIndexes, signals, utils }) {
-  const choices_ = /** @satisfies {SerializedChartableIndex[]} */ ([
-    "timestamp",
-    "date",
-    "week",
-    "d.epoch",
-    "month",
-    "quarter",
-    "semester",
-    "year",
-    // "halving epoch",
-    "decade",
-  ]);
+function createLegend({ signals, utils }) {
+  const element = window.document.createElement("legend");
 
-  /** @type {Accessor<typeof choices_>} */
-  const choices = signals.createMemo(() => {
-    const o = option();
+  const hovered = signals.createSignal(/** @type {Series | null} */ (null));
 
-    if (!Object.keys(o.top).length && !Object.keys(o.bottom).length) {
-      return [...choices_];
-    }
-    const rawIndexes = new Set(
-      [Object.values(o.top), Object.values(o.bottom)]
-        .flat(2)
-        .filter((blueprint) => !blueprint.key.startsWith("constant_"))
-        .map((blueprint) => vecIdToIndexes[blueprint.key])
-        .flat(),
-    );
+  /** @type {HTMLElement[]} */
+  const legends = [];
 
-    const serializedIndexes = [...rawIndexes].flatMap((index) => {
-      const c = utils.serde.chartableIndex.serialize(index);
-      return c ? [c] : [];
-    });
+  return {
+    element,
+    /**
+     * @param {Object} args
+     * @param {Series} args.series
+     * @param {string} args.name
+     * @param {number} args.order
+     * @param {Color[]} args.colors
+     */
+    addOrReplace({ series, name, colors, order }) {
+      const div = window.document.createElement("div");
 
-    return /** @type {any} */ (
-      choices_.filter((choice) => serializedIndexes.includes(choice))
-    );
-  });
+      const prev = legends[order];
+      if (prev) {
+        prev.replaceWith(div);
+      } else {
+        const elementAtOrder = Array.from(element.children).at(order);
+        if (elementAtOrder) {
+          elementAtOrder.before(div);
+        } else {
+          element.append(div);
+        }
+      }
+      legends[order] = div;
 
-  const { field, selected } = utils.dom.createHorizontalChoiceField({
-    defaultValue: "date",
-    keyPrefix,
-    key: "index",
-    choices,
-    id: "index",
-    signals,
-  });
+      const { input, label } = utils.dom.createLabeledInput({
+        inputId: utils.stringToId(`legend-${series.id}`),
+        inputName: utils.stringToId(`selected-${series.id}`),
+        inputValue: "value",
+        title: "Click to toggle",
+        inputChecked: series.active(),
+        onClick: () => {
+          series.active.set(input.checked);
+        },
+        type: "checkbox",
+      });
 
-  const fieldset = window.document.createElement("fieldset");
-  fieldset.id = "interval";
+      const spanMain = window.document.createElement("span");
+      spanMain.classList.add("main");
+      label.append(spanMain);
 
-  const screenshotSpan = window.document.createElement("span");
-  screenshotSpan.innerText = "interval:";
-  fieldset.append(screenshotSpan);
+      const spanName = utils.dom.createSpanName(name);
+      spanMain.append(spanName);
 
-  fieldset.append(field);
-  fieldset.dataset.size = "sm";
+      div.append(label);
+      label.addEventListener("mouseover", () => {
+        const h = hovered();
+        if (!h || h !== series) {
+          hovered.set(series);
+        }
+      });
+      label.addEventListener("mouseleave", () => {
+        hovered.set(null);
+      });
 
-  const index = signals.createMemo(() =>
-    utils.serde.chartableIndex.deserialize(selected()),
-  );
+      function shouldHighlight() {
+        const h = hovered();
+        return !h || h === series;
+      }
 
-  return { fieldset, index };
+      /**
+       * @param {string} color
+       */
+      function tameColor(color) {
+        return `${color.slice(0, -1)} / 50%)`;
+      }
+
+      const spanColors = window.document.createElement("span");
+      spanColors.classList.add("colors");
+      spanMain.prepend(spanColors);
+      colors.forEach((color) => {
+        const spanColor = window.document.createElement("span");
+        spanColors.append(spanColor);
+
+        signals.createEffect(
+          () => ({
+            color: color(),
+            shouldHighlight: shouldHighlight(),
+          }),
+          ({ color, shouldHighlight }) => {
+            if (shouldHighlight) {
+              spanColor.style.backgroundColor = color;
+            } else {
+              spanColor.style.backgroundColor = tameColor(color);
+            }
+          },
+        );
+      });
+
+      const initialColors = /** @type {Record<string, any>} */ ({});
+      const darkenedColors = /** @type {Record<string, any>} */ ({});
+
+      const seriesOptions = series.inner.options();
+      if (!seriesOptions) return;
+
+      Object.entries(seriesOptions).forEach(([k, v]) => {
+        if (k.toLowerCase().includes("color") && typeof v === "string") {
+          if (!v.startsWith("oklch")) return;
+          initialColors[k] = v;
+          darkenedColors[k] = tameColor(v);
+        } else if (k === "lastValueVisible" && v) {
+          initialColors[k] = true;
+          darkenedColors[k] = false;
+        }
+      });
+
+      signals.createEffect(shouldHighlight, (shouldHighlight) => {
+        if (shouldHighlight) {
+          series.inner.applyOptions(initialColors);
+        } else {
+          series.inner.applyOptions(darkenedColors);
+        }
+      });
+
+      const anchor = window.document.createElement("a");
+
+      signals.createEffect(series.url, (url) => {
+        if (url) {
+          anchor.href = url;
+          anchor.target = "_blank";
+          anchor.rel = "noopener noreferrer";
+          anchor.title = "Click to view data";
+          div.append(anchor);
+        }
+      });
+    },
+    /**
+     * @param {number} start
+     */
+    removeFrom(start) {
+      // disposeFrom(start);
+      legends.splice(start).forEach((child) => child.remove());
+    },
+  };
 }
+
+/**
+ * @param {number} value
+ * @param {0 | 2} [digits]
+ */
+function numberToShortUSFormat(value, digits) {
+  const absoluteValue = Math.abs(value);
+
+  if (isNaN(value)) {
+    return "";
+  } else if (absoluteValue < 10) {
+    return numberToUSFormat(value, Math.min(3, digits || 10));
+  } else if (absoluteValue < 1_000) {
+    return numberToUSFormat(value, Math.min(2, digits || 10));
+  } else if (absoluteValue < 10_000) {
+    return numberToUSFormat(value, Math.min(1, digits || 10));
+  } else if (absoluteValue < 1_000_000) {
+    return numberToUSFormat(value, 0);
+  } else if (absoluteValue >= 900_000_000_000_000_000_000_000) {
+    return "Inf.";
+  }
+
+  const log = Math.floor(Math.log10(absoluteValue) - 6);
+
+  const suffices = ["M", "B", "T", "P", "E", "Z"];
+  const letterIndex = Math.floor(log / 3);
+  const letter = suffices[letterIndex];
+
+  const modulused = log % 3;
+
+  // return `${numberToUSFormat(
+  //   value / (1_000_000 * 1_000 ** letterIndex),
+  //   3,
+  // )}${letter}`;
+
+  if (modulused === 0) {
+    return `${numberToUSFormat(
+      value / (1_000_000 * 1_000 ** letterIndex),
+      3,
+    )}${letter}`;
+  } else if (modulused === 1) {
+    return `${numberToUSFormat(
+      value / (1_000_000 * 1_000 ** letterIndex),
+      2,
+    )}${letter}`;
+  } else {
+    return `${numberToUSFormat(
+      value / (1_000_000 * 1_000 ** letterIndex),
+      1,
+    )}${letter}`;
+  }
+}
+
+/**
+ * @param {number} value
+ * @param {number} [digits]
+ * @param {Intl.NumberFormatOptions} [options]
+ */
+function numberToUSFormat(value, digits, options) {
+  return value.toLocaleString("en-us", {
+    ...options,
+    minimumFractionDigits: digits,
+    maximumFractionDigits: digits,
+  });
+}
+
+function createOklchToRGBA() {
+  {
+    /**
+     *
+     * @param {readonly [number, number, number, number, number, number, number, number, number]} A
+     * @param {readonly [number, number, number]} B
+     * @returns
+     */
+    function multiplyMatrices(A, B) {
+      return /** @type {const} */ ([
+        A[0] * B[0] + A[1] * B[1] + A[2] * B[2],
+        A[3] * B[0] + A[4] * B[1] + A[5] * B[2],
+        A[6] * B[0] + A[7] * B[1] + A[8] * B[2],
+      ]);
+    }
+    /**
+     * @param {readonly [number, number, number]} param0
+     */
+    function oklch2oklab([l, c, h]) {
+      return /** @type {const} */ ([
+        l,
+        isNaN(h) ? 0 : c * Math.cos((h * Math.PI) / 180),
+        isNaN(h) ? 0 : c * Math.sin((h * Math.PI) / 180),
+      ]);
+    }
+    /**
+     * @param {readonly [number, number, number]} rgb
+     */
+    function srgbLinear2rgb(rgb) {
+      return rgb.map((c) =>
+        Math.abs(c) > 0.0031308
+          ? (c < 0 ? -1 : 1) * (1.055 * Math.abs(c) ** (1 / 2.4) - 0.055)
+          : 12.92 * c,
+      );
+    }
+    /**
+     * @param {readonly [number, number, number]} lab
+     */
+    function oklab2xyz(lab) {
+      const LMSg = multiplyMatrices(
+        /** @type {const} */ ([
+          1, 0.3963377773761749, 0.2158037573099136, 1, -0.1055613458156586,
+          -0.0638541728258133, 1, -0.0894841775298119, -1.2914855480194092,
+        ]),
+        lab,
+      );
+      const LMS = /** @type {[number, number, number]} */ (
+        LMSg.map((val) => val ** 3)
+      );
+      return multiplyMatrices(
+        /** @type {const} */ ([
+          1.2268798758459243, -0.5578149944602171, 0.2813910456659647,
+          -0.0405757452148008, 1.112286803280317, -0.0717110580655164,
+          -0.0763729366746601, -0.4214933324022432, 1.5869240198367816,
+        ]),
+        LMS,
+      );
+    }
+    /**
+     * @param {readonly [number, number, number]} xyz
+     */
+    function xyz2rgbLinear(xyz) {
+      return multiplyMatrices(
+        [
+          3.2409699419045226, -1.537383177570094, -0.4986107602930034,
+          -0.9692436362808796, 1.8759675015077202, 0.04155505740717559,
+          0.05563007969699366, -0.20397695888897652, 1.0569715142428786,
+        ],
+        xyz,
+      );
+    }
+
+    /** @param {string} oklch */
+    return function (oklch) {
+      oklch = oklch.replace("oklch(", "");
+      oklch = oklch.replace(")", "");
+      let splitOklch = oklch.split(" / ");
+      let alpha = 1;
+      if (splitOklch.length === 2) {
+        alpha = Number(splitOklch.pop()?.replace("%", "")) / 100;
+      }
+      splitOklch = oklch.split(" ");
+      const lch = splitOklch.map((v, i) => {
+        if (!i && v.includes("%")) {
+          return Number(v.replace("%", "")) / 100;
+        } else {
+          return Number(v);
+        }
+      });
+      const rgb = srgbLinear2rgb(
+        xyz2rgbLinear(
+          oklab2xyz(oklch2oklab(/** @type {[number, number, number]} */ (lch))),
+        ),
+      ).map((v) => {
+        return Math.max(Math.min(Math.round(v * 255), 255), 0);
+      });
+      return [...rgb, alpha];
+    };
+  }
+}
+
+/**
+ * @typedef {typeof createChartElement} CreateChartElement
+ * @typedef {ReturnType<createChartElement>} Chart
+ */
+
+export default { createChartElement };
diff --git a/websites/bitview/scripts/charts.js b/websites/bitview/scripts/charts.js
new file mode 100644
index 000000000..8b9cc01d8
--- /dev/null
+++ b/websites/bitview/scripts/charts.js
@@ -0,0 +1,584 @@
+// @ts-check
+
+const keyPrefix = "chart";
+const ONE_BTC_IN_SATS = 100_000_000;
+const AUTO = "auto";
+const LINE = "line";
+const CANDLE = "candle";
+
+/**
+ * @typedef {"timestamp" | "date" | "week" | "d.epoch" | "month" | "quarter" | "semester" | "year" | "decade" } SerializedChartableIndex
+ */
+
+/**
+ * @param {Object} args
+ * @param {Colors} args.colors
+ * @param {CreateChartElement} args.createChartElement
+ * @param {Accessor<ChartOption>} args.option
+ * @param {Signals} args.signals
+ * @param {Utilities} args.utils
+ * @param {WebSockets} args.webSockets
+ * @param {Elements} args.elements
+ * @param {Env} args.env
+ * @param {VecsResources} args.vecsResources
+ * @param {VecIdToIndexes} args.vecIdToIndexes
+ * @param {Packages} args.packages
+ */
+export function init({
+  colors,
+  elements,
+  createChartElement,
+  option,
+  signals,
+  utils,
+  env,
+  webSockets,
+  vecsResources,
+  vecIdToIndexes,
+  packages,
+}) {
+  elements.charts.append(utils.dom.createShadow("left"));
+  elements.charts.append(utils.dom.createShadow("right"));
+
+  const { headerElement, headingElement } = utils.dom.createHeader();
+  elements.charts.append(headerElement);
+
+  const { index, fieldset } = createIndexSelector({
+    option,
+    vecIdToIndexes,
+    signals,
+    utils,
+  });
+
+  const TIMERANGE_LS_KEY = signals.createMemo(
+    () => `chart-timerange-${index()}`,
+  );
+
+  let firstRun = true;
+
+  const from = signals.createSignal(/** @type {number | null} */ (null), {
+    save: {
+      ...utils.serde.optNumber,
+      keyPrefix: TIMERANGE_LS_KEY,
+      key: "from",
+      serializeParam: firstRun,
+    },
+  });
+  const to = signals.createSignal(/** @type {number | null} */ (null), {
+    save: {
+      ...utils.serde.optNumber,
+      keyPrefix: TIMERANGE_LS_KEY,
+      key: "to",
+      serializeParam: firstRun,
+    },
+  });
+
+  const chart = createChartElement({
+    parent: elements.charts,
+    signals,
+    colors,
+    id: "charts",
+    utils,
+    vecsResources,
+    elements,
+    index,
+    timeScaleSetCallback: (unknownTimeScaleCallback) => {
+      // TODO: Although it mostly works in practice, need to make it more robust, there is no guarantee that this runs in order and wait for `from` and `to` to update when `index` and thus `TIMERANGE_LS_KEY` is updated
+      // Need to have the right values before the update
+
+      const from_ = from();
+      const to_ = to();
+      if (from_ !== null && to_ !== null) {
+        chart.inner.timeScale().setVisibleLogicalRange({
+          from: from_,
+          to: to_,
+        });
+      } else {
+        unknownTimeScaleCallback();
+      }
+    },
+  });
+
+  console.log(env.ios, "canShare" in navigator);
+  if (!(env.ios && !("canShare" in navigator))) {
+    const chartBottomRightCanvas = Array.from(
+      chart.inner.chartElement().getElementsByTagName("tr"),
+    ).at(-1)?.lastChild?.firstChild?.firstChild;
+    if (chartBottomRightCanvas) {
+      const charts = elements.charts;
+      const domain = window.document.createElement("p");
+      domain.innerText = `${window.location.host}`;
+      domain.id = "domain";
+      const screenshotButton = window.document.createElement("button");
+      screenshotButton.id = "screenshot";
+      const camera = "[ ◉¯]";
+      screenshotButton.innerHTML = camera;
+      screenshotButton.title = "Screenshot";
+      chartBottomRightCanvas.replaceWith(screenshotButton);
+      screenshotButton.addEventListener("click", () => {
+        packages.modernScreenshot().then(async ({ screenshot }) => {
+          charts.dataset.screenshot = "true";
+          charts.append(domain);
+          seriesTypeField.hidden = true;
+          try {
+            await screenshot({
+              element: charts,
+              name: option().path.join("-"),
+              title: option().title,
+            });
+          } catch {}
+          charts.removeChild(domain);
+          seriesTypeField.hidden = false;
+          charts.dataset.screenshot = "false";
+        });
+      });
+    }
+  }
+
+  chart.inner.timeScale().subscribeVisibleLogicalRangeChange(
+    utils.throttle((t) => {
+      if (!t) return;
+      from.set(t.from);
+      to.set(t.to);
+    }, 250),
+  );
+
+  elements.charts.append(fieldset);
+
+  const { field: seriesTypeField, selected: topSeriesType_ } =
+    utils.dom.createHorizontalChoiceField({
+      defaultValue: CANDLE,
+      keyPrefix,
+      key: "seriestype-0",
+      choices: /** @type {const} */ ([AUTO, CANDLE, LINE]),
+      signals,
+    });
+
+  const topSeriesType = signals.createMemo(() => {
+    const topSeriesType = topSeriesType_();
+    if (topSeriesType === AUTO) {
+      const t = to();
+      const f = from();
+      if (!t || !f) return null;
+      const diff = t - f;
+      if (diff / chart.inner.paneSize().width <= 0.5) {
+        return CANDLE;
+      } else {
+        return LINE;
+      }
+    } else {
+      return topSeriesType;
+    }
+  });
+
+  const { field: topUnitField, selected: topUnit } =
+    utils.dom.createHorizontalChoiceField({
+      defaultValue: "usd",
+      keyPrefix,
+      key: "unit-0",
+      choices: /** @type {const} */ ([
+        /** @satisfies {Unit} */ ("usd"),
+        /** @satisfies {Unit} */ ("sats"),
+      ]),
+      signals,
+      sorted: true,
+    });
+
+  chart.addFieldsetIfNeeded({
+    id: "charts-unit-0",
+    paneIndex: 0,
+    position: "nw",
+    createChild() {
+      return topUnitField;
+    },
+  });
+
+  const seriesListTop = /** @type {Series[]} */ ([]);
+  const seriesListBottom = /** @type {Series[]} */ ([]);
+
+  /**
+   * @param {Object} params
+   * @param {ISeries} params.iseries
+   * @param {Unit} params.unit
+   * @param {Index} params.index
+   */
+  function printLatest({ iseries, unit, index }) {
+    const _latest = webSockets.kraken1dCandle.latest();
+
+    if (!_latest) return;
+
+    const latest = { ..._latest };
+
+    if (unit === "sats") {
+      latest.open = Math.floor(ONE_BTC_IN_SATS / latest.open);
+      latest.high = Math.floor(ONE_BTC_IN_SATS / latest.high);
+      latest.low = Math.floor(ONE_BTC_IN_SATS / latest.low);
+      latest.close = Math.floor(ONE_BTC_IN_SATS / latest.close);
+    }
+
+    const last_ = iseries.data().at(-1);
+    if (!last_) return;
+    const last = { ...last_ };
+
+    if ("close" in last) {
+      last.close = latest.close;
+    }
+    if ("value" in last) {
+      last.value = latest.close;
+    }
+    const date = new Date(latest.time * 1000);
+
+    switch (index) {
+      case /** @satisfies {Height} */ (5):
+      case /** @satisfies {DifficultyEpoch} */ (2):
+      case /** @satisfies {HalvingEpoch} */ (4): {
+        if ("close" in last) {
+          last.low = Math.min(last.low, latest.close);
+          last.high = Math.max(last.high, latest.close);
+        }
+        iseries.update(last);
+        break;
+      }
+      case /** @satisfies {DateIndex} */ (0): {
+        iseries.update(last);
+        break;
+      }
+      default: {
+        if (index === /** @satisfies {WeekIndex} */ (23)) {
+          date.setUTCDate(date.getUTCDate() - ((date.getUTCDay() + 6) % 7));
+        } else if (index === /** @satisfies {MonthIndex} */ (7)) {
+          date.setUTCDate(1);
+        } else if (index === /** @satisfies {QuarterIndex} */ (19)) {
+          const month = date.getUTCMonth();
+          date.setUTCMonth(month - (month % 3), 1);
+        } else if (index === /** @satisfies {SemesterIndex} */ (20)) {
+          const month = date.getUTCMonth();
+          date.setUTCMonth(month - (month % 6), 1);
+        } else if (index === /** @satisfies {YearIndex} */ (24)) {
+          date.setUTCMonth(0, 1);
+        } else if (index === /** @satisfies {DecadeIndex} */ (1)) {
+          date.setUTCFullYear(
+            Math.floor(date.getUTCFullYear() / 10) * 10,
+            0,
+            1,
+          );
+        } else {
+          throw Error("Unsupported");
+        }
+
+        const time = date.valueOf() / 1000;
+
+        if (time === last.time) {
+          if ("close" in last) {
+            last.low = Math.min(last.low, latest.low);
+            last.high = Math.max(last.high, latest.high);
+          }
+          iseries.update(last);
+        } else {
+          latest.time = time;
+          iseries.update(last);
+        }
+      }
+    }
+  }
+
+  signals.createEffect(option, (option) => {
+    headingElement.innerHTML = option.title;
+
+    const bottomUnits = /** @type {readonly Unit[]} */ (
+      Object.keys(option.bottom)
+    );
+    const { field: bottomUnitField, selected: bottomUnit } =
+      utils.dom.createHorizontalChoiceField({
+        defaultValue: bottomUnits.at(0) || "",
+        keyPrefix,
+        key: "unit-1",
+        choices: bottomUnits,
+        signals,
+        sorted: true,
+      });
+
+    if (bottomUnits.length) {
+      chart.addFieldsetIfNeeded({
+        id: "charts-unit-1",
+        paneIndex: 1,
+        position: "nw",
+        createChild() {
+          return bottomUnitField;
+        },
+      });
+    }
+
+    chart.addFieldsetIfNeeded({
+      id: "charts-seriestype-0",
+      paneIndex: 0,
+      position: "ne",
+      createChild() {
+        return seriesTypeField;
+      },
+    });
+
+    signals.createEffect(index, (index) => {
+      signals.createEffect(
+        () => ({
+          topUnit: topUnit(),
+          topSeriesType: topSeriesType(),
+        }),
+        ({ topUnit, topSeriesType }) => {
+          /** @type {Series | undefined} */
+          let series;
+
+          console.log({ topUnit, topSeriesType });
+
+          switch (topUnit) {
+            case "usd": {
+              switch (topSeriesType) {
+                case null:
+                case CANDLE: {
+                  series = chart.addCandlestickSeries({
+                    vecId: "price_ohlc",
+                    name: "Price",
+                    unit: topUnit,
+                    setDataCallback: printLatest,
+                    order: 0,
+                  });
+                  break;
+                }
+                case LINE: {
+                  series = chart.addLineSeries({
+                    vecId: "price_close",
+                    name: "Price",
+                    unit: topUnit,
+                    color: colors.default,
+                    setDataCallback: printLatest,
+                    options: {
+                      priceLineVisible: true,
+                      lastValueVisible: true,
+                    },
+                    order: 0,
+                  });
+                }
+              }
+              break;
+            }
+            case "sats": {
+              switch (topSeriesType) {
+                case null:
+                case CANDLE: {
+                  series = chart.addCandlestickSeries({
+                    vecId: "price_ohlc_in_sats",
+                    name: "Price",
+                    unit: topUnit,
+                    inverse: true,
+                    setDataCallback: printLatest,
+                    order: 0,
+                  });
+                  break;
+                }
+                case LINE: {
+                  series = chart.addLineSeries({
+                    vecId: "price_close_in_sats",
+                    name: "Price",
+                    unit: topUnit,
+                    color: colors.default,
+                    setDataCallback: printLatest,
+                    options: {
+                      priceLineVisible: true,
+                      lastValueVisible: true,
+                    },
+                    order: 0,
+                  });
+                }
+              }
+              break;
+            }
+          }
+
+          if (!series) throw Error("Unreachable");
+
+          seriesListTop[0]?.remove();
+          seriesListTop[0] = series;
+
+          signals.createEffect(
+            () => ({
+              latest: webSockets.kraken1dCandle.latest(),
+              hasData: series.hasData(),
+            }),
+            ({ latest, hasData }) => {
+              if (!series || !latest || !hasData) return;
+              printLatest({ iseries: series.inner, unit: topUnit, index });
+            },
+          );
+        },
+      );
+
+      [
+        {
+          blueprints: option.top,
+          paneIndex: 0,
+          unit: topUnit,
+          seriesList: seriesListTop,
+          orderStart: 1,
+          legend: chart.legendTop,
+        },
+        {
+          blueprints: option.bottom,
+          paneIndex: 1,
+          unit: bottomUnit,
+          seriesList: seriesListBottom,
+          orderStart: 0,
+          legend: chart.legendBottom,
+        },
+      ].forEach(
+        ({ blueprints, paneIndex, unit, seriesList, orderStart, legend }) => {
+          signals.createEffect(unit, (unit) => {
+            legend.removeFrom(orderStart);
+
+            seriesList.splice(orderStart).forEach((series) => {
+              series.remove();
+            });
+
+            blueprints[unit]?.forEach((blueprint, order) => {
+              order += orderStart;
+
+              const indexes = /** @type {readonly number[]} */ (
+                vecIdToIndexes[blueprint.key]
+              );
+
+              if (indexes.includes(index)) {
+                switch (blueprint.type) {
+                  case "Baseline": {
+                    seriesList.push(
+                      chart.addBaselineSeries({
+                        vecId: blueprint.key,
+                        name: blueprint.title,
+                        unit,
+                        defaultActive: blueprint.defaultActive,
+                        paneIndex,
+                        options: {
+                          ...blueprint.options,
+                          topLineColor:
+                            blueprint.color?.() ?? blueprint.colors?.[0](),
+                          bottomLineColor:
+                            blueprint.color?.() ?? blueprint.colors?.[1](),
+                        },
+                        order,
+                      }),
+                    );
+                    break;
+                  }
+                  case "Histogram": {
+                    seriesList.push(
+                      chart.addHistogramSeries({
+                        vecId: blueprint.key,
+                        name: blueprint.title,
+                        unit,
+                        color: blueprint.color,
+                        defaultActive: blueprint.defaultActive,
+                        paneIndex,
+                        options: blueprint.options,
+                        order,
+                      }),
+                    );
+                    break;
+                  }
+                  case "Candlestick": {
+                    throw Error("TODO");
+                  }
+                  case "Line":
+                  case undefined:
+                    seriesList.push(
+                      chart.addLineSeries({
+                        vecId: blueprint.key,
+                        color: blueprint.color,
+                        name: blueprint.title,
+                        unit,
+                        defaultActive: blueprint.defaultActive,
+                        paneIndex,
+                        options: blueprint.options,
+                        order,
+                      }),
+                    );
+                }
+              }
+            });
+          });
+        },
+      );
+
+      firstRun = false;
+    });
+  });
+}
+
+/**
+ * @param {Object} args
+ * @param {Accessor<ChartOption>} args.option
+ * @param {VecIdToIndexes} args.vecIdToIndexes
+ * @param {Signals} args.signals
+ * @param {Utilities} args.utils
+ */
+function createIndexSelector({ option, vecIdToIndexes, signals, utils }) {
+  const choices_ = /** @satisfies {SerializedChartableIndex[]} */ ([
+    "timestamp",
+    "date",
+    "week",
+    "d.epoch",
+    "month",
+    "quarter",
+    "semester",
+    "year",
+    // "halving epoch",
+    "decade",
+  ]);
+
+  /** @type {Accessor<typeof choices_>} */
+  const choices = signals.createMemo(() => {
+    const o = option();
+
+    if (!Object.keys(o.top).length && !Object.keys(o.bottom).length) {
+      return [...choices_];
+    }
+    const rawIndexes = new Set(
+      [Object.values(o.top), Object.values(o.bottom)]
+        .flat(2)
+        .filter((blueprint) => !blueprint.key.startsWith("constant_"))
+        .map((blueprint) => vecIdToIndexes[blueprint.key])
+        .flat(),
+    );
+
+    const serializedIndexes = [...rawIndexes].flatMap((index) => {
+      const c = utils.serde.chartableIndex.serialize(index);
+      return c ? [c] : [];
+    });
+
+    return /** @type {any} */ (
+      choices_.filter((choice) => serializedIndexes.includes(choice))
+    );
+  });
+
+  const { field, selected } = utils.dom.createHorizontalChoiceField({
+    defaultValue: "date",
+    keyPrefix,
+    key: "index",
+    choices,
+    id: "index",
+    signals,
+  });
+
+  const fieldset = window.document.createElement("fieldset");
+  fieldset.id = "interval";
+
+  const screenshotSpan = window.document.createElement("span");
+  screenshotSpan.innerText = "interval:";
+  fieldset.append(screenshotSpan);
+
+  fieldset.append(field);
+  fieldset.dataset.size = "sm";
+
+  const index = signals.createMemo(() =>
+    utils.serde.chartableIndex.deserialize(selected()),
+  );
+
+  return { fieldset, index };
+}
diff --git a/websites/bitview/scripts/explorer.js b/websites/bitview/scripts/explorer.js
index e861c19e0..3603ecde8 100644
--- a/websites/bitview/scripts/explorer.js
+++ b/websites/bitview/scripts/explorer.js
@@ -3,7 +3,7 @@
 /**
  * @param {Object} args
  * @param {Colors} args.colors
- * @param {LightweightCharts} args.lightweightCharts
+ * @param {CreateChartElement} args.createChartElement
  * @param {Accessor<ChartOption>} args.option
  * @param {Signals} args.signals
  * @param {Utilities} args.utils
@@ -15,7 +15,7 @@
 export function init({
   colors,
   elements,
-  lightweightCharts,
+  createChartElement,
   option,
   signals,
   utils,
diff --git a/websites/bitview/scripts/main.js b/websites/bitview/scripts/main.js
index 21bccb378..5f1716a5e 100644
--- a/websites/bitview/scripts/main.js
+++ b/websites/bitview/scripts/main.js
@@ -2,9 +2,9 @@
 
 /**
  * @import { Option, PartialChartOption, ChartOption, AnyPartialOption, ProcessedOptionAddons, OptionsTree, SimulationOption, AnySeriesBlueprint, SeriesType } from "./options"
- * @import { Valued,  SingleValueData, CandlestickData, OHLCTuple, Series, ISeries, HistogramData, LineData, BaselineData, LineSeriesPartialOptions, BaselineSeriesPartialOptions, HistogramSeriesPartialOptions, CandlestickSeriesPartialOptions } from "./packages/lightweight-charts/wrapper"
+ * @import { Valued,  SingleValueData, CandlestickData, OHLCTuple, Series, ISeries, HistogramData, LineData, BaselineData, LineSeriesPartialOptions, BaselineSeriesPartialOptions, HistogramSeriesPartialOptions, CandlestickSeriesPartialOptions, CreateChartElement, Chart } from "./chart"
  * @import * as _ from "./packages/leeoniya-ufuzzy/1.0.19/dist/uFuzzy.d.ts"
- * @import { SerializedChartableIndex } from "./chart";
+ * @import { SerializedChartableIndex } from "./charts";
  * @import { Signal, Signals, Accessor } from "./packages/solidjs-signals/wrapper";
  * @import { DateIndex, DecadeIndex, DifficultyEpoch, Index, HalvingEpoch, Height, MonthIndex, P2PK33AddressIndex, P2PK65AddressIndex, P2PKHAddressIndex, P2SHAddressIndex, P2MSOutputIndex, P2AAddressIndex, P2TRAddressIndex, P2WPKHAddressIndex, P2WSHAddressIndex, TxIndex, InputIndex, OutputIndex, VecId, WeekIndex, SemesterIndex, YearIndex, VecIdToIndexes, QuarterIndex, EmptyOutputIndex, OpReturnIndex, UnknownOutputIndex, EmptyAddressIndex, LoadedAddressIndex } from "./bridge/vecs"
  * @import { Pools, Pool } from "./bridge/pools"
@@ -76,11 +76,9 @@ function initPackages() {
         (d) => d.default,
       );
     },
-    async lightweightCharts() {
+    async chart() {
       return window.document.fonts.ready.then(() =>
-        import("./packages/lightweight-charts/wrapper.js").then(
-          (d) => d.default,
-        ),
+        import("./chart.js").then((d) => d.default),
       );
     },
     async leanQr() {
@@ -100,7 +98,7 @@ function initPackages() {
    * @template {keyof typeof imports} K
    * @param {K} key
    */
-  function importPackage(key) {
+  function lazyImport(key) {
     /** @type {ReturnType<typeof imports[K]> | null} */
     let packagePromise = null;
 
@@ -114,17 +112,15 @@ function initPackages() {
   }
 
   return {
-    signals: importPackage("signals"),
-    lightweightCharts: importPackage("lightweightCharts"),
-    leanQr: importPackage("leanQr"),
-    ufuzzy: importPackage("ufuzzy"),
-    modernScreenshot: importPackage("modernScreenshot"),
+    signals: lazyImport("signals"),
+    chart: lazyImport("chart"),
+    leanQr: lazyImport("leanQr"),
+    ufuzzy: lazyImport("ufuzzy"),
+    modernScreenshot: lazyImport("modernScreenshot"),
   };
 }
 /**
  * @typedef {ReturnType<typeof initPackages>} Packages
- * @typedef {Awaited<ReturnType<Packages["lightweightCharts"]>>} LightweightCharts
- * @typedef {ReturnType<LightweightCharts['createChartElement']>} Chart
  */
 
 function createUtils() {
@@ -2314,14 +2310,14 @@ function main() {
                   element = elements.explorer;
 
                   if (firstTimeLoadingExplorer) {
-                    const lightweightCharts = packages.lightweightCharts();
+                    const chartPkg = packages.chart();
                     import("./explorer.js").then(({ init }) =>
-                      lightweightCharts.then((lightweightCharts) =>
+                      chartPkg.then(({ createChartElement }) =>
                         signals.runWithOwner(owner, () =>
                           init({
                             colors,
                             elements,
-                            lightweightCharts,
+                            createChartElement,
                             option: /** @type {Accessor<ChartOption>} */ (
                               chartOption
                             ),
@@ -2345,14 +2341,14 @@ function main() {
                   chartOption.set(option);
 
                   if (firstTimeLoadingChart) {
-                    const lightweightCharts = packages.lightweightCharts();
-                    import("./chart.js").then(({ init: initChartsElement }) =>
-                      lightweightCharts.then((lightweightCharts) =>
+                    const chartPkg = packages.chart();
+                    import("./charts.js").then(({ init: initChartsElement }) =>
+                      chartPkg.then(({ createChartElement }) =>
                         signals.runWithOwner(owner, () =>
                           initChartsElement({
                             colors,
                             elements,
-                            lightweightCharts,
+                            createChartElement,
                             option: /** @type {Accessor<ChartOption>} */ (
                               chartOption
                             ),
@@ -2399,14 +2395,14 @@ function main() {
                   simOption.set(option);
 
                   if (firstTimeLoadingSimulation) {
-                    const lightweightCharts = packages.lightweightCharts();
+                    const chart = packages.chart();
                     import("./simulation.js").then(({ init }) =>
-                      lightweightCharts.then((lightweightCharts) =>
+                      chart.then(({ createChartElement }) =>
                         signals.runWithOwner(owner, () =>
                           init({
                             colors,
                             elements,
-                            lightweightCharts,
+                            createChartElement,
                             signals,
                             utils,
                             vecsResources,
diff --git a/websites/bitview/scripts/simulation.js b/websites/bitview/scripts/simulation.js
index 0fc3a0ed0..ad87d5122 100644
--- a/websites/bitview/scripts/simulation.js
+++ b/websites/bitview/scripts/simulation.js
@@ -3,7 +3,7 @@
 /**
  * @param {Object} args
  * @param {Colors} args.colors
- * @param {LightweightCharts} args.lightweightCharts
+ * @param {CreateChartElement} args.createChartElement
  * @param {Signals} args.signals
  * @param {Utilities} args.utils
  * @param {Elements} args.elements
@@ -12,7 +12,7 @@
 export function init({
   colors,
   elements,
-  lightweightCharts,
+  createChartElement,
   signals,
   utils,
   vecsResources,
@@ -679,7 +679,7 @@ export function init({
 
   const index = () => /** @type {DateIndex} */ (0);
 
-  lightweightCharts.createChartElement({
+  createChartElement({
     index,
     parent: resultsElement,
     signals,
@@ -724,7 +724,7 @@ export function init({
     ],
   });
 
-  lightweightCharts.createChartElement({
+  createChartElement({
     index,
     parent: resultsElement,
     signals,
@@ -749,7 +749,7 @@ export function init({
     ],
   });
 
-  lightweightCharts.createChartElement({
+  createChartElement({
     index,
     parent: resultsElement,
     signals,
@@ -780,7 +780,7 @@ export function init({
     ],
   });
 
-  lightweightCharts.createChartElement({
+  createChartElement({
     index,
     parent: resultsElement,
     signals,
@@ -804,7 +804,7 @@ export function init({
     ],
   });
 
-  lightweightCharts.createChartElement({
+  createChartElement({
     index,
     parent: resultsElement,
     signals,
diff --git a/websites/packages/lightweight-charts/wrapper.js b/websites/packages/lightweight-charts/wrapper.js
deleted file mode 100644
index 5735b8972..000000000
--- a/websites/packages/lightweight-charts/wrapper.js
+++ /dev/null
@@ -1,1148 +0,0 @@
-// @ts-check
-
-/** @import { IChartApi, ISeriesApi as _ISeriesApi, SeriesDefinition, SingleValueData as _SingleValueData, CandlestickData as _CandlestickData, BaselineData as _BaselineData, HistogramData as _HistogramData, SeriesType, IPaneApi, LineSeriesPartialOptions as _LineSeriesPartialOptions, HistogramSeriesPartialOptions as _HistogramSeriesPartialOptions, BaselineSeriesPartialOptions as _BaselineSeriesPartialOptions, CandlestickSeriesPartialOptions as _CandlestickSeriesPartialOptions, WhitespaceData, DeepPartial, ChartOptions, Time, LineData as _LineData } from './5.0.8/dist/typings' */
-
-/**
- * @typedef {[number, number, number, number]} OHLCTuple
- *
- * @typedef {Object} Valued
- * @property {number} value
- *
- * @typedef {Object} Indexed
- * @property {number} index
- *
- * @typedef {_ISeriesApi<SeriesType, number>} ISeries
- * @typedef {_ISeriesApi<'Candlestick', number>} CandlestickISeries
- * @typedef {_ISeriesApi<'Histogram', number>} HistogramISeries
- * @typedef {_ISeriesApi<'Line', number>} LineISeries
- * @typedef {_ISeriesApi<'Baseline', number>} BaselineISeries
- *
- * @typedef {_LineSeriesPartialOptions} LineSeriesPartialOptions
- * @typedef {_HistogramSeriesPartialOptions} HistogramSeriesPartialOptions
- * @typedef {_BaselineSeriesPartialOptions} BaselineSeriesPartialOptions
- * @typedef {_CandlestickSeriesPartialOptions} CandlestickSeriesPartialOptions
- *
- * @typedef {Object} Series
- * @property {ISeries} inner
- * @property {string} id
- * @property {Signal<boolean>} active
- * @property {Signal<boolean>} hasData
- * @property {Signal<string | null>} url
- * @property {VoidFunction} remove
- *
- * @typedef {_SingleValueData<number>} SingleValueData
- * @typedef {_CandlestickData<number>} CandlestickData
- * @typedef {_LineData<number>} LineData
- * @typedef {_BaselineData<number>} BaselineData
- * @typedef {_HistogramData<number>} HistogramData
- *
- * @typedef {function({ iseries: ISeries; unit: Unit; index: Index }): void} SetDataCallback
- */
-
-import {
-  createChart,
-  CandlestickSeries,
-  HistogramSeries,
-  LineSeries,
-  BaselineSeries,
-  // } from "./5.0.8/dist/lightweight-charts.standalone.development.mjs";
-} from "./5.0.8/dist/lightweight-charts.standalone.production.mjs";
-
-const oklchToRGBA = createOklchToRGBA();
-
-const lineWidth = /** @type {any} */ (1.5);
-
-/**
- * @param {Object} args
- * @param {string} args.id
- * @param {HTMLElement} args.parent
- * @param {Signals} args.signals
- * @param {Colors} args.colors
- * @param {Utilities} args.utils
- * @param {Elements} args.elements
- * @param {VecsResources} args.vecsResources
- * @param {Accessor<Index>} args.index
- * @param {((unknownTimeScaleCallback: VoidFunction) => void)} [args.timeScaleSetCallback]
- * @param {true} [args.fitContent]
- * @param {{unit: Unit; blueprints: AnySeriesBlueprint[]}[]} [args.config]
- */
-function createChartElement({
-  parent,
-  signals,
-  colors,
-  utils,
-  elements,
-  id: chartId,
-  index,
-  vecsResources,
-  timeScaleSetCallback,
-  fitContent,
-  config,
-}) {
-  const div = window.document.createElement("div");
-  div.classList.add("chart");
-  parent.append(div);
-
-  const legendTop = createLegend({
-    utils,
-    signals,
-  });
-  div.append(legendTop.element);
-
-  const chartDiv = window.document.createElement("div");
-  chartDiv.classList.add("lightweight-chart");
-  div.append(chartDiv);
-
-  const legendBottom = createLegend({
-    utils,
-    signals,
-  });
-  div.append(legendBottom.element);
-
-  /** @type {IChartApi} */
-  const ichart = createChart(
-    chartDiv,
-    /** @satisfies {DeepPartial<ChartOptions>} */ ({
-      autoSize: true,
-      layout: {
-        fontFamily: elements.style.fontFamily,
-        background: { color: "transparent" },
-        attributionLogo: false,
-        colorSpace: "display-p3",
-        colorParsers: [oklchToRGBA],
-      },
-      grid: {
-        vertLines: { visible: false },
-        horzLines: { visible: false },
-      },
-      rightPriceScale: {
-        borderVisible: false,
-      },
-      timeScale: {
-        borderVisible: false,
-        ...(fitContent
-          ? {
-              minBarSpacing: 0.001,
-            }
-          : {}),
-      },
-      localization: {
-        priceFormatter: numberToShortUSFormat,
-        locale: "en-us",
-      },
-      crosshair: {
-        mode: 3,
-      },
-      ...(fitContent
-        ? {
-            handleScale: false,
-            handleScroll: false,
-          }
-        : {}),
-      // ..._options,
-    }),
-  );
-
-  // Takes a bit more space sometimes but it's better UX than having the scale being resized on option change
-  ichart.priceScale("right").applyOptions({
-    minimumWidth: 80,
-  });
-
-  ichart.panes().at(0)?.setStretchFactor(1);
-
-  signals.createEffect(
-    () => ({
-      defaultColor: colors.default(),
-      offColor: colors.gray(),
-      borderColor: colors.border(),
-    }),
-    ({ defaultColor, offColor, borderColor }) => {
-      ichart.applyOptions({
-        layout: {
-          textColor: offColor,
-          panes: {
-            separatorColor: borderColor,
-          },
-        },
-        crosshair: {
-          horzLine: {
-            color: offColor,
-            labelBackgroundColor: defaultColor,
-          },
-          vertLine: {
-            color: offColor,
-            labelBackgroundColor: defaultColor,
-          },
-        },
-      });
-    },
-  );
-
-  signals.createEffect(index, (index) => {
-    const minBarSpacing =
-      index === /** @satisfies {MonthIndex} */ (7)
-        ? 1
-        : index === /** @satisfies {QuarterIndex} */ (19)
-          ? 2
-          : index === /** @satisfies {SemesterIndex} */ (20)
-            ? 3
-            : index === /** @satisfies {YearIndex} */ (24)
-              ? 6
-              : index === /** @satisfies {DecadeIndex} */ (1)
-                ? 60
-                : 0.5;
-
-    ichart.applyOptions({
-      timeScale: {
-        timeVisible:
-          index === /** @satisfies {Height} */ (5) ||
-          index === /** @satisfies {DifficultyEpoch} */ (2) ||
-          index === /** @satisfies {HalvingEpoch} */ (4),
-        ...(!fitContent
-          ? {
-              minBarSpacing,
-            }
-          : {}),
-      },
-    });
-  });
-
-  const activeResources = /** @type {Set<VecResource>} */ (new Set());
-  ichart.subscribeCrosshairMove(
-    utils.throttle(() => {
-      activeResources.forEach((v) => {
-        v.fetch();
-      });
-    }),
-  );
-
-  if (fitContent) {
-    new ResizeObserver(() => ichart.timeScale().fitContent()).observe(chartDiv);
-  }
-
-  /**
-   * @param {Object} args
-   * @param {string} args.id
-   * @param {number} args.paneIndex
-   * @param {"nw" | "ne" | "se" | "sw"} args.position
-   * @param {number} [args.timeout]
-   * @param {(pane: IPaneApi<Time>) => HTMLElement} args.createChild
-   */
-  function addFieldsetIfNeeded({ paneIndex, id, position, createChild }) {
-    const owner = signals.getOwner();
-
-    setTimeout(
-      () =>
-        signals.runWithOwner(owner, () => {
-          const parent = ichart
-            ?.panes()
-            .at(paneIndex)
-            ?.getHTMLElement()
-            ?.children?.item(1)?.firstChild;
-
-          if (!parent) throw Error("Parent should exist");
-
-          const children = Array.from(parent.childNodes).filter(
-            (element) =>
-              /** @type {HTMLElement} */ (element).dataset.position ===
-              position,
-          );
-
-          if (children.length === 1) {
-            children[0].remove();
-          } else if (children.length > 1) {
-            throw Error("Untraceable");
-          }
-
-          const fieldset = window.document.createElement("fieldset");
-          fieldset.dataset.size = "xs";
-          fieldset.dataset.position = position;
-          fieldset.id = `${id}-${paneIndex}`;
-          const pane = ichart.panes().at(paneIndex);
-          if (!pane) throw Error("Expect pane");
-          pane
-            .getHTMLElement()
-            ?.children?.item(1)
-            ?.firstChild?.appendChild(fieldset);
-
-          fieldset.append(createChild(pane));
-        }),
-      paneIndex ? 50 : 0,
-    );
-  }
-
-  /**
-   * @param {Object} args
-   * @param {Unit} args.unit
-   * @param {SeriesType} args.seriesType
-   * @param {number} args.paneIndex
-   */
-  function addPriceScaleSelectorIfNeeded({ unit, paneIndex, seriesType }) {
-    const id = `${chartId}-scale`;
-
-    addFieldsetIfNeeded({
-      id,
-      paneIndex,
-      position: "sw",
-      createChild(pane) {
-        const { field, selected } = utils.dom.createHorizontalChoiceField({
-          choices: /** @type {const} */ (["lin", "log"]),
-          id: utils.stringToId(`${id} ${paneIndex} ${unit}`),
-          defaultValue:
-            unit === "usd" && seriesType !== "Baseline" ? "log" : "lin",
-          key: `${id}-price-scale-${paneIndex}`,
-          signals,
-        });
-
-        signals.createEffect(selected, (selected) => {
-          try {
-            pane.priceScale("right").applyOptions({
-              mode: selected === "lin" ? 0 : 1,
-            });
-          } catch {}
-        });
-
-        return field;
-      },
-    });
-  }
-
-  /**
-   * @param {Object} args
-   * @param {ISeries} args.iseries
-   * @param {string} args.name
-   * @param {Unit} args.unit
-   * @param {number} args.order
-   * @param {Color[]} args.colors
-   * @param {SeriesType} args.seriesType
-   * @param {VecId} [args.vecId]
-   * @param {SetDataCallback} [args.setDataCallback]
-   * @param {Accessor<WhitespaceData<number>[]>} [args.data]
-   * @param {number} args.paneIndex
-   * @param {boolean} [args.defaultActive]
-   */
-  function addSeries({
-    iseries,
-    vecId,
-    name,
-    unit,
-    order,
-    seriesType,
-    setDataCallback,
-    paneIndex,
-    defaultActive,
-    colors,
-    data,
-  }) {
-    return signals.createRoot((dispose) => {
-      const id = `${utils.stringToId(name)}-${paneIndex}`;
-
-      const active = signals.createSignal(defaultActive ?? true, {
-        save: {
-          keyPrefix: "",
-          key: id,
-          ...utils.serde.boolean,
-        },
-      });
-
-      const hasData = signals.createSignal(false);
-
-      signals.createEffect(active, (active) =>
-        // Or remove ?
-        iseries.applyOptions({
-          visible: active,
-        }),
-      );
-
-      iseries.setSeriesOrder(order);
-
-      /** @type {VecResource | undefined} */
-      let _valuesResource;
-
-      /** @type {Series} */
-      const series = {
-        inner: iseries,
-        active,
-        hasData,
-        id,
-        url: signals.createSignal(/** @type {string | null} */ (null)),
-        remove() {
-          dispose();
-          // @ts-ignore
-          chart.inner.removeSeries(iseries);
-          if (_valuesResource) {
-            activeResources.delete(_valuesResource);
-          }
-        },
-      };
-
-      if (vecId) {
-        signals.createEffect(index, (index) => {
-          const timeResource = vecsResources.getOrCreate(
-            index,
-            index === /** @satisfies {Height} */ (5)
-              ? "timestamp_fixed"
-              : "timestamp",
-          );
-          timeResource.fetch();
-
-          const valuesResource = vecsResources.getOrCreate(index, vecId);
-          _valuesResource = valuesResource;
-
-          series.url.set(() => valuesResource.url);
-
-          signals.createEffect(active, (active) => {
-            if (active) {
-              valuesResource.fetch();
-              activeResources.add(valuesResource);
-
-              const fetchedKey = vecsResources.defaultFetchedKey;
-              signals.createEffect(
-                () => ({
-                  _indexes: timeResource.fetched().get(fetchedKey)?.vec(),
-                  values: valuesResource.fetched().get(fetchedKey)?.vec(),
-                }),
-                ({ _indexes, values }) => {
-                  if (!_indexes?.length || !values?.length) return;
-
-                  const indexes = /** @type {number[]} */ (_indexes);
-
-                  let length = Math.min(indexes.length, values.length);
-
-                  // TODO: Don't create new Array if data already present, update instead
-                  const data = /** @type {LineData[] | CandlestickData[]} */ (
-                    Array.from({ length })
-                  );
-
-                  let prevTime = null;
-                  let timeOffset = 0;
-
-                  for (let i = 0; i < length; i++) {
-                    const time = indexes[i];
-                    const sameTime = prevTime === time;
-                    if (sameTime) {
-                      timeOffset += 1;
-                    }
-                    const v = values[i];
-                    const offsetedI = i - timeOffset;
-                    if (v === null) {
-                      data[offsetedI] = {
-                        time,
-                        value: NaN,
-                      };
-                    } else if (typeof v === "number") {
-                      data[offsetedI] = {
-                        time,
-                        value: v,
-                      };
-                    } else {
-                      // if (sameTime) {
-                      //   console.log(data[offsetedI]);
-                      // }
-                      let [open, high, low, close] = v;
-                      data[offsetedI] = {
-                        time,
-                        // @ts-ignore
-                        open: sameTime ? data[offsetedI].open : open,
-                        high: sameTime
-                          ? // @ts-ignore
-                            Math.max(data[offsetedI].high, high)
-                          : high,
-                        low: sameTime
-                          ? // @ts-ignore
-                            Math.min(data[offsetedI].low, low)
-                          : low,
-                        close,
-                      };
-                    }
-                    prevTime = time;
-                  }
-
-                  data.length -= timeOffset;
-
-                  hasData.set(true);
-
-                  const seriesData = series.inner.data();
-                  if (!seriesData.length) {
-                    iseries.setData(data);
-
-                    if (fitContent) {
-                      ichart.timeScale().fitContent();
-                    }
-
-                    timeScaleSetCallback?.(() => {
-                      if (
-                        index === /** @satisfies {QuarterIndex} */ (19) ||
-                        index === /** @satisfies {SemesterIndex} */ (20) ||
-                        index === /** @satisfies {YearIndex} */ (24) ||
-                        index === /** @satisfies {DecadeIndex} */ (1)
-                      ) {
-                        ichart.timeScale().setVisibleLogicalRange({
-                          from: -1,
-                          to: data.length,
-                        });
-                      }
-                    });
-                  } else {
-                    const last = seriesData.at(-1);
-                    if (!last) throw Error("Unreachable");
-                    for (let i = 0; i < data.length; i++) {
-                      if (data[i].time >= last.time) {
-                        iseries.update(data[i]);
-                      }
-                    }
-                  }
-
-                  setDataCallback?.({
-                    iseries,
-                    index,
-                    unit,
-                  });
-                },
-              );
-            } else {
-              activeResources.delete(valuesResource);
-            }
-          });
-        });
-      } else if (data) {
-        signals.createEffect(data, (data) => {
-          iseries.setData(data);
-          hasData.set(true);
-          setDataCallback?.({
-            iseries,
-            index: index(),
-            unit,
-          });
-
-          if (fitContent) {
-            ichart.timeScale().fitContent();
-          }
-        });
-      }
-
-      (paneIndex ? legendBottom : legendTop).addOrReplace({
-        series,
-        name,
-        colors,
-        order,
-      });
-
-      addPriceScaleSelectorIfNeeded({
-        paneIndex,
-        seriesType,
-        unit,
-      });
-
-      return series;
-    });
-  }
-
-  const chart = {
-    inner: ichart,
-    legendTop,
-    legendBottom,
-
-    addFieldsetIfNeeded,
-
-    /**
-     * @param {Object} args
-     * @param {string} args.name
-     * @param {Unit} args.unit
-     * @param {number} args.order
-     * @param {VecId} [args.vecId]
-     * @param {Accessor<CandlestickData[]>} [args.data]
-     * @param {number} [args.paneIndex]
-     * @param {boolean} [args.defaultActive]
-     * @param {boolean} [args.inverse]
-     * @param {SetDataCallback} [args.setDataCallback]
-     * @param {CandlestickSeriesPartialOptions} [args.options]
-     */
-    addCandlestickSeries({
-      vecId,
-      name,
-      unit,
-      order,
-      paneIndex = 0,
-      defaultActive,
-      setDataCallback,
-      data,
-      inverse,
-      options,
-    }) {
-      const green = inverse ? colors.red : colors.green;
-      const red = inverse ? colors.green : colors.red;
-
-      /** @type {CandlestickISeries} */
-      const iseries = /** @type {any} */ (
-        ichart.addSeries(
-          /** @type {SeriesDefinition<'Candlestick'>} */ (CandlestickSeries),
-          {
-            upColor: green(),
-            downColor: red(),
-            wickUpColor: green(),
-            wickDownColor: red(),
-            borderVisible: false,
-            visible: defaultActive !== false,
-            ...options,
-          },
-          paneIndex,
-        )
-      );
-
-      return addSeries({
-        colors: [green, red],
-        iseries,
-        name,
-        order,
-        paneIndex,
-        seriesType: "Candlestick",
-        unit,
-        data,
-        setDataCallback,
-        defaultActive,
-        vecId,
-      });
-    },
-    /**
-     * @param {Object} args
-     * @param {string} args.name
-     * @param {Unit} args.unit
-     * @param {number} args.order
-     * @param {Color} args.color
-     * @param {VecId} [args.vecId]
-     * @param {Accessor<HistogramData[]>} [args.data]
-     * @param {number} [args.paneIndex]
-     * @param {boolean} [args.defaultActive]
-     * @param {SetDataCallback} [args.setDataCallback]
-     * @param {HistogramSeriesPartialOptions} [args.options]
-     */
-    addHistogramSeries({
-      vecId,
-      name,
-      unit,
-      color,
-      order,
-      paneIndex = 0,
-      defaultActive,
-      setDataCallback,
-      data,
-      options,
-    }) {
-      /** @type {HistogramISeries} */
-      const iseries = /** @type {any} */ (
-        ichart.addSeries(
-          /** @type {SeriesDefinition<'Histogram'>} */ (HistogramSeries),
-          {
-            color: color(),
-            visible: defaultActive !== false,
-            priceLineVisible: false,
-          },
-          paneIndex,
-        )
-      );
-
-      return addSeries({
-        colors: [color],
-        iseries,
-        name,
-        order,
-        paneIndex,
-        seriesType: "Bar",
-        unit,
-        data,
-        setDataCallback,
-        defaultActive,
-        vecId,
-      });
-    },
-    /**
-     * @param {Object} args
-     * @param {string} args.name
-     * @param {Unit} args.unit
-     * @param {number} args.order
-     * @param {Accessor<LineData[]>} [args.data]
-     * @param {VecId} [args.vecId]
-     * @param {Color} [args.color]
-     * @param {SetDataCallback} [args.setDataCallback]
-     * @param {number} [args.paneIndex]
-     * @param {boolean} [args.defaultActive]
-     * @param {LineSeriesPartialOptions} [args.options]
-     */
-    addLineSeries({
-      vecId,
-      name,
-      unit,
-      order,
-      setDataCallback,
-      color,
-      paneIndex = 0,
-      defaultActive,
-      data,
-      options,
-    }) {
-      color ||= unit === "usd" ? colors.green : colors.orange;
-
-      /** @type {LineISeries} */
-      const iseries = /** @type {any} */ (
-        ichart.addSeries(
-          /** @type {SeriesDefinition<'Line'>} */ (LineSeries),
-          {
-            lineWidth,
-            visible: defaultActive !== false,
-            priceLineVisible: false,
-            color: color(),
-            // lineVisible: false,
-            // pointMarkersVisible: true,
-            // pointMarkersRadius: 1,
-            ...options,
-          },
-          paneIndex,
-        )
-      );
-
-      return addSeries({
-        colors: [color],
-        iseries,
-        name,
-        order,
-        paneIndex,
-        seriesType: "Line",
-        unit,
-        setDataCallback,
-        data,
-        defaultActive,
-        vecId,
-      });
-    },
-    /**
-     * @param {Object} args
-     * @param {string} args.name
-     * @param {Unit} args.unit
-     * @param {number} args.order
-     * @param {Accessor<BaselineData[]>} [args.data]
-     * @param {VecId} [args.vecId]
-     * @param {SetDataCallback} [args.setDataCallback]
-     * @param {number} [args.paneIndex]
-     * @param {boolean} [args.defaultActive]
-     * @param {BaselineSeriesPartialOptions} [args.options]
-     */
-    addBaselineSeries({
-      vecId,
-      name,
-      unit,
-      order,
-      paneIndex: _paneIndex,
-      setDataCallback,
-      defaultActive,
-      data,
-      options,
-    }) {
-      const paneIndex = _paneIndex ?? 0;
-
-      /** @type {BaselineISeries} */
-      const iseries = /** @type {any} */ (
-        ichart.addSeries(
-          /** @type {SeriesDefinition<'Baseline'>} */ (BaselineSeries),
-          {
-            lineWidth,
-            visible: defaultActive !== false,
-            baseValue: {
-              price: options?.baseValue?.price ?? 0,
-            },
-            ...options,
-            topLineColor: options?.topLineColor ?? colors.green(),
-            bottomLineColor: options?.bottomLineColor ?? colors.red(),
-            priceLineVisible: false,
-            bottomFillColor1: "transparent",
-            bottomFillColor2: "transparent",
-            topFillColor1: "transparent",
-            topFillColor2: "transparent",
-            lineVisible: true,
-          },
-          paneIndex,
-        )
-      );
-
-      return addSeries({
-        colors: [
-          () => options?.topLineColor ?? colors.green(),
-          () => options?.bottomLineColor ?? colors.red(),
-        ],
-        iseries,
-        name,
-        order,
-        paneIndex,
-        seriesType: "Baseline",
-        setDataCallback,
-        unit,
-        data,
-        defaultActive,
-        vecId,
-      });
-    },
-  };
-
-  config?.forEach(({ unit, blueprints }, paneIndex) => {
-    blueprints.forEach((blueprint, order) => {
-      if (blueprint.type === "Candlestick") {
-        chart.addCandlestickSeries({
-          name: blueprint.title,
-          unit,
-          data: blueprint.data,
-          defaultActive: blueprint.defaultActive,
-          paneIndex,
-          order,
-        });
-      } else if (blueprint.type === "Baseline") {
-        chart.addBaselineSeries({
-          name: blueprint.title,
-          unit,
-          data: blueprint.data,
-          defaultActive: blueprint.defaultActive,
-          paneIndex,
-          order,
-        });
-      } else if (blueprint.type === "Histogram") {
-        chart.addHistogramSeries({
-          name: blueprint.title,
-          unit,
-          color: blueprint.color,
-          data: blueprint.data,
-          defaultActive: blueprint.defaultActive,
-          paneIndex,
-          order,
-        });
-      } else {
-        chart.addLineSeries({
-          name: blueprint.title,
-          unit,
-          data: blueprint.data,
-          defaultActive: blueprint.defaultActive,
-          paneIndex,
-          color: blueprint.color,
-          order,
-        });
-      }
-    });
-  });
-
-  return chart;
-}
-
-/**
- * @param {Object} args
- * @param {Signals} args.signals
- * @param {Utilities} args.utils
- */
-function createLegend({ signals, utils }) {
-  const element = window.document.createElement("legend");
-
-  const hovered = signals.createSignal(/** @type {Series | null} */ (null));
-
-  /** @type {HTMLElement[]} */
-  const legends = [];
-
-  return {
-    element,
-    /**
-     * @param {Object} args
-     * @param {Series} args.series
-     * @param {string} args.name
-     * @param {number} args.order
-     * @param {Color[]} args.colors
-     */
-    addOrReplace({ series, name, colors, order }) {
-      const div = window.document.createElement("div");
-
-      const prev = legends[order];
-      if (prev) {
-        prev.replaceWith(div);
-      } else {
-        const elementAtOrder = Array.from(element.children).at(order);
-        if (elementAtOrder) {
-          elementAtOrder.before(div);
-        } else {
-          element.append(div);
-        }
-      }
-      legends[order] = div;
-
-      const { input, label } = utils.dom.createLabeledInput({
-        inputId: utils.stringToId(`legend-${series.id}`),
-        inputName: utils.stringToId(`selected-${series.id}`),
-        inputValue: "value",
-        title: "Click to toggle",
-        inputChecked: series.active(),
-        onClick: () => {
-          series.active.set(input.checked);
-        },
-        type: "checkbox",
-      });
-
-      const spanMain = window.document.createElement("span");
-      spanMain.classList.add("main");
-      label.append(spanMain);
-
-      const spanName = utils.dom.createSpanName(name);
-      spanMain.append(spanName);
-
-      div.append(label);
-      label.addEventListener("mouseover", () => {
-        const h = hovered();
-        if (!h || h !== series) {
-          hovered.set(series);
-        }
-      });
-      label.addEventListener("mouseleave", () => {
-        hovered.set(null);
-      });
-
-      function shouldHighlight() {
-        const h = hovered();
-        return !h || h === series;
-      }
-
-      /**
-       * @param {string} color
-       */
-      function tameColor(color) {
-        return `${color.slice(0, -1)} / 50%)`;
-      }
-
-      const spanColors = window.document.createElement("span");
-      spanColors.classList.add("colors");
-      spanMain.prepend(spanColors);
-      colors.forEach((color) => {
-        const spanColor = window.document.createElement("span");
-        spanColors.append(spanColor);
-
-        signals.createEffect(
-          () => ({
-            color: color(),
-            shouldHighlight: shouldHighlight(),
-          }),
-          ({ color, shouldHighlight }) => {
-            if (shouldHighlight) {
-              spanColor.style.backgroundColor = color;
-            } else {
-              spanColor.style.backgroundColor = tameColor(color);
-            }
-          },
-        );
-      });
-
-      const initialColors = /** @type {Record<string, any>} */ ({});
-      const darkenedColors = /** @type {Record<string, any>} */ ({});
-
-      const seriesOptions = series.inner.options();
-      if (!seriesOptions) return;
-
-      Object.entries(seriesOptions).forEach(([k, v]) => {
-        if (k.toLowerCase().includes("color") && typeof v === "string") {
-          if (!v.startsWith("oklch")) return;
-          initialColors[k] = v;
-          darkenedColors[k] = tameColor(v);
-        } else if (k === "lastValueVisible" && v) {
-          initialColors[k] = true;
-          darkenedColors[k] = false;
-        }
-      });
-
-      signals.createEffect(shouldHighlight, (shouldHighlight) => {
-        if (shouldHighlight) {
-          series.inner.applyOptions(initialColors);
-        } else {
-          series.inner.applyOptions(darkenedColors);
-        }
-      });
-
-      const anchor = window.document.createElement("a");
-
-      signals.createEffect(series.url, (url) => {
-        if (url) {
-          anchor.href = url;
-          anchor.target = "_blank";
-          anchor.rel = "noopener noreferrer";
-          anchor.title = "Click to view data";
-          div.append(anchor);
-        }
-      });
-    },
-    /**
-     * @param {number} start
-     */
-    removeFrom(start) {
-      // disposeFrom(start);
-      legends.splice(start).forEach((child) => child.remove());
-    },
-  };
-}
-
-/**
- * @param {number} value
- * @param {0 | 2} [digits]
- */
-function numberToShortUSFormat(value, digits) {
-  const absoluteValue = Math.abs(value);
-
-  if (isNaN(value)) {
-    return "";
-  } else if (absoluteValue < 10) {
-    return numberToUSFormat(value, Math.min(3, digits || 10));
-  } else if (absoluteValue < 1_000) {
-    return numberToUSFormat(value, Math.min(2, digits || 10));
-  } else if (absoluteValue < 10_000) {
-    return numberToUSFormat(value, Math.min(1, digits || 10));
-  } else if (absoluteValue < 1_000_000) {
-    return numberToUSFormat(value, 0);
-  } else if (absoluteValue >= 900_000_000_000_000_000_000_000) {
-    return "Inf.";
-  }
-
-  const log = Math.floor(Math.log10(absoluteValue) - 6);
-
-  const suffices = ["M", "B", "T", "P", "E", "Z"];
-  const letterIndex = Math.floor(log / 3);
-  const letter = suffices[letterIndex];
-
-  const modulused = log % 3;
-
-  // return `${numberToUSFormat(
-  //   value / (1_000_000 * 1_000 ** letterIndex),
-  //   3,
-  // )}${letter}`;
-
-  if (modulused === 0) {
-    return `${numberToUSFormat(
-      value / (1_000_000 * 1_000 ** letterIndex),
-      3,
-    )}${letter}`;
-  } else if (modulused === 1) {
-    return `${numberToUSFormat(
-      value / (1_000_000 * 1_000 ** letterIndex),
-      2,
-    )}${letter}`;
-  } else {
-    return `${numberToUSFormat(
-      value / (1_000_000 * 1_000 ** letterIndex),
-      1,
-    )}${letter}`;
-  }
-}
-
-/**
- * @param {number} value
- * @param {number} [digits]
- * @param {Intl.NumberFormatOptions} [options]
- */
-function numberToUSFormat(value, digits, options) {
-  return value.toLocaleString("en-us", {
-    ...options,
-    minimumFractionDigits: digits,
-    maximumFractionDigits: digits,
-  });
-}
-
-function createOklchToRGBA() {
-  {
-    /**
-     *
-     * @param {readonly [number, number, number, number, number, number, number, number, number]} A
-     * @param {readonly [number, number, number]} B
-     * @returns
-     */
-    function multiplyMatrices(A, B) {
-      return /** @type {const} */ ([
-        A[0] * B[0] + A[1] * B[1] + A[2] * B[2],
-        A[3] * B[0] + A[4] * B[1] + A[5] * B[2],
-        A[6] * B[0] + A[7] * B[1] + A[8] * B[2],
-      ]);
-    }
-    /**
-     * @param {readonly [number, number, number]} param0
-     */
-    function oklch2oklab([l, c, h]) {
-      return /** @type {const} */ ([
-        l,
-        isNaN(h) ? 0 : c * Math.cos((h * Math.PI) / 180),
-        isNaN(h) ? 0 : c * Math.sin((h * Math.PI) / 180),
-      ]);
-    }
-    /**
-     * @param {readonly [number, number, number]} rgb
-     */
-    function srgbLinear2rgb(rgb) {
-      return rgb.map((c) =>
-        Math.abs(c) > 0.0031308
-          ? (c < 0 ? -1 : 1) * (1.055 * Math.abs(c) ** (1 / 2.4) - 0.055)
-          : 12.92 * c,
-      );
-    }
-    /**
-     * @param {readonly [number, number, number]} lab
-     */
-    function oklab2xyz(lab) {
-      const LMSg = multiplyMatrices(
-        /** @type {const} */ ([
-          1, 0.3963377773761749, 0.2158037573099136, 1, -0.1055613458156586,
-          -0.0638541728258133, 1, -0.0894841775298119, -1.2914855480194092,
-        ]),
-        lab,
-      );
-      const LMS = /** @type {[number, number, number]} */ (
-        LMSg.map((val) => val ** 3)
-      );
-      return multiplyMatrices(
-        /** @type {const} */ ([
-          1.2268798758459243, -0.5578149944602171, 0.2813910456659647,
-          -0.0405757452148008, 1.112286803280317, -0.0717110580655164,
-          -0.0763729366746601, -0.4214933324022432, 1.5869240198367816,
-        ]),
-        LMS,
-      );
-    }
-    /**
-     * @param {readonly [number, number, number]} xyz
-     */
-    function xyz2rgbLinear(xyz) {
-      return multiplyMatrices(
-        [
-          3.2409699419045226, -1.537383177570094, -0.4986107602930034,
-          -0.9692436362808796, 1.8759675015077202, 0.04155505740717559,
-          0.05563007969699366, -0.20397695888897652, 1.0569715142428786,
-        ],
-        xyz,
-      );
-    }
-
-    /** @param {string} oklch */
-    return function (oklch) {
-      oklch = oklch.replace("oklch(", "");
-      oklch = oklch.replace(")", "");
-      let splitOklch = oklch.split(" / ");
-      let alpha = 1;
-      if (splitOklch.length === 2) {
-        alpha = Number(splitOklch.pop()?.replace("%", "")) / 100;
-      }
-      splitOklch = oklch.split(" ");
-      const lch = splitOklch.map((v, i) => {
-        if (!i && v.includes("%")) {
-          return Number(v.replace("%", "")) / 100;
-        } else {
-          return Number(v);
-        }
-      });
-      const rgb = srgbLinear2rgb(
-        xyz2rgbLinear(
-          oklab2xyz(oklch2oklab(/** @type {[number, number, number]} */ (lch))),
-        ),
-      ).map((v) => {
-        return Math.max(Math.min(Math.round(v * 255), 255), 0);
-      });
-      return [...rgb, alpha];
-    };
-  }
-}
-
-export default { createChartElement };
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/prod.js b/websites/packages/solidjs-signals/0.4.1/dist/prod.js
deleted file mode 100644
index 111a5ab7c..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/prod.js
+++ /dev/null
@@ -1,1973 +0,0 @@
-// src/core/error.ts
-var NotReadyError = class extends Error {
-};
-var NoOwnerError = class extends Error {
-  constructor() {
-    super("");
-  }
-};
-var ContextNotFoundError = class extends Error {
-  constructor() {
-    super(
-      ""
-    );
-  }
-};
-
-// src/core/constants.ts
-var STATE_CLEAN = 0;
-var STATE_CHECK = 1;
-var STATE_DIRTY = 2;
-var STATE_DISPOSED = 3;
-var EFFECT_PURE = 0;
-var EFFECT_RENDER = 1;
-var EFFECT_USER = 2;
-var SUPPORTS_PROXY = typeof Proxy === "function";
-
-// src/core/scheduler.ts
-var clock = 0;
-function getClock() {
-  return clock;
-}
-function incrementClock() {
-  clock++;
-}
-var scheduled = false;
-function schedule() {
-  if (scheduled)
-    return;
-  scheduled = true;
-  if (!globalQueue.K)
-    queueMicrotask(flush);
-}
-var pureQueue = [];
-var Queue = class {
-  o = null;
-  K = false;
-  L = [[], []];
-  F = [];
-  created = clock;
-  enqueue(type, fn) {
-    pureQueue.push(fn);
-    if (type)
-      this.L[type - 1].push(fn);
-    schedule();
-  }
-  run(type) {
-    if (type === EFFECT_PURE) {
-      pureQueue.length && runQueue(pureQueue, type);
-      pureQueue = [];
-      return;
-    } else if (this.L[type - 1].length) {
-      const effects = this.L[type - 1];
-      this.L[type - 1] = [];
-      runQueue(effects, type);
-    }
-    for (let i = 0; i < this.F.length; i++) {
-      this.F[i].run(type);
-    }
-  }
-  flush() {
-    if (this.K)
-      return;
-    this.K = true;
-    try {
-      this.run(EFFECT_PURE);
-      incrementClock();
-      scheduled = false;
-      this.run(EFFECT_RENDER);
-      this.run(EFFECT_USER);
-    } finally {
-      this.K = false;
-    }
-  }
-  addChild(child) {
-    this.F.push(child);
-    child.o = this;
-  }
-  removeChild(child) {
-    const index = this.F.indexOf(child);
-    if (index >= 0)
-      this.F.splice(index, 1);
-  }
-  notify(...args) {
-    if (this.o)
-      return this.o.notify(...args);
-    return false;
-  }
-};
-var globalQueue = new Queue();
-function flush() {
-  while (scheduled) {
-    globalQueue.flush();
-  }
-}
-function runQueue(queue, type) {
-  for (let i = 0; i < queue.length; i++)
-    queue[i](type);
-}
-
-// src/core/owner.ts
-var currentOwner = null;
-var defaultContext = {};
-function getOwner() {
-  return currentOwner;
-}
-function setOwner(owner) {
-  const out = currentOwner;
-  currentOwner = owner;
-  return out;
-}
-var Owner = class {
-  // We flatten the owner tree into a linked list so that we don't need a pointer to .firstChild
-  // However, the children are actually added in reverse creation order
-  // See comment at the top of the file for an example of the _nextSibling traversal
-  o = null;
-  m = null;
-  t = null;
-  a = STATE_CLEAN;
-  l = null;
-  p = defaultContext;
-  h = globalQueue;
-  W = 0;
-  id = null;
-  constructor(id = null, skipAppend = false) {
-    this.id = id;
-    if (currentOwner) {
-      !skipAppend && currentOwner.append(this);
-    }
-  }
-  append(child) {
-    child.o = this;
-    child.t = this;
-    if (this.m)
-      this.m.t = child;
-    child.m = this.m;
-    this.m = child;
-    if (this.id != null && child.id == null)
-      child.id = this.getNextChildId();
-    if (child.p !== this.p) {
-      child.p = { ...this.p, ...child.p };
-    }
-    if (this.h)
-      child.h = this.h;
-  }
-  dispose(self = true) {
-    if (this.a === STATE_DISPOSED)
-      return;
-    let head = self ? this.t || this.o : this, current = this.m, next = null;
-    while (current && current.o === this) {
-      current.dispose(true);
-      current.z();
-      next = current.m;
-      current.m = null;
-      current = next;
-    }
-    this.W = 0;
-    if (self)
-      this.z();
-    if (current)
-      current.t = !self ? this : this.t;
-    if (head)
-      head.m = current;
-  }
-  z() {
-    if (this.t)
-      this.t.m = null;
-    this.o = null;
-    this.t = null;
-    this.p = defaultContext;
-    this.a = STATE_DISPOSED;
-    this.emptyDisposal();
-  }
-  emptyDisposal() {
-    if (!this.l)
-      return;
-    if (Array.isArray(this.l)) {
-      for (let i = 0; i < this.l.length; i++) {
-        const callable = this.l[i];
-        callable.call(callable);
-      }
-    } else {
-      this.l.call(this.l);
-    }
-    this.l = null;
-  }
-  getNextChildId() {
-    if (this.id != null)
-      return formatId(this.id, this.W++);
-    throw new Error("Cannot get child id from owner without an id");
-  }
-};
-function createContext(defaultValue, description) {
-  return { id: Symbol(description), defaultValue };
-}
-function getContext(context, owner = currentOwner) {
-  if (!owner) {
-    throw new NoOwnerError();
-  }
-  const value = hasContext(context, owner) ? owner.p[context.id] : context.defaultValue;
-  if (isUndefined(value)) {
-    throw new ContextNotFoundError();
-  }
-  return value;
-}
-function setContext(context, value, owner = currentOwner) {
-  if (!owner) {
-    throw new NoOwnerError();
-  }
-  owner.p = {
-    ...owner.p,
-    [context.id]: isUndefined(value) ? context.defaultValue : value
-  };
-}
-function hasContext(context, owner = currentOwner) {
-  return !isUndefined(owner?.p[context.id]);
-}
-function onCleanup(fn) {
-  if (!currentOwner)
-    return fn;
-  const node = currentOwner;
-  if (!node.l) {
-    node.l = fn;
-  } else if (Array.isArray(node.l)) {
-    node.l.push(fn);
-  } else {
-    node.l = [node.l, fn];
-  }
-  return fn;
-}
-function formatId(prefix, id) {
-  const num = id.toString(36), len = num.length - 1;
-  return prefix + (len ? String.fromCharCode(64 + len) : "") + num;
-}
-function isUndefined(value) {
-  return typeof value === "undefined";
-}
-
-// src/core/flags.ts
-var ERROR_OFFSET = 0;
-var ERROR_BIT = 1 << ERROR_OFFSET;
-var LOADING_OFFSET = 1;
-var LOADING_BIT = 1 << LOADING_OFFSET;
-var UNINITIALIZED_OFFSET = 2;
-var UNINITIALIZED_BIT = 1 << UNINITIALIZED_OFFSET;
-var DEFAULT_FLAGS = ERROR_BIT;
-
-// src/core/core.ts
-var currentObserver = null;
-var currentMask = DEFAULT_FLAGS;
-var newSources = null;
-var newSourcesIndex = 0;
-var newFlags = 0;
-var unobserved = [];
-var notStale = false;
-var updateCheck = null;
-var staleCheck = null;
-function getObserver() {
-  return currentObserver;
-}
-var UNCHANGED = Symbol(0);
-var Computation = class extends Owner {
-  c = null;
-  d = null;
-  g;
-  G;
-  A;
-  // Used in __DEV__ mode, hopefully removed in production
-  ca;
-  // Using false is an optimization as an alternative to _equals: () => false
-  // which could enable more efficient DIRTY notification
-  S = isEqual;
-  X;
-  _ = false;
-  /** Whether the computation is an error or has ancestors that are unresolved */
-  f = 0;
-  /** Which flags raised by sources are handled, vs. being passed through. */
-  T = DEFAULT_FLAGS;
-  B = -1;
-  x = false;
-  constructor(initialValue, compute2, options) {
-    super(options?.id, compute2 === null);
-    this.A = compute2;
-    this.a = compute2 ? STATE_DIRTY : STATE_CLEAN;
-    this.f = compute2 && initialValue === void 0 ? UNINITIALIZED_BIT : 0;
-    this.g = initialValue;
-    if (options?.equals !== void 0)
-      this.S = options.equals;
-    if (options?.pureWrite)
-      this._ = true;
-    if (options?.unobserved)
-      this.X = options?.unobserved;
-  }
-  Y() {
-    if (this.A) {
-      if (this.f & ERROR_BIT && this.B <= getClock())
-        update(this);
-      else
-        this.y();
-    }
-    track(this);
-    newFlags |= this.f & ~currentMask;
-    if (this.f & ERROR_BIT) {
-      throw this.G;
-    } else {
-      return this.g;
-    }
-  }
-  /**
-   * Return the current value of this computation
-   * Automatically re-executes the surrounding computation when the value changes
-   */
-  read() {
-    return this.Y();
-  }
-  /**
-   * Return the current value of this computation
-   * Automatically re-executes the surrounding computation when the value changes
-   *
-   * If the computation has any unresolved ancestors, this function waits for the value to resolve
-   * before continuing
-   */
-  wait() {
-    if (this.A && this.f & ERROR_BIT && this.B <= getClock()) {
-      update(this);
-    } else {
-      this.y();
-    }
-    track(this);
-    if ((notStale || this.f & UNINITIALIZED_BIT) && this.f & LOADING_BIT) {
-      throw new NotReadyError();
-    }
-    if (staleCheck && this.f & LOADING_BIT) {
-      staleCheck.g = true;
-    }
-    return this.Y();
-  }
-  /** Update the computation with a new value. */
-  write(value, flags = 0, raw = false) {
-    const newValue = !raw && typeof value === "function" ? value(this.g) : value;
-    const valueChanged = newValue !== UNCHANGED && (!!(this.f & UNINITIALIZED_BIT) || // this._stateFlags & LOADING_BIT & ~flags ||
-    this.S === false || !this.S(this.g, newValue));
-    if (valueChanged) {
-      this.g = newValue;
-      this.G = void 0;
-    }
-    const changedFlagsMask = this.f ^ flags, changedFlags = changedFlagsMask & flags;
-    this.f = flags;
-    this.B = getClock() + 1;
-    if (this.d) {
-      for (let i = 0; i < this.d.length; i++) {
-        if (valueChanged) {
-          this.d[i].r(STATE_DIRTY);
-        } else if (changedFlagsMask) {
-          this.d[i].Z(changedFlagsMask, changedFlags);
-        }
-      }
-    }
-    return this.g;
-  }
-  /**
-   * Set the current node's state, and recursively mark all of this node's observers as STATE_CHECK
-   */
-  r(state, skipQueue) {
-    if (this.a >= state && !this.x)
-      return;
-    this.x = !!skipQueue;
-    this.a = state;
-    if (this.d) {
-      for (let i = 0; i < this.d.length; i++) {
-        this.d[i].r(STATE_CHECK, skipQueue);
-      }
-    }
-  }
-  /**
-   * Notify the computation that one of its sources has changed flags.
-   *
-   * @param mask A bitmask for which flag(s) were changed.
-   * @param newFlags The source's new flags, masked to just the changed ones.
-   */
-  Z(mask, newFlags2) {
-    if (this.a >= STATE_DIRTY)
-      return;
-    if (mask & this.T) {
-      this.r(STATE_DIRTY);
-      return;
-    }
-    if (this.a >= STATE_CHECK)
-      return;
-    const prevFlags = this.f & mask;
-    const deltaFlags = prevFlags ^ newFlags2;
-    if (newFlags2 === prevFlags) ; else if (deltaFlags & prevFlags & mask) {
-      this.r(STATE_CHECK);
-    } else {
-      this.f ^= deltaFlags;
-      if (this.d) {
-        for (let i = 0; i < this.d.length; i++) {
-          this.d[i].Z(mask, newFlags2);
-        }
-      }
-    }
-  }
-  M(error) {
-    this.G = error;
-    this.write(UNCHANGED, this.f & ~LOADING_BIT | ERROR_BIT | UNINITIALIZED_BIT);
-  }
-  /**
-   * This is the core part of the reactivity system, which makes sure that the values are updated
-   * before they are read. We've also adapted it to return the loading state of the computation,
-   * so that we can propagate that to the computation's observers.
-   *
-   * This function will ensure that the value and states we read from the computation are up to date
-   */
-  y() {
-    if (!this.A) {
-      return;
-    }
-    if (this.a === STATE_DISPOSED) {
-      return;
-    }
-    if (this.a === STATE_CLEAN) {
-      return;
-    }
-    let observerFlags = 0;
-    if (this.a === STATE_CHECK) {
-      for (let i = 0; i < this.c.length; i++) {
-        this.c[i].y();
-        observerFlags |= this.c[i].f;
-        if (this.a === STATE_DIRTY) {
-          break;
-        }
-      }
-    }
-    if (this.a === STATE_DIRTY) {
-      update(this);
-    } else {
-      this.write(UNCHANGED, observerFlags);
-      this.a = STATE_CLEAN;
-    }
-  }
-  /**
-   * Remove ourselves from the owner graph and the computation graph
-   */
-  z() {
-    if (this.a === STATE_DISPOSED)
-      return;
-    if (this.c)
-      removeSourceObservers(this, 0);
-    super.z();
-  }
-};
-function track(computation) {
-  if (currentObserver) {
-    if (!newSources && currentObserver.c && currentObserver.c[newSourcesIndex] === computation) {
-      newSourcesIndex++;
-    } else if (!newSources)
-      newSources = [computation];
-    else if (computation !== newSources[newSources.length - 1]) {
-      newSources.push(computation);
-    }
-    if (updateCheck) {
-      updateCheck.g = computation.B > currentObserver.B;
-    }
-  }
-}
-function update(node) {
-  const prevSources = newSources, prevSourcesIndex = newSourcesIndex, prevFlags = newFlags;
-  newSources = null;
-  newSourcesIndex = 0;
-  newFlags = 0;
-  try {
-    node.dispose(false);
-    node.emptyDisposal();
-    const result = compute(node, node.A, node);
-    node.write(result, newFlags, true);
-  } catch (error) {
-    if (error instanceof NotReadyError) {
-      node.write(UNCHANGED, newFlags | LOADING_BIT | node.f & UNINITIALIZED_BIT);
-    } else {
-      node.M(error);
-    }
-  } finally {
-    if (newSources) {
-      if (node.c)
-        removeSourceObservers(node, newSourcesIndex);
-      if (node.c && newSourcesIndex > 0) {
-        node.c.length = newSourcesIndex + newSources.length;
-        for (let i = 0; i < newSources.length; i++) {
-          node.c[newSourcesIndex + i] = newSources[i];
-        }
-      } else {
-        node.c = newSources;
-      }
-      let source;
-      for (let i = newSourcesIndex; i < node.c.length; i++) {
-        source = node.c[i];
-        if (!source.d)
-          source.d = [node];
-        else
-          source.d.push(node);
-      }
-    } else if (node.c && newSourcesIndex < node.c.length) {
-      removeSourceObservers(node, newSourcesIndex);
-      node.c.length = newSourcesIndex;
-    }
-    unobserved.length && notifyUnobserved();
-    newSources = prevSources;
-    newSourcesIndex = prevSourcesIndex;
-    newFlags = prevFlags;
-    node.B = getClock() + 1;
-    node.a = STATE_CLEAN;
-  }
-}
-function removeSourceObservers(node, index) {
-  let source;
-  let swap;
-  for (let i = index; i < node.c.length; i++) {
-    source = node.c[i];
-    if (source.d) {
-      swap = source.d.indexOf(node);
-      source.d[swap] = source.d[source.d.length - 1];
-      source.d.pop();
-      if (!source.d.length)
-        unobserved.push(source);
-    }
-  }
-}
-function notifyUnobserved() {
-  for (let i = 0; i < unobserved.length; i++) {
-    const source = unobserved[i];
-    if (!source.d || !source.d.length)
-      unobserved[i].X?.();
-  }
-  unobserved = [];
-}
-function isEqual(a, b) {
-  return a === b;
-}
-function untrack(fn) {
-  if (currentObserver === null)
-    return fn();
-  return compute(getOwner(), fn, null);
-}
-function hasUpdated(fn) {
-  const current = updateCheck;
-  updateCheck = { g: false };
-  try {
-    fn();
-    return updateCheck.g;
-  } finally {
-    updateCheck = current;
-  }
-}
-function pendingCheck(fn, loadingValue) {
-  const current = staleCheck;
-  staleCheck = { g: false };
-  try {
-    latest(fn);
-    return staleCheck.g;
-  } catch (err) {
-    if (!(err instanceof NotReadyError))
-      return false;
-    if (loadingValue !== void 0)
-      return loadingValue;
-    throw err;
-  } finally {
-    staleCheck = current;
-  }
-}
-function isPending(fn, loadingValue) {
-  if (!currentObserver)
-    return pendingCheck(fn, loadingValue);
-  const c = new Computation(void 0, () => pendingCheck(fn, loadingValue));
-  c.T |= LOADING_BIT;
-  return c.read();
-}
-function latest(fn, fallback) {
-  const argLength = arguments.length;
-  const prevFlags = newFlags;
-  const prevNotStale = notStale;
-  notStale = false;
-  try {
-    return fn();
-  } catch (err) {
-    if (argLength > 1 && err instanceof NotReadyError)
-      return fallback;
-    throw err;
-  } finally {
-    newFlags = prevFlags;
-    notStale = prevNotStale;
-  }
-}
-function runWithObserver(observer, run) {
-  const prevSources = newSources, prevSourcesIndex = newSourcesIndex, prevFlags = newFlags;
-  newSources = null;
-  newSourcesIndex = observer.c ? observer.c.length : 0;
-  newFlags = 0;
-  try {
-    return compute(observer, run, observer);
-  } catch (error) {
-    if (error instanceof NotReadyError) {
-      observer.write(
-        UNCHANGED,
-        newFlags | LOADING_BIT | observer.f & UNINITIALIZED_BIT
-      );
-    } else {
-      observer.M(error);
-    }
-  } finally {
-    if (newSources) {
-      if (newSourcesIndex > 0) {
-        observer.c.length = newSourcesIndex + newSources.length;
-        for (let i = 0; i < newSources.length; i++) {
-          observer.c[newSourcesIndex + i] = newSources[i];
-        }
-      } else {
-        observer.c = newSources;
-      }
-      let source;
-      for (let i = newSourcesIndex; i < observer.c.length; i++) {
-        source = observer.c[i];
-        if (!source.d)
-          source.d = [observer];
-        else
-          source.d.push(observer);
-      }
-    }
-    newSources = prevSources;
-    newSourcesIndex = prevSourcesIndex;
-    newFlags = prevFlags;
-  }
-}
-function compute(owner, fn, observer) {
-  const prevOwner = setOwner(owner), prevObserver = currentObserver, prevMask = currentMask, prevNotStale = notStale;
-  currentObserver = observer;
-  currentMask = observer?.T ?? DEFAULT_FLAGS;
-  notStale = true;
-  try {
-    return fn(observer ? observer.g : void 0);
-  } finally {
-    setOwner(prevOwner);
-    currentObserver = prevObserver;
-    currentMask = prevMask;
-    notStale = prevNotStale;
-  }
-}
-
-// src/core/effect.ts
-var Effect = class extends Computation {
-  U;
-  N;
-  C;
-  V = false;
-  O;
-  s;
-  constructor(initialValue, compute2, effect, error, options) {
-    super(initialValue, compute2, options);
-    this.U = effect;
-    this.N = error;
-    this.O = initialValue;
-    this.s = options?.render ? EFFECT_RENDER : EFFECT_USER;
-    if (this.s === EFFECT_RENDER) {
-      this.A = (p) => getClock() > this.h.created && !(this.f & ERROR_BIT) ? latest(() => compute2(p)) : compute2(p);
-    }
-    this.y();
-    !options?.defer && (this.s === EFFECT_USER ? this.h.enqueue(this.s, this.u.bind(this)) : this.u(this.s));
-  }
-  write(value, flags = 0) {
-    if (this.a == STATE_DIRTY) {
-      this.f;
-      this.f = flags;
-      if (this.s === EFFECT_RENDER) {
-        this.h.notify(this, LOADING_BIT | ERROR_BIT, flags);
-      }
-    }
-    if (value === UNCHANGED)
-      return this.g;
-    this.g = value;
-    this.V = true;
-    return value;
-  }
-  r(state, skipQueue) {
-    if (this.a >= state || skipQueue)
-      return;
-    if (this.a === STATE_CLEAN)
-      this.h.enqueue(this.s, this.u.bind(this));
-    this.a = state;
-  }
-  M(error) {
-    this.G = error;
-    this.h.notify(this, LOADING_BIT, 0);
-    this.f = ERROR_BIT;
-    if (this.s === EFFECT_USER) {
-      try {
-        return this.N ? this.N(error, () => {
-          this.C?.();
-          this.C = void 0;
-        }) : console.error(error);
-      } catch (e) {
-        error = e;
-      }
-    }
-    if (!this.h.notify(this, ERROR_BIT, ERROR_BIT))
-      throw error;
-  }
-  z() {
-    if (this.a === STATE_DISPOSED)
-      return;
-    this.U = void 0;
-    this.O = void 0;
-    this.N = void 0;
-    this.C?.();
-    this.C = void 0;
-    super.z();
-  }
-  u(type) {
-    if (type) {
-      if (this.V && this.a !== STATE_DISPOSED) {
-        this.C?.();
-        try {
-          this.C = this.U(this.g, this.O);
-        } catch (e) {
-          if (!this.h.notify(this, ERROR_BIT, ERROR_BIT))
-            throw e;
-        } finally {
-          this.O = this.g;
-          this.V = false;
-        }
-      }
-    } else
-      this.a !== STATE_CLEAN && runTop(this);
-  }
-};
-var EagerComputation = class extends Computation {
-  constructor(initialValue, compute2, options) {
-    super(initialValue, compute2, options);
-    !options?.defer && this.y();
-  }
-  r(state, skipQueue) {
-    if (this.a >= state && !this.x)
-      return;
-    if (!skipQueue && (this.a === STATE_CLEAN || this.a === STATE_CHECK && this.x))
-      this.h.enqueue(EFFECT_PURE, this.u.bind(this));
-    super.r(state, skipQueue);
-  }
-  u() {
-    this.a !== STATE_CLEAN && runTop(this);
-  }
-};
-var FirewallComputation = class extends Computation {
-  firewall = true;
-  constructor(compute2) {
-    super(void 0, compute2);
-  }
-  r(state, skipQueue) {
-    if (this.a >= state && !this.x)
-      return;
-    if (!skipQueue && (this.a === STATE_CLEAN || this.a === STATE_CHECK && this.x))
-      this.h.enqueue(EFFECT_PURE, this.u.bind(this));
-    super.r(state, true);
-    this.x = !!skipQueue;
-  }
-  u() {
-    this.a !== STATE_CLEAN && runTop(this);
-  }
-};
-function runTop(node) {
-  const ancestors = [];
-  for (let current = node; current !== null; current = current.o) {
-    if (current.a !== STATE_CLEAN) {
-      ancestors.push(current);
-    }
-  }
-  for (let i = ancestors.length - 1; i >= 0; i--) {
-    if (ancestors[i].a !== STATE_DISPOSED)
-      ancestors[i].y();
-  }
-}
-
-// src/signals.ts
-function createSignal(first, second, third) {
-  if (typeof first === "function") {
-    const memo = createMemo((p) => {
-      const node2 = new Computation(
-        first(p ? untrack(p[0]) : second),
-        null,
-        third
-      );
-      return [node2.read.bind(node2), node2.write.bind(node2)];
-    });
-    return [() => memo()[0](), (value) => memo()[1](value)];
-  }
-  const o = getOwner();
-  const needsId = o?.id != null;
-  const node = new Computation(
-    first,
-    null,
-    needsId ? { id: o.getNextChildId(), ...second } : second
-  );
-  return [node.read.bind(node), node.write.bind(node)];
-}
-function createMemo(compute2, value, options) {
-  let node = new Computation(
-    value,
-    compute2,
-    options
-  );
-  let resolvedValue;
-  return () => {
-    if (node) {
-      if (node.a === STATE_DISPOSED) {
-        node = void 0;
-        return resolvedValue;
-      }
-      resolvedValue = node.wait();
-      if (!node.c?.length && node.m?.o !== node) {
-        node.dispose();
-        node = void 0;
-      }
-    }
-    return resolvedValue;
-  };
-}
-function createAsync(compute2, value, options) {
-  let refreshing = false;
-  const node = new EagerComputation(
-    value,
-    (p) => {
-      const source = compute2(p, refreshing);
-      refreshing = false;
-      const isPromise = source instanceof Promise;
-      const iterator = source[Symbol.asyncIterator];
-      if (!isPromise && !iterator) {
-        return source;
-      }
-      let abort = false;
-      onCleanup(() => abort = true);
-      if (isPromise) {
-        source.then(
-          (value3) => {
-            if (abort)
-              return;
-            node.write(value3, 0, true);
-          },
-          (error) => {
-            if (abort)
-              return;
-            node.M(error);
-          }
-        );
-      } else {
-        (async () => {
-          try {
-            for await (let value3 of source) {
-              if (abort)
-                return;
-              node.write(value3, 0, true);
-            }
-          } catch (error) {
-            if (abort)
-              return;
-            node.write(error, ERROR_BIT);
-          }
-        })();
-      }
-      throw new NotReadyError();
-    },
-    options
-  );
-  const read = node.wait.bind(node);
-  read.refresh = () => {
-    node.a = STATE_DIRTY;
-    refreshing = true;
-    node.y();
-  };
-  return read;
-}
-function createEffect(compute2, effect, value, options) {
-  void new Effect(
-    value,
-    compute2,
-    effect.effect ? effect.effect : effect,
-    effect.error,
-    options
-  );
-}
-function createRenderEffect(compute2, effect, value, options) {
-  void new Effect(value, compute2, effect, void 0, {
-    render: true,
-    ...options
-  });
-}
-function createRoot(init, options) {
-  const owner = new Owner(options?.id);
-  return compute(owner, !init.length ? init : () => init(() => owner.dispose()), null);
-}
-function runWithOwner(owner, run) {
-  return compute(owner, run, null);
-}
-function resolve(fn) {
-  return new Promise((res, rej) => {
-    createRoot((dispose) => {
-      new EagerComputation(void 0, () => {
-        try {
-          res(fn());
-        } catch (err) {
-          if (err instanceof NotReadyError)
-            throw err;
-          rej(err);
-        }
-        dispose();
-      });
-    });
-  });
-}
-function tryCatch(fn) {
-  try {
-    const v = fn();
-    if (v instanceof Promise) {
-      return v.then(
-        (v2) => [void 0, v2],
-        (e) => {
-          if (e instanceof NotReadyError)
-            throw e;
-          return [e];
-        }
-      );
-    }
-    return [void 0, v];
-  } catch (e) {
-    if (e instanceof NotReadyError)
-      throw e;
-    return [e];
-  }
-}
-function transition(fn) {
-}
-function createOptimistic(initial, compute2, options) {
-  return [];
-}
-
-// src/store/projection.ts
-function createProjection(fn, initialValue = {}) {
-  let wrappedStore;
-  const node = new FirewallComputation(() => {
-    storeSetter(wrappedStore, fn);
-  });
-  const wrappedMap = /* @__PURE__ */ new WeakMap();
-  const traps = {
-    ...storeTraps,
-    get(target, property, receiver) {
-      const o = getOwner();
-      (!o || o !== node) && node.wait();
-      return storeTraps.get(target, property, receiver);
-    }
-  };
-  function wrapProjection(source) {
-    if (wrappedMap.has(source))
-      return wrappedMap.get(source);
-    if (source[$TARGET]?.[STORE_WRAP] === wrapProjection)
-      return source;
-    const wrapped = createStoreProxy(source, traps, {
-      [STORE_WRAP]: wrapProjection,
-      [STORE_LOOKUP]: wrappedMap
-    });
-    wrappedMap.set(source, wrapped);
-    return wrapped;
-  }
-  return wrappedStore = wrapProjection(initialValue);
-}
-
-// src/store/store.ts
-var $TRACK = Symbol(0);
-var $DEEP = Symbol(0);
-var $TARGET = Symbol(0);
-var $PROXY = Symbol(0);
-var $DELETED = Symbol(0);
-var PARENTS = /* @__PURE__ */ new WeakMap();
-var STORE_VALUE = "v";
-var STORE_OVERRIDE = "o";
-var STORE_NODE = "n";
-var STORE_HAS = "h";
-var STORE_WRAP = "w";
-var STORE_LOOKUP = "l";
-function createStoreProxy(value, traps = storeTraps, extend) {
-  let newTarget;
-  if (Array.isArray(value)) {
-    newTarget = [];
-    newTarget.v = value;
-  } else
-    newTarget = { v: value };
-  extend && Object.assign(newTarget, extend);
-  return newTarget[$PROXY] = new Proxy(newTarget, traps);
-}
-var storeLookup = /* @__PURE__ */ new WeakMap();
-function wrap(value, target) {
-  if (target?.[STORE_WRAP])
-    return target[STORE_WRAP](value, target);
-  let p = value[$PROXY] || storeLookup.get(value);
-  if (!p)
-    storeLookup.set(value, p = createStoreProxy(value));
-  return p;
-}
-function isWrappable(obj) {
-  return obj != null && typeof obj === "object" && !Object.isFrozen(obj);
-}
-function getNodes(target, type) {
-  let nodes = target[type];
-  if (!nodes)
-    target[type] = nodes = /* @__PURE__ */ Object.create(null);
-  return nodes;
-}
-function getNode(nodes, property, value, equals = isEqual) {
-  if (nodes[property])
-    return nodes[property];
-  return nodes[property] = new Computation(value, null, {
-    equals,
-    unobserved() {
-      delete nodes[property];
-    }
-  });
-}
-function trackSelf(target, symbol = $TRACK) {
-  getObserver() && getNode(getNodes(target, STORE_NODE), symbol, void 0, false).read();
-}
-function getKeys(source, override, enumerable = true) {
-  const baseKeys = untrack(() => enumerable ? Object.keys(source) : Reflect.ownKeys(source));
-  if (!override)
-    return baseKeys;
-  const keys = new Set(baseKeys);
-  const overrides = Reflect.ownKeys(override);
-  for (const key of overrides) {
-    if (override[key] !== $DELETED)
-      keys.add(key);
-    else
-      keys.delete(key);
-  }
-  return Array.from(keys);
-}
-function getPropertyDescriptor(source, override, property) {
-  let value = source;
-  if (override && property in override) {
-    if (value[property] === $DELETED)
-      return void 0;
-    if (!(property in value))
-      value = override;
-  }
-  return Reflect.getOwnPropertyDescriptor(value, property);
-}
-var Writing = null;
-var storeTraps = {
-  get(target, property, receiver) {
-    if (property === $TARGET)
-      return target;
-    if (property === $PROXY)
-      return receiver;
-    if (property === $TRACK || property === $DEEP) {
-      trackSelf(target, property);
-      return receiver;
-    }
-    const nodes = getNodes(target, STORE_NODE);
-    const tracked = nodes[property];
-    const overridden = target[STORE_OVERRIDE] && property in target[STORE_OVERRIDE];
-    const proxySource = !!target[STORE_VALUE][$TARGET];
-    const storeValue = overridden ? target[STORE_OVERRIDE] : target[STORE_VALUE];
-    if (!tracked) {
-      const desc = Object.getOwnPropertyDescriptor(storeValue, property);
-      if (desc && desc.get)
-        return desc.get.call(receiver);
-    }
-    if (Writing?.has(receiver)) {
-      let value2 = tracked && (overridden || !proxySource) ? tracked.g : storeValue[property];
-      value2 === $DELETED && (value2 = void 0);
-      if (!isWrappable(value2))
-        return value2;
-      const wrapped = wrap(value2, target);
-      Writing.add(wrapped);
-      return wrapped;
-    }
-    let value = tracked ? overridden || !proxySource ? nodes[property].read() : (nodes[property].read(), storeValue[property]) : storeValue[property];
-    value === $DELETED && (value = void 0);
-    if (!tracked) {
-      if (!overridden && typeof value === "function" && !storeValue.hasOwnProperty(property)) {
-        let proto;
-        return !Array.isArray(target[STORE_VALUE]) && (proto = Object.getPrototypeOf(target[STORE_VALUE])) && proto !== Object.prototype ? value.bind(storeValue) : value;
-      } else if (getObserver()) {
-        return getNode(nodes, property, isWrappable(value) ? wrap(value, target) : value).read();
-      }
-    }
-    return isWrappable(value) ? wrap(value, target) : value;
-  },
-  has(target, property) {
-    if (property === $PROXY || property === $TRACK || property === "__proto__")
-      return true;
-    const has = target[STORE_OVERRIDE] && property in target[STORE_OVERRIDE] ? target[STORE_OVERRIDE][property] !== $DELETED : property in target[STORE_VALUE];
-    getObserver() && getNode(getNodes(target, STORE_HAS), property, has).read();
-    return has;
-  },
-  set(target, property, rawValue) {
-    const store = target[$PROXY];
-    if (Writing?.has(target[$PROXY])) {
-      untrack(() => {
-        const state = target[STORE_VALUE];
-        const base = state[property];
-        const prev = target[STORE_OVERRIDE]?.[property] || base;
-        const value = rawValue?.[$TARGET]?.[STORE_VALUE] ?? rawValue;
-        if (prev === value)
-          return true;
-        const len = target[STORE_OVERRIDE]?.length || state.length;
-        if (value !== void 0 && value === base)
-          delete target[STORE_OVERRIDE][property];
-        else
-          (target[STORE_OVERRIDE] || (target[STORE_OVERRIDE] = /* @__PURE__ */ Object.create(null)))[property] = value;
-        const wrappable = isWrappable(value);
-        if (isWrappable(prev)) {
-          const parents = PARENTS.get(prev);
-          parents && (parents instanceof Set ? parents.delete(store) : PARENTS.delete(prev));
-        }
-        if (recursivelyNotify(store, storeLookup) && wrappable)
-          recursivelyAddParent(value, store);
-        target[STORE_HAS]?.[property]?.write(true);
-        const nodes = getNodes(target, STORE_NODE);
-        nodes[property]?.write(wrappable ? wrap(value, target) : value);
-        if (Array.isArray(state)) {
-          const index = parseInt(property) + 1;
-          if (index > len)
-            nodes.length?.write(index);
-        }
-        nodes[$TRACK]?.write(void 0);
-      });
-    }
-    return true;
-  },
-  deleteProperty(target, property) {
-    if (Writing?.has(target[$PROXY]) && target[STORE_OVERRIDE]?.[property] !== $DELETED) {
-      untrack(() => {
-        const prev = target[STORE_OVERRIDE]?.[property] || target[STORE_VALUE][property];
-        if (property in target[STORE_VALUE]) {
-          (target[STORE_OVERRIDE] || (target[STORE_OVERRIDE] = /* @__PURE__ */ Object.create(null)))[property] = $DELETED;
-        } else if (target[STORE_OVERRIDE] && property in target[STORE_OVERRIDE]) {
-          delete target[STORE_OVERRIDE][property];
-        } else
-          return true;
-        if (isWrappable(prev)) {
-          const parents = PARENTS.get(prev);
-          parents && (parents instanceof Set ? parents.delete(target) : PARENTS.delete(prev));
-        }
-        target[STORE_HAS]?.[property]?.write(false);
-        const nodes = getNodes(target, STORE_NODE);
-        nodes[property]?.write(void 0);
-        nodes[$TRACK]?.write(void 0);
-      });
-    }
-    return true;
-  },
-  ownKeys(target) {
-    trackSelf(target);
-    return getKeys(target[STORE_VALUE], target[STORE_OVERRIDE], false);
-  },
-  getOwnPropertyDescriptor(target, property) {
-    if (property === $PROXY)
-      return { value: target[$PROXY], writable: true, configurable: true };
-    return getPropertyDescriptor(target[STORE_VALUE], target[STORE_OVERRIDE], property);
-  },
-  getPrototypeOf(target) {
-    return Object.getPrototypeOf(target[STORE_VALUE]);
-  }
-};
-function storeSetter(store, fn) {
-  const prevWriting = Writing;
-  Writing = /* @__PURE__ */ new Set();
-  Writing.add(store);
-  try {
-    fn(store);
-  } finally {
-    Writing.clear();
-    Writing = prevWriting;
-  }
-}
-function createStore(first, second) {
-  const derived = typeof first === "function", wrappedStore = derived ? createProjection(first, second) : wrap(first);
-  return [wrappedStore, (fn) => storeSetter(wrappedStore, fn)];
-}
-function recursivelyNotify(state, lookup) {
-  let target = state[$TARGET] || lookup?.get(state)?.[$TARGET];
-  let notified = false;
-  if (target) {
-    const deep2 = getNodes(target, STORE_NODE)[$DEEP];
-    if (deep2) {
-      deep2.write(void 0);
-      notified = true;
-    }
-    lookup = target[STORE_LOOKUP] || lookup;
-  }
-  const parents = PARENTS.get(target?.[STORE_VALUE] || state);
-  if (!parents)
-    return notified;
-  if (parents instanceof Set) {
-    for (let parent of parents)
-      notified = recursivelyNotify(parent, lookup) || notified;
-  } else
-    notified = recursivelyNotify(parents, lookup) || notified;
-  return notified;
-}
-function recursivelyAddParent(state, parent) {
-  let override;
-  const target = state[$TARGET];
-  if (target) {
-    override = target[STORE_OVERRIDE];
-    state = target[STORE_VALUE];
-  }
-  if (parent) {
-    let parents = PARENTS.get(state);
-    if (!parents)
-      PARENTS.set(state, parent);
-    else if (parents !== parent) {
-      if (!(parents instanceof Set))
-        PARENTS.set(state, parents = /* @__PURE__ */ new Set([parents]));
-      else if (parents.has(parent))
-        return;
-      parents.add(parent);
-    } else
-      return;
-  }
-  if (Array.isArray(state)) {
-    const len = override?.length || state.length;
-    for (let i = 0; i < len; i++) {
-      const item = override && i in override ? override[i] : state[i];
-      isWrappable(item) && recursivelyAddParent(item, state);
-    }
-  } else {
-    const keys = getKeys(state, override);
-    for (let i = 0; i < keys.length; i++) {
-      const key = keys[i];
-      const item = override && key in override ? override[key] : state[key];
-      isWrappable(item) && recursivelyAddParent(item, state);
-    }
-  }
-}
-function deep(store) {
-  recursivelyAddParent(store);
-  return store[$DEEP];
-}
-
-// src/store/reconcile.ts
-function unwrap(value) {
-  return value?.[$TARGET]?.[STORE_NODE] ?? value;
-}
-function getOverrideValue(value, override, key) {
-  return override && key in override ? override[key] : value[key];
-}
-function getAllKeys(value, override, next) {
-  const keys = getKeys(value, override);
-  const nextKeys = Object.keys(next);
-  return Array.from(/* @__PURE__ */ new Set([...keys, ...nextKeys]));
-}
-function applyState(next, state, keyFn, all) {
-  const target = state?.[$TARGET];
-  if (!target)
-    return;
-  const previous = target[STORE_VALUE];
-  const override = target[STORE_OVERRIDE];
-  if (next === previous && !override)
-    return;
-  (target[STORE_LOOKUP] || storeLookup).set(next, target[$PROXY]);
-  target[STORE_VALUE] = next;
-  target[STORE_OVERRIDE] = void 0;
-  if (Array.isArray(previous)) {
-    let changed = false;
-    const prevLength = getOverrideValue(previous, override, "length");
-    if (next.length && prevLength && next[0] && keyFn(next[0]) != null) {
-      let i, j, start, end, newEnd, item, newIndicesNext, keyVal;
-      for (start = 0, end = Math.min(prevLength, next.length); start < end && ((item = getOverrideValue(previous, override, start)) === next[start] || item && next[start] && keyFn(item) === keyFn(next[start])); start++) {
-        applyState(next[start], wrap(item, target), keyFn, all);
-      }
-      const temp = new Array(next.length), newIndices = /* @__PURE__ */ new Map();
-      for (end = prevLength - 1, newEnd = next.length - 1; end >= start && newEnd >= start && ((item = getOverrideValue(previous, override, end)) === next[newEnd] || item && next[newEnd] && keyFn(item) === keyFn(next[newEnd])); end--, newEnd--) {
-        temp[newEnd] = item;
-      }
-      if (start > newEnd || start > end) {
-        for (j = start; j <= newEnd; j++) {
-          changed = true;
-          target[STORE_NODE][j]?.write(wrap(next[j], target));
-        }
-        for (; j < next.length; j++) {
-          changed = true;
-          const wrapped = wrap(temp[j], target);
-          target[STORE_NODE][j]?.write(wrapped);
-          applyState(next[j], wrapped, keyFn, all);
-        }
-        changed && target[STORE_NODE][$TRACK]?.write(void 0);
-        prevLength !== next.length && target[STORE_NODE].length?.write(next.length);
-        return;
-      }
-      newIndicesNext = new Array(newEnd + 1);
-      for (j = newEnd; j >= start; j--) {
-        item = next[j];
-        keyVal = item ? keyFn(item) : item;
-        i = newIndices.get(keyVal);
-        newIndicesNext[j] = i === void 0 ? -1 : i;
-        newIndices.set(keyVal, j);
-      }
-      for (i = start; i <= end; i++) {
-        item = getOverrideValue(previous, override, i);
-        keyVal = item ? keyFn(item) : item;
-        j = newIndices.get(keyVal);
-        if (j !== void 0 && j !== -1) {
-          temp[j] = item;
-          j = newIndicesNext[j];
-          newIndices.set(keyVal, j);
-        }
-      }
-      for (j = start; j < next.length; j++) {
-        if (j in temp) {
-          const wrapped = wrap(temp[j], target);
-          target[STORE_NODE][j]?.write(wrapped);
-          applyState(next[j], wrapped, keyFn, all);
-        } else
-          target[STORE_NODE][j]?.write(wrap(next[j], target));
-      }
-      if (start < next.length)
-        changed = true;
-    } else if (prevLength && next.length) {
-      for (let i = 0, len = next.length; i < len; i++) {
-        const item = getOverrideValue(previous, override, i);
-        isWrappable(item) && applyState(next[i], wrap(item, target), keyFn, all);
-      }
-    }
-    if (prevLength !== next.length) {
-      changed = true;
-      target[STORE_NODE].length?.write(next.length);
-    }
-    changed && target[STORE_NODE][$TRACK]?.write(void 0);
-    return;
-  }
-  let nodes = target[STORE_NODE];
-  if (nodes) {
-    const tracked = nodes[$TRACK];
-    const keys = tracked || all ? getAllKeys(previous, override, next) : Object.keys(nodes);
-    for (let i = 0, len = keys.length; i < len; i++) {
-      const key = keys[i];
-      const node = nodes[key];
-      const previousValue = unwrap(getOverrideValue(previous, override, key));
-      let nextValue = unwrap(next[key]);
-      if (previousValue === nextValue)
-        continue;
-      if (!previousValue || !isWrappable(previousValue) || keyFn(previousValue) != null && keyFn(previousValue) !== keyFn(nextValue)) {
-        tracked?.write(void 0);
-        node?.write(isWrappable(nextValue) ? wrap(nextValue, target) : nextValue);
-      } else
-        applyState(nextValue, wrap(previousValue, target), keyFn, all);
-    }
-  }
-  if (nodes = target[STORE_HAS]) {
-    const keys = Object.keys(nodes);
-    for (let i = 0, len = keys.length; i < len; i++) {
-      nodes[keys[i]].write(keys[i] in next);
-    }
-  }
-}
-function reconcile(value, key, all = false) {
-  return (state) => {
-    const keyFn = typeof key === "string" ? (item) => item[key] : key;
-    const eq = keyFn(state);
-    if (eq !== void 0 && keyFn(value) !== keyFn(state))
-      throw new Error("Cannot reconcile states with different identity");
-    applyState(value, state, keyFn, all);
-  };
-}
-
-// src/store/utils.ts
-function snapshot(item, map, lookup) {
-  let target, isArray, override, result, unwrapped, v;
-  if (!isWrappable(item))
-    return item;
-  if (map && map.has(item))
-    return map.get(item);
-  if (!map)
-    map = /* @__PURE__ */ new Map();
-  if (target = item[$TARGET] || lookup?.get(item)?.[$TARGET]) {
-    override = target[STORE_OVERRIDE];
-    isArray = Array.isArray(target[STORE_VALUE]);
-    map.set(
-      item,
-      override ? result = isArray ? [] : Object.create(Object.getPrototypeOf(target[STORE_VALUE])) : target[STORE_VALUE]
-    );
-    item = target[STORE_VALUE];
-    lookup = storeLookup;
-  } else {
-    isArray = Array.isArray(item);
-    map.set(item, item);
-  }
-  if (isArray) {
-    const len = override?.length || item.length;
-    for (let i = 0; i < len; i++) {
-      v = override && i in override ? override[i] : item[i];
-      if (v === $DELETED)
-        continue;
-      if ((unwrapped = snapshot(v, map, lookup)) !== v || result) {
-        if (!result)
-          map.set(item, result = [...item]);
-        result[i] = unwrapped;
-      }
-    }
-  } else {
-    const keys = getKeys(item, override);
-    for (let i = 0, l = keys.length; i < l; i++) {
-      let prop = keys[i];
-      const desc = getPropertyDescriptor(item, override, prop);
-      if (desc.get)
-        continue;
-      v = override && prop in override ? override[prop] : item[prop];
-      if ((unwrapped = snapshot(v, map, lookup)) !== item[prop] || result) {
-        if (!result) {
-          result = Object.create(Object.getPrototypeOf(item));
-          Object.assign(result, item);
-        }
-        result[prop] = unwrapped;
-      }
-    }
-  }
-  return result || item;
-}
-function trueFn() {
-  return true;
-}
-var propTraps = {
-  get(_, property, receiver) {
-    if (property === $PROXY)
-      return receiver;
-    return _.get(property);
-  },
-  has(_, property) {
-    if (property === $PROXY)
-      return true;
-    return _.has(property);
-  },
-  set: trueFn,
-  deleteProperty: trueFn,
-  getOwnPropertyDescriptor(_, property) {
-    return {
-      configurable: true,
-      enumerable: true,
-      get() {
-        return _.get(property);
-      },
-      set: trueFn,
-      deleteProperty: trueFn
-    };
-  },
-  ownKeys(_) {
-    return _.keys();
-  }
-};
-function resolveSource(s) {
-  return !(s = typeof s === "function" ? s() : s) ? {} : s;
-}
-var $SOURCES = Symbol(0);
-function merge(...sources) {
-  if (sources.length === 1 && typeof sources[0] !== "function")
-    return sources[0];
-  let proxy = false;
-  const flattened = [];
-  for (let i = 0; i < sources.length; i++) {
-    const s = sources[i];
-    proxy = proxy || !!s && $PROXY in s;
-    const childSources = !!s && s[$SOURCES];
-    if (childSources)
-      flattened.push(...childSources);
-    else
-      flattened.push(
-        typeof s === "function" ? (proxy = true, createMemo(s)) : s
-      );
-  }
-  if (SUPPORTS_PROXY && proxy) {
-    return new Proxy(
-      {
-        get(property) {
-          if (property === $SOURCES)
-            return flattened;
-          for (let i = flattened.length - 1; i >= 0; i--) {
-            const s = resolveSource(flattened[i]);
-            if (property in s)
-              return s[property];
-          }
-        },
-        has(property) {
-          for (let i = flattened.length - 1; i >= 0; i--) {
-            if (property in resolveSource(flattened[i]))
-              return true;
-          }
-          return false;
-        },
-        keys() {
-          const keys = [];
-          for (let i = 0; i < flattened.length; i++)
-            keys.push(...Object.keys(resolveSource(flattened[i])));
-          return [...new Set(keys)];
-        }
-      },
-      propTraps
-    );
-  }
-  const defined = /* @__PURE__ */ Object.create(null);
-  let nonTargetKey = false;
-  let lastIndex = flattened.length - 1;
-  for (let i = lastIndex; i >= 0; i--) {
-    const source = flattened[i];
-    if (!source) {
-      i === lastIndex && lastIndex--;
-      continue;
-    }
-    const sourceKeys = Object.getOwnPropertyNames(source);
-    for (let j = sourceKeys.length - 1; j >= 0; j--) {
-      const key = sourceKeys[j];
-      if (key === "__proto__" || key === "constructor")
-        continue;
-      if (!defined[key]) {
-        nonTargetKey = nonTargetKey || i !== lastIndex;
-        const desc = Object.getOwnPropertyDescriptor(source, key);
-        defined[key] = desc.get ? {
-          enumerable: true,
-          configurable: true,
-          get: desc.get.bind(source)
-        } : desc;
-      }
-    }
-  }
-  if (!nonTargetKey)
-    return flattened[lastIndex];
-  const target = {};
-  const definedKeys = Object.keys(defined);
-  for (let i = definedKeys.length - 1; i >= 0; i--) {
-    const key = definedKeys[i], desc = defined[key];
-    if (desc.get)
-      Object.defineProperty(target, key, desc);
-    else
-      target[key] = desc.value;
-  }
-  target[$SOURCES] = flattened;
-  return target;
-}
-function omit(props, ...keys) {
-  const blocked = new Set(keys);
-  if (SUPPORTS_PROXY && $PROXY in props) {
-    return new Proxy(
-      {
-        get(property) {
-          return blocked.has(property) ? void 0 : props[property];
-        },
-        has(property) {
-          return !blocked.has(property) && property in props;
-        },
-        keys() {
-          return Object.keys(props).filter((k) => !blocked.has(k));
-        }
-      },
-      propTraps
-    );
-  }
-  const result = {};
-  for (const propName of Object.getOwnPropertyNames(props)) {
-    if (!blocked.has(propName)) {
-      const desc = Object.getOwnPropertyDescriptor(props, propName);
-      !desc.get && !desc.set && desc.enumerable && desc.writable && desc.configurable ? result[propName] = desc.value : Object.defineProperty(result, propName, desc);
-    }
-  }
-  return result;
-}
-
-// src/map.ts
-function mapArray(list, map, options) {
-  const keyFn = typeof options?.keyed === "function" ? options.keyed : void 0;
-  return updateKeyedMap.bind({
-    H: new Owner(),
-    i: 0,
-    $: list,
-    w: [],
-    D: map,
-    e: [],
-    b: [],
-    E: keyFn,
-    j: keyFn || options?.keyed === false ? [] : void 0,
-    k: map.length > 1 ? [] : void 0,
-    I: options?.fallback
-  });
-}
-var pureOptions = { pureWrite: true };
-function updateKeyedMap() {
-  const newItems = this.$() || [], newLen = newItems.length;
-  newItems[$TRACK];
-  runWithOwner(this.H, () => {
-    let i, j, mapper = this.j ? () => {
-      this.j[j] = new Computation(newItems[j], null, pureOptions);
-      this.k && (this.k[j] = new Computation(j, null, pureOptions));
-      return this.D(
-        Computation.prototype.read.bind(this.j[j]),
-        this.k ? Computation.prototype.read.bind(this.k[j]) : void 0
-      );
-    } : this.k ? () => {
-      const item = newItems[j];
-      this.k[j] = new Computation(j, null, pureOptions);
-      return this.D(() => item, Computation.prototype.read.bind(this.k[j]));
-    } : () => {
-      const item = newItems[j];
-      return this.D(() => item);
-    };
-    if (newLen === 0) {
-      if (this.i !== 0) {
-        this.H.dispose(false);
-        this.b = [];
-        this.w = [];
-        this.e = [];
-        this.i = 0;
-        this.j && (this.j = []);
-        this.k && (this.k = []);
-      }
-      if (this.I && !this.e[0]) {
-        this.e[0] = compute(
-          this.b[0] = new Owner(),
-          this.I,
-          null
-        );
-      }
-    } else if (this.i === 0) {
-      if (this.b[0])
-        this.b[0].dispose();
-      this.e = new Array(newLen);
-      for (j = 0; j < newLen; j++) {
-        this.w[j] = newItems[j];
-        this.e[j] = compute(this.b[j] = new Owner(), mapper, null);
-      }
-      this.i = newLen;
-    } else {
-      let start, end, newEnd, item, key, newIndices, newIndicesNext, temp = new Array(newLen), tempNodes = new Array(newLen), tempRows = this.j ? new Array(newLen) : void 0, tempIndexes = this.k ? new Array(newLen) : void 0;
-      for (start = 0, end = Math.min(this.i, newLen); start < end && (this.w[start] === newItems[start] || this.j && compare(this.E, this.w[start], newItems[start])); start++) {
-        if (this.j)
-          this.j[start].write(newItems[start]);
-      }
-      for (end = this.i - 1, newEnd = newLen - 1; end >= start && newEnd >= start && (this.w[end] === newItems[newEnd] || this.j && compare(this.E, this.w[end], newItems[newEnd])); end--, newEnd--) {
-        temp[newEnd] = this.e[end];
-        tempNodes[newEnd] = this.b[end];
-        tempRows && (tempRows[newEnd] = this.j[end]);
-        tempIndexes && (tempIndexes[newEnd] = this.k[end]);
-      }
-      newIndices = /* @__PURE__ */ new Map();
-      newIndicesNext = new Array(newEnd + 1);
-      for (j = newEnd; j >= start; j--) {
-        item = newItems[j];
-        key = this.E ? this.E(item) : item;
-        i = newIndices.get(key);
-        newIndicesNext[j] = i === void 0 ? -1 : i;
-        newIndices.set(key, j);
-      }
-      for (i = start; i <= end; i++) {
-        item = this.w[i];
-        key = this.E ? this.E(item) : item;
-        j = newIndices.get(key);
-        if (j !== void 0 && j !== -1) {
-          temp[j] = this.e[i];
-          tempNodes[j] = this.b[i];
-          tempRows && (tempRows[j] = this.j[i]);
-          tempIndexes && (tempIndexes[j] = this.k[i]);
-          j = newIndicesNext[j];
-          newIndices.set(key, j);
-        } else
-          this.b[i].dispose();
-      }
-      for (j = start; j < newLen; j++) {
-        if (j in temp) {
-          this.e[j] = temp[j];
-          this.b[j] = tempNodes[j];
-          if (tempRows) {
-            this.j[j] = tempRows[j];
-            this.j[j].write(newItems[j]);
-          }
-          if (tempIndexes) {
-            this.k[j] = tempIndexes[j];
-            this.k[j].write(j);
-          }
-        } else {
-          this.e[j] = compute(this.b[j] = new Owner(), mapper, null);
-        }
-      }
-      this.e = this.e.slice(0, this.i = newLen);
-      this.w = newItems.slice(0);
-    }
-  });
-  return this.e;
-}
-function repeat(count, map, options) {
-  return updateRepeat.bind({
-    H: new Owner(),
-    i: 0,
-    q: 0,
-    aa: count,
-    D: map,
-    b: [],
-    e: [],
-    ba: options?.from,
-    I: options?.fallback
-  });
-}
-function updateRepeat() {
-  const newLen = this.aa();
-  const from = this.ba?.() || 0;
-  runWithOwner(this.H, () => {
-    if (newLen === 0) {
-      if (this.i !== 0) {
-        this.H.dispose(false);
-        this.b = [];
-        this.e = [];
-        this.i = 0;
-      }
-      if (this.I && !this.e[0]) {
-        this.e[0] = compute(
-          this.b[0] = new Owner(),
-          this.I,
-          null
-        );
-      }
-      return;
-    }
-    const to = from + newLen;
-    const prevTo = this.q + this.i;
-    if (this.i === 0 && this.b[0])
-      this.b[0].dispose();
-    for (let i = to; i < prevTo; i++)
-      this.b[i - this.q].dispose();
-    if (this.q < from) {
-      let i = this.q;
-      while (i < from && i < this.i)
-        this.b[i++].dispose();
-      this.b.splice(0, from - this.q);
-      this.e.splice(0, from - this.q);
-    } else if (this.q > from) {
-      let i = prevTo - this.q - 1;
-      let difference = this.q - from;
-      this.b.length = this.e.length = newLen;
-      while (i >= difference) {
-        this.b[i] = this.b[i - difference];
-        this.e[i] = this.e[i - difference];
-        i--;
-      }
-      for (let i2 = 0; i2 < difference; i2++) {
-        this.e[i2] = compute(
-          this.b[i2] = new Owner(),
-          () => this.D(i2 + from),
-          null
-        );
-      }
-    }
-    for (let i = prevTo; i < to; i++) {
-      this.e[i - from] = compute(
-        this.b[i - from] = new Owner(),
-        () => this.D(i),
-        null
-      );
-    }
-    this.e = this.e.slice(0, newLen);
-    this.q = from;
-    this.i = newLen;
-  });
-  return this.e;
-}
-function compare(key, a, b) {
-  return key ? key(a) === key(b) : true;
-}
-
-// src/boundaries.ts
-var BoundaryComputation = class extends EagerComputation {
-  J;
-  constructor(compute2, propagationMask) {
-    super(void 0, compute2, { defer: true });
-    this.J = propagationMask;
-  }
-  write(value, flags) {
-    super.write(value, flags & ~this.J);
-    if (this.J & LOADING_BIT && !(this.f & UNINITIALIZED_BIT)) {
-      flags &= ~LOADING_BIT;
-    }
-    this.h.notify(this, this.J, flags);
-    return this.g;
-  }
-};
-function createBoundChildren(owner, fn, queue, mask) {
-  const parentQueue = owner.h;
-  parentQueue.addChild(owner.h = queue);
-  onCleanup(() => parentQueue.removeChild(owner.h));
-  return compute(
-    owner,
-    () => {
-      const c = new Computation(void 0, fn);
-      return new BoundaryComputation(() => flatten(c.wait()), mask);
-    },
-    null
-  );
-}
-var ConditionalQueue = class extends Queue {
-  n;
-  P = /* @__PURE__ */ new Set();
-  Q = /* @__PURE__ */ new Set();
-  constructor(disabled) {
-    super();
-    this.n = disabled;
-  }
-  run(type) {
-    if (!type || this.n.read())
-      return;
-    return super.run(type);
-  }
-  notify(node, type, flags) {
-    if (this.n.read()) {
-      if (type & LOADING_BIT) {
-        if (flags & LOADING_BIT) {
-          this.Q.add(node);
-          type &= ~LOADING_BIT;
-        } else if (this.Q.delete(node))
-          type &= ~LOADING_BIT;
-      }
-      if (type & ERROR_BIT) {
-        if (flags & ERROR_BIT) {
-          this.P.add(node);
-          type &= ~ERROR_BIT;
-        } else if (this.P.delete(node))
-          type &= ~ERROR_BIT;
-      }
-    }
-    return type ? super.notify(node, type, flags) : true;
-  }
-};
-var CollectionQueue = class extends Queue {
-  R;
-  b = /* @__PURE__ */ new Set();
-  n = new Computation(false, null, { pureWrite: true });
-  constructor(type) {
-    super();
-    this.R = type;
-  }
-  run(type) {
-    if (!type || this.n.read())
-      return;
-    return super.run(type);
-  }
-  notify(node, type, flags) {
-    if (!(type & this.R))
-      return super.notify(node, type, flags);
-    if (flags & this.R) {
-      this.b.add(node);
-      if (this.b.size === 1)
-        this.n.write(true);
-    } else {
-      this.b.delete(node);
-      if (this.b.size === 0)
-        this.n.write(false);
-    }
-    type &= ~this.R;
-    return type ? super.notify(node, type, flags) : true;
-  }
-};
-function createBoundary(fn, condition) {
-  const owner = new Owner();
-  const queue = new ConditionalQueue(
-    new Computation(void 0, () => condition() === "hidden" /* HIDDEN */)
-  );
-  const tree = createBoundChildren(owner, fn, queue, 0);
-  new EagerComputation(void 0, () => {
-    const disabled = queue.n.read();
-    tree.J = disabled ? ERROR_BIT | LOADING_BIT : 0;
-    if (!disabled) {
-      queue.Q.forEach((node) => queue.notify(node, LOADING_BIT, LOADING_BIT));
-      queue.P.forEach((node) => queue.notify(node, ERROR_BIT, ERROR_BIT));
-      queue.Q.clear();
-      queue.P.clear();
-    }
-  });
-  return () => queue.n.read() ? void 0 : tree.read();
-}
-function createCollectionBoundary(type, fn, fallback) {
-  const owner = new Owner();
-  const queue = new CollectionQueue(type);
-  const tree = createBoundChildren(owner, fn, queue, type);
-  const decision = new Computation(void 0, () => {
-    if (!queue.n.read()) {
-      const resolved = tree.read();
-      if (!queue.n.read())
-        return resolved;
-    }
-    return fallback(queue);
-  });
-  return decision.read.bind(decision);
-}
-function createSuspense(fn, fallback) {
-  return createCollectionBoundary(LOADING_BIT, fn, () => fallback());
-}
-function createErrorBoundary(fn, fallback) {
-  return createCollectionBoundary(
-    ERROR_BIT,
-    fn,
-    (queue) => fallback(queue.b.values().next().value.G, () => {
-      incrementClock();
-      for (let node of queue.b) {
-        node.a = STATE_DIRTY;
-        node.h?.enqueue(node.s, node.u.bind(node));
-      }
-    })
-  );
-}
-function flatten(children, options) {
-  if (typeof children === "function" && !children.length) {
-    if (options?.doNotUnwrap)
-      return children;
-    do {
-      children = children();
-    } while (typeof children === "function" && !children.length);
-  }
-  if (options?.skipNonRendered && (children == null || children === true || children === false || children === ""))
-    return;
-  if (Array.isArray(children)) {
-    let results = [];
-    if (flattenArray(children, results, options)) {
-      return () => {
-        let nested = [];
-        flattenArray(results, nested, { ...options, doNotUnwrap: false });
-        return nested;
-      };
-    }
-    return results;
-  }
-  return children;
-}
-function flattenArray(children, results = [], options) {
-  let notReady = null;
-  let needsUnwrap = false;
-  for (let i = 0; i < children.length; i++) {
-    try {
-      let child = children[i];
-      if (typeof child === "function" && !child.length) {
-        if (options?.doNotUnwrap) {
-          results.push(child);
-          needsUnwrap = true;
-          continue;
-        }
-        do {
-          child = child();
-        } while (typeof child === "function" && !child.length);
-      }
-      if (Array.isArray(child)) {
-        needsUnwrap = flattenArray(child, results, options);
-      } else if (options?.skipNonRendered && (child == null || child === true || child === false || child === "")) {
-      } else
-        results.push(child);
-    } catch (e) {
-      if (!(e instanceof NotReadyError))
-        throw e;
-      notReady = e;
-    }
-  }
-  if (notReady)
-    throw notReady;
-  return needsUnwrap;
-}
-
-export { $PROXY, $TARGET, $TRACK, Computation, ContextNotFoundError, NoOwnerError, NotReadyError, Owner, Queue, SUPPORTS_PROXY, createAsync, createBoundary, createContext, createEffect, createErrorBoundary, createMemo, createOptimistic, createProjection, createRenderEffect, createRoot, createSignal, createStore, createSuspense, deep, flatten, flush, getContext, getObserver, getOwner, hasContext, hasUpdated, isEqual, isPending, isWrappable, latest, mapArray, merge, omit, onCleanup, reconcile, repeat, resolve, runWithObserver, runWithOwner, setContext, snapshot, transition, tryCatch, untrack };
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/boundaries.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/boundaries.d.ts
deleted file mode 100644
index 6414acab3..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/boundaries.d.ts
+++ /dev/null
@@ -1,21 +0,0 @@
-import { Computation, Queue } from "./core/index.js";
-import type { Effect } from "./core/index.js";
-export declare class CollectionQueue extends Queue {
-    _collectionType: number;
-    _nodes: Set<Effect>;
-    _disabled: Computation<boolean>;
-    constructor(type: number);
-    run(type: number): void;
-    notify(node: Effect, type: number, flags: number): boolean;
-}
-export declare enum BoundaryMode {
-    VISIBLE = "visible",
-    HIDDEN = "hidden"
-}
-export declare function createBoundary<T>(fn: () => T, condition: () => BoundaryMode): () => T | undefined;
-export declare function createSuspense(fn: () => any, fallback: () => any): () => any;
-export declare function createErrorBoundary<U>(fn: () => any, fallback: (error: unknown, reset: () => void) => U): () => any;
-export declare function flatten(children: any, options?: {
-    skipNonRendered?: boolean;
-    doNotUnwrap?: boolean;
-}): any;
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/core/constants.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/core/constants.d.ts
deleted file mode 100644
index 34e31ee8e..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/core/constants.d.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-/**
- * See https://dev.to/modderme123/super-charging-fine-grained-reactive-performance-47ph
- * State clean corresponds to a node where all the sources are fully up to date
- * State check corresponds to a node where some sources (including grandparents) may have changed
- * State dirty corresponds to a node where the direct parents of a node has changed
- */
-export declare const STATE_CLEAN = 0;
-export declare const STATE_CHECK = 1;
-export declare const STATE_DIRTY = 2;
-export declare const STATE_DISPOSED = 3;
-export declare const EFFECT_PURE = 0;
-export declare const EFFECT_RENDER = 1;
-export declare const EFFECT_USER = 2;
-export declare const SUPPORTS_PROXY: boolean;
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/core/core.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/core/core.d.ts
deleted file mode 100644
index e163cf49f..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/core/core.d.ts
+++ /dev/null
@@ -1,157 +0,0 @@
-/**
- * Nodes for constructing a graph of reactive values and reactive computations.
- *
- * - The graph is acyclic.
- * - The user inputs new values into the graph by calling .write() on one more computation nodes.
- * - The user retrieves computed results from the graph by calling .read() on one or more computation nodes.
- * - The library is responsible for running any necessary computations so that .read() is up to date
- *   with all prior .write() calls anywhere in the graph.
- * - We call the input nodes 'roots' and the output nodes 'leaves' of the graph here.
- * - Changes flow from roots to leaves. It would be effective but inefficient to immediately
- *   propagate all changes from a root through the graph to descendant leaves. Instead, we defer
- *   change most change propagation computation until a leaf is accessed. This allows us to
- *   coalesce computations and skip altogether recalculating unused sections of the graph.
- * - Each computation node tracks its sources and its observers (observers are other
- *   elements that have this node as a source). Source and observer links are updated automatically
- *   as observer computations re-evaluate and call get() on their sources.
- * - Each node stores a cache state (clean/check/dirty) to support the change propagation algorithm:
- *
- * In general, execution proceeds in three passes:
- *
- *  1. write() propagates changes down the graph to the leaves
- *     direct children are marked as dirty and their deeper descendants marked as check
- *     (no computations are evaluated)
- *  2. read() requests that parent nodes updateIfNecessary(), which proceeds recursively up the tree
- *     to decide whether the node is clean (parents unchanged) or dirty (parents changed)
- *  3. updateIfNecessary() evaluates the computation if the node is dirty (the computations are
- *     executed in root to leaf order)
- */
-import { type Flags } from "./flags.js";
-import { Owner } from "./owner.js";
-export interface SignalOptions<T> {
-    id?: string;
-    name?: string;
-    equals?: ((prev: T, next: T) => boolean) | false;
-    pureWrite?: boolean;
-    unobserved?: () => void;
-}
-interface SourceType {
-    _observers: ObserverType[] | null;
-    _unobserved?: () => void;
-    _updateIfNecessary: () => void;
-    _stateFlags: Flags;
-    _time: number;
-}
-interface ObserverType {
-    _sources: SourceType[] | null;
-    _notify: (state: number, skipQueue?: boolean) => void;
-    _handlerMask: Flags;
-    _notifyFlags: (mask: Flags, newFlags: Flags) => void;
-    _time: number;
-}
-/**
- * Returns the current observer.
- */
-export declare function getObserver(): Computation | null;
-export declare const UNCHANGED: unique symbol;
-export type UNCHANGED = typeof UNCHANGED;
-export declare class Computation<T = any> extends Owner implements SourceType, ObserverType {
-    _sources: SourceType[] | null;
-    _observers: ObserverType[] | null;
-    _value: T | undefined;
-    _error: unknown;
-    _compute: null | ((p?: T) => T);
-    _name: string | undefined;
-    _equals: false | ((a: T, b: T) => boolean);
-    _unobserved: (() => void) | undefined;
-    _pureWrite: boolean;
-    /** Whether the computation is an error or has ancestors that are unresolved */
-    _stateFlags: number;
-    /** Which flags raised by sources are handled, vs. being passed through. */
-    _handlerMask: number;
-    _time: number;
-    _forceNotify: boolean;
-    constructor(initialValue: T | undefined, compute: null | ((p?: T) => T), options?: SignalOptions<T>);
-    _read(): T;
-    /**
-     * Return the current value of this computation
-     * Automatically re-executes the surrounding computation when the value changes
-     */
-    read(): T;
-    /**
-     * Return the current value of this computation
-     * Automatically re-executes the surrounding computation when the value changes
-     *
-     * If the computation has any unresolved ancestors, this function waits for the value to resolve
-     * before continuing
-     */
-    wait(): T;
-    /** Update the computation with a new value. */
-    write(value: T | ((currentValue: T) => T) | UNCHANGED, flags?: number, raw?: boolean): T;
-    /**
-     * Set the current node's state, and recursively mark all of this node's observers as STATE_CHECK
-     */
-    _notify(state: number, skipQueue?: boolean): void;
-    /**
-     * Notify the computation that one of its sources has changed flags.
-     *
-     * @param mask A bitmask for which flag(s) were changed.
-     * @param newFlags The source's new flags, masked to just the changed ones.
-     */
-    _notifyFlags(mask: Flags, newFlags: Flags): void;
-    _setError(error: unknown): void;
-    /**
-     * This is the core part of the reactivity system, which makes sure that the values are updated
-     * before they are read. We've also adapted it to return the loading state of the computation,
-     * so that we can propagate that to the computation's observers.
-     *
-     * This function will ensure that the value and states we read from the computation are up to date
-     */
-    _updateIfNecessary(): void;
-    /**
-     * Remove ourselves from the owner graph and the computation graph
-     */
-    _disposeNode(): void;
-}
-/**
- * Reruns a computation's _compute function, producing a new value and keeping track of dependencies.
- *
- * It handles the updating of sources and observers, disposal of previous executions,
- * and error handling if the _compute function throws. It also sets the node as loading
- * if it reads any parents that are currently loading.
- */
-export declare function update<T>(node: Computation<T>): void;
-export declare function isEqual<T>(a: T, b: T): boolean;
-/**
- * Returns the current value stored inside the given compute function without triggering any
- * dependencies. Use `untrack` if you want to also disable owner tracking.
- */
-export declare function untrack<T>(fn: () => T): T;
-/**
- * Returns true if the given functinon contains signals that have been updated since the last time
- * the parent computation was run.
- */
-export declare function hasUpdated(fn: () => any): boolean;
-/**
- * Returns an accessor that is true if the given function contains async signals that are out of date.
- */
-export declare function isPending(fn: () => any): boolean;
-export declare function isPending(fn: () => any, loadingValue: boolean): boolean;
-/**
- * Attempts to resolve value of expression synchronously returning the last resolved value for any async computation.
- */
-export declare function latest<T>(fn: () => T): T;
-export declare function latest<T, U>(fn: () => T, fallback: U): T | U;
-/**
- * Runs the given function in the given observer.
- *
- * Warning: Usually there are simpler ways of modeling a problem that avoid using this function
- */
-export declare function runWithObserver<T>(observer: Computation, run: () => T): T | undefined;
-/**
- * A convenient wrapper that calls `compute` with the `owner` and `observer` and is guaranteed
- * to reset the global context after the computation is finished even if an error is thrown.
- */
-export declare function compute<T>(owner: Owner | null, fn: (val: T) => T, observer: Computation<T>): T;
-export declare function compute<T>(owner: Owner | null, fn: (val: undefined) => T, observer: null): T;
-export {};
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/core/effect.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/core/effect.d.ts
deleted file mode 100644
index 8c7ce20af..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/core/effect.d.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-import { EFFECT_RENDER, EFFECT_USER } from "./constants.js";
-import { Computation, type SignalOptions } from "./core.js";
-/**
- * Effects are the leaf nodes of our reactive graph. When their sources change, they are
- * automatically added to the queue of effects to re-execute, which will cause them to fetch their
- * sources and recompute
- */
-export declare class Effect<T = any> extends Computation<T> {
-    _effect: (val: T, prev: T | undefined) => void | (() => void);
-    _onerror: ((err: unknown, cleanup: () => void) => void) | undefined;
-    _cleanup: (() => void) | undefined;
-    _modified: boolean;
-    _prevValue: T | undefined;
-    _type: typeof EFFECT_RENDER | typeof EFFECT_USER;
-    constructor(initialValue: T, compute: (val?: T) => T, effect: (val: T, prev: T | undefined) => void | (() => void), error?: (err: unknown) => void | (() => void), options?: SignalOptions<T> & {
-        render?: boolean;
-        defer?: boolean;
-    });
-    write(value: T, flags?: number): T;
-    _notify(state: number, skipQueue?: boolean): void;
-    _setError(error: unknown): void;
-    _disposeNode(): void;
-    _run(type: number): void;
-}
-export declare class EagerComputation<T = any> extends Computation<T> {
-    constructor(initialValue: T, compute: () => T, options?: SignalOptions<T> & {
-        defer?: boolean;
-    });
-    _notify(state: number, skipQueue?: boolean): void;
-    _run(): void;
-}
-export declare class FirewallComputation extends Computation {
-    firewall: boolean;
-    constructor(compute: () => void);
-    _notify(state: number, skipQueue?: boolean): void;
-    _run(): void;
-}
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/core/error.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/core/error.d.ts
deleted file mode 100644
index eea675ff9..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/core/error.d.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-export declare class NotReadyError extends Error {
-}
-export declare class NoOwnerError extends Error {
-    constructor();
-}
-export declare class ContextNotFoundError extends Error {
-    constructor();
-}
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/core/flags.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/core/flags.d.ts
deleted file mode 100644
index b63bff2e2..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/core/flags.d.ts
+++ /dev/null
@@ -1,11 +0,0 @@
-export type Flags = number;
-export declare const ERROR_OFFSET = 0;
-export declare const ERROR_BIT: number;
-export declare const ERROR: unique symbol;
-export declare const LOADING_OFFSET = 1;
-export declare const LOADING_BIT: number;
-export declare const LOADING: unique symbol;
-export declare const UNINITIALIZED_OFFSET = 2;
-export declare const UNINITIALIZED_BIT: number;
-export declare const UNINITIALIZED: unique symbol;
-export declare const DEFAULT_FLAGS: number;
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/core/index.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/core/index.d.ts
deleted file mode 100644
index c2ed5a775..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/core/index.d.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export { ContextNotFoundError, NoOwnerError, NotReadyError } from "./error.js";
-export { Owner, createContext, getContext, setContext, hasContext, getOwner, onCleanup, type Context, type ContextRecord, type Disposable } from "./owner.js";
-export { Computation, getObserver, isEqual, untrack, hasUpdated, isPending, latest, UNCHANGED, compute, runWithObserver, type SignalOptions } from "./core.js";
-export { Effect, EagerComputation } from "./effect.js";
-export { flush, Queue, incrementClock, getClock, type IQueue } from "./scheduler.js";
-export * from "./constants.js";
-export * from "./flags.js";
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/core/owner.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/core/owner.d.ts
deleted file mode 100644
index 83f9c4301..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/core/owner.d.ts
+++ /dev/null
@@ -1,95 +0,0 @@
-/**
- * Owner tracking is used to enable nested tracking scopes with automatic cleanup.
- * We also use owners to also keep track of which error handling context we are in.
- *
- * If you write the following
- *
- *   const a = createOwner(() => {
- *     const b = createOwner(() => {});
- *
- *     const c = createOwner(() => {
- *       const d = createOwner(() => {});
- *     });
- *
- *     const e = createOwner(() => {});
- *   });
- *
- * The owner tree will look like this:
- *
- *    a
- *   /|\
- *  b-c-e
- *    |
- *    d
- *
- * Following the _nextSibling pointers of each owner will first give you its children, and then its siblings (in reverse).
- * a -> e -> c -> d -> b
- *
- * Note that the owner tree is largely orthogonal to the reactivity tree, and is much closer to the component tree.
- */
-import { type IQueue } from "./scheduler.js";
-export type ContextRecord = Record<string | symbol, unknown>;
-export interface Disposable {
-    (): void;
-}
-/**
- * Returns the currently executing parent owner.
- */
-export declare function getOwner(): Owner | null;
-export declare function setOwner(owner: Owner | null): Owner | null;
-export declare class Owner {
-    _parent: Owner | null;
-    _nextSibling: Owner | null;
-    _prevSibling: Owner | null;
-    _state: number;
-    _disposal: Disposable | Disposable[] | null;
-    _context: ContextRecord;
-    _queue: IQueue;
-    _childCount: number;
-    id: string | null;
-    constructor(id?: string | null, skipAppend?: boolean);
-    append(child: Owner): void;
-    dispose(this: Owner, self?: boolean): void;
-    _disposeNode(): void;
-    emptyDisposal(): void;
-    getNextChildId(): string;
-}
-export interface Context<T> {
-    readonly id: symbol;
-    readonly defaultValue: T | undefined;
-}
-/**
- * Context provides a form of dependency injection. It is used to save from needing to pass
- * data as props through intermediate components. This function creates a new context object
- * that can be used with `getContext` and `setContext`.
- *
- * A default value can be provided here which will be used when a specific value is not provided
- * via a `setContext` call.
- */
-export declare function createContext<T>(defaultValue?: T, description?: string): Context<T>;
-/**
- * Attempts to get a context value for the given key.
- *
- * @throws `NoOwnerError` if there's no owner at the time of call.
- * @throws `ContextNotFoundError` if a context value has not been set yet.
- */
-export declare function getContext<T>(context: Context<T>, owner?: Owner | null): T;
-/**
- * Attempts to set a context value on the parent scope with the given key.
- *
- * @throws `NoOwnerError` if there's no owner at the time of call.
- */
-export declare function setContext<T>(context: Context<T>, value?: T, owner?: Owner | null): void;
-/**
- * Whether the given context is currently defined.
- */
-export declare function hasContext(context: Context<any>, owner?: Owner | null): boolean;
-/**
- * Runs an effect once before the reactive scope is disposed
- * @param fn an effect that should run only once on cleanup
- *
- * @returns the same {@link fn} function that was passed in
- *
- * @description https://docs.solidjs.com/reference/lifecycle/on-cleanup
- */
-export declare function onCleanup(fn: Disposable): Disposable;
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/core/scheduler.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/core/scheduler.d.ts
deleted file mode 100644
index d69fc1f25..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/core/scheduler.d.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-export declare function getClock(): number;
-export declare function incrementClock(): void;
-type QueueCallback = (type: number) => void;
-export interface IQueue {
-    enqueue(type: number, fn: QueueCallback): void;
-    run(type: number): boolean | void;
-    flush(): void;
-    addChild(child: IQueue): void;
-    removeChild(child: IQueue): void;
-    created: number;
-    notify(...args: any[]): boolean;
-    _parent: IQueue | null;
-}
-export declare class Queue implements IQueue {
-    _parent: IQueue | null;
-    _running: boolean;
-    _queues: [QueueCallback[], QueueCallback[]];
-    _children: IQueue[];
-    created: number;
-    enqueue(type: number, fn: QueueCallback): void;
-    run(type: number): void;
-    flush(): void;
-    addChild(child: IQueue): void;
-    removeChild(child: IQueue): void;
-    notify(...args: any[]): boolean;
-}
-export declare const globalQueue: Queue;
-/**
- * By default, changes are batched on the microtask queue which is an async process. You can flush
- * the queue synchronously to get the latest updates by calling `flush()`.
- */
-export declare function flush(): void;
-export {};
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/index.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/index.d.ts
deleted file mode 100644
index 0a000e98a..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/index.d.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export { Computation, ContextNotFoundError, NoOwnerError, NotReadyError, Owner, Queue, createContext, flush, getContext, setContext, hasContext, getOwner, onCleanup, getObserver, isEqual, untrack, hasUpdated, isPending, latest, runWithObserver, SUPPORTS_PROXY } from "./core/index.js";
-export type { SignalOptions, Context, ContextRecord, Disposable, IQueue } from "./core/index.js";
-export { mapArray, repeat, type Maybe } from "./map.js";
-export * from "./signals.js";
-export * from "./store/index.js";
-export { createSuspense, createErrorBoundary, createBoundary, flatten, type BoundaryMode } from "./boundaries.js";
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/map.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/map.d.ts
deleted file mode 100644
index 74ed53672..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/map.d.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-import type { Accessor } from "./signals.js";
-export type Maybe<T> = T | void | null | undefined | false;
-/**
- * Reactively transforms an array with a callback function - underlying helper for the `<For>` control flow
- *
- * similar to `Array.prototype.map`, but gets the value and index as accessors, transforms only values that changed and returns an accessor and reactively tracks changes to the list.
- *
- * @description https://docs.solidjs.com/reference/reactive-utilities/map-array
- */
-export declare function mapArray<Item, MappedItem>(list: Accessor<Maybe<readonly Item[]>>, map: (value: Accessor<Item>, index: Accessor<number>) => MappedItem, options?: {
-    keyed?: boolean | ((item: Item) => any);
-    fallback?: Accessor<any>;
-}): Accessor<MappedItem[]>;
-/**
- * Reactively repeats a callback function the count provided - underlying helper for the `<Repeat>` control flow
- *
- * @description https://docs.solidjs.com/reference/reactive-utilities/repeat
- */
-export declare function repeat(count: Accessor<number>, map: (index: number) => any, options?: {
-    from?: Accessor<number | undefined>;
-    fallback?: Accessor<any>;
-}): Accessor<any[]>;
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/signals.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/signals.d.ts
deleted file mode 100644
index b6a6f43c4..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/signals.d.ts
+++ /dev/null
@@ -1,182 +0,0 @@
-import type { SignalOptions } from "./core/index.js";
-import { Owner } from "./core/index.js";
-export type Accessor<T> = () => T;
-export type Setter<in out T> = {
-    <U extends T>(...args: undefined extends T ? [] : [value: Exclude<U, Function> | ((prev: T) => U)]): undefined extends T ? undefined : U;
-    <U extends T>(value: (prev: T) => U): U;
-    <U extends T>(value: Exclude<U, Function>): U;
-    <U extends T>(value: Exclude<U, Function> | ((prev: T) => U)): U;
-};
-export type Signal<T> = [get: Accessor<T>, set: Setter<T>];
-export type ComputeFunction<Prev, Next extends Prev = Prev> = (v: Prev) => Next;
-export type EffectFunction<Prev, Next extends Prev = Prev> = (v: Next, p?: Prev) => (() => void) | void;
-export type EffectBundle<Prev, Next extends Prev = Prev> = {
-    effect: EffectFunction<Prev, Next>;
-    error: (err: unknown, cleanup: () => void) => void;
-};
-export interface EffectOptions {
-    name?: string;
-    defer?: boolean;
-}
-export interface MemoOptions<T> {
-    name?: string;
-    equals?: false | ((prev: T, next: T) => boolean);
-}
-export type NoInfer<T extends any> = [T][T extends any ? 0 : never];
-/**
- * Creates a simple reactive state with a getter and setter
- * ```typescript
- * const [state: Accessor<T>, setState: Setter<T>] = createSignal<T>(
- *  value: T,
- *  options?: { name?: string, equals?: false | ((prev: T, next: T) => boolean) }
- * )
- * ```
- * @param value initial value of the state; if empty, the state's type will automatically extended with undefined; otherwise you need to extend the type manually if you want setting to undefined not be an error
- * @param options optional object with a name for debugging purposes and equals, a comparator function for the previous and next value to allow fine-grained control over the reactivity
- *
- * @returns ```typescript
- * [state: Accessor<T>, setState: Setter<T>]
- * ```
- * * the Accessor is a function that returns the current value and registers each call to the reactive root
- * * the Setter is a function that allows directly setting or mutating the value:
- * ```typescript
- * const [count, setCount] = createSignal(0);
- * setCount(count => count + 1);
- * ```
- *
- * @description https://docs.solidjs.com/reference/basic-reactivity/create-signal
- */
-export declare function createSignal<T>(): Signal<T | undefined>;
-export declare function createSignal<T>(value: Exclude<T, Function>, options?: SignalOptions<T>): Signal<T>;
-export declare function createSignal<T>(fn: ComputeFunction<T>, initialValue?: T, options?: SignalOptions<T>): Signal<T>;
-/**
- * Creates a readonly derived reactive memoized signal
- * ```typescript
- * export function createMemo<T>(
- *   compute: (v: T) => T,
- *   value?: T,
- *   options?: { name?: string, equals?: false | ((prev: T, next: T) => boolean) }
- * ): () => T;
- * ```
- * @param compute a function that receives its previous or the initial value, if set, and returns a new value used to react on a computation
- * @param value an optional initial value for the computation; if set, fn will never receive undefined as first argument
- * @param options allows to set a name in dev mode for debugging purposes and use a custom comparison function in equals
- *
- * @description https://docs.solidjs.com/reference/basic-reactivity/create-memo
- */
-export declare function createMemo<Next extends Prev, Prev = Next>(compute: ComputeFunction<undefined | NoInfer<Prev>, Next>): Accessor<Next>;
-export declare function createMemo<Next extends Prev, Init = Next, Prev = Next>(compute: ComputeFunction<Init | Prev, Next>, value: Init, options?: MemoOptions<Next>): Accessor<Next>;
-/**
- * Creates a readonly derived async reactive memoized signal
- * ```typescript
- * export function createAsync<T>(
- *   compute: (v: T) => Promise<T> | T,
- *   value?: T,
- *   options?: { name?: string, equals?: false | ((prev: T, next: T) => boolean) }
- * ): () => T;
- * ```
- * @param compute a function that receives its previous or the initial value, if set, and returns a new value used to react on a computation
- * @param value an optional initial value for the computation; if set, fn will never receive undefined as first argument
- * @param options allows to set a name in dev mode for debugging purposes and use a custom comparison function in equals
- *
- * @description https://docs.solidjs.com/reference/basic-reactivity/create-async
- */
-export declare function createAsync<T>(compute: (prev: T | undefined, refreshing: boolean) => Promise<T> | AsyncIterable<T> | T, value?: T, options?: MemoOptions<T>): Accessor<T> & {
-    refresh: () => void;
-};
-/**
- * Creates a reactive effect that runs after the render phase
- * ```typescript
- * export function createEffect<T>(
- *   compute: (prev: T) => T,
- *   effect: (v: T, prev: T) => (() => void) | void,
- *   value?: T,
- *   options?: { name?: string }
- * ): void;
- * ```
- * @param compute a function that receives its previous or the initial value, if set, and returns a new value used to react on a computation
- * @param effect a function that receives the new value and is used to perform side effects, return a cleanup function to run on disposal
- * @param error an optional function that receives an error if thrown during the computation
- * @param value an optional initial value for the computation; if set, fn will never receive undefined as first argument
- * @param options allows to set a name in dev mode for debugging purposes
- *
- * @description https://docs.solidjs.com/reference/basic-reactivity/create-effect
- */
-export declare function createEffect<Next>(compute: ComputeFunction<undefined | NoInfer<Next>, Next>, effect: EffectFunction<NoInfer<Next>, Next> | EffectBundle<NoInfer<Next>, Next>): void;
-export declare function createEffect<Next, Init = Next>(compute: ComputeFunction<Init | Next, Next>, effect: EffectFunction<Next, Next> | EffectBundle<Next, Next>, value: Init, options?: EffectOptions): void;
-/**
- * Creates a reactive computation that runs during the render phase as DOM elements are created and updated but not necessarily connected
- * ```typescript
- * export function createRenderEffect<T>(
- *   compute: (prev: T) => T,
- *   effect: (v: T, prev: T) => (() => void) | void,
- *   value?: T,
- *   options?: { name?: string }
- * ): void;
- * ```
- * @param compute a function that receives its previous or the initial value, if set, and returns a new value used to react on a computation
- * @param effect a function that receives the new value and is used to perform side effects
- * @param value an optional initial value for the computation; if set, fn will never receive undefined as first argument
- * @param options allows to set a name in dev mode for debugging purposes
- *
- * @description https://docs.solidjs.com/reference/secondary-primitives/create-render-effect
- */
-export declare function createRenderEffect<Next>(compute: ComputeFunction<undefined | NoInfer<Next>, Next>, effect: EffectFunction<NoInfer<Next>, Next>): void;
-export declare function createRenderEffect<Next, Init = Next>(compute: ComputeFunction<Init | Next, Next>, effect: EffectFunction<Next, Next>, value: Init, options?: EffectOptions): void;
-/**
- * Creates a new non-tracked reactive context with manual disposal
- *
- * @param fn a function in which the reactive state is scoped
- * @returns the output of `fn`.
- *
- * @description https://docs.solidjs.com/reference/reactive-utilities/create-root
- */
-export declare function createRoot<T>(init: ((dispose: () => void) => T) | (() => T), options?: {
-    id: string;
-}): T;
-/**
- * Runs the given function in the given owner to move ownership of nested primitives and cleanups.
- * This method untracks the current scope.
- *
- * Warning: Usually there are simpler ways of modeling a problem that avoid using this function
- */
-export declare function runWithOwner<T>(owner: Owner | null, run: () => T): T;
-/**
- * Returns a promise of the resolved value of a reactive expression
- * @param fn a reactive expression to resolve
- */
-export declare function resolve<T>(fn: () => T): Promise<T>;
-/**
- * Runs the given function and returns a tuple with the result or an error.
- * If the function throws an error, it will be caught and returned as the first element of the tuple.
- * If the function returns a promise, it will resolve to a tuple with the result or an error.
- *
- * @param fn The function to run.
- * @returns A tuple with either [undefined, result] or [error].
- *
- * @description https://docs.solidjs.com/reference/reactive-utilities/try-catch
- */
-export type TryCatchResult<T, E> = [undefined, T] | [E];
-export declare function tryCatch<T, E = Error>(fn: () => Promise<T>): Promise<TryCatchResult<T, E>>;
-export declare function tryCatch<T, E = Error>(fn: () => T): TryCatchResult<T, E>;
-/**
- * Runs the given function in a transition scope, allowing for batch updates and optimizations.
- * This is useful for grouping multiple state updates together to avoid unnecessary re-renders.
- *
- * @param fn A function that receives a resume function to continue the transition.
- * The resume function can be called with another function to continue the transition.
- *
- * @description https://docs.solidjs.com/reference/advanced-reactivity/transition
- */
-export declare function transition(fn: (resume: (fn: () => any | Promise<any>) => void) => any | Promise<any>): void;
-/**
- * Creates an optimistic signal that can be used to optimistically update a value
- * and then revert it back to the previous value at end of transition.
- *
- * @param initial The initial value of the signal.
- * @param compute An optional function to compute the next value based on the previous value and change.
- * @param options Optional signal options.
- *
- * @returns A tuple containing an accessor for the current value and a setter function to apply changes.
- */
-export declare function createOptimistic<T, U>(initial: T, compute?: (prev: T, change: U) => void, options?: SignalOptions<T>): [Accessor<T>, (v: U) => void];
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/store/index.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/store/index.d.ts
deleted file mode 100644
index faa557495..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/store/index.d.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-export type { Store, StoreSetter, StoreNode, NotWrappable, SolidStore } from "./store.js";
-export type { Merge, Omit } from "./utils.js";
-export { isWrappable, createStore, deep, $TRACK, $PROXY, $TARGET } from "./store.js";
-export { createProjection } from "./projection.js";
-export { reconcile } from "./reconcile.js";
-export { snapshot, merge, omit } from "./utils.js";
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/store/projection.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/store/projection.d.ts
deleted file mode 100644
index 54577cdee..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/store/projection.d.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { type Store } from "./store.js";
-/**
- * Creates a mutable derived value
- *
- * @see {@link https://github.com/solidjs/x-reactivity#createprojection}
- */
-export declare function createProjection<T extends Object>(fn: (draft: T) => void, initialValue?: T): Store<T>;
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/store/reconcile.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/store/reconcile.d.ts
deleted file mode 100644
index 01effdba8..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/store/reconcile.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-export declare function reconcile<T extends U, U>(value: T, key: string | ((item: NonNullable<any>) => any), all?: boolean): (state: U) => void;
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/store/store.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/store/store.d.ts
deleted file mode 100644
index 728a817b9..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/store/store.d.ts
+++ /dev/null
@@ -1,33 +0,0 @@
-import { Computation } from "../core/index.js";
-export type Store<T> = Readonly<T>;
-export type StoreSetter<T> = (fn: (state: T) => void) => void;
-type DataNode = Computation<any>;
-type DataNodes = Record<PropertyKey, DataNode>;
-export declare const $TRACK: unique symbol, $DEEP: unique symbol, $TARGET: unique symbol, $PROXY: unique symbol, $DELETED: unique symbol;
-export declare const STORE_VALUE = "v", STORE_OVERRIDE = "o", STORE_NODE = "n", STORE_HAS = "h", STORE_WRAP = "w", STORE_LOOKUP = "l";
-export type StoreNode = {
-    [$PROXY]: any;
-    [STORE_VALUE]: Record<PropertyKey, any>;
-    [STORE_OVERRIDE]?: Record<PropertyKey, any>;
-    [STORE_NODE]?: DataNodes;
-    [STORE_HAS]?: DataNodes;
-    [STORE_WRAP]?: (value: any, target?: StoreNode) => any;
-    [STORE_LOOKUP]?: WeakMap<any, any>;
-};
-export declare namespace SolidStore {
-    interface Unwrappable {
-    }
-}
-export type NotWrappable = string | number | bigint | symbol | boolean | Function | null | undefined | SolidStore.Unwrappable[keyof SolidStore.Unwrappable];
-export declare function createStoreProxy<T extends object>(value: T, traps?: ProxyHandler<StoreNode>, extend?: Record<PropertyKey, any>): any;
-export declare const storeLookup: WeakMap<object, any>;
-export declare function wrap<T extends Record<PropertyKey, any>>(value: T, target?: StoreNode): T;
-export declare function isWrappable<T>(obj: T | NotWrappable): obj is T;
-export declare function getKeys(source: Record<PropertyKey, any>, override: Record<PropertyKey, any> | undefined, enumerable?: boolean): PropertyKey[];
-export declare function getPropertyDescriptor(source: Record<PropertyKey, any>, override: Record<PropertyKey, any> | undefined, property: PropertyKey): PropertyDescriptor | undefined;
-export declare const storeTraps: ProxyHandler<StoreNode>;
-export declare function storeSetter<T extends object>(store: Store<T>, fn: (draft: T) => void): void;
-export declare function createStore<T extends object = {}>(store: T | Store<T>): [get: Store<T>, set: StoreSetter<T>];
-export declare function createStore<T extends object = {}>(fn: (store: T) => void, store: T | Store<T>): [get: Store<T>, set: StoreSetter<T>];
-export declare function deep<T extends object>(store: Store<T>): Store<any>;
-export {};
diff --git a/websites/packages/solidjs-signals/0.4.1/dist/types/store/utils.d.ts b/websites/packages/solidjs-signals/0.4.1/dist/types/store/utils.d.ts
deleted file mode 100644
index 42e497e15..000000000
--- a/websites/packages/solidjs-signals/0.4.1/dist/types/store/utils.d.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-/**
- * Returns a non reactive copy of the store object.
- * It will attempt to preserver the original reference unless the value has been modified.
- * @param item store proxy object
- */
-export declare function snapshot<T>(item: T): T;
-export declare function snapshot<T>(item: T, map?: Map<unknown, unknown>, lookup?: WeakMap<any, any>): T;
-type DistributeOverride<T, F> = T extends undefined ? F : T;
-type Override<T, U> = T extends any ? U extends any ? {
-    [K in keyof T]: K extends keyof U ? DistributeOverride<U[K], T[K]> : T[K];
-} & {
-    [K in keyof U]: K extends keyof T ? DistributeOverride<U[K], T[K]> : U[K];
-} : T & U : T & U;
-type OverrideSpread<T, U> = T extends any ? {
-    [K in keyof ({
-        [K in keyof T]: any;
-    } & {
-        [K in keyof U]?: any;
-    } & {
-        [K in U extends any ? keyof U : keyof U]?: any;
-    })]: K extends keyof T ? Exclude<U extends any ? U[K & keyof U] : never, undefined> | T[K] : U extends any ? U[K & keyof U] : never;
-} : T & U;
-type Simplify<T> = T extends any ? {
-    [K in keyof T]: T[K];
-} : T;
-type _Merge<T extends unknown[], Curr = {}> = T extends [
-    infer Next | (() => infer Next),
-    ...infer Rest
-] ? _Merge<Rest, Override<Curr, Next>> : T extends [...infer Rest, infer Next | (() => infer Next)] ? Override<_Merge<Rest, Curr>, Next> : T extends [] ? Curr : T extends (infer I | (() => infer I))[] ? OverrideSpread<Curr, I> : Curr;
-export type Merge<T extends unknown[]> = Simplify<_Merge<T>>;
-export declare function merge<T extends unknown[]>(...sources: T): Merge<T>;
-export type Omit<T, K extends readonly (keyof T)[]> = {
-    [P in keyof T as Exclude<P, K[number]>]: T[P];
-};
-export declare function omit<T extends Record<any, any>, K extends readonly (keyof T)[]>(props: T, ...keys: K): Omit<T, K>;
-export {};
diff --git a/websites/packages/solidjs-signals/wrapper.js b/websites/packages/solidjs-signals/wrapper.js
index 8d28f0b0e..10b0380f1 100644
--- a/websites/packages/solidjs-signals/wrapper.js
+++ b/websites/packages/solidjs-signals/wrapper.js
@@ -16,8 +16,6 @@
  * @typedef {Accessor<T> & { set: Setter<T>; reset: VoidFunction }} Signal
  */
 
-console.log("bob");
-
 import {
   createSignal,
   createEffect,