@jbrowse/plugin-linear-genome-view 3.7.0 → 4.0.1

package/esm/BaseLinearDisplay/models/calculateLabelPositions.d.ts

@@ -0,0 +1,24 @@
+import type { LinearGenomeViewModel } from '../../LinearGenomeView/index.ts';
+import type { BaseLinearDisplayModel } from '../model.ts';
+import type { Assembly } from '@jbrowse/core/assemblyManager/assembly';
+export interface RenderProps {
+    rendererType: any;
+    renderArgs: Record<string, any>;
+    renderProps: Record<string, any>;
+    displayError: unknown;
+    rpcManager: {
+        call: (...args: unknown[]) => void;
+    };
+    cannotBeRenderedReason: string;
+}
+export interface LabelData {
+    key: string;
+    label: string;
+    description: string;
+    leftPos: number;
+    topPos: number;
+}
+export interface ErrorProps {
+    displayError: string;
+}
+export declare function calculateLabelPositions(model: BaseLinearDisplayModel, view: LinearGenomeViewModel, assembly: Assembly | undefined, offsetPx: number): LabelData[];

package/esm/BaseLinearDisplay/models/calculateLabelPositions.js

@@ -0,0 +1,60 @@
+import { clamp, measureText } from '@jbrowse/core/util';
+export function calculateLabelPositions(model, view, assembly, offsetPx) {
+    if (!assembly) {
+        return [];
+    }
+    const fontSize = 11;
+    const result = [];
+    for (const [key, val] of model.layoutFeatures.entries()) {
+        if (!val?.[4]) {
+            continue;
+        }
+        const [left, , right, bottom, feature] = val;
+        const { refName, description, label, totalLayoutWidth } = feature;
+        if (!label) {
+            continue;
+        }
+        const r0 = assembly.getCanonicalRefName2(refName);
+        const px1 = view.bpToPx({
+            refName: r0,
+            coord: left,
+        })?.offsetPx;
+        const px2 = view.bpToPx({
+            refName: r0,
+            coord: right,
+        })?.offsetPx;
+        if (px1 === undefined) {
+            continue;
+        }
+        const leftPx = px2 !== undefined ? Math.min(px1, px2) : px1;
+        const rightPx = px2 !== undefined ? Math.max(px1, px2) : px1;
+        const labelWidth = getCachedMeasureText(label, fontSize);
+        const effectiveRightPx = totalLayoutWidth !== undefined ? leftPx + totalLayoutWidth : rightPx;
+        const leftPos = clamp(0, leftPx - offsetPx, effectiveRightPx - offsetPx - labelWidth);
+        const topPos = bottom - 14 * (+!!description + +!!label);
+        result.push({
+            key,
+            label,
+            description: description || '',
+            leftPos,
+            topPos,
+        });
+    }
+    return result;
+}
+const textMeasureCache = new Map();
+function getCachedMeasureText(text, fontSize) {
+    const key = `${text}:${fontSize}`;
+    let width = textMeasureCache.get(key);
+    if (width === undefined) {
+        width = measureText(text, fontSize);
+        if (textMeasureCache.size > 500) {
+            const firstKey = textMeasureCache.keys().next().value;
+            if (firstKey) {
+                textMeasureCache.delete(firstKey);
+            }
+        }
+        textMeasureCache.set(key, width);
+    }
+    return width;
+}

package/esm/BaseLinearDisplay/models/configSchema.d.ts

@@ -1,4 +1,4 @@
-declare const baseLinearDisplayConfigSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+declare const baseLinearDisplayConfigSchema: import("node_modules/@jbrowse/core/src/configuration/configurationSchema").ConfigurationSchemaType<{
     maxFeatureScreenDensity: {
         type: string;
         description: string;
@@ -25,5 +25,5 @@ declare const baseLinearDisplayConfigSchema: import("@jbrowse/core/configuration
         description: string;
         defaultValue: never[];
     };
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
+}, import("node_modules/@jbrowse/core/src/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>;
 export default baseLinearDisplayConfigSchema;

package/esm/BaseLinearDisplay/models/configSchema.js

@@ -8,7 +8,7 @@ const baseLinearDisplayConfigSchema = ConfigurationSchema('BaseLinearDisplay', {
     },
     fetchSizeLimit: {
         type: 'number',
-        defaultValue: 1000000,
+        defaultValue: 1_000_000,
         description: "maximum data to attempt to download for a given track, used if adapter doesn't specify one",
     },
     height: {
@@ -19,7 +19,7 @@ const baseLinearDisplayConfigSchema = ConfigurationSchema('BaseLinearDisplay', {
     mouseover: {
         type: 'string',
         description: 'text to display when the cursor hovers over a feature',
-        defaultValue: `jexl:join('<br/>',get(feature,'_mouseOver')||get(feature,'name')||get(feature,'id'),mouseoverExtraInformation||'')`,
+        defaultValue: `jexl:mouseoverExtraInformation||get(feature,'_mouseOver')||get(feature,'name')||get(feature,'id')`,
         contextVariable: ['feature', 'mouseoverExtraInformation'],
     },
     jexlFilters: {

package/esm/BaseLinearDisplay/models/renderSvg.d.ts

@@ -1,7 +1,3 @@
-import type { ExportSvgOptions } from '../../LinearGenomeView/types';
-import type { BaseLinearDisplayModel } from '../model';
-import type { ThemeOptions } from '@mui/material';
-export declare function renderBaseLinearDisplaySvg(self: BaseLinearDisplayModel, opts: ExportSvgOptions & {
-    overrideHeight: number;
-    theme?: ThemeOptions;
-}): Promise<import("react/jsx-runtime").JSX.Element>;
+import type { BaseLinearDisplayModel } from '../model.ts';
+import type { ExportSvgDisplayOptions } from '../types.ts';
+export declare function renderBaseLinearDisplaySvg(self: BaseLinearDisplayModel, opts: ExportSvgDisplayOptions): Promise<import("react/jsx-runtime").JSX.Element>;

package/esm/BaseLinearDisplay/models/renderSvg.js

@@ -1,13 +1,18 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment } from 'react';
-import { ReactRendering, getContainingView, getViewParams, } from '@jbrowse/core/util';
-import BlockState, { renderBlockData } from './serverSideRenderedBlock';
-import { getId } from './util';
+import { ReactRendering, getContainingView, getSession, } from '@jbrowse/core/util';
+import { calculateLabelPositions } from "./calculateLabelPositions.js";
+import BlockState, { renderBlockData } from "./serverSideRenderedBlock.js";
+import { getId } from "./util.js";
+import { ErrorBox } from "../../LinearGenomeView/SVGErrorBox.js";
 export async function renderBaseLinearDisplaySvg(self, opts) {
     const { height, id } = self;
     const { overrideHeight } = opts;
     const view = getContainingView(self);
     const { offsetPx: viewOffsetPx, roundedDynamicBlocks, width } = view;
+    if (self.error) {
+        return _jsx(ErrorBox, { error: self.error, width: width, height: height });
+    }
     const renderings = await Promise.all(roundedDynamicBlocks.map(async (block) => {
         const blockState = BlockState.create({
             key: block.key,
@@ -23,22 +28,28 @@ export async function renderBaseLinearDisplaySvg(self, opts) {
                 },
             ];
         }
-        const { rpcManager, renderArgs, renderProps, rendererType } = renderBlockData(blockState, self);
+        const { rpcManager, renderArgs, renderProps, renderingProps, rendererType, } = renderBlockData(blockState, self);
         return [
             block,
             await rendererType.renderInClient(rpcManager, {
                 ...renderArgs,
                 ...renderProps,
-                viewParams: getViewParams(self, true),
+                renderingProps,
                 exportSVG: opts,
                 theme: opts.theme || renderProps.theme,
             }),
         ];
     }));
-    return (_jsx(_Fragment, { children: renderings.map(([block, rendering], index) => {
-            const { offsetPx, widthPx } = block;
-            const offset = offsetPx - viewOffsetPx;
-            const clipid = getId(id, index);
-            return (_jsxs(Fragment, { children: [_jsx("defs", { children: _jsx("clipPath", { id: clipid, children: _jsx("rect", { x: 0, y: 0, width: widthPx, height: overrideHeight || height }) }) }), _jsx("g", { transform: `translate(${offset} 0)`, children: _jsx("g", { clipPath: `url(#${clipid})`, children: _jsx(ReactRendering, { rendering: rendering }) }) })] }, `frag-${index}`));
-        }) }));
+    const { assemblyManager } = getSession(self);
+    const { offsetPx } = view;
+    const assemblyName = view.assemblyNames[0];
+    const assembly = assemblyName ? assemblyManager.get(assemblyName) : undefined;
+    const labelData = calculateLabelPositions(self, view, assembly, offsetPx);
+    const labelsClipId = getId(id, 'labels');
+    return (_jsxs(_Fragment, { children: [renderings.map(([block, rendering], index) => {
+                const { offsetPx, widthPx } = block;
+                const offset = offsetPx - viewOffsetPx;
+                const clipid = getId(id, index);
+                return (_jsxs(Fragment, { children: [_jsx("defs", { children: _jsx("clipPath", { id: clipid, children: _jsx("rect", { x: 0, y: 0, width: widthPx, height: overrideHeight || height }) }) }), _jsx("g", { transform: `translate(${offset} 0)`, children: _jsx("g", { clipPath: `url(#${clipid})`, children: _jsx(ReactRendering, { rendering: rendering }) }) })] }, `frag-${index}`));
+            }), _jsx("defs", { children: _jsx("clipPath", { id: labelsClipId, children: _jsx("rect", { x: 0, y: 0, width: width, height: overrideHeight || height }) }) }), _jsx("g", { clipPath: `url(#${labelsClipId})`, children: labelData.map(({ key, label, description, leftPos, topPos }) => (_jsxs("g", { transform: `translate(${leftPos}, ${topPos})`, children: [_jsx("text", { x: 0, y: 11, fontSize: 11, fill: "currentColor", style: { pointerEvents: 'none' }, children: label }), description ? (_jsx("text", { x: 0, y: 25, fontSize: 11, fill: "blue", style: { pointerEvents: 'none' }, children: description })) : null] }, `label-${key}`))) })] }));
 }

package/esm/BaseLinearDisplay/models/serverSideRenderedBlock.d.ts

@@ -1,27 +1,29 @@
 import type React from 'react';
 import type { Feature } from '@jbrowse/core/util';
+import type { StopToken } from '@jbrowse/core/util/stopToken';
 import type { AbstractDisplayModel, Region } from '@jbrowse/core/util/types';
-import type { Instance } from 'mobx-state-tree';
+import type { Instance } from '@jbrowse/mobx-state-tree';
 export interface RenderedProps {
     reactElement: React.ReactElement;
     features: Map<string, Feature>;
     layout: any;
     maxHeightReached: boolean;
     renderProps: any;
+    renderArgs: Record<string, unknown>;
 }
-declare const blockState: import("mobx-state-tree").IModelType<{
-    key: import("mobx-state-tree").ISimpleType<string>;
-    region: import("mobx-state-tree").IType<Region, Region, Region>;
-    reloadFlag: import("mobx-state-tree").IType<number | undefined, number, number>;
-    isLeftEndOfDisplayedRegion: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
-    isRightEndOfDisplayedRegion: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+declare const blockState: import("@jbrowse/mobx-state-tree").IModelType<{
+    key: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
+    region: import("@jbrowse/mobx-state-tree").IType<Region, Region, Region>;
+    reloadFlag: import("@jbrowse/mobx-state-tree").IType<number | undefined, number, number>;
+    isLeftEndOfDisplayedRegion: import("@jbrowse/mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+    isRightEndOfDisplayedRegion: import("@jbrowse/mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
 }, {
-    stopToken: string | undefined;
+    stopToken: StopToken | undefined;
     filled: boolean;
     reactElement: React.ReactElement | undefined;
     features: Map<string, Feature> | undefined;
     layout: any;
-    status: string;
+    blockStatusMessage: string;
     error: unknown;
     message: string | undefined;
     maxHeightReached: boolean;
@@ -29,24 +31,31 @@ declare const blockState: import("mobx-state-tree").IModelType<{
         model: {
             error?: unknown;
             reload: () => void;
-            message: React.ReactNode;
-            filled?: boolean;
-            status?: string;
+            message?: React.ReactNode;
+            statusMessage?: string;
             reactElement?: React.ReactElement;
+            isRenderingPending?: boolean;
         };
-    }) => import("react/jsx-runtime").JSX.Element | undefined;
+    }) => import("react/jsx-runtime").JSX.Element;
     renderProps: any;
+    renderArgs: Record<string, unknown> | undefined;
+    isRenderingPending: boolean;
+    cachedDisplay: AbstractDisplayModel | undefined;
 } & {
     doReload(): void;
-    afterAttach(): void;
-    setStatus(message: string): void;
-    setLoading(newStopToken: string): void;
+    setStatusMessage(message: string): void;
+    setLoading(newStopToken: StopToken): void;
     setMessage(messageText: string): void;
     setRendered(props: RenderedProps | undefined): void;
     setError(error: unknown): void;
     reload(): void;
+    setCachedDisplay(display: AbstractDisplayModel): void;
     beforeDestroy(): void;
-}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>;
+} & {
+    readonly statusMessage: any;
+} & {
+    afterAttach(): void;
+}, import("@jbrowse/mobx-state-tree")._NotCustomized, import("@jbrowse/mobx-state-tree")._NotCustomized>;
 export default blockState;
 export type BlockStateModel = typeof blockState;
 export type BlockModel = Instance<BlockStateModel>;
@@ -54,16 +63,24 @@ export declare function renderBlockData(self: BlockModel, optDisplay?: AbstractD
     rendererType: any;
     rpcManager: import("@jbrowse/core/rpc/RpcManager").default;
     renderProps: any;
+    renderingProps: Record<string, unknown> | undefined;
     cannotBeRenderedReason: any;
     displayError: any;
     renderArgs: {
         statusCallback: (message: string) => void;
         assemblyName: string;
-        regions: (Region & import("mobx-state-tree").IStateTreeNode<import("mobx-state-tree").IType<Region, Region, Region>>)[];
+        regions: {
+            seqAdapterRefName: string | undefined;
+            assemblyName: string;
+            refName: string;
+            start: number;
+            end: number;
+            reversed?: boolean | undefined;
+        }[];
         adapterConfig: any;
         rendererType: any;
         sessionId: string;
-        layoutId: string;
+        trackInstanceId: any;
         blockKey: string;
         reloadFlag: number;
         timeout: number;
@@ -73,6 +90,7 @@ export declare function renderBlockData(self: BlockModel, optDisplay?: AbstractD
     rendererType?: undefined;
     rpcManager?: undefined;
     renderProps?: undefined;
+    renderingProps?: undefined;
     cannotBeRenderedReason?: undefined;
     renderArgs?: undefined;
 };

package/esm/BaseLinearDisplay/models/serverSideRenderedBlock.js

@@ -1,10 +1,10 @@
 import { readConfObject } from '@jbrowse/core/configuration';
-import { assembleLocString, getContainingDisplay, getContainingTrack, getSession, getViewParams, makeAbortableReaction, } from '@jbrowse/core/util';
+import { assembleLocString, getContainingDisplay, getSession, makeAbortableReaction, } from '@jbrowse/core/util';
 import { stopStopToken } from '@jbrowse/core/util/stopToken';
 import { getRpcSessionId, getTrackAssemblyNames, } from '@jbrowse/core/util/tracks';
 import { isRetryException } from '@jbrowse/core/util/types';
-import { cast, getParent, isAlive, types } from 'mobx-state-tree';
-import ServerSideRenderedBlockContent from '../components/ServerSideRenderedBlockContent';
+import { getParent, isAlive, types } from '@jbrowse/mobx-state-tree';
+import ServerSideRenderedBlockContent from "../components/ServerSideRenderedBlockContent.js";
 const blockState = types
     .model('BlockState', {
     key: types.string,
@@ -19,205 +19,221 @@ const blockState = types
     reactElement: undefined,
     features: undefined,
     layout: undefined,
-    status: '',
+    blockStatusMessage: '',
     error: undefined,
     message: undefined,
     maxHeightReached: false,
     ReactComponent: ServerSideRenderedBlockContent,
     renderProps: undefined,
+    renderArgs: undefined,
+    isRenderingPending: true,
+    cachedDisplay: undefined,
 }))
-    .actions(self => ({
-    doReload() {
-        self.reloadFlag = self.reloadFlag + 1;
-    },
-    afterAttach() {
-        const display = getContainingDisplay(self);
-        setTimeout(() => {
-            if (isAlive(self)) {
-                makeAbortableReaction(self, renderBlockData, renderBlockEffect, {
-                    name: `${display.id}/${assembleLocString(self.region)} rendering`,
-                    delay: display.renderDelay,
-                    fireImmediately: true,
-                }, this.setLoading, this.setRendered, this.setError);
-            }
-        }, display.renderDelay);
-    },
-    setStatus(message) {
-        self.status = message;
-    },
-    setLoading(newStopToken) {
-        if (self.stopToken !== undefined) {
-            stopStopToken(self.stopToken);
-        }
-        self.filled = false;
-        self.message = undefined;
-        self.reactElement = undefined;
-        self.features = undefined;
-        self.layout = undefined;
-        self.error = undefined;
-        self.maxHeightReached = false;
-        self.renderProps = undefined;
-        self.stopToken = newStopToken;
-    },
-    setMessage(messageText) {
-        if (self.stopToken !== undefined) {
-            stopStopToken(self.stopToken);
-        }
-        self.filled = false;
-        self.message = messageText;
-        self.reactElement = undefined;
-        self.features = undefined;
-        self.layout = undefined;
-        self.error = undefined;
-        self.maxHeightReached = false;
-        self.renderProps = undefined;
-        self.stopToken = undefined;
-    },
-    setRendered(props) {
-        if (!props) {
-            return;
-        }
-        const { reactElement, features, layout, maxHeightReached, renderProps } = props;
-        self.filled = true;
-        self.message = undefined;
-        self.reactElement = reactElement;
-        self.features = features;
-        self.layout = layout;
-        self.error = undefined;
-        self.maxHeightReached = maxHeightReached;
-        self.renderProps = renderProps;
-        self.stopToken = undefined;
-    },
-    setError(error) {
-        console.error(error);
+    .actions(self => {
+    function stopCurrentToken() {
         if (self.stopToken !== undefined) {
             stopStopToken(self.stopToken);
+            self.stopToken = undefined;
         }
-        self.filled = false;
-        self.message = undefined;
-        self.reactElement = undefined;
-        self.features = undefined;
-        self.layout = undefined;
-        self.maxHeightReached = false;
-        self.error = error;
-        self.renderProps = undefined;
-        self.stopToken = undefined;
-        if (isRetryException(error)) {
-            this.reload();
-        }
-    },
-    reload() {
-        self.stopToken = undefined;
+    }
+    function clearRenderState() {
         self.filled = false;
         self.reactElement = undefined;
         self.features = undefined;
         self.layout = undefined;
-        self.error = undefined;
-        self.message = undefined;
         self.maxHeightReached = false;
-        self.ReactComponent = ServerSideRenderedBlockContent;
         self.renderProps = undefined;
-        getParent(self, 2).reload();
-    },
-    beforeDestroy() {
-        ;
-        (async () => {
-            try {
-                if (self.stopToken !== undefined) {
-                    stopStopToken(self.stopToken);
+        self.renderArgs = undefined;
+    }
+    return {
+        doReload() {
+            self.reloadFlag = self.reloadFlag + 1;
+        },
+        setStatusMessage(message) {
+            self.blockStatusMessage = message;
+        },
+        setLoading(newStopToken) {
+            stopCurrentToken();
+            self.isRenderingPending = true;
+            self.error = undefined;
+            self.message = undefined;
+            self.stopToken = newStopToken;
+        },
+        setMessage(messageText) {
+            stopCurrentToken();
+            self.isRenderingPending = false;
+            self.message = messageText;
+            self.error = undefined;
+            clearRenderState();
+        },
+        setRendered(props) {
+            if (!props) {
+                return;
+            }
+            const { reactElement, features, layout, maxHeightReached, renderProps, renderArgs, } = props;
+            self.filled = true;
+            self.isRenderingPending = false;
+            self.message = undefined;
+            self.reactElement = reactElement;
+            self.features = features;
+            self.layout = layout;
+            self.error = undefined;
+            self.maxHeightReached = maxHeightReached;
+            self.renderProps = renderProps;
+            self.renderArgs = renderArgs;
+            self.stopToken = undefined;
+        },
+        setError(error) {
+            console.error(error);
+            stopCurrentToken();
+            self.isRenderingPending = false;
+            self.message = undefined;
+            self.error = error;
+            clearRenderState();
+            if (isRetryException(error)) {
+                this.reload();
+            }
+        },
+        reload() {
+            self.stopToken = undefined;
+            self.isRenderingPending = false;
+            self.error = undefined;
+            self.message = undefined;
+            self.ReactComponent = ServerSideRenderedBlockContent;
+            clearRenderState();
+            getParent(self, 2).reload();
+        },
+        setCachedDisplay(display) {
+            self.cachedDisplay = display;
+        },
+        beforeDestroy() {
+            ;
+            (async () => {
+                try {
+                    stopCurrentToken();
+                    if (self.renderArgs && self.cachedDisplay) {
+                        const { rpcManager } = getSession(self);
+                        const { rendererType } = self.cachedDisplay;
+                        await rendererType.freeResourcesInClient(rpcManager, JSON.parse(JSON.stringify(self.renderArgs)));
+                    }
                 }
-                const display = getContainingDisplay(self);
-                const { rpcManager } = getSession(self);
-                const { rendererType } = display;
-                const { renderArgs } = renderBlockData(cast(self));
-                if (renderArgs) {
-                    await rendererType.freeResourcesInClient(rpcManager, JSON.parse(JSON.stringify(renderArgs)));
+                catch (e) {
+                    console.error('Error while destroying block', e);
                 }
+            })();
+        },
+    };
+})
+    .views(self => ({
+    get statusMessage() {
+        return self.isRenderingPending
+            ? self.blockStatusMessage ||
+                self.cachedDisplay?.statusMessage ||
+                'Loading'
+            : undefined;
+    },
+}))
+    .actions(self => ({
+    afterAttach() {
+        const display = self.cachedDisplay || getContainingDisplay(self);
+        setTimeout(() => {
+            if (isAlive(self)) {
+                makeAbortableReaction(self, renderBlockData, renderBlockEffect, {
+                    name: `${display.id}/${assembleLocString(self.region)} rendering`,
+                    delay: display.renderDelay,
+                    fireImmediately: true,
+                }, self.setLoading, self.setRendered, self.setError);
             }
-            catch (e) {
-                console.error('Error while destroying block', e);
-            }
-        })();
+        }, display.renderDelay);
     },
 }));
 export default blockState;
 export function renderBlockData(self, optDisplay) {
     try {
-        const display = optDisplay || getContainingDisplay(self);
+        const display = (optDisplay ||
+            self.cachedDisplay ||
+            getContainingDisplay(self));
         const { assemblyManager, rpcManager } = getSession(display);
         const { adapterConfig, rendererType, error, parentTrack } = display;
         const assemblyNames = getTrackAssemblyNames(parentTrack);
         const regionAsm = self.region.assemblyName;
         if (!assemblyNames.includes(regionAsm) &&
-            !assemblyNames.some(name => { var _a; return (_a = assemblyManager.get(name)) === null || _a === void 0 ? void 0 : _a.hasName(regionAsm); })) {
+            !assemblyNames.some(name => assemblyManager.get(name)?.hasName(regionAsm))) {
             throw new Error(`region assembly (${regionAsm}) does not match track assemblies (${assemblyNames})`);
         }
         const renderProps = display.renderProps();
+        const renderingProps = display.renderingProps?.();
         const { config } = renderProps;
         readConfObject(config);
         const sessionId = getRpcSessionId(display);
-        const layoutId = getContainingTrack(display).id;
+        const trackInstanceId = parentTrack.id;
         const cannotBeRenderedReason = display.regionCannotBeRendered(self.region);
+        const assembly = assemblyManager.get(self.region.assemblyName);
+        const seqAdapterRefName = assembly?.getSeqAdapterRefName(self.region.refName);
         return {
             rendererType,
             rpcManager,
             renderProps,
+            renderingProps,
             cannotBeRenderedReason,
             displayError: error,
             renderArgs: {
                 statusCallback: (message) => {
                     if (isAlive(self)) {
-                        self.setStatus(message);
+                        self.setStatusMessage(message);
                     }
                 },
                 assemblyName: self.region.assemblyName,
-                regions: [self.region],
+                regions: [
+                    {
+                        ...self.region,
+                        seqAdapterRefName,
+                    },
+                ],
                 adapterConfig,
                 rendererType: rendererType.name,
                 sessionId,
-                layoutId,
+                trackInstanceId,
                 blockKey: self.key,
                 reloadFlag: self.reloadFlag,
-                timeout: 1000000,
+                timeout: 1_000_000,
             },
         };
     }
     catch (e) {
-        return { displayError: e };
+        return {
+            displayError: e,
+        };
     }
 }
 async function renderBlockEffect(props, stopToken, self) {
-    if (!props) {
-        return;
-    }
-    const { rendererType, renderProps, rpcManager, renderArgs, cannotBeRenderedReason, displayError, } = props;
-    if (!isAlive(self)) {
+    if (!props || !isAlive(self)) {
         return undefined;
     }
-    else if (displayError) {
+    const { rendererType, renderProps, renderingProps, rpcManager, renderArgs, cannotBeRenderedReason, displayError, } = props;
+    if (displayError) {
         self.setError(displayError);
         return undefined;
     }
-    else if (cannotBeRenderedReason) {
+    if (cannotBeRenderedReason) {
         self.setMessage(cannotBeRenderedReason);
         return undefined;
     }
-    else if (renderProps.notReady) {
+    if (renderProps.notReady || !renderArgs) {
         return undefined;
     }
-    else {
-        const { reactElement, features, layout, maxHeightReached } = await rendererType.renderInClient(rpcManager, {
-            ...renderArgs,
-            ...renderProps,
-            viewParams: getViewParams(self),
-            stopToken,
-        });
-        return {
-            reactElement,
-            features,
-            layout,
-            maxHeightReached,
-            renderProps,
-        };
-    }
+    const { reactElement, features, layout, maxHeightReached } = await rendererType.renderInClient(rpcManager, {
+        ...renderArgs,
+        ...renderProps,
+        renderingProps,
+        stopToken,
+    });
+    return {
+        reactElement,
+        features,
+        layout,
+        maxHeightReached,
+        renderProps,
+        renderArgs,
+    };
 }