@antv/gpt-vis 1.0.0 → 1.0.2

package/dist/cjs/vis/pie/index.js

@@ -23,18 +23,19 @@ __export(pie_exports, {
 });
 module.exports = __toCommonJS(pie_exports);
 var import_g2 = require("@antv/g2");
-var import_theme = require("../../util/theme");
+var import_util = require("../../util");
 var Pie = (options) => {
   const { container, width, height, theme: chartTheme = "default" } = options;
   let chart = null;
+  let hasRendered = false;
   const PERCENTAGE_PRECISION_MULTIPLIER = 1e4;
   const render = (config) => {
     const { data = [], innerRadius = 0, theme = chartTheme, title, style = {} } = config;
     if (chart) {
       chart.destroy();
     }
-    const colors = (0, import_theme.normalizePalette)(style.palette, theme);
-    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
+    const colors = (0, import_util.normalizePalette)(style.palette, theme);
+    const tokens = (0, import_util.getChartVisualTokens)(theme);
     const sumValue = data.reduce((sum, item) => sum + item.value, 0);
     chart = new import_g2.Chart({
       container,
@@ -43,10 +44,10 @@ var Pie = (options) => {
       autoFit: true
     });
     const chartOptions = {
-      animate: false,
+      animate: (0, import_util.getChartAnimation)(hasRendered, "waveIn"),
       type: "interval",
       data,
-      title: title ?? "",
+      title: title || "",
       encode: {
         y: "value",
         color: "category"
@@ -56,14 +57,13 @@ var Pie = (options) => {
       scale: {
         color: { range: colors }
       },
-      legend: {
-        color: { position: "top" }
-      },
-      labels: [
+      legend: (0, import_util.getColorLegend)(true),
+      labels: data.length > 8 ? [] : [
         {
           text: (d) => {
-            const percentage = Math.round(d.value / sumValue * 100 * PERCENTAGE_PRECISION_MULTIPLIER) / PERCENTAGE_PRECISION_MULTIPLIER;
-            return `${d.category}: ${percentage}%`;
+            const percentage = sumValue ? Math.round(d.value / sumValue * 100 * PERCENTAGE_PRECISION_MULTIPLIER) / PERCENTAGE_PRECISION_MULTIPLIER : 0;
+            const formattedPercentage = Number(percentage.toFixed(1)).toString();
+            return `${d.category}: ${formattedPercentage}%`;
           },
           position: "outside",
           transform: [{ type: "overlapHide" }]
@@ -78,24 +78,34 @@ var Pie = (options) => {
         ]
       },
       interaction: {
+        tooltip: true,
+        elementHighlight: true,
+        elementHoverScale: { shadow: false },
         elementSelect: { single: true }
       },
-      style: {
-        fillOpacity: 0.8
+      state: {
+        active: { fillOpacity: 1, lineWidth: 3 },
+        inactive: { fillOpacity: 0.3 },
+        selected: { fillOpacity: 1, lineWidth: 3 }
       },
-      viewStyle: {
-        viewFill: backgroundColor
+      style: {
+        fillOpacity: 1,
+        stroke: tokens.separator,
+        lineWidth: 2
       },
-      theme: (0, import_theme.getThemeObject)(theme)
+      viewStyle: style.backgroundColor ? { viewFill: style.backgroundColor } : void 0,
+      theme: (0, import_util.getThemeObject)(theme)
     };
     chart.options(chartOptions);
     chart.render();
+    hasRendered = true;
   };
   const destroy = () => {
     if (chart) {
       chart.destroy();
       chart = null;
     }
+    hasRendered = false;
   };
   return {
     render,

package/dist/cjs/vis/radar/index.d.ts

@@ -1,4 +1,4 @@
-import type { VisualizationOptions } from '../../types';
+import type { VisualizationOptions, VisualizationTheme } from '../../types';
 /**
  * RadarDataItem is the type for each data item in the radar chart.
  */
@@ -15,7 +15,7 @@ export interface RadarConfig {
     data: RadarDataItem[];
     title?: string;
     align?: boolean;
-    theme?: 'default' | 'academy' | 'dark';
+    theme?: VisualizationTheme;
     style?: {
         backgroundColor?: string;
         palette?: string[];

package/dist/cjs/vis/radar/index.js

@@ -23,7 +23,7 @@ __export(radar_exports, {
 });
 module.exports = __toCommonJS(radar_exports);
 var import_g2 = require("@antv/g2");
-var import_theme = require("../../util/theme");
+var import_util = require("../../util");
 function transformRadarToParallel(data) {
   if (!data || data.length === 0) {
     return [];
@@ -55,11 +55,12 @@ var Radar = (options) => {
     if (chart) {
       chart.destroy();
     }
-    const { lineWidth = 2 } = style;
-    const colors = (0, import_theme.normalizePalette)(style.palette, theme);
-    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
+    const { lineWidth = import_util.CHART_STYLE_DEFAULTS.lineWidth } = style;
+    const colors = (0, import_util.normalizePalette)(style.palette, theme);
     const parallelData = transformRadarToParallel(data);
     const position = Object.keys(parallelData[0] || {}).filter((key) => key !== "group");
+    const hasMultipleSeries = parallelData.length > 1;
+    const legend = (0, import_util.getColorLegend)(hasMultipleSeries);
     chart = new import_g2.Chart({
       container,
       width,
@@ -70,9 +71,9 @@ var Radar = (options) => {
       animate: false,
       type: "line",
       data: parallelData,
-      title: title ?? "",
+      title: title || "",
       coordinate: { type: "radar" },
-      inset: 18,
+      inset: 24,
       encode: {
         position,
         color: "group"
@@ -96,42 +97,33 @@ var Radar = (options) => {
         Array.from({ length: position.length }, (_, i) => [
           `position${i === 0 ? "" : i}`,
           {
-            zIndex: 1,
-            titleFontSize: 10,
-            titleSpacing: 8,
-            label: true,
-            labelFill: theme === "dark" ? "#fff" : "#000",
-            labelOpacity: 0.45,
-            labelFontSize: 10,
-            line: true,
-            lineFill: "#000",
-            lineStrokeOpacity: 0.25,
+            label: align ? i === 0 : true,
             tickFilter: (_2, idx) => {
               return !(i !== 0 && idx === 0);
             },
-            tickCount: 4,
-            gridStrokeOpacity: 0.45,
-            gridStroke: theme === "dark" ? "#fff" : "#000",
-            gridLineWidth: 1,
-            gridLineDash: [4, 4]
+            grid: i === 0
           }
         ])
       ),
       style: {
         lineWidth,
         lineCap: "round",
-        lineJoin: "round"
+        lineJoin: "round",
+        strokeOpacity: import_util.CHART_STYLE_DEFAULTS.lineOpacity
       },
-      legend: parallelData.length > 1 ? { color: { position: "top", itemMarker: "point" } } : false,
-      interaction: {
-        tooltip: {
-          series: false
+      state: hasMultipleSeries ? (0, import_util.getLineHighlightState)(lineWidth) : void 0,
+      legend: legend === false ? false : {
+        color: {
+          ...legend.color,
+          itemMarker: "smooth"
         }
       },
-      viewStyle: {
-        viewFill: backgroundColor
+      interaction: {
+        tooltip: true,
+        ...hasMultipleSeries ? (0, import_util.getSeriesHighlightByColorInteraction)() : {}
       },
-      theme: (0, import_theme.getThemeObject)(theme)
+      viewStyle: style.backgroundColor ? { viewFill: style.backgroundColor } : void 0,
+      theme: (0, import_util.getThemeObject)(theme)
     };
     chart.options(chartOptions);
     chart.render();

package/dist/cjs/vis/sankey/index.js

@@ -33,7 +33,6 @@ var Sankey = (options) => {
       chart.destroy();
     }
     const colors = (0, import_theme.normalizePalette)(style.palette, theme);
-    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
     chart = new import_g2.Chart({
       container,
       width,
@@ -67,9 +66,7 @@ var Sankey = (options) => {
         nodeLineWidth: 1,
         linkFillOpacity: 0.3
       },
-      viewStyle: {
-        viewFill: backgroundColor
-      },
+      viewStyle: style.backgroundColor ? { viewFill: style.backgroundColor } : void 0,
       theme: (0, import_theme.getThemeObject)(theme),
       legend: false,
       tooltip: false

package/dist/cjs/vis/scatter/index.d.ts

@@ -1,4 +1,4 @@
-import type { VisualizationOptions } from '../../types';
+import type { VisualizationOptions, VisualizationTheme } from '../../types';
 /**
  * ScatterDataItem is the type for each data item in the scatter chart.
  */
@@ -16,7 +16,7 @@ export interface ScatterConfig {
     title?: string;
     axisXTitle?: string;
     axisYTitle?: string;
-    theme?: 'default' | 'academy' | 'dark';
+    theme?: VisualizationTheme;
     style?: {
         backgroundColor?: string;
         palette?: string[];

package/dist/cjs/vis/scatter/index.js

@@ -23,18 +23,19 @@ __export(scatter_exports, {
 });
 module.exports = __toCommonJS(scatter_exports);
 var import_g2 = require("@antv/g2");
-var import_theme = require("../../util/theme");
+var import_util = require("../../util");
 var Scatter = (options) => {
   const { container, width, height, theme: chartTheme = "default" } = options;
   let chart = null;
+  let hasRendered = false;
   const render = (config) => {
     var _a;
     const { data = [], theme = chartTheme, title, axisXTitle, axisYTitle, style = {} } = config;
     if (chart) {
       chart.destroy();
     }
-    const colors = (0, import_theme.normalizePalette)(style.palette, theme);
-    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
+    const colors = (0, import_util.normalizePalette)(style.palette, theme);
+    const backgroundColor = style.backgroundColor || (0, import_util.getBackgroundColor)(theme);
     const hasGroupField = data.length > 0 && ((_a = data[0]) == null ? void 0 : _a.group) !== void 0;
     chart = new import_g2.Chart({
       container,
@@ -44,29 +45,47 @@ var Scatter = (options) => {
     });
     let encode = {};
     const scaleConfig = {
-      y: { nice: true }
+      y: { nice: true },
+      x: { nice: true }
     };
     if (hasGroupField) {
-      encode = { x: "x", y: "y", color: "group" };
+      encode = {
+        x: "x",
+        y: "y",
+        color: "group",
+        shape: "point",
+        size: import_util.CHART_STYLE_DEFAULTS.scatterPointSize
+      };
       scaleConfig.color = { range: colors };
     } else {
-      encode = { x: "x", y: "y", color: () => "all" };
+      encode = {
+        x: "x",
+        y: "y",
+        shape: "point",
+        size: import_util.CHART_STYLE_DEFAULTS.scatterPointSize
+      };
     }
     const chartOptions = {
-      animate: false,
+      animate: (0, import_util.getChartAnimation)(hasRendered, "fadeIn"),
       type: "point",
       data,
-      title: title ?? "",
+      title: title || "",
       encode,
-      legend: hasGroupField ? { color: { position: "top" } } : false,
+      legend: (0, import_util.getColorLegend)(hasGroupField),
       scale: scaleConfig,
-      axis: {
-        x: { title: axisXTitle ?? "x" },
-        y: { title: axisYTitle ?? "y" }
-      },
+      axis: (0, import_util.getCartesianAxis)({
+        axisXTitle,
+        axisYTitle
+      }),
       style: {
-        lineWidth: 1
+        lineWidth: import_util.CHART_STYLE_DEFAULTS.pointLineWidth,
+        fillOpacity: 0.88,
+        stroke: backgroundColor,
+        ...!hasGroupField ? { fill: colors[0] } : {}
       },
+      // A same-color stroke enlarges the rendered path without changing its transform or
+      // hit area, so repeated pointer events cannot accumulate scale.
+      state: (0, import_util.getPointHighlightState)(),
       tooltip: {
         title: (d) => (d == null ? void 0 : d.group) ? d.group : false,
         items: [
@@ -74,19 +93,23 @@ var Scatter = (options) => {
           { channel: "y", name: axisYTitle ?? "y" }
         ]
       },
-      viewStyle: {
-        viewFill: backgroundColor
+      interaction: {
+        tooltip: true,
+        elementHighlight: true
       },
-      theme: (0, import_theme.getThemeObject)(theme)
+      viewStyle: style.backgroundColor ? { viewFill: backgroundColor } : void 0,
+      theme: (0, import_util.getThemeObject)(theme)
     };
     chart.options(chartOptions);
     chart.render();
+    hasRendered = true;
   };
   const destroy = () => {
     if (chart) {
       chart.destroy();
       chart = null;
     }
+    hasRendered = false;
   };
   return {
     render,

package/dist/cjs/vis/table/index.js

@@ -24,6 +24,7 @@ __export(table_exports, {
 });
 module.exports = __toCommonJS(table_exports);
 var import_measury = require("measury");
+var import_html = require("../../util/html");
 var SCOPE_ID = "__gpt-vis-table__";
 var FONT_FAMILY = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif';
 var CELL_PADDING = 16;
@@ -43,6 +44,12 @@ var TABLE_STYLES = `
     color: #1d2129;
   }
 
+  .${SCOPE_ID} .table-empty {
+    padding: 20px;
+    text-align: center;
+    color: #999;
+  }
+
   .${SCOPE_ID} table {
     border-collapse: separate;
     border-spacing: 0;
@@ -167,10 +174,11 @@ var Table = (options) => {
     if (theme === "dark") {
       tableWrapper.setAttribute("data-theme", "dark");
     }
+    const titleHTML = title ? `<div class="table-title">${(0, import_html.escapeHtml)(title)}</div>` : "";
     if (data.length === 0) {
       tableWrapper.innerHTML = `
-        ${title ? `<div class="table-title">${title}</div>` : ""}
-        <div style="padding: 20px; text-align: center; color: #999;">No data available</div>
+        ${titleHTML}
+        <div class="table-empty">No data available</div>
       `;
       container.appendChild(tableWrapper);
       return;
@@ -178,12 +186,12 @@ var Table = (options) => {
     const columns = Object.keys(data[0]);
     let minWidth = calculateTableMinWidth(data, columns);
     minWidth = Math.max(minWidth, columns.length * 100);
-    const headerHTML = columns.map((col) => `<th>${col}</th>`).join("");
+    const headerHTML = columns.map((column) => `<th>${(0, import_html.escapeHtml)(column)}</th>`).join("");
     const bodyHTML = data.map(
-      (row) => `<tr>${columns.map((col) => `<td>${row[col] != null ? row[col] : ""}</td>`).join("")}</tr>`
+      (row) => `<tr>${columns.map((column) => `<td>${(0, import_html.escapeHtml)(row[column])}</td>`).join("")}</tr>`
     ).join("");
     tableWrapper.innerHTML = `
-      ${title ? `<div class="table-title">${title}</div>` : ""}
+      ${titleHTML}
       <table style="min-width: ${minWidth}px;">
         <thead><tr>${headerHTML}</tr></thead>
         <tbody>${bodyHTML}</tbody>

package/dist/cjs/vis/treemap/index.js

@@ -33,7 +33,6 @@ var Treemap = (options) => {
       chart.destroy();
     }
     const colors = (0, import_theme.normalizePalette)(style.palette, theme);
-    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
     chart = new import_g2.Chart({
       container,
       width,
@@ -74,9 +73,7 @@ var Treemap = (options) => {
           }
         ]
       },
-      viewStyle: {
-        viewFill: backgroundColor
-      },
+      viewStyle: style.backgroundColor ? { viewFill: style.backgroundColor } : void 0,
       theme: (0, import_theme.getThemeObject)(theme),
       scale: {
         ...colors.length > 0 ? {

package/dist/cjs/vis/venn/index.js

@@ -43,7 +43,6 @@ var Venn = (options) => {
       chart.destroy();
     }
     const colors = (0, import_theme.normalizePalette)(style.palette, theme);
-    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
     const normalizedData = data.map((d) => ({
       ...d,
       sets: normalizeVennSets(d.sets)
@@ -87,9 +86,7 @@ var Venn = (options) => {
           fontSize: 10
         }
       ],
-      viewStyle: {
-        viewFill: backgroundColor
-      },
+      viewStyle: style.backgroundColor ? { viewFill: style.backgroundColor } : void 0,
       theme: (0, import_theme.getThemeObject)(theme),
       legend: false,
       axis: false,

package/dist/cjs/vis/violin/index.js

@@ -133,7 +133,7 @@ var Violin = (options) => {
       legend: {
         color: hasGroupField ? { position: "top" } : false
       },
-      ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {},
+      viewStyle: style.backgroundColor ? { viewFill: backgroundColor } : void 0,
       theme: (0, import_theme.getThemeObject)(theme)
     };
     chart.options(chartOptions);

package/dist/cjs/vis/waterfall/index.js

@@ -172,7 +172,7 @@ var Waterfall = (options) => {
         }
       ],
       legend: false,
-      ...backgroundColor ? { viewStyle: { viewFill: backgroundColor } } : {},
+      viewStyle: style.backgroundColor ? { viewFill: backgroundColor } : void 0,
       theme: (0, import_theme.getThemeObject)(theme)
     };
     chart.options(chartOptions);

package/dist/cjs/vis/word-cloud/index.d.ts

@@ -1,4 +1,4 @@
-import type { VisualizationOptions } from '../../types';
+import type { VisualizationOptions, VisualizationTheme } from '../../types';
 /**
  * WordCloudDataItem is the type for each data item in the word cloud chart.
  */
@@ -12,8 +12,9 @@ export type WordCloudDataItem = {
 export interface WordCloudConfig {
     type?: 'word-cloud';
     data: WordCloudDataItem[];
-    theme?: 'default' | 'academy' | 'dark';
+    theme?: VisualizationTheme;
     title?: string;
+    locale?: string;
     style?: {
         backgroundColor?: string;
         palette?: string[];

package/dist/cjs/vis/word-cloud/index.js

@@ -23,17 +23,99 @@ __export(word_cloud_exports, {
 });
 module.exports = __toCommonJS(word_cloud_exports);
 var import_g2 = require("@antv/g2");
+var import_components = require("../../util/components");
 var import_theme = require("../../util/theme");
+var WORD_CLOUD_MAX_WORDS = 50;
+var WORD_CLOUD_FONT_FAMILY = "Impact";
+var WORD_CLOUD_ROTATIONS = [-90, -60, -30, 0, 30, 60];
+var WORD_CLOUD_LABELS = {
+  "en-US": {
+    rank: "Rank",
+    share: "Share of total weight",
+    weight: "Weight / frequency"
+  },
+  "zh-CN": {
+    rank: "排名",
+    share: "占总权重",
+    weight: "权重 / 词频"
+  }
+};
+var hashWordCloudData = (data) => {
+  let hash = 2166136261;
+  data.forEach(({ text, value }) => {
+    const input = `${text}\0${value}
`;
+    for (let index = 0; index < input.length; index += 1) {
+      hash ^= input.charCodeAt(index);
+      hash = Math.imul(hash, 16777619);
+    }
+  });
+  return hash >>> 0;
+};
+var createSeededRandom = (seed) => {
+  let state = seed || 1;
+  return () => {
+    state += 1831565813;
+    let value = state;
+    value = Math.imul(value ^ value >>> 15, value | 1);
+    value ^= value + Math.imul(value ^ value >>> 7, value | 61);
+    return ((value ^ value >>> 14) >>> 0) / 4294967296;
+  };
+};
+var getWordCloudPalette = (palette, theme) => (0, import_theme.normalizePalette)(palette, theme);
+var prepareWordCloudData = (data, colors) => {
+  const rankedData = data.map((item, index) => ({ item, index })).filter(
+    ({ item }) => item.text.trim().length > 0 && Number.isFinite(item.value) && item.value > 0
+  ).sort((a, b) => b.item.value - a.item.value || a.index - b.index);
+  const totalWeight = rankedData.reduce((sum, { item }) => sum + item.value, 0);
+  const visibleData = rankedData.slice(0, WORD_CLOUD_MAX_WORDS);
+  const lastVisibleIndex = Math.max(1, visibleData.length - 1);
+  const colorByText = /* @__PURE__ */ new Map();
+  let nextColorIndex = 0;
+  return visibleData.map(({ item }, index) => {
+    const percentile = index / lastVisibleIndex;
+    const fontWeight = percentile <= 0.1 ? 700 : percentile <= 0.32 ? 600 : percentile <= 0.68 ? 500 : 400;
+    let wordColor = colorByText.get(item.text);
+    if (!wordColor) {
+      wordColor = colors[nextColorIndex % colors.length];
+      colorByText.set(item.text, wordColor);
+      nextColorIndex += 1;
+    }
+    return {
+      ...item,
+      rank: index + 1,
+      share: totalWeight > 0 ? item.value / totalWeight : 0,
+      fontWeight,
+      wordColor
+    };
+  });
+};
 var WordCloud = (options) => {
-  const { container, width, height, theme: chartTheme = "default" } = options;
+  const { container, width, height, locale, theme: chartTheme = "default" } = options;
   let chart = null;
   const render = (config) => {
-    const { data = [], theme = chartTheme, title, style = {} } = config;
+    const {
+      data = [],
+      theme = chartTheme,
+      title,
+      locale: renderLocale = locale,
+      style = {}
+    } = config;
+    const chartLocale = (0, import_components.resolveChartLocale)(renderLocale);
+    const labels = WORD_CLOUD_LABELS[chartLocale];
+    const valueFormatter = new Intl.NumberFormat(chartLocale, {
+      maximumFractionDigits: 2
+    });
+    const percentageFormatter = new Intl.NumberFormat(chartLocale, {
+      style: "percent",
+      maximumFractionDigits: 2
+    });
     if (chart) {
       chart.destroy();
     }
-    const colors = (0, import_theme.normalizePalette)(style.palette, theme);
-    const backgroundColor = style.backgroundColor || (0, import_theme.getBackgroundColor)(theme);
+    const colors = getWordCloudPalette(style.palette, theme);
+    const preparedData = prepareWordCloudData(data, colors);
+    const layoutSeed = hashWordCloudData(preparedData);
+    const rotationRandom = createSeededRandom(layoutSeed ^ 2654435769);
     chart = new import_g2.Chart({
       container,
       width,
@@ -43,31 +125,64 @@ var WordCloud = (options) => {
     const chartOptions = {
       animate: false,
       type: "wordCloud",
-      data,
+      data: preparedData,
       title: title ?? "",
       layout: {
-        fontSize: [8, 42]
+        font: WORD_CLOUD_FONT_FAMILY,
+        fontSize: [11, 44],
+        fontWeight: (d) => d.fontWeight,
+        padding: 2,
+        random: createSeededRandom(layoutSeed),
+        rotate: () => WORD_CLOUD_ROTATIONS[Math.floor(rotationRandom() * WORD_CLOUD_ROTATIONS.length)]
       },
       encode: {
         text: "text",
         color: "text",
         value: "value"
       },
+      style: {
+        fill: (d) => d.wordColor,
+        fontFamily: WORD_CLOUD_FONT_FAMILY,
+        fontWeight: (d) => d.weight ?? d.fontWeight,
+        stroke: (d) => d.wordColor
+      },
       scale: {
         color: { range: colors }
       },
       legend: false,
+      state: {
+        active: {
+          fillOpacity: 1,
+          strokeOpacity: 1
+        },
+        inactive: {
+          fillOpacity: 0.3,
+          strokeOpacity: 0.3
+        }
+      },
       tooltip: {
+        title: "text",
         items: [
           (d) => ({
-            name: d.text,
-            value: d.value
+            name: labels.weight,
+            value: valueFormatter.format(d.value)
+          }),
+          (d) => ({
+            name: labels.rank,
+            value: `#${d.rank}`
+          }),
+          (d) => ({
+            name: labels.share,
+            value: percentageFormatter.format(d.share)
           })
         ]
       },
-      viewStyle: {
-        viewFill: backgroundColor
+      interaction: {
+        tooltip: true,
+        elementHighlight: true,
+        elementHoverScale: true
       },
+      viewStyle: style.backgroundColor ? { viewFill: style.backgroundColor } : void 0,
       theme: (0, import_theme.getThemeObject)(theme)
     };
     chart.options(chartOptions);

package/dist/esm/types/index.d.ts

@@ -2,11 +2,12 @@
  * Common visualization options for all chart components.
  * Defines the container and dimensions for rendering visualizations.
  */
+export type VisualizationTheme = 'default' | 'light' | 'dark' | 'academy';
 export interface VisualizationOptions {
     container: string | HTMLElement;
     width?: number;
     height?: number;
-    theme?: 'default' | 'light' | 'dark' | 'academy';
+    theme?: VisualizationTheme;
     wrapper?: boolean;
     locale?: string;
 }

package/dist/esm/util/animation.d.ts

@@ -0,0 +1,2 @@
+export type ChartEnterAnimation = 'fadeIn' | 'pathIn' | 'growInX' | 'growInY' | 'waveIn';
+export declare const getChartAnimation: (hasRendered: boolean, enterType?: ChartEnterAnimation) => false | Record<string, unknown>;