cx 26.0.1 → 26.0.3

package/build/charts/Column.js

@@ -0,0 +1,81 @@
+import { Widget } from "../ui/Widget";
+import { ColumnBarBase } from "./ColumnBarBase";
+import { Rect } from "../svg/util/Rect";
+import { isDefined } from "../util/isDefined";
+export class Column extends ColumnBarBase {
+    constructor(config) {
+        super(config);
+    }
+    init() {
+        if (isDefined(this.width))
+            this.size = this.width;
+        super.init();
+    }
+    declareData(...args) {
+        return super.declareData({
+            y0: undefined,
+            size: undefined,
+            autoSize: undefined,
+        }, ...args);
+    }
+    checkValid(data) {
+        return data.x != null && data.y != null && data.y0 != null;
+    }
+    explore(context, instance) {
+        let { data, xAxis, yAxis } = instance;
+        instance.colorMap = data.colorMap && context.getColorMap && context.getColorMap(data.colorMap);
+        if (instance.colorMap && data.colorName)
+            instance.colorMap.acknowledge(data.colorName);
+        if (!data.valid)
+            return;
+        if (data.active) {
+            xAxis.acknowledge(data.x, data.size, data.offset);
+            if (data.autoSize)
+                xAxis.book(data.x, data.stacked ? data.stack : data.name);
+            if (data.stacked) {
+                yAxis.stacknowledge(data.stack, data.x, data.y0);
+                yAxis.stacknowledge(data.stack, data.x, data.y);
+            }
+            else {
+                if (!this.hiddenBase)
+                    yAxis.acknowledge(data.y0);
+                yAxis.acknowledge(data.y);
+            }
+            super.explore(context, instance);
+        }
+    }
+    calculateRect(instance) {
+        var { data } = instance;
+        var { offset, size } = data;
+        if (data.autoSize) {
+            var [index, count] = instance.xAxis.locate(data.x, data.stacked ? data.stack : data.name);
+            offset = (size / count) * (index - count / 2 + 0.5);
+            size = size / count;
+        }
+        var x1 = instance.xAxis.map(data.x, offset - size / 2);
+        var x2 = instance.xAxis.map(data.x, offset + size / 2);
+        var y1 = data.stacked ? instance.yAxis.stack(data.stack, data.x, data.y0) : instance.yAxis.map(data.y0);
+        var y2 = data.stacked ? instance.yAxis.stack(data.stack, data.x, data.y) : instance.yAxis.map(data.y);
+        if (Math.abs(y2 - y1) < this.minPixelHeight) {
+            if (y1 < y2)
+                y2 = y1 + this.minPixelHeight;
+            else
+                y2 = y1 - this.minPixelHeight;
+        }
+        var bounds = new Rect({
+            l: Math.min(x1, x2),
+            r: Math.max(x1, x2),
+            t: Math.min(y1, y2),
+            b: Math.max(y1, y2),
+        });
+        return bounds;
+    }
+}
+Column.prototype.baseClass = "column";
+Column.prototype.y0 = 0;
+Column.prototype.size = 1;
+Column.prototype.autoSize = false;
+Column.prototype.legendShape = "column";
+Column.prototype.hiddenBase = false;
+Column.prototype.minPixelHeight = 0.5;
+Widget.alias("column", Column);

package/build/charts/ColumnBarBase.d.ts

@@ -0,0 +1,92 @@
+/** @jsxImportSource react */
+import { StyledContainerBase, StyledContainerConfig } from "../ui/Container";
+import { TooltipParentInstance } from "../widgets/overlay/tooltip-ops";
+import { Selection } from "../ui/selection/Selection";
+import { Prop, BooleanProp, NumberProp, StringProp } from "../ui/Prop";
+import { Instance } from "../ui/Instance";
+import { RenderingContext } from "../ui/RenderingContext";
+import { Rect } from "../svg/util/Rect";
+import type { ChartRenderingContext } from "./Chart";
+export interface ColumnBarBaseConfig extends StyledContainerConfig {
+    /** The `x` value binding or expression. */
+    x?: Prop<string | number>;
+    /** The `y` value binding or expression. */
+    y?: Prop<string | number>;
+    disabled?: BooleanProp;
+    /** Index of a color from the standard palette of colors. 0-15. */
+    colorIndex?: NumberProp;
+    /** Used to automatically assign a color based on the `name` and the contextual `ColorMap` widget. */
+    colorMap?: StringProp;
+    /** Name used to resolve the color. If not provided, `name` is used instead. */
+    colorName?: StringProp;
+    /** Name of the item as it will appear in the legend. */
+    name?: StringProp;
+    /** Used to indicate if an item is active or not. Inactive items are shown only in the legend. */
+    active?: BooleanProp;
+    /** Indicate that columns should be stacked on top of the other columns. Default value is `false`. */
+    stacked?: BooleanProp;
+    /** Name of the stack. If multiple stacks are used, each should have a unique name. Default value is `stack`. */
+    stack?: StringProp;
+    /** Of center offset of the column. Use this in combination with `size` to align multiple series on the same chart. */
+    offset?: NumberProp;
+    /** Border radius of the column/bar. */
+    borderRadius?: NumberProp;
+    /**
+     * Name of the horizontal axis. The value should match one of the horizontal axes set
+     * in the `axes` configuration of the parent `Chart` component. Default value is `x`.
+     */
+    xAxis?: string;
+    /**
+     * Name of the vertical axis. The value should match one of the vertical axes set
+     *  in the `axes` configuration if the parent `Chart` component. Default value is `y`.
+     */
+    yAxis?: string;
+    /** Name of the legend to be used. Default is `legend`. Set to `false` to hide the legend entry. */
+    legend?: string | false;
+    legendAction?: string;
+    legendShape?: string;
+    /** A value used to identify the group of components participating in hover effect synchronization. */
+    hoverChannel?: string;
+    /** A value used to uniquely identify the record within the hover sync group. */
+    hoverId?: StringProp;
+    /** Hide the bar/column rect. Used for stacked series where only top bar should be visible. */
+    hidden?: BooleanProp;
+    selection?: any;
+    tooltip?: any;
+}
+export interface ColumnBarBaseInstance extends Instance, TooltipParentInstance {
+    axes: Record<string, any>;
+    xAxis: any;
+    yAxis: any;
+    hoverSync: any;
+    colorMap: any;
+    bounds: Rect;
+}
+export declare class ColumnBarBase extends StyledContainerBase<ColumnBarBaseConfig> {
+    baseClass: string;
+    xAxis: string;
+    yAxis: string;
+    offset: number;
+    legend: string | false;
+    legendAction: string;
+    active: boolean;
+    stacked: boolean;
+    stack: string;
+    legendShape: string;
+    hoverChannel: string;
+    borderRadius: number;
+    hidden: boolean;
+    selection: Selection;
+    tooltip: any;
+    constructor(config: ColumnBarBaseConfig);
+    init(): void;
+    declareData(...args: any[]): any;
+    prepareData(context: ChartRenderingContext, instance: ColumnBarBaseInstance): void;
+    checkValid(data: any): boolean;
+    prepare(context: ChartRenderingContext, instance: ColumnBarBaseInstance): void;
+    prepareCleanup(context: ChartRenderingContext, instance: ColumnBarBaseInstance): void;
+    onLegendClick(e: MouseEvent, instance: ColumnBarBaseInstance): void;
+    calculateRect(instance: ColumnBarBaseInstance): Rect;
+    render(context: RenderingContext, instance: ColumnBarBaseInstance, key: string): React.ReactNode;
+    handleClick(e: MouseEvent | React.MouseEvent, instance: ColumnBarBaseInstance): void;
+}

package/build/charts/ColumnBarBase.js

@@ -0,0 +1,144 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { StyledContainerBase } from "../ui/Container";
+import { tooltipMouseMove, tooltipMouseLeave } from "../widgets/overlay/tooltip-ops";
+import { Selection } from "../ui/selection/Selection";
+import { withHoverSync } from "../ui/HoverSync";
+export class ColumnBarBase extends StyledContainerBase {
+    constructor(config) {
+        super(config);
+    }
+    init() {
+        this.selection = Selection.create(this.selection);
+        super.init();
+    }
+    declareData(...args) {
+        var selection = this.selection.configureWidget(this);
+        return super.declareData(selection, {
+            x: undefined,
+            y: undefined,
+            style: { structured: true },
+            class: { structured: true },
+            className: { structured: true },
+            disabled: undefined,
+            colorIndex: undefined,
+            colorMap: undefined,
+            colorName: undefined,
+            name: undefined,
+            active: true,
+            stacked: undefined,
+            stack: undefined,
+            offset: undefined,
+            hoverId: undefined,
+            borderRadius: undefined,
+            hidden: undefined,
+        }, ...args);
+    }
+    prepareData(context, instance) {
+        instance.axes = context.axes;
+        instance.xAxis = context.axes[this.xAxis];
+        instance.yAxis = context.axes[this.yAxis];
+        instance.hoverSync = context.hoverSync;
+        var { data } = instance;
+        data.valid = this.checkValid(data);
+        if (!data.colorName && data.name)
+            data.colorName = data.name;
+        super.prepareData(context, instance);
+    }
+    checkValid(data) {
+        return true;
+    }
+    prepare(context, instance) {
+        let { data, colorMap } = instance;
+        if (colorMap && data.colorName) {
+            data.colorIndex = colorMap.map(data.colorName);
+            if (instance.cache("colorIndex", data.colorIndex))
+                instance.markShouldUpdate(context);
+        }
+        if (!data.valid)
+            return;
+        if (data.active) {
+            instance.bounds = this.calculateRect(instance);
+            instance.cache("bounds", instance.bounds);
+            if (!instance.bounds.isEqual(instance.cached.bounds))
+                instance.markShouldUpdate(context);
+            context.push("parentRect", instance.bounds);
+            if (instance.xAxis.shouldUpdate || instance.yAxis.shouldUpdate)
+                instance.markShouldUpdate(context);
+        }
+        if (data.name && context.addLegendEntry)
+            context.addLegendEntry(this.legend, {
+                name: data.name,
+                active: data.active,
+                colorIndex: data.colorIndex,
+                disabled: data.disabled,
+                selected: this.selection.isInstanceSelected(instance),
+                style: data.style,
+                shape: this.legendShape,
+                onClick: (e) => {
+                    this.onLegendClick(e, instance);
+                },
+            });
+    }
+    prepareCleanup(context, instance) {
+        let { data } = instance;
+        if (data.valid && data.active)
+            context.pop("parentRect");
+    }
+    onLegendClick(e, instance) {
+        var allActions = this.legendAction == "auto";
+        var { data } = instance;
+        if (allActions || this.legendAction == "toggle")
+            if (instance.set("active", !data.active))
+                return;
+        if (allActions || this.legendAction == "select")
+            this.handleClick(e, instance);
+    }
+    calculateRect(instance) {
+        throw new Error("Abstract method.");
+    }
+    render(context, instance, key) {
+        let { data, bounds } = instance;
+        if (!data.active || !data.valid)
+            return null;
+        return withHoverSync(key, instance.hoverSync, this.hoverChannel, data.hoverId, ({ hover, onMouseMove, onMouseLeave, key }) => {
+            var stateMods = {
+                selected: this.selection.isInstanceSelected(instance),
+                disabled: data.disabled,
+                selectable: !this.selection.isDummy,
+                ["color-" + data.colorIndex]: data.colorIndex != null,
+                hover,
+            };
+            return (_jsxs("g", { className: data.classNames, children: [!data.hidden && (_jsx("rect", { className: this.CSS.element(this.baseClass, "rect", stateMods), style: data.style, x: bounds.l, y: bounds.t, width: bounds.width(), height: bounds.height(), rx: data.borderRadius, onMouseMove: (e) => {
+                            onMouseMove(e, instance);
+                            tooltipMouseMove(e, instance, this.tooltip);
+                        }, onMouseLeave: (e) => {
+                            onMouseLeave(e, instance);
+                            tooltipMouseLeave(e, instance, this.tooltip);
+                        }, onClick: (e) => {
+                            this.handleClick(e, instance);
+                        } })), this.renderChildren(context, instance)] }, key));
+        });
+    }
+    handleClick(e, instance) {
+        if (!this.selection.isDummy) {
+            this.selection.selectInstance(instance, {
+                toggle: e.ctrlKey,
+            });
+            e.stopPropagation();
+            e.preventDefault();
+        }
+    }
+}
+ColumnBarBase.prototype.xAxis = "x";
+ColumnBarBase.prototype.yAxis = "y";
+ColumnBarBase.prototype.offset = 0;
+ColumnBarBase.prototype.legend = "legend";
+ColumnBarBase.prototype.legendAction = "auto";
+ColumnBarBase.prototype.active = true;
+ColumnBarBase.prototype.stacked = false;
+ColumnBarBase.prototype.stack = "stack";
+ColumnBarBase.prototype.legendShape = "rect";
+ColumnBarBase.prototype.styled = true;
+ColumnBarBase.prototype.hoverChannel = "default";
+ColumnBarBase.prototype.borderRadius = 0;
+ColumnBarBase.prototype.hidden = false;

package/build/charts/ColumnBarGraphBase.d.ts

@@ -0,0 +1,91 @@
+/** @jsxImportSource react */
+import { Widget, WidgetConfig } from "../ui/Widget";
+import { Selection } from "../ui/selection/Selection";
+import { Instance } from "../ui/Instance";
+import { RenderingContext } from "../ui/RenderingContext";
+import { NumberProp, BooleanProp, StringProp, RecordsProp } from "../ui/Prop";
+import type { ChartRenderingContext } from "./Chart";
+export interface ColumnBarGraphBaseConfig extends WidgetConfig {
+    /**
+     * Data for the graph. Each entry should be an object with at least two properties
+     * whose names should match the `xField` and `yField` values.
+     */
+    data?: RecordsProp;
+    /** Index of a color from the standard palette of colors. 0-15. */
+    colorIndex?: NumberProp;
+    /** Used to automatically assign a color based on the `name` and the contextual `ColorMap` widget. */
+    colorMap?: StringProp;
+    /** Name used to resolve the color. If not provided, `name` is used instead. */
+    colorName?: StringProp;
+    /** Name of the item as it will appear in the legend. */
+    name?: StringProp;
+    /** Size (width) of the column in axis units. */
+    size?: NumberProp;
+    /** Of center offset of the column. Use this in combination with `size` to align multiple series on the same chart. */
+    offset?: NumberProp;
+    /** Set to true to auto-calculate size and offset. Available only if the x axis is a category axis. */
+    autoSize?: BooleanProp;
+    /** Used to indicate if an item is active or not. Inactive items are shown only in the legend. */
+    active?: BooleanProp;
+    /** Indicate that columns should be stacked on top of the other columns. Default value is `false`. */
+    stacked?: BooleanProp;
+    /** Border radius of the column/bar. */
+    borderRadius?: NumberProp;
+    /** Name of the stack. If multiple stacks are used, each should have a unique name. Default value is `stack`. */
+    stack?: StringProp;
+    /** Column/bar base value for y axis. */
+    y0?: NumberProp;
+    /** Column/bar base value for x axis. */
+    x0?: NumberProp;
+    /** Name of the horizontal axis. Default value is `x`. */
+    xAxis?: string;
+    /** Name of the vertical axis. Default value is `y`. */
+    yAxis?: string;
+    /** Name of the property which holds the x value. Default value is `x`. */
+    xField?: string;
+    /** Name of the property which holds the y value. Default value is `y`. */
+    yField?: string;
+    colorIndexField?: boolean | string;
+    /** Name of the legend to be used. Default is `legend`. Set to `false` to hide the legend entry. */
+    legend?: string | false;
+    legendAction?: string;
+    legendShape?: string;
+    /** Selection configuration. */
+    selection?: any;
+    onClick?: (e: MouseEvent, instance: Instance, point: any, index: number) => void | false;
+}
+export interface ColumnBarGraphBaseInstance extends Instance {
+    xAxis: any;
+    yAxis: any;
+    colorMap: any;
+}
+export declare class ColumnBarGraphBase extends Widget<ColumnBarGraphBaseConfig> {
+    baseClass: string;
+    xAxis: string;
+    yAxis: string;
+    xField: string;
+    yField: string;
+    colorIndexField: boolean | string;
+    size: number;
+    legend: string | false;
+    legendAction: string;
+    legendShape: string;
+    stack: string;
+    stacked: boolean;
+    autoSize: number | boolean;
+    offset: number;
+    borderRadius: number;
+    selection: Selection;
+    data: any;
+    onClick: ColumnBarGraphBaseConfig["onClick"];
+    constructor(config?: ColumnBarGraphBaseConfig);
+    init(): void;
+    declareData(...args: any[]): void;
+    prepareData(context: RenderingContext, instance: ColumnBarGraphBaseInstance): void;
+    explore(context: ChartRenderingContext, instance: ColumnBarGraphBaseInstance): void;
+    prepare(context: ChartRenderingContext, instance: ColumnBarGraphBaseInstance): void;
+    onLegendClick(e: MouseEvent, instance: ColumnBarGraphBaseInstance): void;
+    render(context: RenderingContext, instance: ColumnBarGraphBaseInstance, key: string): React.ReactNode;
+    renderGraph(context: RenderingContext, instance: ColumnBarGraphBaseInstance): React.ReactNode;
+    handleClick(e: React.MouseEvent, instance: ColumnBarGraphBaseInstance, point: any, index: number): void;
+}

package/build/charts/ColumnBarGraphBase.js

@@ -0,0 +1,106 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/** @jsxImportSource react */
+import { Widget } from "../ui/Widget";
+import { Selection } from "../ui/selection/Selection";
+export class ColumnBarGraphBase extends Widget {
+    constructor(config) {
+        super(config);
+    }
+    init() {
+        this.selection = Selection.create(this.selection, {
+            records: this.data,
+        });
+        super.init();
+    }
+    declareData(...args) {
+        var selection = this.selection.configureWidget(this);
+        super.declareData(selection, {
+            data: undefined,
+            colorIndex: undefined,
+            colorMap: undefined,
+            colorName: undefined,
+            name: undefined,
+            size: undefined,
+            offset: undefined,
+            y0: undefined,
+            x0: undefined,
+            autoSize: undefined,
+            active: true,
+            stacked: undefined,
+            stack: undefined,
+            borderRadius: undefined,
+        }, ...args);
+    }
+    prepareData(context, instance) {
+        let { data } = instance;
+        if (data.name && !data.colorName)
+            data.colorName = data.name;
+        super.prepareData(context, instance);
+    }
+    explore(context, instance) {
+        instance.xAxis = context.axes[this.xAxis];
+        instance.yAxis = context.axes[this.yAxis];
+        var { data } = instance;
+        instance.colorMap = data.colorMap && context.getColorMap && context.getColorMap(data.colorMap);
+        if (instance.colorMap && data.colorName)
+            instance.colorMap.acknowledge(data.colorName);
+        super.explore(context, instance);
+    }
+    prepare(context, instance) {
+        let { data, colorMap, xAxis, yAxis } = instance;
+        if (colorMap && data.name) {
+            data.colorIndex = colorMap.map(data.colorName);
+            if (instance.cache("colorIndex", data.colorIndex))
+                instance.markShouldUpdate(context);
+        }
+        if (xAxis.shouldUpdate || yAxis.shouldUpdate)
+            instance.markShouldUpdate(context);
+        if (data.name && context.addLegendEntry)
+            context.addLegendEntry(this.legend, {
+                name: data.name,
+                active: data.active,
+                colorIndex: data.colorIndex,
+                disabled: data.disabled,
+                selected: this.selection.isInstanceSelected(instance),
+                style: data.style,
+                shape: this.legendShape,
+                onClick: (e) => {
+                    this.onLegendClick(e, instance);
+                },
+            });
+    }
+    onLegendClick(e, instance) {
+        var allActions = this.legendAction == "auto";
+        var { data } = instance;
+        if (allActions || this.legendAction == "toggle")
+            instance.set("active", !data.active);
+    }
+    render(context, instance, key) {
+        var { data } = instance;
+        return (_jsx("g", { className: data.classNames, children: data.active && this.renderGraph(context, instance) }, key));
+    }
+    renderGraph(context, instance) {
+        throw new Error("Abstract method");
+    }
+    handleClick(e, instance, point, index) {
+        if (this.onClick && instance.invoke("onClick", e, instance, point, index) === false)
+            return;
+        if (!this.selection.isDummy)
+            this.selection.select(instance.store, point, index, { toggle: e.ctrlKey });
+    }
+}
+ColumnBarGraphBase.prototype.xAxis = "x";
+ColumnBarGraphBase.prototype.yAxis = "y";
+ColumnBarGraphBase.prototype.xField = "x";
+ColumnBarGraphBase.prototype.yField = "y";
+ColumnBarGraphBase.prototype.colorIndexField = false;
+ColumnBarGraphBase.prototype.size = 1;
+ColumnBarGraphBase.prototype.legend = "legend";
+ColumnBarGraphBase.prototype.legendAction = "auto";
+ColumnBarGraphBase.prototype.legendShape = "rect";
+ColumnBarGraphBase.prototype.stack = "stack";
+ColumnBarGraphBase.prototype.stacked = false;
+ColumnBarGraphBase.prototype.autoSize = 0;
+ColumnBarGraphBase.prototype.offset = 0;
+ColumnBarGraphBase.prototype.styled = true;
+ColumnBarGraphBase.prototype.borderRadius = 0;

package/build/charts/ColumnGraph.d.ts

@@ -0,0 +1,30 @@
+/** @jsxImportSource react */
+import { ColumnBarGraphBase, ColumnBarGraphBaseConfig, ColumnBarGraphBaseInstance } from "./ColumnBarGraphBase";
+import { TooltipParentInstance } from "../widgets/overlay/tooltip-ops";
+import { RenderingContext } from "../ui/RenderingContext";
+import { NumberProp } from "../ui/Prop";
+export interface ColumnGraphConfig extends ColumnBarGraphBaseConfig {
+    /**
+     * Name of the property which holds the base value.
+     * Default value is `false`, which means y0 value is not read from the data array.
+     */
+    y0Field?: string | false;
+    /** Column base value. Default value is `0`. */
+    y0?: NumberProp;
+    /** Hide the base of the column (y0). */
+    hiddenBase?: boolean;
+    /** Tooltip configuration. */
+    tooltip?: any;
+}
+export interface ColumnGraphInstance extends ColumnBarGraphBaseInstance, TooltipParentInstance {
+}
+export declare class ColumnGraph extends ColumnBarGraphBase {
+    y0Field: string | false;
+    y0: number;
+    hiddenBase: boolean;
+    tooltip: any;
+    constructor(config: ColumnGraphConfig);
+    explore(context: RenderingContext, instance: ColumnGraphInstance): void;
+    prepare(context: RenderingContext, instance: ColumnGraphInstance): void;
+    renderGraph(context: RenderingContext, instance: ColumnGraphInstance): React.ReactNode;
+}

package/build/charts/ColumnGraph.js

@@ -0,0 +1,94 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/** @jsxImportSource react */
+import { Widget } from "../ui/Widget";
+import { ColumnBarGraphBase } from "./ColumnBarGraphBase";
+import { tooltipMouseMove, tooltipMouseLeave } from "../widgets/overlay/tooltip-ops";
+import { isArray } from "../util/isArray";
+export class ColumnGraph extends ColumnBarGraphBase {
+    constructor(config) {
+        super(config);
+    }
+    explore(context, instance) {
+        super.explore(context, instance);
+        let { data, xAxis, yAxis } = instance;
+        if (isArray(data.data)) {
+            data.data.forEach((p, index) => {
+                var y0 = this.y0Field ? p[this.y0Field] : data.y0;
+                var x = p[this.xField];
+                var y = p[this.yField];
+                xAxis.acknowledge(x, data.size, data.offset);
+                if (data.autoSize)
+                    xAxis.book(x, data.stacked ? data.stack : data.name);
+                if (data.stacked) {
+                    yAxis.stacknowledge(data.stack, x, y0);
+                    yAxis.stacknowledge(data.stack, x, y);
+                }
+                else {
+                    if (!this.hiddenBase)
+                        yAxis.acknowledge(y0);
+                    yAxis.acknowledge(y);
+                }
+            });
+        }
+    }
+    prepare(context, instance) {
+        super.prepare(context, instance);
+        let { data } = instance;
+        if (context.pointReducer && isArray(data.data)) {
+            data.data.forEach((p, index) => {
+                context.pointReducer(p[this.xField], p[this.yField], data.name, p, data.data, index);
+            });
+        }
+    }
+    renderGraph(context, instance) {
+        var { data, xAxis, yAxis, store } = instance;
+        if (!isArray(data.data))
+            return false;
+        var isSelected = this.selection.getIsSelectedDelegate(store);
+        return data.data.map((p, i) => {
+            var { offset, size } = data;
+            var y0 = this.y0Field ? p[this.y0Field] : data.y0;
+            var x = p[this.xField];
+            var y = p[this.yField];
+            if (data.autoSize) {
+                var [index, count] = instance.xAxis.locate(x, data.stacked ? data.stack : data.name);
+                offset = (size / count) * (index - count / 2 + 0.5);
+                size = size / count;
+            }
+            var x1 = xAxis.map(x, offset - size / 2);
+            var x2 = xAxis.map(x, offset + size / 2);
+            var y1 = data.stacked ? yAxis.stack(data.stack, x, y0) : yAxis.map(y0);
+            var y2 = data.stacked ? yAxis.stack(data.stack, x, y) : yAxis.map(y);
+            var color = this.colorIndexField ? p[this.colorIndexField] : data.colorIndex;
+            var state = {
+                selected: isSelected(p, i),
+                selectable: !this.selection.isDummy,
+                [`color-${color}`]: color != null,
+            };
+            let mmove, mleave;
+            if (this.tooltip) {
+                mmove = (e) => tooltipMouseMove(e, instance, this.tooltip, {
+                    target: e.target.parent,
+                    data: {
+                        $record: p,
+                    },
+                });
+                mleave = (e) => tooltipMouseLeave(e, instance, this.tooltip, {
+                    target: e.target.parent,
+                    data: {
+                        $record: p,
+                    },
+                });
+            }
+            return (_jsx("rect", { className: this.CSS.element(this.baseClass, "column", state), onClick: (e) => {
+                    this.handleClick(e, instance, p, i);
+                }, x: Math.min(x1, x2), y: Math.min(y1, y2), width: Math.abs(x2 - x1), height: Math.abs(y2 - y1), style: data.style, onMouseMove: mmove, onMouseLeave: mleave, rx: data.borderRadius }, i));
+        });
+    }
+}
+ColumnGraph.prototype.baseClass = "columngraph";
+ColumnGraph.prototype.y0Field = false;
+ColumnGraph.prototype.y0 = 0;
+ColumnGraph.prototype.legendShape = "column";
+ColumnGraph.prototype.hiddenBase = false;
+Widget.alias("columngraph", ColumnGraph);

package/build/charts/Grid.d.ts

@@ -0,0 +1,2 @@
+import { Gridlines } from "./Gridlines";
+export declare const Grid: typeof Gridlines;

package/build/charts/Grid.js

@@ -0,0 +1,3 @@
+import { Gridlines } from "./Gridlines";
+export const Grid = Gridlines;
+console.log("charts/Grid module is deprecated. Use Gridlines instead.");