@visactor/vchart-theme-demo-component 1.11.1 → 1.11.2-alpha.0

package/cjs/spec/funnel.js

@@ -0,0 +1,36 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.funnelSpec = void 0, exports.funnelSpec = {
+    type: "funnel",
+    categoryField: "name",
+    valueField: "value",
+    data: [ {
+        id: "funnel",
+        values: [ {
+            value: 100,
+            name: "Step1"
+        }, {
+            value: 80,
+            name: "Step2"
+        }, {
+            value: 60,
+            name: "Step3"
+        }, {
+            value: 40,
+            name: "Step4"
+        }, {
+            value: 20,
+            name: "Step5"
+        } ]
+    } ],
+    label: {
+        visible: !0
+    },
+    legends: {
+        visible: !0,
+        orient: "bottom"
+    }
+};
+//# sourceMappingURL=funnel.js.map

package/cjs/spec/funnel.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/spec/funnel.ts"],"names":[],"mappings":";;;AAAa,QAAA,UAAU,GAAG;IACxB,IAAI,EAAE,QAAQ;IACd,aAAa,EAAE,MAAM;IACrB,UAAU,EAAE,OAAO;IACnB,IAAI,EAAE;QACJ;YACE,EAAE,EAAE,QAAQ;YACZ,MAAM,EAAE;gBACN;oBACE,KAAK,EAAE,GAAG;oBACV,IAAI,EAAE,OAAO;iBACd;gBACD;oBACE,KAAK,EAAE,EAAE;oBACT,IAAI,EAAE,OAAO;iBACd;gBACD;oBACE,KAAK,EAAE,EAAE;oBACT,IAAI,EAAE,OAAO;iBACd;gBACD;oBACE,KAAK,EAAE,EAAE;oBACT,IAAI,EAAE,OAAO;iBACd;gBACD;oBACE,KAAK,EAAE,EAAE;oBACT,IAAI,EAAE,OAAO;iBACd;aACF;SACF;KACF;IACD,KAAK,EAAE;QACL,OAAO,EAAE,IAAI;KACd;IACD,OAAO,EAAE;QACP,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,QAAQ;KACjB;CACF,CAAC","file":"funnel.js","sourcesContent":["export const funnelSpec = {\n  type: 'funnel',\n  categoryField: 'name',\n  valueField: 'value',\n  data: [\n    {\n      id: 'funnel',\n      values: [\n        {\n          value: 100,\n          name: 'Step1'\n        },\n        {\n          value: 80,\n          name: 'Step2'\n        },\n        {\n          value: 60,\n          name: 'Step3'\n        },\n        {\n          value: 40,\n          name: 'Step4'\n        },\n        {\n          value: 20,\n          name: 'Step5'\n        }\n      ]\n    }\n  ],\n  label: {\n    visible: true\n  },\n  legends: {\n    visible: true,\n    orient: 'bottom'\n  }\n};\n"]}

package/cjs/spec/gauge.d.ts

@@ -0,0 +1,58 @@
+export declare const gaugeSpec: {
+    type: string;
+    data: {
+        id: string;
+        values: {
+            type: string;
+            value: number;
+        }[];
+    }[];
+    categoryField: string;
+    valueField: string;
+    outerRadius: number;
+    innerRadius: number;
+    startAngle: number;
+    endAngle: number;
+    indicator: {
+        visible: boolean;
+        title: {
+            style: {
+                text: string;
+                fontSize: number;
+                fontWeight: number;
+            };
+        };
+    }[];
+    axes: {
+        type: string;
+        orient: string;
+        min: number;
+        max: number;
+        offset: number;
+        radius: number;
+        grid: {
+            visible: boolean;
+        };
+        tick: {
+            visible: boolean;
+            tickSize: number;
+            style: {
+                lineWidth: number;
+            };
+        };
+        subTick: {
+            visible: boolean;
+            tickSize: number;
+            style: {
+                lineWidth: number;
+            };
+        };
+        label: {
+            visible: boolean;
+            style: {
+                fill: string;
+                fontSize: number;
+            };
+        };
+    }[];
+};

package/cjs/spec/gauge.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.gaugeSpec = void 0, exports.gaugeSpec = {
+    type: "gauge",
+    data: [ {
+        id: "id0",
+        values: [ {
+            type: "目标A",
+            value: 45
+        } ]
+    } ],
+    categoryField: "type",
+    valueField: "value",
+    outerRadius: .8,
+    innerRadius: .7,
+    startAngle: -180,
+    endAngle: 0,
+    indicator: [ {
+        visible: !0,
+        title: {
+            style: {
+                text: "45",
+                fontSize: 60,
+                fontWeight: 800
+            }
+        }
+    } ],
+    axes: [ {
+        type: "linear",
+        orient: "angle",
+        min: 0,
+        max: 50,
+        offset: 20,
+        radius: .81,
+        grid: {
+            visible: !1
+        },
+        tick: {
+            visible: !0,
+            tickSize: 5,
+            style: {
+                lineWidth: 1
+            }
+        },
+        subTick: {
+            visible: !0,
+            tickSize: 3,
+            style: {
+                lineWidth: 1
+            }
+        },
+        label: {
+            visible: !0,
+            style: {
+                fill: "black",
+                fontSize: 12
+            }
+        }
+    } ]
+};
+//# sourceMappingURL=gauge.js.map

package/cjs/spec/gauge.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/spec/gauge.ts"],"names":[],"mappings":";;;AAAa,QAAA,SAAS,GAAG;IACvB,IAAI,EAAE,OAAO;IACb,IAAI,EAAE;QACJ;YACE,EAAE,EAAE,KAAK;YACT,MAAM,EAAE;gBACN;oBACE,IAAI,EAAE,KAAK;oBACX,KAAK,EAAE,EAAE;iBACV;aACF;SACF;KACF;IACD,aAAa,EAAE,MAAM;IACrB,UAAU,EAAE,OAAO;IACnB,WAAW,EAAE,GAAG;IAChB,WAAW,EAAE,GAAG;IAChB,UAAU,EAAE,CAAC,GAAG;IAChB,QAAQ,EAAE,CAAC;IACX,SAAS,EAAE;QACT;YACE,OAAO,EAAE,IAAI;YACb,KAAK,EAAE;gBACL,KAAK,EAAE;oBACL,IAAI,EAAE,IAAI;oBACV,QAAQ,EAAE,EAAE;oBACZ,UAAU,EAAE,GAAG;iBAChB;aACF;SACF;KACF;IACD,IAAI,EAAE;QACJ;YACE,IAAI,EAAE,QAAQ;YACd,MAAM,EAAE,OAAO;YACf,GAAG,EAAE,CAAC;YACN,GAAG,EAAE,EAAE;YACP,MAAM,EAAE,EAAE;YACV,MAAM,EAAE,IAAI;YACZ,IAAI,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE;YACxB,IAAI,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EAAE;YAC7D,OAAO,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,SAAS,EAAE,CAAC,EAAE,EAAE;YAChE,KAAK,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE;SACjE;KACF;CACF,CAAC","file":"gauge.js","sourcesContent":["export const gaugeSpec = {\n  type: 'gauge',\n  data: [\n    {\n      id: 'id0',\n      values: [\n        {\n          type: '目标A',\n          value: 45\n        }\n      ]\n    }\n  ],\n  categoryField: 'type',\n  valueField: 'value',\n  outerRadius: 0.8,\n  innerRadius: 0.7,\n  startAngle: -180,\n  endAngle: 0,\n  indicator: [\n    {\n      visible: true,\n      title: {\n        style: {\n          text: '45',\n          fontSize: 60,\n          fontWeight: 800\n        }\n      }\n    }\n  ],\n  axes: [\n    {\n      type: 'linear',\n      orient: 'angle',\n      min: 0,\n      max: 50,\n      offset: 20,\n      radius: 0.81,\n      grid: { visible: false },\n      tick: { visible: true, tickSize: 5, style: { lineWidth: 1 } },\n      subTick: { visible: true, tickSize: 3, style: { lineWidth: 1 } },\n      label: { visible: true, style: { fill: 'black', fontSize: 12 } }\n    }\n  ]\n};\n"]}

package/cjs/spec/horizontalBar.d.ts

@@ -0,0 +1,99 @@
+export declare const horizontalBarSpec: {
+    type: string;
+    data: {
+        id: string;
+        values: {
+            province: string;
+            value: number;
+            type: string;
+        }[];
+    }[];
+    direction: string;
+    xField: string;
+    yField: string;
+    seriesField: string;
+    padding: {
+        right: number;
+        left: number;
+    };
+    axes: ({
+        orient: string;
+        visible: boolean;
+        nice: boolean;
+        maxWidth?: undefined;
+        label?: undefined;
+        domainLine?: undefined;
+        tick?: undefined;
+    } | {
+        orient: string;
+        maxWidth: number;
+        label: {
+            autoLimit: boolean;
+        };
+        domainLine: {
+            visible: boolean;
+        };
+        tick: {
+            visible: boolean;
+        };
+        visible?: undefined;
+        nice?: undefined;
+    })[];
+    stackCornerRadius: number;
+    bar: {
+        style: {
+            cornerRadius: number[];
+            height: number;
+        };
+    };
+    barBackground: {
+        visible: boolean;
+        style: {
+            cornerRadius: number[];
+            height: number;
+        };
+        state: {
+            hover: {
+                stroke: string;
+                lineWidth: number;
+            };
+        };
+    };
+    extensionMark: {
+        type: string;
+        dataId: string;
+        visible: boolean;
+        style: {
+            text: (datum: any) => any;
+            fontSize: number;
+            x: (datum: any, ctx: any) => any;
+            y: (datum: any, ctx: any) => any;
+            textBaseline: string;
+            textAlign: string;
+            fill: string;
+            size: number;
+        };
+    }[];
+    crosshair: {
+        yField: {
+            visible: boolean;
+        };
+    };
+    tooltip: {
+        mark: {
+            title: {
+                visible: boolean;
+            };
+        };
+        dimension: {
+            title: {
+                visible: boolean;
+            };
+        };
+        style: {
+            shape: {
+                shapeType: string;
+            };
+        };
+    };
+};

package/cjs/spec/horizontalBar.js

@@ -0,0 +1,134 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.horizontalBarSpec = void 0, exports.horizontalBarSpec = {
+    type: "bar",
+    data: [ {
+        id: "barData",
+        values: [ {
+            province: "北京",
+            value: 3080,
+            type: "top1"
+        }, {
+            province: "天津",
+            value: 2880,
+            type: "top2"
+        }, {
+            province: "重庆",
+            value: 880,
+            type: "top3"
+        }, {
+            province: "深圳",
+            value: 780,
+            type: "common"
+        }, {
+            province: "广州",
+            value: 680,
+            type: "common"
+        }, {
+            province: "山东",
+            value: 580,
+            type: "common"
+        }, {
+            province: "浙江",
+            value: 480,
+            type: "common"
+        }, {
+            province: "福建",
+            value: 100,
+            type: "common"
+        }, {
+            province: "石家庄",
+            value: 100,
+            type: "common"
+        }, {
+            province: "广西壮族自治区",
+            value: 100,
+            type: "common"
+        } ]
+    } ],
+    direction: "horizontal",
+    xField: "value",
+    yField: "province",
+    seriesField: "province",
+    padding: {
+        right: 50,
+        left: 10
+    },
+    axes: [ {
+        orient: "bottom",
+        visible: !1,
+        nice: !1
+    }, {
+        orient: "left",
+        maxWidth: 65,
+        label: {
+            autoLimit: !0
+        },
+        domainLine: {
+            visible: !1
+        },
+        tick: {
+            visible: !1
+        }
+    } ],
+    stackCornerRadius: 0,
+    bar: {
+        style: {
+            cornerRadius: [ 5, 5, 5, 5 ],
+            height: 10
+        }
+    },
+    barBackground: {
+        visible: !0,
+        style: {
+            cornerRadius: [ 5, 5, 5, 5 ],
+            height: 10
+        },
+        state: {
+            hover: {
+                stroke: "#D9D9D9",
+                lineWidth: 1
+            }
+        }
+    },
+    extensionMark: [ {
+        type: "text",
+        dataId: "barData",
+        visible: !0,
+        style: {
+            text: datum => datum.value,
+            fontSize: 12,
+            x: (datum, ctx) => ctx.getRegion().getLayoutRect().width + 10,
+            y: (datum, ctx) => ctx.valueToY([ datum.province ]) + ctx.yBandwidth() / 2,
+            textBaseline: "middle",
+            textAlign: "left",
+            fill: "#595959",
+            size: 20
+        }
+    } ],
+    crosshair: {
+        yField: {
+            visible: !1
+        }
+    },
+    tooltip: {
+        mark: {
+            title: {
+                visible: !1
+            }
+        },
+        dimension: {
+            title: {
+                visible: !1
+            }
+        },
+        style: {
+            shape: {
+                shapeType: "circle"
+            }
+        }
+    }
+};
+//# sourceMappingURL=horizontalBar.js.map

package/cjs/spec/horizontalBar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/spec/horizontalBar.ts"],"names":[],"mappings":"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","file":"horizontalBar.js","sourcesContent":["export const horizontalBarSpec = {\n  type: 'bar',\n  data: [\n    {\n      id: 'barData',\n      values: [\n        {\n          province: '北京',\n          value: 3080,\n          type: 'top1'\n        },\n        {\n          province: '天津',\n          value: 2880,\n          type: 'top2'\n        },\n        {\n          province: '重庆',\n          value: 880,\n          type: 'top3'\n        },\n        {\n          province: '深圳',\n          value: 780,\n          type: 'common'\n        },\n        {\n          province: '广州',\n          value: 680,\n          type: 'common'\n        },\n        {\n          province: '山东',\n          value: 580,\n          type: 'common'\n        },\n        {\n          province: '浙江',\n          value: 480,\n          type: 'common'\n        },\n        {\n          province: '福建',\n          value: 100,\n          type: 'common'\n        },\n        {\n          province: '石家庄',\n          value: 100,\n          type: 'common'\n        },\n        {\n          province: '广西壮族自治区',\n          value: 100,\n          type: 'common'\n        }\n      ]\n    }\n  ],\n  direction: 'horizontal',\n  xField: 'value',\n  yField: 'province',\n  seriesField: 'province',\n  padding: { right: 50, left: 10 },\n  axes: [\n    {\n      orient: 'bottom',\n      visible: false,\n      nice: false\n    },\n    {\n      orient: 'left',\n      maxWidth: 65,\n      label: {\n        autoLimit: true\n      },\n      domainLine: {\n        visible: false\n      },\n      tick: {\n        visible: false\n      }\n    }\n  ],\n  stackCornerRadius: 0,\n  bar: {\n    style: {\n      cornerRadius: [5, 5, 5, 5],\n      height: 10\n    }\n  },\n  barBackground: {\n    visible: true,\n    style: {\n      cornerRadius: [5, 5, 5, 5],\n      height: 10\n    },\n    state: {\n      hover: {\n        stroke: '#D9D9D9',\n        lineWidth: 1\n      }\n    }\n  },\n  extensionMark: [\n    {\n      type: 'text',\n      dataId: 'barData',\n      visible: true,\n      style: {\n        text: (datum: any) => datum.value,\n        fontSize: 12,\n        x: (datum: any, ctx: any) => {\n          return ctx.getRegion().getLayoutRect().width + 10;\n        },\n        y: (datum: any, ctx: any) => {\n          return ctx.valueToY([datum.province]) + ctx.yBandwidth() / 2;\n        },\n        textBaseline: 'middle',\n        textAlign: 'left',\n        fill: '#595959',\n        size: 20\n      }\n    }\n  ],\n  crosshair: {\n    yField: {\n      visible: false\n    }\n  },\n  tooltip: {\n    mark: {\n      title: {\n        visible: false\n      }\n    },\n    dimension: {\n      title: {\n        visible: false\n      }\n    },\n    style: {\n      shape: {\n        shapeType: 'circle'\n      }\n    }\n  }\n};\n"]}

package/cjs/spec/indicatorSankey.d.ts

@@ -0,0 +1,81 @@
+export declare const indicatorSankeySpec: {
+    type: string;
+    data: {
+        id: string;
+        values: {
+            links: ({
+                source: string;
+                target: string;
+                value: number;
+            } | {
+                source: string;
+                value: number;
+                target?: undefined;
+            } | {
+                target: string;
+                value: number;
+                source?: undefined;
+            })[];
+        }[];
+    }[];
+    dataId: string;
+    categoryField: string;
+    valueField: string;
+    sourceField: string;
+    targetField: string;
+    dropIsolatedNode: boolean;
+    nodeGap: number;
+    nodeWidth: number;
+    equalNodeHeight: boolean;
+    linkOverlap: string;
+    label: {
+        visible: boolean;
+        style: {
+            fontSize: number;
+        };
+    };
+    node: {
+        state: {
+            hover: {
+                stroke: string;
+            };
+            selected: {
+                lineWidth: number;
+                brighter: number;
+                fillOpacity: number;
+            };
+        };
+        style: {
+            fill: string;
+            fillOpacity: number;
+            lineWidth: number;
+            stroke: string;
+            html: (datum: any, a: any, c: any) => {
+                style: ({ width, height }: any) => {
+                    'border-right': string;
+                    width: string;
+                    height: string;
+                    background: string;
+                };
+                dom: string;
+            };
+        };
+    };
+    link: {
+        style: {
+            fill: string;
+        };
+        state: {
+            hover: {
+                fillOpacity: number;
+            };
+            selected: {
+                fill: string;
+                stroke: string;
+                lineWidth: number;
+                brighter: number;
+                fillOpacity: number;
+            };
+        };
+    };
+};

package/cjs/spec/indicatorSankey.js

@@ -0,0 +1,103 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+    value: !0
+}), exports.indicatorSankeySpec = void 0, exports.indicatorSankeySpec = {
+    type: "sankey",
+    data: [ {
+        id: "sankeyData",
+        values: [ {
+            links: [ {
+                source: "Opportunity Audience",
+                target: "High Potential Users",
+                value: 199999
+            }, {
+                source: "High Potential User 0",
+                target: "High Potential Users",
+                value: 299999
+            }, {
+                source: "First Course New Order",
+                target: "High Potential Users",
+                value: 399999
+            }, {
+                source: "First Course New Order",
+                target: "Repeat Loyalty",
+                value: 499999
+            }, {
+                source: "Deputy Purchase Loyalty",
+                target: "High Potential Users",
+                value: 599999
+            }, {
+                source: "Others",
+                value: 199999
+            }, {
+                target: "First Order New Customer",
+                value: 999
+            } ]
+        } ]
+    } ],
+    dataId: "sankeyData",
+    categoryField: "name",
+    valueField: "value",
+    sourceField: "source",
+    targetField: "target",
+    dropIsolatedNode: !1,
+    nodeGap: 2,
+    nodeWidth: 200,
+    equalNodeHeight: !0,
+    linkOverlap: "center",
+    label: {
+        visible: !1,
+        style: {
+            fontSize: 10
+        }
+    },
+    node: {
+        state: {
+            hover: {
+                stroke: "#333333"
+            },
+            selected: {
+                lineWidth: 1,
+                brighter: 1,
+                fillOpacity: .1
+            }
+        },
+        style: {
+            fill: "#1664FF",
+            fillOpacity: 0,
+            lineWidth: 1,
+            stroke: "#1664FF",
+            html: (datum, a, c) => {
+                const hasSource = datum.targetLinks && datum.targetLinks.length;
+                return {
+                    style: ({width: width, height: height}) => ({
+                        "border-right": "8px solid #1664FF",
+                        width: `${width}px`,
+                        height: `${height}px`,
+                        background: hasSource ? "#1664FF" : "transparent"
+                    }),
+                    dom: `<div style="margin: 10px 0 0 10px;">\n              <p style="\n              margin:0;\n              font-weight:500;\n              line-height: 18px;\n              font-size:12px;\n              color:${hasSource ? "#fff" : "#646475"};\n              ">${datum.key}</p>\n              <p style="margin:0;font-weight: 700;\n              font-size: 20px;\n              line-height: 28px;\n              color: ${hasSource ? "#fff" : "#1d1d2e"};">${datum.value}</p>\n            </div>`
+                };
+            }
+        }
+    },
+    link: {
+        style: {
+            fill: "#1664FF"
+        },
+        state: {
+            hover: {
+                fillOpacity: 1
+            },
+            selected: {
+                fill: "#1664FF",
+                stroke: "",
+                lineWidth: 1,
+                brighter: 1,
+                fillOpacity: .2
+            }
+        }
+    }
+};
+//# sourceMappingURL=indicatorSankey.js.map

package/cjs/spec/indicatorSankey.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/spec/indicatorSankey.ts"],"names":[],"mappings":"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","file":"indicatorSankey.js","sourcesContent":["export const indicatorSankeySpec = {\n  type: 'sankey',\n  data: [\n    {\n      id: 'sankeyData',\n      values: [\n        {\n          links: [\n            {\n              source: 'Opportunity Audience',\n              target: 'High Potential Users',\n              value: 199999\n            },\n            {\n              source: 'High Potential User 0',\n              target: 'High Potential Users',\n              value: 299999\n            },\n            {\n              source: 'First Course New Order',\n              target: 'High Potential Users',\n              value: 399999\n            },\n            {\n              source: 'First Course New Order',\n              target: 'Repeat Loyalty',\n              value: 499999\n            },\n            {\n              source: 'Deputy Purchase Loyalty',\n              target: 'High Potential Users',\n              value: 599999\n            },\n            {\n              source: 'Others',\n              value: 199999\n            },\n            {\n              target: 'First Order New Customer',\n              value: 999\n            }\n          ]\n        }\n      ]\n    }\n  ],\n  dataId: 'sankeyData',\n  categoryField: 'name',\n  valueField: 'value',\n  sourceField: 'source',\n  targetField: 'target',\n  // nodeAlign: 'justify',\n\n  dropIsolatedNode: false,\n  nodeGap: 2,\n  nodeWidth: 200,\n\n  // nodeHeight: 100,\n  equalNodeHeight: true,\n  linkOverlap: 'center',\n  label: {\n    visible: false,\n    style: {\n      fontSize: 10\n    }\n  },\n  node: {\n    state: {\n      hover: {\n        stroke: '#333333'\n      },\n      selected: {\n        lineWidth: 1,\n        brighter: 1,\n        fillOpacity: 0.1\n      }\n    },\n    style: {\n      fill: '#1664FF',\n      fillOpacity: 0,\n      lineWidth: 1,\n      stroke: '#1664FF',\n      html: (datum: any, a: any, c: any) => {\n        const color = '#1664FF';\n        const hasSource = datum.targetLinks && datum.targetLinks.length;\n\n        return {\n          style: ({ width, height }: any) => {\n            return {\n              'border-right': `8px solid ${color}`,\n              width: `${width}px`,\n              height: `${height}px`,\n              background: hasSource ? color : 'transparent'\n            };\n          },\n          dom: `<div style=\"margin: 10px 0 0 10px;\">\n              <p style=\"\n              margin:0;\n              font-weight:500;\n              line-height: 18px;\n              font-size:12px;\n              color:${hasSource ? '#fff' : '#646475'};\n              \">${datum.key}</p>\n              <p style=\"margin:0;font-weight: 700;\n              font-size: 20px;\n              line-height: 28px;\n              color: ${hasSource ? '#fff' : '#1d1d2e'};\">${datum.value}</p>\n            </div>`\n        };\n      }\n    }\n  },\n  link: {\n    style: {\n      fill: '#1664FF'\n    },\n    state: {\n      hover: {\n        fillOpacity: 1\n      },\n      selected: {\n        fill: '#1664FF',\n        stroke: '',\n        lineWidth: 1,\n        brighter: 1,\n        fillOpacity: 0.2\n      }\n    }\n  }\n};\n"]}

package/cjs/spec/line.d.ts

@@ -0,0 +1,46 @@
+export declare const lineSpec: {
+    type: string;
+    data: {
+        values: {
+            type: string;
+            country: string;
+            value: number;
+        }[];
+    };
+    height: number;
+    xField: string[];
+    yField: string;
+    seriesField: string;
+    legends: {
+        visible: boolean;
+    };
+    point: {
+        state: {
+            dimension_hover: {
+                visible: boolean;
+                size: number;
+            };
+        };
+    };
+    line: {
+        state: {
+            active: {
+                lineWidth: number;
+            };
+        };
+    };
+    interactions: {
+        type: string;
+        state: string;
+    }[];
+    crosshair: {
+        xField: {
+            line: {
+                type: string;
+                style: {
+                    lineWidth: number;
+                };
+            };
+        };
+    };
+};