@antv/gpt-vis 0.5.5 → 0.5.7

package/dist/cjs/Scatter/index.d.ts

@@ -1,11 +1,10 @@
-import type { ScatterConfig } from '@ant-design/plots';
 import React from 'react';
-import type { BasePlotProps } from '../types';
+import type { BasePlotProps, Style, Theme } from '../types';
 type ScatterDataItem = {
     x: number;
     y: number;
     [key: string]: string | number;
 };
-export type ScatterProps = BasePlotProps<ScatterDataItem> & Partial<ScatterConfig>;
+export type ScatterProps = BasePlotProps<ScatterDataItem> & Theme & Style;
 declare const Scatter: (props: ScatterProps) => React.JSX.Element;
 export default Scatter;

package/dist/cjs/Scatter/index.js

@@ -36,22 +36,68 @@ var import_plots = require("@ant-design/plots");
 var import_lodash = require("lodash");
 var import_react = __toESM(require("react"));
 var import_hooks = require("../ConfigProvider/hooks");
+var import_theme = require("../theme");
 var defaultConfig = (props) => {
-  const { data, xField = "x", yField = "y" } = props;
+  var _a;
+  const { data, xField = "x", yField = "y", style = {} } = props;
+  const { backgroundColor, palette } = style;
   const axisXTitle = (0, import_lodash.get)(props, "axis.x.title");
   const axisYTitle = (0, import_lodash.get)(props, "axis.y.title");
+  const hasGroupField = ((_a = (data || [])[0]) == null ? void 0 : _a.group) !== void 0;
+  const hasPalette = !!(palette == null ? void 0 : palette[0]);
+  let paletteConfig = { color: void 0 };
+  let encode = {};
+  if (hasPalette) {
+    paletteConfig = {
+      color: {
+        range: palette
+      }
+    };
+  }
+  if (hasGroupField) {
+    encode = {
+      x: xField,
+      y: yField,
+      color: "group"
+    };
+  } else {
+    encode = {
+      x: xField,
+      y: yField,
+      color: () => "all"
+    };
+  }
   return {
     data,
     xField,
     yField,
-    tooltip: [
-      { channel: "x", name: axisXTitle || "x" },
-      { channel: "y", name: axisYTitle || "y" }
-    ]
+    tooltip: {
+      title: (d) => (d == null ? void 0 : d.group) ? d.group : false,
+      items: [
+        { channel: "x", name: axisXTitle || "x" },
+        { channel: "y", name: axisYTitle || "y" }
+      ]
+    },
+    legend: hasGroupField ? {} : false,
+    encode,
+    scale: {
+      y: {
+        nice: true
+      },
+      ...paletteConfig
+    },
+    style: {
+      lineWidth: 1
+    },
+    ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : { viewStyle: void 0 }
   };
 };
 var Scatter = (props) => {
-  const config = (0, import_hooks.usePlotConfig)("Scatter", defaultConfig, props);
+  const themeConfig = import_theme.THEME_MAP[props.theme ?? "default"];
+  const config = (0, import_hooks.usePlotConfig)("Scatter", defaultConfig, {
+    ...props,
+    theme: themeConfig
+  });
   return /* @__PURE__ */ import_react.default.createElement(import_plots.Scatter, { ...config });
 };
 var Scatter_default = Scatter;

package/dist/cjs/Treemap/index.d.ts

@@ -1,11 +1,10 @@
-import type { TreemapConfig } from '@ant-design/plots';
 import React from 'react';
-import type { BasePlotProps } from '../types';
+import type { BasePlotProps, Style, Theme } from '../types';
 type TreeNode = {
     name: string;
     value: number;
     children?: TreeNode[];
 };
-export type TreemapProps = BasePlotProps<TreeNode> & Partial<TreemapConfig>;
+export type TreemapProps = BasePlotProps<TreeNode> & Theme & Style;
 declare const Treemap: (props: TreemapProps) => React.JSX.Element;
 export default Treemap;

package/dist/cjs/Treemap/index.js

@@ -35,8 +35,19 @@ module.exports = __toCommonJS(Treemap_exports);
 var import_plots = require("@ant-design/plots");
 var import_react = __toESM(require("react"));
 var import_hooks = require("../ConfigProvider/hooks");
+var import_theme = require("../theme");
 var defaultConfig = (props) => {
-  const { valueField = "value" } = props;
+  const { valueField = "value", style = {} } = props;
+  const { backgroundColor, palette } = style;
+  const hasPalette = !!(palette == null ? void 0 : palette[0]);
+  let paletteConfig = { color: void 0 };
+  if (hasPalette) {
+    paletteConfig = {
+      color: {
+        range: palette
+      }
+    };
+  }
   return {
     legend: false,
     layout: {
@@ -55,7 +66,11 @@ var defaultConfig = (props) => {
         }
       ]
     },
-    style: { fillOpacity: 0.8, labelFontSize: 12 }
+    style: { fillOpacity: 0.8, labelFontSize: 12 },
+    ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : { viewStyle: void 0 },
+    scale: {
+      ...paletteConfig
+    }
   };
 };
 var transform = (data) => {
@@ -65,9 +80,14 @@ var transform = (data) => {
   };
 };
 var Treemap = (props) => {
-  const config = (0, import_hooks.usePlotConfig)("Treemap", defaultConfig, props);
+  const themeConfig = import_theme.THEME_MAP[props.theme ?? "default"];
+  const config = (0, import_hooks.usePlotConfig)("Treemap", defaultConfig, {
+    ...props,
+    theme: themeConfig
+  });
   const { data, ...others } = config;
   const transformData = (0, import_react.useMemo)(() => transform(data), [data]);
+  console.log("treemap config:", config, props);
   return /* @__PURE__ */ import_react.default.createElement(import_plots.Treemap, { ...others, data: transformData });
 };
 var Treemap_default = Treemap;

package/dist/cjs/Venn/index.d.ts

@@ -0,0 +1,32 @@
+import React from 'react';
+import type { BasePlotProps, Style, Theme } from '../types';
+type VennDatum = {
+    /**
+     * Label for the venn chart segment.
+     * This should be a string that describes the segment.
+     * For example, "A", "B", or "A ∩ B" for intersections.
+     * It is used to identify the segment in the chart.
+     */
+    label?: string;
+    /**
+     * Value for the venn chart segment.
+     * This should be a number that represents the size or count of the segment.
+     * For example, if the segment represents a set of items, this could be the number of items in that set.
+     * It is used to determine the size of the segment in the chart.
+     * For intersections, this value should represent the count of items that belong to the intersection of sets.
+     * For example, if "A ∩ B" represents the intersection of sets A and B, this value should be the count of items that are in both sets.
+     */
+    value: number;
+    /**
+     * Sets that the segment belongs to.
+     * This should be an array of strings representing the sets that the segment is part of.
+     * For example, if the segment represents items that belong to both set A and set B, this could be ['A', 'B'].
+     * It is used to determine how the segment is displayed in the venn chart.
+     * For intersections, this array should include the sets that contribute to the intersection.
+     * For example, if "A ∩ B" represents the intersection of sets A and B, this array should be ['A', 'B'].
+     */
+    sets: string[] | number[];
+};
+export type VennProps = BasePlotProps<VennDatum> & Theme & Style;
+declare const Venn: (props: VennProps) => React.JSX.Element;
+export default Venn;

package/dist/cjs/Venn/index.js

@@ -0,0 +1,87 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Venn/index.tsx
+var Venn_exports = {};
+__export(Venn_exports, {
+  default: () => Venn_default
+});
+module.exports = __toCommonJS(Venn_exports);
+var import_plots = require("@ant-design/plots");
+var import_react = __toESM(require("react"));
+var import_hooks = require("../ConfigProvider/hooks");
+var import_theme = require("../theme");
+var defaultConfig = (props) => {
+  const { data, style = {} } = props;
+  const { backgroundColor, palette } = style;
+  let paletteConfig = { color: void 0 };
+  const hasPalette = !!(palette == null ? void 0 : palette[0]);
+  if (hasPalette) {
+    paletteConfig = {
+      color: {
+        range: palette
+      }
+    };
+  }
+  return {
+    data,
+    sizeField: "value",
+    ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {},
+    labels: [
+      {
+        position: "inside",
+        text: (d) => d.label || "",
+        transform: [{ type: "contrastReverse" }],
+        fill: "#000",
+        fillOpacity: 0.85,
+        fontSize: 10
+      }
+    ],
+    scale: {
+      ...paletteConfig
+    },
+    tooltip: {
+      title: false,
+      items: [
+        (d) => {
+          return { name: d.key, value: d.size };
+        }
+      ]
+    },
+    legend: false
+  };
+};
+var Venn = (props) => {
+  const themeConfig = import_theme.THEME_MAP[props.theme ?? "default"];
+  const config = (0, import_hooks.usePlotConfig)("Venn", defaultConfig, {
+    ...props,
+    theme: themeConfig
+  });
+  return /* @__PURE__ */ import_react.default.createElement(import_plots.Venn, { ...config });
+};
+var Venn_default = Venn;

package/dist/cjs/Violin/index.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { BasePlotProps, Style, Theme } from '../types';
+type ViolinDatum = {
+    category: string;
+    value: number;
+    group?: string;
+};
+export type ViolinProps = BasePlotProps<ViolinDatum> & Theme & Style;
+declare const Violin: (props: ViolinProps) => React.JSX.Element;
+export default Violin;

package/dist/cjs/Violin/index.js

@@ -0,0 +1,185 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/Violin/index.tsx
+var Violin_exports = {};
+__export(Violin_exports, {
+  default: () => Violin_default
+});
+module.exports = __toCommonJS(Violin_exports);
+var import_g2 = require("@antv/g2");
+var import_react = __toESM(require("react"));
+var import_theme = require("../theme");
+var defaultConfig = (props) => {
+  var _a;
+  const { data, title, axisYTitle, axisXTitle, theme = "default", style = {} } = props;
+  const { backgroundColor, palette } = style;
+  const hasGroupField = ((_a = (data || [])[0]) == null ? void 0 : _a.group) !== void 0;
+  let encode = {};
+  let children = [];
+  if (hasGroupField) {
+    encode = {
+      x: "category",
+      y: "y",
+      color: "group",
+      series: "group",
+      size: "size"
+    };
+    children = [
+      {
+        type: "density",
+        data: {
+          transform: [{ type: "kde", field: "value", groupBy: ["category", "group"] }]
+        },
+        encode,
+        scale: {
+          y: {
+            nice: true
+          },
+          ...(palette == null ? void 0 : palette[0]) ? {
+            color: {
+              range: palette
+            }
+          } : {}
+        },
+        ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {}
+      },
+      {
+        type: "boxplot",
+        encode: {
+          x: "category",
+          y: "value",
+          series: "group",
+          color: "group",
+          shape: "violin"
+        },
+        style: { opacity: 0.5, strokeOpacity: 0.5, point: false },
+        ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {},
+        scale: {
+          y: {
+            nice: true
+          },
+          ...(palette == null ? void 0 : palette[0]) ? {
+            color: {
+              range: palette
+            }
+          } : {}
+        }
+      }
+    ];
+  } else {
+    encode = {
+      x: "category",
+      y: "y",
+      color: "category",
+      size: "size"
+    };
+    children = [
+      {
+        type: "density",
+        data: {
+          transform: [{ type: "kde", field: "value", groupBy: ["category"], size: 20 }]
+        },
+        encode,
+        scale: {
+          y: {
+            nice: true
+          }
+        },
+        ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {},
+        tooltip: false
+      },
+      {
+        type: "boxplot",
+        encode: {
+          x: "category",
+          y: "value",
+          color: "category",
+          shape: "violin"
+        },
+        style: { opacity: 0.5, strokeOpacity: 0.5, point: false },
+        ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {},
+        scale: {
+          y: {
+            nice: true
+          },
+          ...(palette == null ? void 0 : palette[0]) ? {
+            color: {
+              range: palette
+            }
+          } : {}
+        }
+      }
+    ];
+  }
+  return {
+    type: "view",
+    theme: import_theme.THEME_MAP[theme],
+    title,
+    autoFit: true,
+    data,
+    axis: {
+      y: {
+        title: axisYTitle || false
+      },
+      x: {
+        title: axisXTitle || false
+      }
+    },
+    children,
+    scale: {
+      y: {
+        nice: true
+      }
+    },
+    ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {}
+  };
+};
+var Violin = (props) => {
+  const containerRef = (0, import_react.useRef)(null);
+  const chartRef = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    if (!containerRef.current)
+      return;
+    const chart = new import_g2.Chart({
+      container: containerRef.current,
+      autoFit: true,
+      padding: "auto"
+    });
+    const config = defaultConfig(props);
+    chart.options(config);
+    chart.render();
+    chartRef.current = chart;
+    return () => {
+      chart.destroy();
+      chartRef.current = null;
+    };
+  }, [props]);
+  return /* @__PURE__ */ import_react.default.createElement("div", { ref: containerRef });
+};
+var Violin_default = Violin;

package/dist/cjs/WordCloud/index.d.ts

@@ -1,10 +1,9 @@
-import type { WordCloudConfig } from '@ant-design/plots';
 import { type FC } from 'react';
-import type { BasePlotProps } from '../types';
+import type { BasePlotProps, Style, Theme } from '../types';
 type WordCloudDataItem = {
     text: string;
     value: number;
 };
-export type WordCloudProps = BasePlotProps<WordCloudDataItem> & Partial<WordCloudConfig>;
+export type WordCloudProps = BasePlotProps<WordCloudDataItem> & Theme & Style;
 declare const WordCloud: FC<WordCloudProps>;
 export default WordCloud;

package/dist/cjs/WordCloud/index.js

@@ -35,15 +35,42 @@ module.exports = __toCommonJS(WordCloud_exports);
 var import_plots = require("@ant-design/plots");
 var import_react = __toESM(require("react"));
 var import_hooks = require("../ConfigProvider/hooks");
-var defaultConfig = {
-  autoFit: true,
-  layout: { fontSize: [20, 100] },
-  colorField: "text",
-  legend: false,
-  tooltip: false
+var import_theme = require("../theme");
+var defaultConfig = (props) => {
+  const { data, style = {} } = props;
+  const { backgroundColor, palette } = style;
+  const hasPalette = !!(palette == null ? void 0 : palette[0]);
+  let paletteConfig = { color: void 0 };
+  if (hasPalette) {
+    paletteConfig = {
+      color: {
+        range: palette
+      }
+    };
+  }
+  return {
+    data,
+    layout: { fontSize: [20, 100] },
+    colorField: "text",
+    legend: false,
+    tooltip: false,
+    encode: {
+      text: "text",
+      color: "text",
+      value: "value"
+    },
+    ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : { viewStyle: void 0 },
+    scale: {
+      ...paletteConfig
+    }
+  };
 };
 var WordCloud = (props) => {
-  const config = (0, import_hooks.usePlotConfig)("WordCloud", defaultConfig, props);
+  const themeConfig = import_theme.THEME_MAP[props.theme ?? "default"];
+  const config = (0, import_hooks.usePlotConfig)("WordCloud", defaultConfig, {
+    ...props,
+    theme: themeConfig
+  });
   return /* @__PURE__ */ import_react.default.createElement(import_plots.WordCloud, { ...config });
 };
 var WordCloud_default = WordCloud;

package/dist/cjs/export.d.ts

@@ -2,14 +2,20 @@
 /********** plot chart **********/
 import { default as Area, type AreaProps } from './Area';
 import { default as Bar, type BarProps } from './Bar';
+import { default as Boxplot, type BoxplotProps } from './Boxplot';
 import { default as Column, type ColumnProps } from './Column';
 import { default as DualAxes, type DualAxesProps } from './DualAxes';
+import { default as Funnel, type FunnelProps } from './Funnel';
 import { default as Histogram, type HistogramProps } from './Histogram';
 import { default as Line, type LineProps } from './Line';
+import { default as Liquid, type LiquidProps } from './Liquid';
 import { default as Pie, type PieProps } from './Pie';
 import { default as Radar, type RadarProps } from './Radar';
+import { default as Sankey, type SankeyProps } from './Sankey';
 import { default as Scatter, type ScatterProps } from './Scatter';
 import { default as Treemap, type TreemapProps } from './Treemap';
+import { default as Venn, type VennProps } from './Venn';
+import { default as Violin, type ViolinProps } from './Violin';
 import { default as WordCloud, type WordCloudProps } from './WordCloud';
 /********** graph chart **********/
 import { default as FishboneDiagram, type FishboneDiagramProps } from './FishboneDiagram';
@@ -23,5 +29,5 @@ export { Map, type MapProps } from './export-map';
 import { PinMap, type PinMapProps, HeatMap, type HeatMapProps, PathMap, type PathMapProps } from './export-map';
 /********** NTV **********/
 export { VisText, type VisTextProps } from './Text';
-export { Area, Bar, Column, DualAxes, FishboneDiagram, FlowDiagram, HeatMap, Histogram, Line, MindMap, NetworkGraph, PathMap, Pie, PinMap, Radar, Scatter, Treemap, WordCloud, type AreaProps, type BarProps, type ColumnProps, type DualAxesProps, type FishboneDiagramProps, type FlowDiagramProps, type HeatMapProps, type HistogramProps, type LineProps, type MindMapProps, type NetworkGraphProps, type PathMapProps, type PieProps, type PinMapProps, type RadarProps, type ScatterProps, type TreemapProps, type WordCloudProps, };
+export { Area, Bar, Boxplot, Column, DualAxes, FishboneDiagram, FlowDiagram, Funnel, HeatMap, Histogram, Line, Liquid, MindMap, NetworkGraph, PathMap, Pie, PinMap, Radar, Sankey, Scatter, Treemap, Venn, Violin, WordCloud, type AreaProps, type BarProps, type BoxplotProps, type ColumnProps, type DualAxesProps, type FishboneDiagramProps, type FlowDiagramProps, type FunnelProps, type HeatMapProps, type HistogramProps, type LineProps, type LiquidProps, type MindMapProps, type NetworkGraphProps, type PathMapProps, type PieProps, type PinMapProps, type RadarProps, type SankeyProps, type ScatterProps, type TreemapProps, type VennProps, type ViolinProps, type WordCloudProps, };
 export declare const DEFAULT_CHART_COMPONENTS: Record<string, React.FC<any>>;