react-msaview 6.0.0 → 6.1.1

package/dist/components/ConservationTrack.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import type { MsaViewModel } from '../model.ts';
-import type { BasicTrack } from '../types.ts';
-declare const ConservationTrack: ({ model, track, }: {
-    model: MsaViewModel;
-    track: BasicTrack;
-}) => React.JSX.Element;
-export default ConservationTrack;

package/dist/components/ConservationTrack.js

@@ -1,49 +0,0 @@
-import React from 'react';
-import { observer } from 'mobx-react';
-import { useCanvasAutorun } from '../useCanvasAutorun.js';
-import { ConservationTrackResizeHandle } from './ResizeHandles.js';
-import { barTrackValues, drawConservationBars, } from './tracks/renderTracksSvg.js';
-const ConservationBlock = observer(function ({ model, track, offsetX, trackHeight, }) {
-    const { blockSize, scrollX, highResScaleFactor } = model;
-    const ref = useCanvasAutorun({
-        draw: ctx => {
-            const { colWidth } = model;
-            ctx.resetTransform();
-            ctx.scale(highResScaleFactor, highResScaleFactor);
-            ctx.clearRect(0, 0, blockSize, trackHeight);
-            ctx.translate(-offsetX, 0);
-            drawConservationBars({
-                ctx,
-                values: barTrackValues(model, track.model.id),
-                color: track.model.barColor ?? 'gray',
-                colWidth,
-                trackHeight,
-                offsetX,
-                blockSize,
-            });
-        },
-        width: blockSize * highResScaleFactor,
-        height: trackHeight * highResScaleFactor,
-        deps: [model, track, offsetX, trackHeight],
-    });
-    return (React.createElement("canvas", { ref: ref, height: trackHeight * highResScaleFactor, width: blockSize * highResScaleFactor, style: {
-            position: 'absolute',
-            left: scrollX + offsetX,
-            width: blockSize,
-            height: trackHeight,
-        } }));
-});
-const ConservationTrack = observer(function ({ model, track, }) {
-    const { blocksX, msaAreaWidth } = model;
-    const trackHeight = track.model.height;
-    return (React.createElement("div", { style: {
-            position: 'relative',
-            height: trackHeight,
-            width: msaAreaWidth,
-            overflow: 'hidden',
-        } },
-        blocksX.map(bx => (React.createElement(ConservationBlock, { key: bx, model: model, track: track, offsetX: bx, trackHeight: trackHeight }))),
-        React.createElement(ConservationTrackResizeHandle, { model: model })));
-});
-export default ConservationTrack;
-//# sourceMappingURL=ConservationTrack.js.map

package/dist/components/ConservationTrack.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ConservationTrack.js","sourceRoot":"","sources":["../../src/components/ConservationTrack.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AACzD,OAAO,EAAE,6BAA6B,EAAE,MAAM,oBAAqB,CAAA;AACnE,OAAO,EACL,cAAc,EACd,oBAAoB,GACrB,MAAM,6BAA6B,CAAA;AAKpC,MAAM,iBAAiB,GAAG,QAAQ,CAAC,UAAU,EAC3C,KAAK,EACL,KAAK,EACL,OAAO,EACP,WAAW,GAMZ;IACC,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,kBAAkB,EAAE,GAAG,KAAK,CAAA;IAExD,MAAM,GAAG,GAAG,gBAAgB,CAAC;QAC3B,IAAI,EAAE,GAAG,CAAC,EAAE;YACV,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAA;YAC1B,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,GAAG,CAAC,KAAK,CAAC,kBAAkB,EAAE,kBAAkB,CAAC,CAAA;YACjD,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,SAAS,EAAE,WAAW,CAAC,CAAA;YAC3C,GAAG,CAAC,SAAS,CAAC,CAAC,OAAO,EAAE,CAAC,CAAC,CAAA;YAE1B,oBAAoB,CAAC;gBACnB,GAAG;gBACH,MAAM,EAAE,cAAc,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,EAAE,CAAC;gBAC7C,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,QAAQ,IAAI,MAAM;gBACrC,QAAQ;gBACR,WAAW;gBACX,OAAO;gBACP,SAAS;aACV,CAAC,CAAA;QACJ,CAAC;QACD,KAAK,EAAE,SAAS,GAAG,kBAAkB;QACrC,MAAM,EAAE,WAAW,GAAG,kBAAkB;QACxC,IAAI,EAAE,CAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,WAAW,CAAC;KAC3C,CAAC,CAAA;IAEF,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,WAAW,GAAG,kBAAkB,EACxC,KAAK,EAAE,SAAS,GAAG,kBAAkB,EACrC,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,IAAI,EAAE,OAAO,GAAG,OAAO;YACvB,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,WAAW;SACpB,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,iBAAiB,GAAG,QAAQ,CAAC,UAAU,EAC3C,KAAK,EACL,KAAK,GAIN;IACC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,GAAG,KAAK,CAAA;IACvC,MAAM,WAAW,GAAG,KAAK,CAAC,KAAK,CAAC,MAAM,CAAA;IAEtC,OAAO,CACL,6BACE,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,MAAM,EAAE,WAAW;YACnB,KAAK,EAAE,YAAY;YACnB,QAAQ,EAAE,QAAQ;SACnB;QAEA,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,CACjB,oBAAC,iBAAiB,IAChB,GAAG,EAAE,EAAE,EACP,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,EAAE,EACX,WAAW,EAAE,WAAW,GACxB,CACH,CAAC;QACF,oBAAC,6BAA6B,IAAC,KAAK,EAAE,KAAK,GAAI,CAC3C,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,iBAAiB,CAAA"}

package/dist/components/ScrollbarThumb.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-export declare const scrollbarThumbFill = "rgba(66,119,127,0.3)";
-/**
- * The draggable thumb shared by the horizontal Minimap and the
- * VerticalScrollbar. `getStart` is read at mousedown and handed back to
- * `onDrag` alongside the pixel delta since, so a caller only supplies the
- * scroll offset it drives and where the thumb sits.
- */
-export default function ScrollbarThumb({ axis, getStart, onDrag, style, }: {
-    axis: 'x' | 'y';
-    getStart: () => number;
-    onDrag: (delta: number, startValue: number) => void;
-    style: React.CSSProperties;
-}): React.JSX.Element;

package/dist/components/ScrollbarThumb.js

@@ -1,28 +0,0 @@
-import React, { useState } from 'react';
-import { useDragScroll } from '../useDragScroll.js';
-export const scrollbarThumbFill = 'rgba(66,119,127,0.3)';
-const scrollbarThumbFillHovered = 'rgba(66,119,127,0.6)';
-/**
- * The draggable thumb shared by the horizontal Minimap and the
- * VerticalScrollbar. `getStart` is read at mousedown and handed back to
- * `onDrag` alongside the pixel delta since, so a caller only supplies the
- * scroll offset it drives and where the thumb sits.
- */
-export default function ScrollbarThumb({ axis, getStart, onDrag, style, }) {
-    const [hovered, setHovered] = useState(false);
-    const { startDrag } = useDragScroll(axis, onDrag);
-    return (React.createElement("div", { onMouseOver: () => {
-            setHovered(true);
-        }, onMouseOut: () => {
-            setHovered(false);
-        }, onMouseDown: event => {
-            startDrag(event, getStart());
-        }, style: {
-            position: 'absolute',
-            zIndex: 100,
-            cursor: 'pointer',
-            background: hovered ? scrollbarThumbFillHovered : scrollbarThumbFill,
-            ...style,
-        } }));
-}
-//# sourceMappingURL=ScrollbarThumb.js.map

package/dist/components/ScrollbarThumb.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ScrollbarThumb.js","sourceRoot":"","sources":["../../src/components/ScrollbarThumb.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AAEnD,MAAM,CAAC,MAAM,kBAAkB,GAAG,sBAAsB,CAAA;AACxD,MAAM,yBAAyB,GAAG,sBAAsB,CAAA;AAExD;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,KAAK,GAMN;IACC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC7C,MAAM,EAAE,SAAS,EAAE,GAAG,aAAa,CAAC,IAAI,EAAE,MAAM,CAAC,CAAA;IAEjD,OAAO,CACL,6BACE,WAAW,EAAE,GAAG,EAAE;YAChB,UAAU,CAAC,IAAI,CAAC,CAAA;QAClB,CAAC,EACD,UAAU,EAAE,GAAG,EAAE;YACf,UAAU,CAAC,KAAK,CAAC,CAAA;QACnB,CAAC,EACD,WAAW,EAAE,KAAK,CAAC,EAAE;YACnB,SAAS,CAAC,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAA;QAC9B,CAAC,EACD,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,MAAM,EAAE,GAAG;YACX,MAAM,EAAE,SAAS;YACjB,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC,yBAAyB,CAAC,CAAC,CAAC,kBAAkB;YACpE,GAAG,KAAK;SACT,GACD,CACH,CAAA;AACH,CAAC"}

package/dist/components/TextTrack.d.ts

@@ -1,8 +0,0 @@
-import React from 'react';
-import type { MsaViewModel } from '../model.ts';
-import type { BasicTrack } from '../types.ts';
-declare const AnnotationTrack: ({ track, model, }: {
-    track: BasicTrack;
-    model: MsaViewModel;
-}) => React.JSX.Element | null;
-export default AnnotationTrack;

package/dist/components/TextTrack.js

@@ -1,58 +0,0 @@
-import React from 'react';
-import { observer } from 'mobx-react';
-import { setFontSize } from '../setFontSize.js';
-import { useCanvasAutorun } from '../useCanvasAutorun.js';
-import { useColorContrast } from '../useColorContrast.js';
-import { drawTextTrackContent } from './tracks/renderTracksSvg.js';
-const AnnotationBlock = observer(function ({ track, model, offsetX, }) {
-    const { blockSize, scrollX, colorScheme: modelColorScheme, rowHeight, highResScaleFactor, } = model;
-    const { model: { customColorScheme, data }, } = track;
-    const colorScheme = customColorScheme ?? modelColorScheme;
-    const { theme, contrastScheme } = useColorContrast(colorScheme);
-    const ref = useCanvasAutorun({
-        draw: ctx => {
-            const { bgColor, colWidth, fontSize } = model;
-            ctx.resetTransform();
-            ctx.scale(highResScaleFactor, highResScaleFactor);
-            ctx.clearRect(0, 0, blockSize, rowHeight);
-            ctx.translate(-offsetX, 0);
-            ctx.textAlign = 'center';
-            setFontSize(ctx, fontSize);
-            drawTextTrackContent({
-                ctx,
-                data,
-                colorScheme,
-                contrastScheme,
-                bgColor,
-                textColor: theme.palette.text.primary,
-                colWidth,
-                rowHeight,
-                offsetX,
-                blockSize,
-            });
-        },
-        width: blockSize * highResScaleFactor,
-        height: rowHeight * highResScaleFactor,
-        deps: [model, offsetX, theme, contrastScheme, colorScheme, data],
-    });
-    return (React.createElement("canvas", { ref: ref, height: rowHeight * highResScaleFactor, width: blockSize * highResScaleFactor, style: {
-            position: 'absolute',
-            left: scrollX + offsetX,
-            width: blockSize,
-            height: rowHeight,
-        } }));
-});
-const AnnotationTrack = observer(function ({ track, model, }) {
-    const { blocksX, msaAreaWidth, rowHeight } = model;
-    if (!track.model.data) {
-        return null;
-    }
-    return (React.createElement("div", { style: {
-            position: 'relative',
-            height: rowHeight,
-            width: msaAreaWidth,
-            overflow: 'hidden',
-        } }, blocksX.map(bx => (React.createElement(AnnotationBlock, { key: bx, track: track, model: model, offsetX: bx })))));
-});
-export default AnnotationTrack;
-//# sourceMappingURL=TextTrack.js.map

package/dist/components/TextTrack.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextTrack.js","sourceRoot":"","sources":["../../src/components/TextTrack.tsx"],"names":[],"mappings":"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"}

package/dist/components/tracks/renderTracksSvg.js

@@ -1,126 +0,0 @@
-import { setFontSize } from '../../setFontSize.js';
-import { visibleColRange } from '../msa/visibleColRange.js';
-export function drawConservationBars({ ctx, values, color, colWidth, trackHeight, offsetX, blockSize, }) {
-    const { xStart, xEnd } = visibleColRange({
-        offsetX,
-        blockWidth: blockSize,
-        colWidth,
-    });
-    ctx.fillStyle = color;
-    for (let i = xStart; i < xEnd && i < values.length; i++) {
-        const value = values[i];
-        const barHeight = value * trackHeight;
-        const x = i * colWidth;
-        ctx.fillRect(x, trackHeight - barHeight, colWidth, barHeight);
-    }
-}
-// the bar-track values live on model getters (kept off the plain track object so
-// the live canvas autorun stays reactive); select the right one by track id
-export function barTrackValues(model, trackId) {
-    return trackId === 'property-conservation'
-        ? model.propertyConservation
-        : model.conservation;
-}
-export function drawTextTrackContent({ ctx, data, colorScheme, contrastScheme, bgColor, textColor, colWidth, rowHeight, offsetX, blockSize, }) {
-    const { xStart, xEnd } = visibleColRange({
-        offsetX,
-        blockWidth: blockSize,
-        colWidth,
-    });
-    const str = data?.slice(xStart, xEnd);
-    const drawLetters = rowHeight >= 10 && colWidth >= rowHeight / 2;
-    for (let i = 0; str && i < str.length; i++) {
-        const letter = str[i];
-        const upper = letter.toUpperCase();
-        const color = colorScheme[upper];
-        const x = (xStart + i) * colWidth;
-        const filled = bgColor && !!color;
-        if (filled) {
-            ctx.fillStyle = color;
-            ctx.fillRect(x, 0, colWidth, rowHeight);
-        }
-        if (drawLetters) {
-            // a letter on a colored tile needs the tile's contrast color; otherwise it
-            // sits on the plain background and takes the theme's text color
-            ctx.fillStyle = filled ? (contrastScheme[upper] ?? 'black') : textColor;
-            ctx.fillText(letter, x + colWidth / 2, rowHeight / 2 + 1);
-        }
-    }
-}
-export function renderConservationTrack({ model, ctx, track, offsetX, offsetY, trackHeight, blockSizeXOverride, highResScaleFactorOverride, }) {
-    const { blockSize, colWidth, highResScaleFactor } = model;
-    const bx = blockSizeXOverride ?? blockSize;
-    const k = highResScaleFactorOverride ?? highResScaleFactor;
-    ctx.resetTransform();
-    ctx.scale(k, k);
-    ctx.translate(-offsetX, offsetY);
-    drawConservationBars({
-        ctx,
-        values: barTrackValues(model, track.model.id),
-        color: track.model.barColor ?? 'gray',
-        colWidth,
-        trackHeight,
-        offsetX,
-        blockSize: bx,
-    });
-    ctx.resetTransform();
-}
-export function renderTextTrack({ model, ctx, track, offsetX, offsetY, contrastScheme, theme, blockSizeXOverride, highResScaleFactorOverride, }) {
-    const { blockSize, bgColor, colorScheme: modelColorScheme, colWidth, fontSize, rowHeight, highResScaleFactor, } = model;
-    const { customColorScheme, data } = track.model;
-    const colorScheme = customColorScheme ?? modelColorScheme;
-    const bx = blockSizeXOverride ?? blockSize;
-    const k = highResScaleFactorOverride ?? highResScaleFactor;
-    ctx.resetTransform();
-    ctx.scale(k, k);
-    ctx.translate(-offsetX, offsetY);
-    ctx.textAlign = 'center';
-    setFontSize(ctx, fontSize);
-    drawTextTrackContent({
-        ctx,
-        data,
-        colorScheme,
-        contrastScheme,
-        bgColor,
-        textColor: theme.palette.text.primary,
-        colWidth,
-        rowHeight,
-        offsetX,
-        blockSize: bx,
-    });
-    ctx.resetTransform();
-}
-export function renderAllTracks({ model, ctx, offsetX, contrastScheme, theme, blockSizeXOverride, highResScaleFactorOverride, }) {
-    const { turnedOnTracks } = model;
-    let currentY = 0;
-    for (const track of turnedOnTracks) {
-        const trackHeight = track.model.height;
-        if (track.model.barColor !== undefined) {
-            renderConservationTrack({
-                model,
-                ctx,
-                track,
-                offsetX,
-                offsetY: currentY,
-                trackHeight,
-                blockSizeXOverride,
-                highResScaleFactorOverride,
-            });
-        }
-        else {
-            renderTextTrack({
-                model,
-                ctx,
-                track,
-                offsetX,
-                offsetY: currentY,
-                contrastScheme,
-                theme,
-                blockSizeXOverride,
-                highResScaleFactorOverride,
-            });
-        }
-        currentY += trackHeight;
-    }
-}
-//# sourceMappingURL=renderTracksSvg.js.map

package/dist/components/tracks/renderTracksSvg.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"renderTracksSvg.js","sourceRoot":"","sources":["../../../src/components/tracks/renderTracksSvg.ts"],"names":[],"mappings":"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"}

package/src/components/ConservationTrack.tsx

@@ -1,99 +0,0 @@
-import React from 'react'
-
-import { observer } from 'mobx-react'
-
-import { useCanvasAutorun } from '../useCanvasAutorun.ts'
-import { ConservationTrackResizeHandle } from './ResizeHandles.tsx'
-import {
-  barTrackValues,
-  drawConservationBars,
-} from './tracks/renderTracksSvg.ts'
-
-import type { MsaViewModel } from '../model.ts'
-import type { BasicTrack } from '../types.ts'
-
-const ConservationBlock = observer(function ({
-  model,
-  track,
-  offsetX,
-  trackHeight,
-}: {
-  model: MsaViewModel
-  track: BasicTrack
-  offsetX: number
-  trackHeight: number
-}) {
-  const { blockSize, scrollX, highResScaleFactor } = model
-
-  const ref = useCanvasAutorun({
-    draw: ctx => {
-      const { colWidth } = model
-      ctx.resetTransform()
-      ctx.scale(highResScaleFactor, highResScaleFactor)
-      ctx.clearRect(0, 0, blockSize, trackHeight)
-      ctx.translate(-offsetX, 0)
-
-      drawConservationBars({
-        ctx,
-        values: barTrackValues(model, track.model.id),
-        color: track.model.barColor ?? 'gray',
-        colWidth,
-        trackHeight,
-        offsetX,
-        blockSize,
-      })
-    },
-    width: blockSize * highResScaleFactor,
-    height: trackHeight * highResScaleFactor,
-    deps: [model, track, offsetX, trackHeight],
-  })
-
-  return (
-    <canvas
-      ref={ref}
-      height={trackHeight * highResScaleFactor}
-      width={blockSize * highResScaleFactor}
-      style={{
-        position: 'absolute',
-        left: scrollX + offsetX,
-        width: blockSize,
-        height: trackHeight,
-      }}
-    />
-  )
-})
-
-const ConservationTrack = observer(function ({
-  model,
-  track,
-}: {
-  model: MsaViewModel
-  track: BasicTrack
-}) {
-  const { blocksX, msaAreaWidth } = model
-  const trackHeight = track.model.height
-
-  return (
-    <div
-      style={{
-        position: 'relative',
-        height: trackHeight,
-        width: msaAreaWidth,
-        overflow: 'hidden',
-      }}
-    >
-      {blocksX.map(bx => (
-        <ConservationBlock
-          key={bx}
-          model={model}
-          track={track}
-          offsetX={bx}
-          trackHeight={trackHeight}
-        />
-      ))}
-      <ConservationTrackResizeHandle model={model} />
-    </div>
-  )
-})
-
-export default ConservationTrack

package/src/components/ScrollbarThumb.tsx

@@ -1,48 +0,0 @@
-import React, { useState } from 'react'
-
-import { useDragScroll } from '../useDragScroll.ts'
-
-export const scrollbarThumbFill = 'rgba(66,119,127,0.3)'
-const scrollbarThumbFillHovered = 'rgba(66,119,127,0.6)'
-
-/**
- * The draggable thumb shared by the horizontal Minimap and the
- * VerticalScrollbar. `getStart` is read at mousedown and handed back to
- * `onDrag` alongside the pixel delta since, so a caller only supplies the
- * scroll offset it drives and where the thumb sits.
- */
-export default function ScrollbarThumb({
-  axis,
-  getStart,
-  onDrag,
-  style,
-}: {
-  axis: 'x' | 'y'
-  getStart: () => number
-  onDrag: (delta: number, startValue: number) => void
-  style: React.CSSProperties
-}) {
-  const [hovered, setHovered] = useState(false)
-  const { startDrag } = useDragScroll(axis, onDrag)
-
-  return (
-    <div
-      onMouseOver={() => {
-        setHovered(true)
-      }}
-      onMouseOut={() => {
-        setHovered(false)
-      }}
-      onMouseDown={event => {
-        startDrag(event, getStart())
-      }}
-      style={{
-        position: 'absolute',
-        zIndex: 100,
-        cursor: 'pointer',
-        background: hovered ? scrollbarThumbFillHovered : scrollbarThumbFill,
-        ...style,
-      }}
-    />
-  )
-}

package/src/components/TextTrack.tsx

@@ -1,103 +0,0 @@
-import React from 'react'
-
-import { observer } from 'mobx-react'
-
-import { setFontSize } from '../setFontSize.ts'
-import { useCanvasAutorun } from '../useCanvasAutorun.ts'
-import { useColorContrast } from '../useColorContrast.ts'
-import { drawTextTrackContent } from './tracks/renderTracksSvg.ts'
-
-import type { MsaViewModel } from '../model.ts'
-import type { BasicTrack } from '../types.ts'
-
-const AnnotationBlock = observer(function ({
-  track,
-  model,
-  offsetX,
-}: {
-  track: BasicTrack
-  model: MsaViewModel
-  offsetX: number
-}) {
-  const {
-    blockSize,
-    scrollX,
-    colorScheme: modelColorScheme,
-    rowHeight,
-    highResScaleFactor,
-  } = model
-  const {
-    model: { customColorScheme, data },
-  } = track
-
-  const colorScheme = customColorScheme ?? modelColorScheme
-  const { theme, contrastScheme } = useColorContrast(colorScheme)
-  const ref = useCanvasAutorun({
-    draw: ctx => {
-      const { bgColor, colWidth, fontSize } = model
-      ctx.resetTransform()
-      ctx.scale(highResScaleFactor, highResScaleFactor)
-      ctx.clearRect(0, 0, blockSize, rowHeight)
-      ctx.translate(-offsetX, 0)
-      ctx.textAlign = 'center'
-      setFontSize(ctx, fontSize)
-
-      drawTextTrackContent({
-        ctx,
-        data,
-        colorScheme,
-        contrastScheme,
-        bgColor,
-        textColor: theme.palette.text.primary,
-        colWidth,
-        rowHeight,
-        offsetX,
-        blockSize,
-      })
-    },
-    width: blockSize * highResScaleFactor,
-    height: rowHeight * highResScaleFactor,
-    deps: [model, offsetX, theme, contrastScheme, colorScheme, data],
-  })
-  return (
-    <canvas
-      ref={ref}
-      height={rowHeight * highResScaleFactor}
-      width={blockSize * highResScaleFactor}
-      style={{
-        position: 'absolute',
-        left: scrollX + offsetX,
-        width: blockSize,
-        height: rowHeight,
-      }}
-    />
-  )
-})
-const AnnotationTrack = observer(function ({
-  track,
-  model,
-}: {
-  track: BasicTrack
-  model: MsaViewModel
-}) {
-  const { blocksX, msaAreaWidth, rowHeight } = model
-  if (!track.model.data) {
-    return null
-  }
-  return (
-    <div
-      style={{
-        position: 'relative',
-        height: rowHeight,
-        width: msaAreaWidth,
-        overflow: 'hidden',
-      }}
-    >
-      {blocksX.map(bx => (
-        <AnnotationBlock key={bx} track={track} model={model} offsetX={bx} />
-      ))}
-    </div>
-  )
-})
-
-export default AnnotationTrack