@unovis/ts 1.1.1-beta.7 → 1.1.1-beta.9

package/components/graph/types.d.ts

@@ -0,0 +1,125 @@
+import { Position } from "../../types/position";
+import { GraphInputLink, GraphInputNode, GraphNodeCore, GraphLinkCore } from "../../types/graph";
+import { Spacing } from "../../types/spacing";
+export declare type GraphNode<N extends GraphInputNode = GraphInputNode, L extends GraphInputLink = GraphInputLink> = GraphNodeCore<N, L> & {
+    x?: number;
+    y?: number;
+    _id?: number | string;
+    _index?: number;
+    _state?: {
+        isDragged?: boolean;
+        fx?: number;
+        fy?: number;
+        selected?: boolean;
+        greyout?: boolean;
+    };
+    _panels?: GraphPanel<N, L>[];
+    _isConnected?: boolean;
+};
+export declare type GraphLink<N extends GraphInputNode = GraphInputNode, L extends GraphInputLink = GraphInputLink> = GraphLinkCore<N, L> & {
+    id?: number | string;
+    source: number | string | GraphNode<N>;
+    target: number | string | GraphNode<N>;
+    _id?: number | string;
+    _direction?: number;
+    _index?: number;
+    _neighbours?: number;
+    _state?: {
+        flowAnimTime?: number;
+        hovered?: boolean;
+        selected?: boolean;
+        greyout?: boolean;
+    };
+};
+export declare enum GraphLayoutType {
+    Circular = "circular",
+    Concentric = "concentric",
+    Parallel = "parallel",
+    ParallelHorizontal = "parallel horizontal",
+    Dagre = "dagre",
+    Force = "force",
+    Elk = "elk"
+}
+export declare type GraphCircleLabel = {
+    text: string;
+    textColor?: string | null;
+    color?: string | null;
+    cursor?: string | null;
+    fontSize?: string | null;
+    radius?: number;
+};
+export declare enum GraphLinkStyle {
+    Dashed = "dashed",
+    Solid = "solid"
+}
+export declare enum GraphLinkArrowStyle {
+    Single = "single",
+    Double = "double"
+}
+export declare enum GraphNodeShape {
+    Circle = "circle",
+    Square = "square",
+    Hexagon = "hexagon",
+    Triangle = "triangle"
+}
+export declare type GraphPanelConfig = {
+    /** Panel nodes references by unique ids */
+    nodes: (string | number)[];
+    /** Panel label */
+    label?: string;
+    /** Position of the label */
+    labelPosition?: Position.Top | Position.Bottom | string;
+    /** Color of the panel's border */
+    borderColor?: string;
+    /** Border width of the panel in pixels */
+    borderWidth?: number;
+    /** Inner padding */
+    padding?: number | Spacing;
+    /** Dashed outline showing that the panel is selected */
+    dashedOutline?: boolean;
+    /** Side icon symbol */
+    sideIconSymbol?: string;
+    /** Size of the icon as a CSS string. e.g.: `12pt` or `12px` */
+    sideIconFontSize?: string;
+    /** Color of the icon */
+    sideIconSymbolColor?: string;
+    /** Shape of the icon's background */
+    sideIconShape?: GraphNodeShape | string;
+    /** Size of the icon's background shape */
+    sideIconShapeSize?: number;
+    /** Stroke color of the icon's background shape */
+    sideIconShapeStroke?: string;
+    /** Cursor, when hovering over the icon */
+    sideIconCursor?: string;
+};
+export declare type GraphPanel<N extends GraphInputNode = GraphInputNode, L extends GraphInputLink = GraphInputLink> = GraphPanelConfig & {
+    _numNodes?: number;
+    _x?: number;
+    _y?: number;
+    _width?: number;
+    _height?: number;
+    _disabled?: boolean;
+    _padding?: Spacing;
+};
+export declare type GraphNodeAnimationState = {
+    endAngle: number;
+    nodeIndex: number;
+    nodeSize?: number;
+    borderWidth?: number;
+};
+export declare type GraphNodeAnimatedElement<T = SVGElement> = T & {
+    _animState: GraphNodeAnimationState;
+};
+export declare type GraphForceLayoutSettings = {
+    /** Preferred Link Distance. Default: `60` */
+    linkDistance?: number;
+    /** Link Strength [0:1]. Default: `0.45` */
+    linkStrength?: number;
+    /** Charge Force (<0 repulsion, >0 attraction). Default: `-500` */
+    charge?: number;
+    /** X-centring force. Default: `0.15` */
+    forceXStrength?: number;
+    /** Y-centring force. Default: `0.25` */
+    forceYStrength?: number;
+};
+export declare type GraphElkLayoutSettings = Record<string, string>;

package/components/graph/types.js

@@ -0,0 +1,30 @@
+var GraphLayoutType;
+(function (GraphLayoutType) {
+    GraphLayoutType["Circular"] = "circular";
+    GraphLayoutType["Concentric"] = "concentric";
+    GraphLayoutType["Parallel"] = "parallel";
+    GraphLayoutType["ParallelHorizontal"] = "parallel horizontal";
+    GraphLayoutType["Dagre"] = "dagre";
+    GraphLayoutType["Force"] = "force";
+    GraphLayoutType["Elk"] = "elk";
+})(GraphLayoutType || (GraphLayoutType = {}));
+var GraphLinkStyle;
+(function (GraphLinkStyle) {
+    GraphLinkStyle["Dashed"] = "dashed";
+    GraphLinkStyle["Solid"] = "solid";
+})(GraphLinkStyle || (GraphLinkStyle = {}));
+var GraphLinkArrowStyle;
+(function (GraphLinkArrowStyle) {
+    GraphLinkArrowStyle["Single"] = "single";
+    GraphLinkArrowStyle["Double"] = "double";
+})(GraphLinkArrowStyle || (GraphLinkArrowStyle = {}));
+var GraphNodeShape;
+(function (GraphNodeShape) {
+    GraphNodeShape["Circle"] = "circle";
+    GraphNodeShape["Square"] = "square";
+    GraphNodeShape["Hexagon"] = "hexagon";
+    GraphNodeShape["Triangle"] = "triangle";
+})(GraphNodeShape || (GraphNodeShape = {}));
+
+export { GraphLayoutType, GraphLinkArrowStyle, GraphLinkStyle, GraphNodeShape };
+//# sourceMappingURL=types.js.map

package/components/graph/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":["../../../src/components/graph/types.ts"],"sourcesContent":["// Types\nimport { Position } from 'types/position'\nimport { GraphInputLink, GraphInputNode, GraphNodeCore, GraphLinkCore } from 'types/graph'\nimport { Spacing } from 'types/spacing'\n\nexport type GraphNode<\n  N extends GraphInputNode = GraphInputNode,\n  L extends GraphInputLink = GraphInputLink,\n> = GraphNodeCore<N, L> & {\n  x?: number;\n  y?: number;\n\n  _id?: number | string;\n  _index?: number;\n  _state?: {\n    isDragged?: boolean;\n    fx?: number;\n    fy?: number;\n    selected?: boolean;\n    greyout?: boolean;\n  };\n\n  _panels?: GraphPanel<N, L>[];\n  _isConnected?: boolean;\n}\n\nexport type GraphLink<\n  N extends GraphInputNode = GraphInputNode,\n  L extends GraphInputLink = GraphInputLink,\n> = GraphLinkCore<N, L> & {\n  id?: number | string;\n  source: number | string | GraphNode<N>;\n  target: number | string | GraphNode<N>;\n\n  _id?: number | string;\n  _direction?: number;\n  _index?: number;\n  _neighbours?: number;\n\n  _state?: {\n    flowAnimTime?: number;\n    hovered?: boolean;\n    selected?: boolean;\n    greyout?: boolean;\n  };\n}\n\nexport enum GraphLayoutType {\n  Circular = 'circular',\n  Concentric = 'concentric',\n  Parallel = 'parallel',\n  ParallelHorizontal = 'parallel horizontal',\n  Dagre = 'dagre',\n  Force = 'force',\n  Elk = 'elk',\n}\n\nexport type GraphCircleLabel = {\n  text: string;\n  textColor?: string | null;\n  color?: string | null;\n  cursor?: string | null;\n  fontSize?: string | null;\n  radius?: number;\n}\n\nexport enum GraphLinkStyle {\n  Dashed = 'dashed',\n  Solid = 'solid',\n}\n\nexport enum GraphLinkArrowStyle {\n  Single = 'single',\n  Double = 'double',\n}\n\nexport enum GraphNodeShape {\n  Circle = 'circle',\n  Square = 'square',\n  Hexagon = 'hexagon',\n  Triangle = 'triangle',\n}\n\nexport type GraphPanelConfig = {\n  /** Panel nodes references by unique ids */\n  nodes: (string|number)[];\n  /** Panel label */\n  label?: string;\n  /** Position of the label */\n  labelPosition?: Position.Top | Position.Bottom | string;\n  /** Color of the panel's border */\n  borderColor?: string;\n  /** Border width of the panel in pixels */\n  borderWidth?: number;\n  /** Inner padding */\n  padding?: number | Spacing;\n  /** Dashed outline showing that the panel is selected */\n  dashedOutline?: boolean;\n  /** Side icon symbol */\n  sideIconSymbol?: string;\n  /** Size of the icon as a CSS string. e.g.: `12pt` or `12px` */\n  sideIconFontSize?: string;\n  /** Color of the icon */\n  sideIconSymbolColor?: string;\n  /** Shape of the icon's background */\n  sideIconShape?: GraphNodeShape | string;\n  /** Size of the icon's background shape */\n  sideIconShapeSize?: number;\n  /** Stroke color of the icon's background shape */\n  sideIconShapeStroke?: string;\n  /** Cursor, when hovering over the icon */\n  sideIconCursor?: string;\n}\n\nexport type GraphPanel<\n  N extends GraphInputNode = GraphInputNode,\n  L extends GraphInputLink = GraphInputLink,\n> = GraphPanelConfig & {\n  _numNodes?: number;\n  _x?: number;\n  _y?: number;\n  _width?: number;\n  _height?: number;\n  _disabled?: boolean;\n  _padding?: Spacing;\n}\n\nexport type GraphNodeAnimationState = {\n  endAngle: number;\n  nodeIndex: number;\n  nodeSize?: number;\n  borderWidth?: number;\n}\n\nexport type GraphNodeAnimatedElement<T = SVGElement> = T & {\n  _animState: GraphNodeAnimationState;\n}\n\nexport type GraphForceLayoutSettings = {\n  /** Preferred Link Distance. Default: `60` */\n  linkDistance?: number;\n  /** Link Strength [0:1]. Default: `0.45` */\n  linkStrength?: number;\n  /** Charge Force (<0 repulsion, >0 attraction). Default: `-500` */\n  charge?: number;\n  /** X-centring force. Default: `0.15` */\n  forceXStrength?: number;\n  /** Y-centring force. Default: `0.25` */\n  forceYStrength?: number;\n}\n\nexport type GraphElkLayoutSettings = Record<string, string>\n"],"names":[],"mappings":"IA+CY,gBAQX;AARD,CAAA,UAAY,eAAe,EAAA;AACzB,IAAA,eAAA,CAAA,UAAA,CAAA,GAAA,UAAqB,CAAA;AACrB,IAAA,eAAA,CAAA,YAAA,CAAA,GAAA,YAAyB,CAAA;AACzB,IAAA,eAAA,CAAA,UAAA,CAAA,GAAA,UAAqB,CAAA;AACrB,IAAA,eAAA,CAAA,oBAAA,CAAA,GAAA,qBAA0C,CAAA;AAC1C,IAAA,eAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,eAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,eAAA,CAAA,KAAA,CAAA,GAAA,KAAW,CAAA;AACb,CAAC,EARW,eAAe,KAAf,eAAe,GAQ1B,EAAA,CAAA,CAAA,CAAA;IAWW,eAGX;AAHD,CAAA,UAAY,cAAc,EAAA;AACxB,IAAA,cAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AACjB,IAAA,cAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACjB,CAAC,EAHW,cAAc,KAAd,cAAc,GAGzB,EAAA,CAAA,CAAA,CAAA;IAEW,oBAGX;AAHD,CAAA,UAAY,mBAAmB,EAAA;AAC7B,IAAA,mBAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AACjB,IAAA,mBAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AACnB,CAAC,EAHW,mBAAmB,KAAnB,mBAAmB,GAG9B,EAAA,CAAA,CAAA,CAAA;IAEW,eAKX;AALD,CAAA,UAAY,cAAc,EAAA;AACxB,IAAA,cAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AACjB,IAAA,cAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AACjB,IAAA,cAAA,CAAA,SAAA,CAAA,GAAA,SAAmB,CAAA;AACnB,IAAA,cAAA,CAAA,UAAA,CAAA,GAAA,UAAqB,CAAA;AACvB,CAAC,EALW,cAAc,KAAd,cAAc,GAKzB,EAAA,CAAA,CAAA;;;;"}

package/components/grouped-bar/config.d.ts

@@ -0,0 +1,36 @@
+import { XYComponentConfigInterface, XYComponentConfig } from "../../core/xy-component/config";
+import { StringAccessor } from "../../types/accessor";
+import { Orientation } from "../../types/position";
+export interface GroupedBarConfigInterface<Datum> extends XYComponentConfigInterface<Datum> {
+    /** Force set the group width in pixels. Default: `undefined` */
+    groupWidth?: number;
+    /** Maximum group width for dynamic sizing. Limits the groupWidth property from the top. Default: `undefined` */
+    groupMaxWidth?: number;
+    /** Expected step between the bar groups in the X axis units.
+     * Needed to correctly calculate the width of the bar groups when there are gaps in the data.
+     * Default: `undefined` */
+    dataStep?: number;
+    /** Fractional padding between the groups in the range of [0,1). Default: `0.05` */
+    groupPadding?: number;
+    /** Fractional padding between the bars in the range of [0,1). Default: `0` */
+    barPadding?: number;
+    /** Rounded bar corners. Boolean or number (to set the radius in pixels explicitly). Default: `2` */
+    roundedCorners?: number | boolean;
+    /** Sets the minimum bar height for better visibility of small values. Default: `1` */
+    barMinHeight?: number;
+    /** Configurable bar cursor when hovering over. Default: `null` */
+    cursor?: StringAccessor<Datum>;
+    /** Chart orientation: `Orientation.Vertical` or `Orientation.Horizontal`. Default `Orientation.Vertical` */
+    orientation?: Orientation | string;
+}
+export declare class GroupedBarConfig<Datum> extends XYComponentConfig<Datum> implements GroupedBarConfigInterface<Datum> {
+    groupMaxWidth: any;
+    groupWidth: any;
+    dataStep: any;
+    groupPadding: number;
+    barPadding: number;
+    roundedCorners: number;
+    barMinHeight: number;
+    cursor: any;
+    orientation: Orientation;
+}

package/components/grouped-bar/config.js

@@ -0,0 +1,20 @@
+import { XYComponentConfig } from '../../core/xy-component/config.js';
+import { Orientation } from '../../types/position.js';
+
+class GroupedBarConfig extends XYComponentConfig {
+    constructor() {
+        super(...arguments);
+        this.groupMaxWidth = undefined;
+        this.groupWidth = undefined;
+        this.dataStep = undefined;
+        this.groupPadding = 0.05;
+        this.barPadding = 0.0;
+        this.roundedCorners = 2;
+        this.barMinHeight = 2;
+        this.cursor = null;
+        this.orientation = Orientation.Vertical;
+    }
+}
+
+export { GroupedBarConfig };
+//# sourceMappingURL=config.js.map

package/components/grouped-bar/config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"config.js","sources":["../../../src/components/grouped-bar/config.ts"],"sourcesContent":["import { XYComponentConfigInterface, XYComponentConfig } from 'core/xy-component/config'\n\n// Types\nimport { StringAccessor } from 'types/accessor'\nimport { Orientation } from 'types/position'\n\nexport interface GroupedBarConfigInterface<Datum> extends XYComponentConfigInterface<Datum> {\n  /** Force set the group width in pixels. Default: `undefined` */\n  groupWidth?: number;\n  /** Maximum group width for dynamic sizing. Limits the groupWidth property from the top. Default: `undefined` */\n  groupMaxWidth?: number;\n  /** Expected step between the bar groups in the X axis units.\n   * Needed to correctly calculate the width of the bar groups when there are gaps in the data.\n   * Default: `undefined` */\n  dataStep?: number;\n  /** Fractional padding between the groups in the range of [0,1). Default: `0.05` */\n  groupPadding?: number;\n  /** Fractional padding between the bars in the range of [0,1). Default: `0` */\n  barPadding?: number;\n  /** Rounded bar corners. Boolean or number (to set the radius in pixels explicitly). Default: `2` */\n  roundedCorners?: number | boolean;\n  /** Sets the minimum bar height for better visibility of small values. Default: `1` */\n  barMinHeight?: number;\n  /** Configurable bar cursor when hovering over. Default: `null` */\n  cursor?: StringAccessor<Datum>;\n  /** Chart orientation: `Orientation.Vertical` or `Orientation.Horizontal`. Default `Orientation.Vertical` */\n  orientation?: Orientation | string;\n}\n\nexport class GroupedBarConfig<Datum> extends XYComponentConfig<Datum> implements GroupedBarConfigInterface<Datum> {\n  groupMaxWidth = undefined\n  groupWidth = undefined\n  dataStep = undefined\n  groupPadding = 0.05\n  barPadding = 0.0\n  roundedCorners = 2\n  barMinHeight = 2\n  cursor = null\n  orientation = Orientation.Vertical\n}\n"],"names":[],"mappings":";;;AA6BM,MAAO,gBAAwB,SAAQ,iBAAwB,CAAA;AAArE,IAAA,WAAA,GAAA;;QACE,IAAa,CAAA,aAAA,GAAG,SAAS,CAAA;QACzB,IAAU,CAAA,UAAA,GAAG,SAAS,CAAA;QACtB,IAAQ,CAAA,QAAA,GAAG,SAAS,CAAA;QACpB,IAAY,CAAA,YAAA,GAAG,IAAI,CAAA;QACnB,IAAU,CAAA,UAAA,GAAG,GAAG,CAAA;QAChB,IAAc,CAAA,cAAA,GAAG,CAAC,CAAA;QAClB,IAAY,CAAA,YAAA,GAAG,CAAC,CAAA;QAChB,IAAM,CAAA,MAAA,GAAG,IAAI,CAAA;AACb,QAAA,IAAA,CAAA,WAAW,GAAG,WAAW,CAAC,QAAQ,CAAA;KACnC;AAAA;;;;"}

package/components/grouped-bar/index.d.ts

@@ -0,0 +1,32 @@
+import { XYComponentCore } from "../../core/xy-component";
+import { NumericAccessor } from "../../types/accessor";
+import { Spacing } from "../../types/spacing";
+import { Direction } from "../../types/direction";
+import { GroupedBarConfig, GroupedBarConfigInterface } from './config';
+import * as s from './style';
+export declare class GroupedBar<Datum> extends XYComponentCore<Datum, GroupedBarConfig<Datum>, GroupedBarConfigInterface<Datum>> {
+    static selectors: typeof s;
+    config: GroupedBarConfig<Datum>;
+    getAccessors: () => NumericAccessor<Datum>[];
+    events: {
+        [x: string]: {
+            mouseover: (d: any, i: any, els: any) => void;
+        };
+    };
+    private _barData;
+    constructor(config?: GroupedBarConfigInterface<Datum>);
+    get bleed(): Spacing;
+    private get dataScale();
+    private get valueScale();
+    private isVertical;
+    _render(customDuration?: number): void;
+    _getValueAxisDirection(): Direction.North | Direction.South;
+    _getVisibleData(): Datum[];
+    _getBarPath(x: number, y: number, width: number, height: number, isNegative: boolean, direction: Direction.North | Direction.South): string;
+    _getGroupWidth(): number;
+    getValueScaleExtent(scaleByVisibleData: boolean): number[];
+    _raiseSelection(d: any, i: any, els: any): void;
+    getDataScaleExtent(): number[];
+    getYDataExtent(scaleByVisibleData: boolean): number[];
+    getXDataExtent(): number[];
+}

package/components/grouped-bar/index.js

@@ -0,0 +1,249 @@
+import { scaleBand } from 'd3-scale';
+import { min, max, range } from 'd3-array';
+import { select } from 'd3';
+import { XYComponentCore } from '../../core/xy-component/index.js';
+import { isArray, getNumber, isNumber, getString, clamp, isEmpty, getMin, getMax, getExtent } from '../../utils/data.js';
+import { roundedRectPath } from '../../utils/path.js';
+import { smartTransition } from '../../utils/d3.js';
+import { getColor } from '../../utils/color.js';
+import { Direction } from '../../types/direction.js';
+import { Orientation } from '../../types/position.js';
+import { GroupedBarConfig } from './config.js';
+import * as style from './style.js';
+import { barGroup, barGroupExit, bar } from './style.js';
+
+class GroupedBar extends XYComponentCore {
+    constructor(config) {
+        super();
+        this.config = new GroupedBarConfig();
+        this.getAccessors = () => isArray(this.config.y) ? this.config.y : [this.config.y];
+        this.events = {
+            [GroupedBar.selectors.barGroup]: {
+                mouseover: this._raiseSelection,
+            },
+            [GroupedBar.selectors.bar]: {
+                mouseover: this._raiseSelection,
+            },
+        };
+        this._barData = [];
+        if (config)
+            this.config.init(config);
+    }
+    get bleed() {
+        this._barData = this._getVisibleData();
+        if (this._barData.length === 0)
+            return { top: 0, bottom: 0, left: 0, right: 0 };
+        // By default, horizontal orientation is "flipped", i.e. the `yDirection` of `XYContainer` is set to `Direction.North`
+        const isHorizontalAndFlipped = !this.isVertical() && (this.dataScale.range()[0] > this.dataScale.range()[1]);
+        const dataDomain = this.dataScale.domain();
+        const halfGroupWidth = this._getGroupWidth() / 2;
+        const dataScaleValues = this._barData.map((d, i) => getNumber(d, this.config.x, i));
+        const firstDataValue = min(dataScaleValues);
+        const lastDataValue = max(dataScaleValues);
+        const firstValuePx = this.dataScale(firstDataValue);
+        const lastValuePx = this.dataScale(lastDataValue);
+        const dataDomainRequiredStart = this.dataScale.invert(firstValuePx + (isHorizontalAndFlipped ? halfGroupWidth : -halfGroupWidth));
+        const dataDomainRequiredEnd = this.dataScale.invert(lastValuePx + (isHorizontalAndFlipped ? -halfGroupWidth : halfGroupWidth));
+        const bleedPxStart = dataDomainRequiredStart <= dataDomain[0] ? this.dataScale(dataDomain[0]) - this.dataScale(dataDomainRequiredStart) : 0;
+        const bleedPxEnd = dataDomainRequiredEnd > dataDomain[1] ? this.dataScale(dataDomainRequiredEnd) - this.dataScale(dataDomain[1]) : 0;
+        return {
+            top: this.isVertical() ? 0 : (isHorizontalAndFlipped ? -bleedPxEnd : bleedPxStart),
+            bottom: this.isVertical() ? 0 : (isHorizontalAndFlipped ? -bleedPxStart : bleedPxEnd),
+            left: this.isVertical() ? bleedPxStart : 0,
+            right: this.isVertical() ? bleedPxEnd : 0,
+        };
+    }
+    get dataScale() {
+        return this.isVertical() ? this.xScale : this.yScale;
+    }
+    get valueScale() {
+        return this.isVertical() ? this.yScale : this.xScale;
+    }
+    isVertical() {
+        return this.config.orientation === Orientation.Vertical;
+    }
+    _render(customDuration) {
+        const { config } = this;
+        const duration = isNumber(customDuration)
+            ? customDuration
+            : config.duration;
+        const groupWidth = this._getGroupWidth();
+        const yAccessors = this.getAccessors();
+        const innerBandScaleRange = [-groupWidth / 2, groupWidth / 2];
+        const innerBandScale = scaleBand()
+            .domain(range(yAccessors.length))
+            .range(innerBandScaleRange)
+            .paddingInner(config.barPadding)
+            .paddingOuter(config.barPadding);
+        const barGroups = this.g
+            .selectAll(`.${barGroup}`)
+            .data(this._barData, (d, i) => { var _a; return `${(_a = getString(d, config.id, i)) !== null && _a !== void 0 ? _a : i}`; });
+        const getBarGroupsTransform = (d, i) => {
+            const v = this.dataScale(getNumber(d, config.x, i));
+            const x = this.isVertical() ? v : 0;
+            const y = this.isVertical() ? 0 : v;
+            return `translate(${x},${y})`;
+        };
+        const barGroupsEnter = barGroups
+            .enter()
+            .append('g')
+            .attr('class', barGroup)
+            .attr('transform', getBarGroupsTransform)
+            .style('opacity', 1);
+        const barGroupsMerged = barGroupsEnter.merge(barGroups);
+        smartTransition(barGroupsMerged, duration)
+            .attr('transform', getBarGroupsTransform)
+            .style('opacity', 1);
+        const barGroupExit$1 = barGroups.exit().attr('class', barGroupExit);
+        smartTransition(barGroupExit$1, duration).style('opacity', 0).remove();
+        // Animate exiting bars going down
+        smartTransition(barGroupExit$1.selectAll(`.${bar}`), duration)
+            .attr('transform', (d, i, e) => {
+            return this.isVertical()
+                ? `translate(0,${this.yScale(0)}) scale(1,0)`
+                : `translate(${this.xScale(0)},0) scale(0,1)`;
+        });
+        const barWidth = innerBandScale.bandwidth();
+        const bars = barGroupsMerged
+            .selectAll(`.${bar}`)
+            .data((d) => yAccessors.map(() => d));
+        const valueAxisDirection = this._getValueAxisDirection();
+        const barsEnter = bars
+            .enter()
+            .append('path')
+            .attr('class', bar)
+            .attr('d', (d, i) => {
+            const x = innerBandScale(i);
+            const y = this.valueScale(0);
+            const width = barWidth;
+            const height = 0;
+            return this._getBarPath(x, y, width, height, false, valueAxisDirection);
+        })
+            .style('fill', (d, i) => getColor(d, config.color, i));
+        const barsMerged = barsEnter.merge(bars);
+        smartTransition(barsMerged, duration)
+            .attr('d', (d, j) => {
+            const x = innerBandScale(j);
+            const width = barWidth;
+            // Todo: Find a way to pass the datum index to `getNumber` below
+            const value = getNumber(d, yAccessors[j]);
+            const isNegative = value < 0;
+            let y = isNegative ? this.valueScale(0) : this.valueScale(value || 0);
+            let height = Math.abs(this.valueScale(0) - this.valueScale(value)) || 0;
+            // Optionally set minimum bar height
+            if (height < config.barMinHeight) {
+                const dir = valueAxisDirection === Direction.North ? -1 : 1;
+                y = this.valueScale(0) + dir * config.barMinHeight;
+                height = config.barMinHeight;
+            }
+            return this._getBarPath(x, y, width, height, isNegative, valueAxisDirection);
+        })
+            .style('fill', (d, i) => getColor(d, config.color, i))
+            .style('cursor', (d, i) => getString(d, config.cursor, i));
+        smartTransition(bars.exit(), duration).remove();
+    }
+    _getValueAxisDirection() {
+        return this.valueScale.range()[0] > this.valueScale.range()[1]
+            ? Direction.North
+            : Direction.South;
+    }
+    _getVisibleData() {
+        const { config, datamodel: { data }, } = this;
+        const groupWidth = this._getGroupWidth();
+        const halfGroupWidth = data.length < 2 ? 0 : groupWidth / 2;
+        const dataScale = this.dataScale;
+        const xHalfGroupWidth = Math.abs(dataScale.invert(halfGroupWidth) -
+            dataScale.invert(0));
+        const filtered = data === null || data === void 0 ? void 0 : data.filter((d, i) => {
+            const v = getNumber(d, config.x, i);
+            const domain = dataScale.domain();
+            const domainMin = +domain[0];
+            const domainMax = +domain[1];
+            return (v >= domainMin - xHalfGroupWidth && v <= domainMax + xHalfGroupWidth);
+        });
+        return filtered;
+    }
+    _getBarPath(x, y, width, height, isNegative, direction) {
+        const { config } = this;
+        const cornerRadius = config.roundedCorners
+            ? isNumber(config.roundedCorners)
+                ? +config.roundedCorners
+                : width / 2
+            : 0;
+        const cornerRadiusClamped = clamp(cornerRadius, 0, Math.min(height, width) / 2);
+        const isNorthDirected = direction === Direction.North;
+        const roundedTop = this.isVertical() && isNegative !== isNorthDirected;
+        const roundedBottom = this.isVertical() && isNegative === isNorthDirected;
+        const roundedLeft = !this.isVertical() && isNegative;
+        const roundedRight = !this.isVertical() && !isNegative;
+        return roundedRectPath({
+            x: this.isVertical() ? x : y + (isNorthDirected ? 0 : -height),
+            y: this.isVertical() ? y + (isNorthDirected ? 0 : -height) : x,
+            w: this.isVertical() ? width : height,
+            h: this.isVertical() ? height : width,
+            tl: roundedTop || roundedLeft,
+            tr: roundedTop || roundedRight,
+            bl: roundedBottom || roundedLeft,
+            br: roundedBottom || roundedRight,
+            r: cornerRadiusClamped,
+        });
+    }
+    _getGroupWidth() {
+        const { config, datamodel: { data }, } = this;
+        if (isEmpty(data))
+            return 0;
+        if (config.groupWidth) {
+            return min([config.groupWidth, config.groupMaxWidth]);
+        }
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        const isOrdinal = this.dataScale.bandwidth;
+        const domain = (this.dataScale.domain ? this.dataScale.domain() : []);
+        const domainLength = isOrdinal ? domain.length : domain[1] - domain[0];
+        // If the dataStep property is provided the amount of data elements is calculates as domainLength / dataStep
+        //   otherwise we get the number of data elements within the domain range
+        // Or if the scale is ordinal we use data.length
+        let dataSize = 1 + domainLength / config.dataStep ||
+            (!isOrdinal &&
+                data.filter((d, i) => {
+                    const value = getNumber(d, config.x, i);
+                    return value >= domain[0] && value <= domain[1];
+                }).length) ||
+            data.length;
+        // We increase the dataSize by 1 to take into account possible additional domain space
+        if (!isOrdinal && dataSize >= 2)
+            dataSize += 1;
+        const c = dataSize < 2 ? 1 : 1 - config.groupPadding;
+        const groupWidth = (c * (this.isVertical() ? this._width : this._height)) / dataSize;
+        return min([groupWidth, config.groupMaxWidth]);
+    }
+    getValueScaleExtent(scaleByVisibleData) {
+        const { datamodel } = this;
+        const yAccessors = this.getAccessors();
+        const data = scaleByVisibleData ? this._getVisibleData() : datamodel.data;
+        const min = getMin(data, ...yAccessors);
+        const max = getMax(data, ...yAccessors);
+        return [min > 0 ? 0 : min, max < 0 ? 0 : max];
+    }
+    _raiseSelection(d, i, els) {
+        select(els[i]).raise();
+    }
+    getDataScaleExtent() {
+        const { config, datamodel } = this;
+        return getExtent(datamodel.data, config.x);
+    }
+    getYDataExtent(scaleByVisibleData) {
+        return this.isVertical()
+            ? this.getValueScaleExtent(scaleByVisibleData)
+            : this.getDataScaleExtent();
+    }
+    getXDataExtent() {
+        return this.isVertical()
+            ? this.getDataScaleExtent()
+            : this.getValueScaleExtent(false);
+    }
+}
+GroupedBar.selectors = style;
+
+export { GroupedBar };
+//# sourceMappingURL=index.js.map

package/components/grouped-bar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/grouped-bar/index.ts"],"sourcesContent":["import { scaleBand } from 'd3-scale'\nimport { min, max, range } from 'd3-array'\nimport { select } from 'd3'\n\n// Core\nimport { XYComponentCore } from 'core/xy-component'\n\n// Utils\nimport { clamp, getExtent, getMax, getMin, getNumber, getString, isArray, isEmpty, isNumber } from 'utils/data'\nimport { roundedRectPath } from 'utils/path'\nimport { smartTransition } from 'utils/d3'\nimport { getColor } from 'utils/color'\n\n// Types\nimport { NumericAccessor } from 'types/accessor'\nimport { Spacing } from 'types/spacing'\nimport { Direction } from 'types/direction'\nimport { Orientation } from 'types/position'\nimport { ContinuousScale } from 'types/scale'\n\n// Config\nimport { GroupedBarConfig, GroupedBarConfigInterface } from './config'\n\n// Styles\nimport * as s from './style'\n\nexport class GroupedBar<Datum> extends XYComponentCore<Datum, GroupedBarConfig<Datum>, GroupedBarConfigInterface<Datum>> {\n  static selectors = s\n  config: GroupedBarConfig<Datum> = new GroupedBarConfig()\n  getAccessors = (): NumericAccessor<Datum>[] =>\n    isArray(this.config.y) ? this.config.y : [this.config.y]\n\n  events = {\n    [GroupedBar.selectors.barGroup]: {\n      mouseover: this._raiseSelection,\n    },\n    [GroupedBar.selectors.bar]: {\n      mouseover: this._raiseSelection,\n    },\n  }\n\n  private _barData: Datum[] = []\n\n  constructor (config?: GroupedBarConfigInterface<Datum>) {\n    super()\n    if (config) this.config.init(config)\n  }\n\n  get bleed (): Spacing {\n    this._barData = this._getVisibleData()\n    if (this._barData.length === 0) return { top: 0, bottom: 0, left: 0, right: 0 }\n\n    // By default, horizontal orientation is \"flipped\", i.e. the `yDirection` of `XYContainer` is set to `Direction.North`\n    const isHorizontalAndFlipped = !this.isVertical() && (this.dataScale.range()[0] > this.dataScale.range()[1])\n    const dataDomain = this.dataScale.domain()\n    const halfGroupWidth = this._getGroupWidth() / 2\n\n    const dataScaleValues = this._barData.map((d, i) => getNumber(d, this.config.x, i))\n    const firstDataValue = min(dataScaleValues)\n    const lastDataValue = max(dataScaleValues)\n    const firstValuePx = this.dataScale(firstDataValue)\n    const lastValuePx = this.dataScale(lastDataValue)\n\n    const dataDomainRequiredStart = this.dataScale.invert(firstValuePx + (isHorizontalAndFlipped ? halfGroupWidth : -halfGroupWidth))\n    const dataDomainRequiredEnd = this.dataScale.invert(lastValuePx + (isHorizontalAndFlipped ? -halfGroupWidth : halfGroupWidth))\n    const bleedPxStart = dataDomainRequiredStart <= dataDomain[0] ? this.dataScale(dataDomain[0]) - this.dataScale(dataDomainRequiredStart) : 0\n    const bleedPxEnd = dataDomainRequiredEnd > dataDomain[1] ? this.dataScale(dataDomainRequiredEnd) - this.dataScale(dataDomain[1]) : 0\n\n    return {\n      top: this.isVertical() ? 0 : (isHorizontalAndFlipped ? -bleedPxEnd : bleedPxStart),\n      bottom: this.isVertical() ? 0 : (isHorizontalAndFlipped ? -bleedPxStart : bleedPxEnd),\n      left: this.isVertical() ? bleedPxStart : 0,\n      right: this.isVertical() ? bleedPxEnd : 0,\n    }\n  }\n\n  private get dataScale (): ContinuousScale {\n    return this.isVertical() ? this.xScale : this.yScale\n  }\n\n  private get valueScale (): ContinuousScale {\n    return this.isVertical() ? this.yScale : this.xScale\n  }\n\n  private isVertical (): boolean {\n    return this.config.orientation === Orientation.Vertical\n  }\n\n  _render (customDuration?: number): void {\n    const { config } = this\n    const duration = isNumber(customDuration)\n      ? customDuration\n      : config.duration\n    const groupWidth = this._getGroupWidth()\n\n    const yAccessors = this.getAccessors()\n    const innerBandScaleRange = [-groupWidth / 2, groupWidth / 2] as [\n      number,\n      number,\n    ]\n    const innerBandScale = scaleBand<number>()\n      .domain(range(yAccessors.length))\n      .range(innerBandScaleRange)\n      .paddingInner(config.barPadding)\n      .paddingOuter(config.barPadding)\n\n    const barGroups = this.g\n      .selectAll<SVGGElement, Datum>(`.${s.barGroup}`)\n      .data(this._barData, (d, i) => `${getString(d, config.id, i) ?? i}`)\n\n    const getBarGroupsTransform = (d: Datum, i: number): string => {\n      const v = this.dataScale(getNumber(d, config.x, i))\n      const x = this.isVertical() ? v : 0\n      const y = this.isVertical() ? 0 : v\n      return `translate(${x},${y})`\n    }\n\n    const barGroupsEnter = barGroups\n      .enter()\n      .append('g')\n      .attr('class', s.barGroup)\n      .attr('transform', getBarGroupsTransform)\n      .style('opacity', 1)\n\n    const barGroupsMerged = barGroupsEnter.merge(barGroups)\n    smartTransition(barGroupsMerged, duration)\n      .attr('transform', getBarGroupsTransform)\n      .style('opacity', 1)\n\n    const barGroupExit = barGroups.exit().attr('class', s.barGroupExit)\n    smartTransition(barGroupExit, duration).style('opacity', 0).remove()\n\n    // Animate exiting bars going down\n    smartTransition(barGroupExit.selectAll<SVGPathElement, Datum>(`.${s.bar}`), duration)\n      .attr('transform', (d, i, e) => {\n        return this.isVertical()\n          ? `translate(0,${this.yScale(0)}) scale(1,0)`\n          : `translate(${this.xScale(0)},0) scale(0,1)`\n      })\n\n    const barWidth = innerBandScale.bandwidth()\n    const bars = barGroupsMerged\n      .selectAll<SVGPathElement, Datum>(`.${s.bar}`)\n      .data((d) => yAccessors.map(() => d))\n\n    const valueAxisDirection = this._getValueAxisDirection()\n    const barsEnter = bars\n      .enter()\n      .append('path')\n      .attr('class', s.bar)\n      .attr('d', (d, i) => {\n        const x = innerBandScale(i)\n        const y = this.valueScale(0)\n        const width = barWidth\n        const height = 0\n        return this._getBarPath(x, y, width, height, false, valueAxisDirection)\n      })\n      .style('fill', (d, i) => getColor(d, config.color, i))\n\n    const barsMerged = barsEnter.merge(bars)\n    smartTransition(barsMerged, duration)\n      .attr('d', (d, j) => {\n        const x = innerBandScale(j)\n        const width = barWidth\n\n        // Todo: Find a way to pass the datum index to `getNumber` below\n        const value = getNumber(d, yAccessors[j])\n        const isNegative = value < 0\n        let y = isNegative ? this.valueScale(0) : this.valueScale(value || 0)\n        let height = Math.abs(this.valueScale(0) - this.valueScale(value)) || 0\n\n        // Optionally set minimum bar height\n        if (height < config.barMinHeight) {\n          const dir = valueAxisDirection === Direction.North ? -1 : 1\n          y = this.valueScale(0) + dir * config.barMinHeight\n          height = config.barMinHeight\n        }\n        return this._getBarPath(x, y, width, height, isNegative, valueAxisDirection)\n      })\n      .style('fill', (d, i) => getColor(d, config.color, i))\n      .style('cursor', (d, i) => getString(d, config.cursor, i))\n\n    smartTransition(bars.exit(), duration).remove()\n  }\n\n  _getValueAxisDirection (): Direction.North | Direction.South {\n    return this.valueScale.range()[0] > this.valueScale.range()[1]\n      ? Direction.North\n      : Direction.South\n  }\n\n  _getVisibleData (): Datum[] {\n    const {\n      config,\n      datamodel: { data },\n    } = this\n    const groupWidth = this._getGroupWidth()\n    const halfGroupWidth = data.length < 2 ? 0 : groupWidth / 2\n\n    const dataScale = this.dataScale\n    const xHalfGroupWidth = Math.abs(\n      (dataScale.invert(halfGroupWidth) as number) -\n        (dataScale.invert(0) as number)\n    )\n    const filtered = data?.filter((d, i) => {\n      const v = getNumber(d, config.x, i)\n      const domain: number[] | Date[] = dataScale.domain()\n      const domainMin = +domain[0]\n      const domainMax = +domain[1]\n      return (\n        v >= domainMin - xHalfGroupWidth && v <= domainMax + xHalfGroupWidth\n      )\n    })\n\n    return filtered\n  }\n\n  _getBarPath (\n    x: number,\n    y: number,\n    width: number,\n    height: number,\n    isNegative: boolean,\n    direction: Direction.North | Direction.South\n  ): string {\n    const { config } = this\n\n    const cornerRadius = config.roundedCorners\n      ? isNumber(config.roundedCorners)\n        ? +config.roundedCorners\n        : width / 2\n      : 0\n    const cornerRadiusClamped = clamp(\n      cornerRadius,\n      0,\n      Math.min(height, width) / 2\n    )\n\n    const isNorthDirected = direction === Direction.North\n    const roundedTop = this.isVertical() && isNegative !== isNorthDirected\n    const roundedBottom = this.isVertical() && isNegative === isNorthDirected\n    const roundedLeft = !this.isVertical() && isNegative\n    const roundedRight = !this.isVertical() && !isNegative\n\n    return roundedRectPath({\n      x: this.isVertical() ? x : y + (isNorthDirected ? 0 : -height),\n      y: this.isVertical() ? y + (isNorthDirected ? 0 : -height) : x,\n      w: this.isVertical() ? width : height,\n      h: this.isVertical() ? height : width,\n      tl: roundedTop || roundedLeft,\n      tr: roundedTop || roundedRight,\n      bl: roundedBottom || roundedLeft,\n      br: roundedBottom || roundedRight,\n      r: cornerRadiusClamped,\n    })\n  }\n\n  _getGroupWidth (): number {\n    const {\n      config,\n      datamodel: { data },\n    } = this\n    if (isEmpty(data)) return 0\n    if (config.groupWidth) { return min([config.groupWidth, config.groupMaxWidth]) }\n\n    // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n    // @ts-ignore\n    const isOrdinal = this.dataScale.bandwidth\n    const domain = (\n      this.dataScale.domain ? this.dataScale.domain() : []\n    ) as number[]\n    const domainLength = isOrdinal ? domain.length : domain[1] - domain[0]\n\n    // If the dataStep property is provided the amount of data elements is calculates as domainLength / dataStep\n    //   otherwise we get the number of data elements within the domain range\n    // Or if the scale is ordinal we use data.length\n    let dataSize =\n      1 + domainLength / config.dataStep ||\n      (!isOrdinal &&\n        data.filter((d, i) => {\n          const value = getNumber(d, config.x, i)\n          return value >= domain[0] && value <= domain[1]\n        }).length) ||\n      data.length\n\n    // We increase the dataSize by 1 to take into account possible additional domain space\n    if (!isOrdinal && dataSize >= 2) dataSize += 1\n\n    const c = dataSize < 2 ? 1 : 1 - config.groupPadding\n    const groupWidth =\n      (c * (this.isVertical() ? this._width : this._height)) / dataSize\n    return min([groupWidth, config.groupMaxWidth])\n  }\n\n  getValueScaleExtent (scaleByVisibleData: boolean): number[] {\n    const { datamodel } = this\n    const yAccessors = this.getAccessors()\n\n    const data = scaleByVisibleData ? this._getVisibleData() : datamodel.data\n    const min = getMin(data, ...yAccessors)\n    const max = getMax(data, ...yAccessors)\n    return [min > 0 ? 0 : min, max < 0 ? 0 : max]\n  }\n\n  _raiseSelection (d, i, els): void {\n    select(els[i]).raise()\n  }\n\n  getDataScaleExtent (): number[] {\n    const { config, datamodel } = this\n    return getExtent(datamodel.data, config.x)\n  }\n\n  getYDataExtent (scaleByVisibleData: boolean): number[] {\n    return this.isVertical()\n      ? this.getValueScaleExtent(scaleByVisibleData)\n      : this.getDataScaleExtent()\n  }\n\n  getXDataExtent (): number[] {\n    return this.isVertical()\n      ? this.getDataScaleExtent()\n      : this.getValueScaleExtent(false)\n  }\n}\n"],"names":["s.barGroup","barGroupExit","s.barGroupExit","s.bar","s"],"mappings":"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"}

package/components/grouped-bar/style.d.ts

@@ -0,0 +1,5 @@
+export declare const root: string;
+export declare const globalStyles: void;
+export declare const bar: string;
+export declare const barGroup: string;
+export declare const barGroupExit: string;

package/{src/components/grouped-bar/style.ts → components/grouped-bar/style.js}

@@ -1,10 +1,9 @@
-import { css, injectGlobal } from '@emotion/css'
+import { css, injectGlobal } from '@emotion/css';
 
-export const root = css`
+const root = css `
   label: grouped-bar-component;
-`
-
-export const globalStyles = injectGlobal`
+`;
+const globalStyles = injectGlobal `
   :root {
     --vis-grouped-bar-cursor: default;
     --vis-grouped-bar-fill-color: var(--vis-color-main);
@@ -21,9 +20,8 @@ export const globalStyles = injectGlobal`
   body.theme-dark ${`.${root}`} {
     --vis-grouped-bar-stroke-color: var(--vis-dark-grouped-bar-stroke-color);
   }
-`
-
-export const bar = css`
+`;
+const bar = css `
   label: bar;
   fill: var(--vis-grouped-bar-fill-color);
   stroke: var(--vis-grouped-bar-stroke-color);
@@ -34,12 +32,13 @@ export const bar = css`
     stroke-width: var(--vis-grouped-bar-hover-stroke-width);
     stroke: var(--vis-grouped-bar-hover-stroke-color);
   }
-`
-
-export const barGroup = css`
+`;
+const barGroup = css `
   label: barGroup;
-`
-
-export const barGroupExit = css`
+`;
+const barGroupExit = css `
   label: barGroupExit;
-`
+`;
+
+export { bar, barGroup, barGroupExit, globalStyles, root };
+//# sourceMappingURL=style.js.map

package/components/grouped-bar/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","sources":["../../../src/components/grouped-bar/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\n\nexport const root = css`\n  label: grouped-bar-component;\n`\n\nexport const globalStyles = injectGlobal`\n  :root {\n    --vis-grouped-bar-cursor: default;\n    --vis-grouped-bar-fill-color: var(--vis-color-main);\n    --vis-grouped-bar-stroke-color: none;\n    --vis-grouped-bar-stroke-width: 0px;\n    --vis-grouped-bar-hover-stroke-width: 1px;\n    --vis-grouped-bar-hover-stroke-color: none;\n\n\n    /* Dark Theme */\n    --vis-dark-grouped-bar-stroke-color: none;\n  }\n\n  body.theme-dark ${`.${root}`} {\n    --vis-grouped-bar-stroke-color: var(--vis-dark-grouped-bar-stroke-color);\n  }\n`\n\nexport const bar = css`\n  label: bar;\n  fill: var(--vis-grouped-bar-fill-color);\n  stroke: var(--vis-grouped-bar-stroke-color);\n  stroke-width: var(--vis-grouped-bar-stroke-width);\n  cursor: var(--vis-grouped-bar-cursor);\n\n  &:hover {\n    stroke-width: var(--vis-grouped-bar-hover-stroke-width);\n    stroke: var(--vis-grouped-bar-hover-stroke-color);\n  }\n`\n\nexport const barGroup = css`\n  label: barGroup;\n`\n\nexport const barGroupExit = css`\n  label: barGroupExit;\n`\n"],"names":[],"mappings":";;AAEO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,YAAY,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;AAcpB,kBAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAE,CAAA,CAAA;;;EAG7B;AAEM,MAAM,GAAG,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;EAWrB;AAEM,MAAM,QAAQ,GAAG,GAAG,CAAA,CAAA;;EAE1B;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;;;;;"}