@jbrowse/plugin-wiggle 3.0.0 → 3.0.2

package/esm/BigWigAdapter/BigWigAdapter.js

@@ -7,12 +7,14 @@ import { rectifyStats } from '@jbrowse/core/util/stats';
 class BigWigAdapter extends BaseFeatureDataAdapter {
     async setupPre(opts) {
         const { statusCallback = () => { } } = opts || {};
-        const pm = this.pluginManager;
+        const pluginManager = this.pluginManager;
         const bigwig = new BigWig({
-            filehandle: openLocation(this.getConf('bigWigLocation'), pm),
+            filehandle: openLocation(this.getConf('bigWigLocation'), pluginManager),
         });
-        const header = await updateStatus('Downloading bigwig header', statusCallback, () => bigwig.getHeader(opts));
-        return { bigwig, header };
+        return {
+            bigwig,
+            header: await updateStatus('Downloading bigwig header', statusCallback, () => bigwig.getHeader(opts)),
+        };
     }
     async setup(opts) {
         if (!this.setupP) {
@@ -40,14 +42,13 @@ class BigWigAdapter extends BaseFeatureDataAdapter {
         const { refName, start, end } = region;
         const { bpPerPx = 0, stopToken, resolution = 1, statusCallback = () => { }, } = opts;
         return ObservableCreate(async (observer) => {
-            statusCallback('Downloading bigwig data');
             const source = this.getConf('source');
             const resolutionMultiplier = this.getConf('resolutionMultiplier');
             const { bigwig } = await this.setup(opts);
-            const feats = await bigwig.getFeatures(refName, start, end, {
+            const feats = await updateStatus('Downloading bigwig data', statusCallback, () => bigwig.getFeatures(refName, start, end, {
                 ...opts,
                 basesPerSpan: (bpPerPx / resolution) * resolutionMultiplier,
-            });
+            }));
             for (const data of feats) {
                 if (source) {
                     data.source = source;
@@ -65,7 +66,9 @@ class BigWigAdapter extends BaseFeatureDataAdapter {
         }, stopToken);
     }
     async getMultiRegionFeatureDensityStats(_regions) {
-        return { featureDensity: 0 };
+        return {
+            featureDensity: 0,
+        };
     }
     freeResources() { }
 }

package/esm/DensityRenderer/configSchema.d.ts

@@ -3,16 +3,19 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     posColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     negColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     clipColor: {
         type: string;

package/esm/LinePlotRenderer/configSchema.d.ts

@@ -9,16 +9,19 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     posColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     negColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     clipColor: {
         type: string;

package/esm/LinearWiggleDisplay/components/WiggleDisplayComponent.js

@@ -4,18 +4,17 @@ import { getContainingTrack, getContainingView, measureText, } from '@jbrowse/co
 import { BaseLinearDisplayComponent } from '@jbrowse/plugin-linear-genome-view';
 import { observer } from 'mobx-react';
 import YScaleBar from '../../shared/YScaleBar';
-const LinearWiggleDisplay = observer((props) => {
+const LinearWiggleDisplay = observer(function (props) {
     const { model } = props;
-    const { stats, height, needsScalebar } = model;
+    const { stats, height, graphType } = model;
     const { trackLabels } = getContainingView(model);
     const track = getContainingTrack(model);
-    const left = trackLabels === 'overlapping'
-        ? measureText(getConf(track, 'name'), 12.8) + 100
-        : 50;
-    return (_jsxs("div", { children: [_jsx(BaseLinearDisplayComponent, { ...props }), stats && needsScalebar ? (_jsx("svg", { style: {
+    return (_jsxs("div", { children: [_jsx(BaseLinearDisplayComponent, { ...props }), stats && graphType ? (_jsx("svg", { style: {
                     position: 'absolute',
                     top: 0,
-                    left,
+                    left: trackLabels === 'overlapping'
+                        ? measureText(getConf(track, 'name'), 12.8) + 100
+                        : 50,
                     pointerEvents: 'none',
                     height,
                     width: 50,

package/esm/LinearWiggleDisplay/model.d.ts

@@ -99,6 +99,7 @@ declare function stateModelFactory(pluginManager: PluginManager, configSchema: A
     configuration: AnyConfigurationSchemaType;
 } & {
     type: import("mobx-state-tree").ISimpleType<"LinearWiggleDisplay">;
+    invertedSetting: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<boolean>>;
 }, {
     rendererTypeName: string;
     error: unknown;
@@ -320,10 +321,14 @@ declare function stateModelFactory(pluginManager: PluginManager, configSchema: A
     })[];
 } & {
     reload(): Promise<void>;
+} & {
+    setInverted(arg: boolean): void;
 } & {
     readonly TooltipComponent: AnyReactComponentType;
     readonly rendererTypeName: string;
     readonly quantitativeStatsRelevantToCurrentZoom: boolean;
+    readonly graphType: boolean;
+    readonly inverted: any;
 } & {
     adapterProps(): any;
     readonly ticks: {
@@ -334,18 +339,10 @@ declare function stateModelFactory(pluginManager: PluginManager, configSchema: A
     } | undefined;
 } & {
     renderProps(): any;
-    readonly needsScalebar: boolean;
     readonly fillSetting: 2 | 1 | 0;
     readonly quantitativeStatsReady: boolean;
 } & {
     trackMenuItems(): (import("@jbrowse/core/ui").MenuDivider | import("@jbrowse/core/ui").MenuSubHeader | import("@jbrowse/core/ui").NormalMenuItem | import("@jbrowse/core/ui").CheckboxMenuItem | import("@jbrowse/core/ui").RadioMenuItem | import("@jbrowse/core/ui").SubMenuItem | {
-        type: string;
-        label?: undefined;
-        icon?: undefined;
-        subMenu?: undefined;
-        onClick?: undefined;
-        checked?: undefined;
-    } | {
         label: string;
         icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
             muiName: string;
@@ -372,8 +369,15 @@ declare function stateModelFactory(pluginManager: PluginManager, configSchema: A
             subMenu?: undefined;
         })[];
         type?: undefined;
-        onClick?: undefined;
         checked?: undefined;
+        onClick?: undefined;
+    } | {
+        label: string;
+        type: string;
+        checked: any;
+        onClick: () => void;
+        icon?: undefined;
+        subMenu?: undefined;
     } | {
         label: string;
         subMenu: {
@@ -382,18 +386,18 @@ declare function stateModelFactory(pluginManager: PluginManager, configSchema: A
             checked: boolean;
             onClick: () => void;
         }[];
-        type?: undefined;
         icon?: undefined;
-        onClick?: undefined;
+        type?: undefined;
         checked?: undefined;
+        onClick?: undefined;
     } | {
         label: string;
         icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
             muiName: string;
         };
         onClick: () => void;
-        type?: undefined;
         subMenu?: undefined;
+        type?: undefined;
         checked?: undefined;
     } | {
         type: string;

package/esm/LinearWiggleDisplay/model.js

@@ -19,6 +19,12 @@ function stateModelFactory(pluginManager, configSchema) {
     return types
         .compose('LinearWiggleDisplay', SharedWiggleMixin(configSchema), types.model({
         type: types.literal('LinearWiggleDisplay'),
+        invertedSetting: types.maybe(types.boolean),
+    }))
+        .actions(self => ({
+        setInverted(arg) {
+            self.invertedSetting = arg;
+        },
     }))
         .views(self => ({
         get TooltipComponent() {
@@ -37,6 +43,14 @@ function stateModelFactory(pluginManager, configSchema) {
             const view = getContainingView(self);
             return ((_a = self.stats) === null || _a === void 0 ? void 0 : _a.currStatsBpPerPx) === view.bpPerPx;
         },
+        get graphType() {
+            return (self.rendererTypeName === 'XYPlotRenderer' ||
+                self.rendererTypeName === 'LinePlotRenderer');
+        },
+        get inverted() {
+            var _a;
+            return (_a = self.invertedSetting) !== null && _a !== void 0 ? _a : getConf(self, 'inverted');
+        },
     }))
         .views(self => {
         const { renderProps: superRenderProps } = self;
@@ -56,9 +70,8 @@ function stateModelFactory(pluginManager, configSchema) {
                 };
             },
             get ticks() {
-                const { scaleType, domain, height } = self;
+                const { inverted, scaleType, domain, height } = self;
                 const minimalTicks = getConf(self, 'minimalTicks');
-                const inverted = getConf(self, 'inverted');
                 if (domain) {
                     const ticks = axisPropsFromTickScale(getScale({
                         scaleType,
@@ -81,19 +94,16 @@ function stateModelFactory(pluginManager, configSchema) {
     })
         .views(self => ({
         renderProps() {
-            const { ticks, height } = self;
+            const { inverted, ticks, height } = self;
             const superProps = self.adapterProps();
             return {
                 ...self.adapterProps(),
                 notReady: superProps.notReady || !self.stats,
                 height,
                 ticks,
+                inverted,
             };
         },
-        get needsScalebar() {
-            return (self.rendererTypeName === 'XYPlotRenderer' ||
-                self.rendererTypeName === 'LinePlotRenderer');
-        },
         get fillSetting() {
             if (self.filled) {
                 return 0;
@@ -117,12 +127,23 @@ function stateModelFactory(pluginManager, configSchema) {
             trackMenuItems() {
                 return [
                     ...superTrackMenuItems(),
-                    { type: 'divider' },
                     {
                         label: 'Score',
                         icon: EqualizerIcon,
                         subMenu: self.scoreTrackMenuItems(),
                     },
+                    ...(self.graphType
+                        ? [
+                            {
+                                label: 'Inverted',
+                                type: 'checkbox',
+                                checked: self.inverted,
+                                onClick: () => {
+                                    self.setInverted(!self.inverted);
+                                },
+                            },
+                        ]
+                        : []),
                     ...(self.canHaveFill
                         ? [
                             {
@@ -166,7 +187,7 @@ function stateModelFactory(pluginManager, configSchema) {
                             ]);
                         },
                     },
-                    ...(self.needsScalebar
+                    ...(self.graphType
                         ? [
                             {
                                 type: 'checkbox',

package/esm/LinearWiggleDisplay/renderSvg.js

@@ -4,7 +4,7 @@ import { when } from 'mobx';
 import YScaleBar from '../shared/YScaleBar';
 export async function renderSvg(self, opts, superRenderSvg) {
     await when(() => !!self.stats && !!self.regionCannotBeRenderedText);
-    const { needsScalebar, stats } = self;
+    const { graphType, stats } = self;
     const { offsetPx } = getContainingView(self);
-    return (_jsxs(_Fragment, { children: [_jsx("g", { children: await superRenderSvg(opts) }), needsScalebar && stats ? (_jsx("g", { transform: `translate(${Math.max(-offsetPx, 0)})`, children: _jsx(YScaleBar, { model: self, orientation: "left" }) })) : null] }));
+    return (_jsxs(_Fragment, { children: [_jsx("g", { children: await superRenderSvg(opts) }), graphType && stats ? (_jsx("g", { transform: `translate(${Math.max(-offsetPx, 0)})`, children: _jsx(YScaleBar, { model: self, orientation: "left" }) })) : null] }));
 }

package/esm/MultiDensityRenderer/configSchema.d.ts

@@ -3,16 +3,19 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     posColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     negColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     clipColor: {
         type: string;

package/esm/MultiLineRenderer/configSchema.d.ts

@@ -15,16 +15,19 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     posColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     negColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     clipColor: {
         type: string;

package/esm/MultiLinearWiggleDisplay/components/ColorLegend.js

@@ -3,11 +3,11 @@ import { observer } from 'mobx-react';
 import LegendItem from './LegendItem';
 import RectBg from './RectBg';
 const ColorLegend = observer(function ({ model, rowHeight, exportSVG, }) {
-    const { needsScalebar, needsFullHeightScalebar, rowHeightTooSmallForScalebar, renderColorBoxes, sources, labelWidth, } = model;
+    const { graphType, needsFullHeightScalebar, rowHeightTooSmallForScalebar, renderColorBoxes, sources, labelWidth, } = model;
     const colorBoxWidth = renderColorBoxes ? 15 : 0;
     const legendWidth = labelWidth + colorBoxWidth + 5;
     const svgOffset = exportSVG ? 10 : 0;
-    const extraOffset = svgOffset || (needsScalebar && !rowHeightTooSmallForScalebar ? 50 : 0);
+    const extraOffset = svgOffset || (graphType && !rowHeightTooSmallForScalebar ? 50 : 0);
     return sources ? (_jsxs(_Fragment, { children: [needsFullHeightScalebar ? (_jsx(RectBg, { y: 0, x: extraOffset, width: legendWidth, height: (sources.length + 0.25) * rowHeight })) : null, sources.map((source, idx) => (_jsx(LegendItem, { source: source, idx: idx, model: model, rowHeight: rowHeight, exportSVG: exportSVG, labelWidth: labelWidth }, `${source.name}-${idx}`)))] })) : null;
 });
 export default ColorLegend;

package/esm/MultiLinearWiggleDisplay/components/LegendItem.js

@@ -2,13 +2,13 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import RectBg from './RectBg';
 const LegendItem = function ({ source, idx, rowHeight, labelWidth, model, exportSVG, }) {
     const boxHeight = Math.min(20, rowHeight);
-    const { needsCustomLegend, needsScalebar, needsFullHeightScalebar, rowHeightTooSmallForScalebar, renderColorBoxes, } = model;
+    const { needsCustomLegend, graphType, needsFullHeightScalebar, rowHeightTooSmallForScalebar, renderColorBoxes, } = model;
     const svgFontSize = Math.min(rowHeight, 12);
     const canDisplayLabel = rowHeight > 11;
     const colorBoxWidth = renderColorBoxes ? 15 : 0;
     const legendWidth = labelWidth + colorBoxWidth + 5;
     const svgOffset = exportSVG ? 10 : 0;
-    const extraOffset = svgOffset || (needsScalebar && !rowHeightTooSmallForScalebar ? 50 : 0);
+    const extraOffset = svgOffset || (graphType && !rowHeightTooSmallForScalebar ? 50 : 0);
     return (_jsxs(_Fragment, { children: [needsFullHeightScalebar ? null : (_jsx(RectBg, { y: idx * rowHeight + 1, x: extraOffset, width: legendWidth, height: boxHeight })), source.color ? (_jsx(RectBg, { y: idx * rowHeight + 1, x: extraOffset, width: colorBoxWidth, height: needsCustomLegend ? rowHeight : boxHeight, color: source.color })) : null, canDisplayLabel ? (_jsx("text", { y: idx * rowHeight + 13, x: extraOffset + colorBoxWidth + 2, fontSize: svgFontSize, children: source.name })) : null] }));
 };
 export default LegendItem;

package/esm/MultiLinearWiggleDisplay/model.d.ts

@@ -337,7 +337,7 @@ export declare function stateModelFactory(_pluginManager: PluginManager, configS
     readonly TooltipComponent: AnyReactComponentType;
     readonly rendererTypeName: string;
 } & {
-    readonly needsScalebar: boolean;
+    readonly graphType: boolean;
     readonly needsFullHeightScalebar: boolean;
     readonly isMultiRow: boolean;
     readonly needsCustomLegend: boolean;

package/esm/MultiLinearWiggleDisplay/model.js

@@ -68,7 +68,7 @@ export function stateModelFactory(_pluginManager, configSchema) {
         },
     }))
         .views(self => ({
-        get needsScalebar() {
+        get graphType() {
             return (self.rendererTypeName === 'MultiXYPlotRenderer' ||
                 self.rendererTypeName === 'MultiRowXYPlotRenderer' ||
                 self.rendererTypeName === 'MultiLineRenderer' ||
@@ -254,7 +254,7 @@ export function stateModelFactory(_pluginManager, configSchema) {
                             },
                         ]
                         : []),
-                    ...(self.needsScalebar
+                    ...(self.graphType
                         ? [
                             {
                                 type: 'checkbox',

package/esm/MultiRowLineRenderer/configSchema.d.ts

@@ -15,16 +15,19 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     posColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     negColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     clipColor: {
         type: string;

package/esm/MultiRowXYPlotRenderer/configSchema.d.ts

@@ -23,16 +23,19 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     posColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     negColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     clipColor: {
         type: string;

package/esm/MultiXYPlotRenderer/configSchema.d.ts

@@ -23,16 +23,19 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     posColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     negColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     clipColor: {
         type: string;

package/esm/WiggleBaseRenderer.d.ts

@@ -15,10 +15,12 @@ export interface RenderArgsDeserialized extends FeatureRenderArgsDeserialized {
     ticks: {
         values: number[];
     };
+    inverted: boolean;
     themeOptions: ThemeOptions;
 }
 export interface RenderArgsDeserializedWithFeatures extends RenderArgsDeserialized {
     features: Map<string, Feature>;
+    inverted: boolean;
 }
 export interface MultiRenderArgsDeserialized extends RenderArgsDeserializedWithFeatures {
     sources: Source[];

package/esm/WiggleBaseRenderer.js

@@ -7,12 +7,13 @@ export default class WiggleBaseRenderer extends FeatureRendererType {
     }
     async render(renderProps) {
         const features = await this.getFeatures(renderProps);
-        const { height, regions, bpPerPx } = renderProps;
+        const { inverted, height, regions, bpPerPx } = renderProps;
         const region = regions[0];
         const width = (region.end - region.start) / bpPerPx;
         const { reducedFeatures, ...rest } = await renderToAbstractCanvas(width, height, renderProps, ctx => this.draw(ctx, {
             ...renderProps,
             features,
+            inverted,
         }));
         const results = await super.render({
             ...renderProps,

package/esm/XYPlotRenderer/XYPlotRenderer.d.ts

@@ -1,8 +1,7 @@
 import WiggleBaseRenderer from '../WiggleBaseRenderer';
 import type { RenderArgsDeserializedWithFeatures } from '../WiggleBaseRenderer';
-import type { Feature } from '@jbrowse/core/util';
 export default class XYPlotRenderer extends WiggleBaseRenderer {
     draw(ctx: CanvasRenderingContext2D, props: RenderArgsDeserializedWithFeatures): Promise<{
-        reducedFeatures: Feature[];
+        reducedFeatures: import("@jbrowse/core/util").Feature[];
     }>;
 }

package/esm/XYPlotRenderer/XYPlotRenderer.js

@@ -3,18 +3,19 @@ import WiggleBaseRenderer from '../WiggleBaseRenderer';
 import { YSCALEBAR_LABEL_OFFSET } from '../util';
 export default class XYPlotRenderer extends WiggleBaseRenderer {
     async draw(ctx, props) {
-        const { stopToken, features, config } = props;
+        const { inverted, stopToken, features, config } = props;
         const { drawXY } = await import('../drawXY');
         const pivotValue = readConfObject(config, 'bicolorPivotValue');
         const negColor = readConfObject(config, 'negColor');
         const posColor = readConfObject(config, 'posColor');
         return drawXY(ctx, {
             ...props,
-            colorCallback: readConfObject(config, 'color') === '#f0f'
-                ? (_, score) => score < pivotValue ? negColor : posColor
+            colorCallback: !config.color.isCallback
+                ? (_feature, score) => (score < pivotValue ? negColor : posColor)
                 : (feature, _score) => readConfObject(config, 'color', { feature }),
             offset: YSCALEBAR_LABEL_OFFSET,
             features: [...features.values()],
+            inverted,
             stopToken,
         });
     }

package/esm/XYPlotRenderer/configSchema.d.ts

@@ -23,16 +23,19 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     posColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     negColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     clipColor: {
         type: string;

package/esm/configSchema.d.ts

@@ -3,16 +3,19 @@ declare const WiggleRenderer: import("@jbrowse/core/configuration/configurationS
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     posColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     negColor: {
         type: string;
         description: string;
         defaultValue: string;
+        contextVariable: string[];
     };
     clipColor: {
         type: string;

package/esm/configSchema.js

@@ -6,16 +6,19 @@ const WiggleRenderer = ConfigurationSchema('WiggleRenderer', {
         type: 'color',
         description: 'the color of track, overrides posColor and negColor',
         defaultValue: '#f0f',
+        contextVariable: ['feature'],
     },
     posColor: {
         type: 'color',
         description: 'the color to use when the score is positive',
         defaultValue: 'blue',
+        contextVariable: ['feature'],
     },
     negColor: {
         type: 'color',
         description: 'the color to use when the score is negative',
         defaultValue: 'red',
+        contextVariable: ['feature'],
     },
     clipColor: {
         type: 'color',

package/esm/drawXY.d.ts

@@ -13,6 +13,7 @@ export declare function drawXY(ctx: CanvasRenderingContext2D, props: {
     };
     config: AnyConfigurationModel;
     displayCrossHatches: boolean;
+    inverted: boolean;
     offset?: number;
     colorCallback: (f: Feature, score: number) => string;
 }): {

package/esm/drawXY.js

@@ -16,7 +16,7 @@ function darken(color, amount) {
 const fudgeFactor = 0.3;
 const clipHeight = 2;
 export function drawXY(ctx, props) {
-    const { features, bpPerPx, regions, scaleOpts, height: unadjustedHeight, config, ticks, displayCrossHatches, offset = 0, colorCallback, } = props;
+    const { features, bpPerPx, regions, scaleOpts, height: unadjustedHeight, config, ticks, displayCrossHatches, offset = 0, colorCallback, inverted, } = props;
     const region = regions[0];
     const width = (region.end - region.start) / bpPerPx;
     const height = unadjustedHeight - offset * 2;
@@ -25,7 +25,7 @@ export function drawXY(ctx, props) {
     const summaryScoreMode = readConfObject(config, 'summaryScoreMode');
     const pivotValue = readConfObject(config, 'bicolorPivotValue');
     const minSize = readConfObject(config, 'minSize');
-    const scale = getScale({ ...scaleOpts, range: [0, height] });
+    const scale = getScale({ ...scaleOpts, range: [0, height], inverted });
     const originY = getOrigin(scaleOpts.scaleType);
     const domain = scale.domain();
     const niceMin = domain[0];

package/esm/index.d.ts

@@ -50,16 +50,19 @@ export default class WigglePlugin extends Plugin {
                 type: string;
                 description: string;
                 defaultValue: string;
+                contextVariable: string[];
             };
             posColor: {
                 type: string;
                 description: string;
                 defaultValue: string;
+                contextVariable: string[];
             };
             negColor: {
                 type: string;
                 description: string;
                 defaultValue: string;
+                contextVariable: string[];
             };
             clipColor: {
                 type: string;