@antv/gpt-vis 1.0.0 → 1.0.1

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>;

package/dist/esm/util/animation.js

@@ -0,0 +1,17 @@
+var prefersReducedMotion = function prefersReducedMotion() {
+  return typeof window !== 'undefined' && typeof window.matchMedia === 'function' && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+};
+export var getChartAnimation = function getChartAnimation(hasRendered, enterType) {
+  if (hasRendered || prefersReducedMotion()) return false;
+  return {
+    enter: enterType ? {
+      type: enterType
+    } : {},
+    update: {
+      type: null
+    },
+    exit: {
+      type: null
+    }
+  };
+};

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

@@ -0,0 +1,15 @@
+export type ChartLocale = 'en-US' | 'zh-CN';
+export type CartesianXAxisOptions = {
+    xLabels?: unknown[];
+    chartWidth?: number;
+};
+export type CartesianAxisOptions = CartesianXAxisOptions & {
+    axisXTitle?: string | false;
+    axisYTitle?: string | false;
+};
+export declare const resolveChartLocale: (locale?: string) => ChartLocale;
+export declare const getCartesianLayout: ({ xLabels, chartWidth, }: CartesianXAxisOptions) => Record<string, number>;
+export declare const getCartesianAxis: ({ axisXTitle, axisYTitle, xLabels, chartWidth, }: CartesianAxisOptions) => Record<'x' | 'y', Record<string, unknown>>;
+export declare const getColorLegend: (visible: boolean) => false | {
+    color: Record<string, never>;
+};

package/dist/esm/util/components.js

@@ -0,0 +1,67 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var DEFAULT_CHART_WIDTH = 640;
+var AXIS_HORIZONTAL_PADDING = 96;
+var ANGLED_LABEL_MARGIN_RIGHT_MIN = 32;
+var ANGLED_LABEL_MARGIN_RIGHT_MAX = 64;
+var ANGLED_LABEL_EDGE_GAP = 8;
+var estimateLabelWidth = function estimateLabelWidth(value) {
+  return Array.from(String(value !== null && value !== void 0 ? value : '')).reduce(function (width, character) {
+    var _character$codePointA;
+    return width + (((_character$codePointA = character.codePointAt(0)) !== null && _character$codePointA !== void 0 ? _character$codePointA : 0) > 0xff ? 12 : 7);
+  }, 0);
+};
+var shouldUseAngledXAxisLabels = function shouldUseAngledXAxisLabels(labels) {
+  var chartWidth = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : DEFAULT_CHART_WIDTH;
+  if (!(labels !== null && labels !== void 0 && labels.length)) return false;
+  var uniqueLabels = Array.from(new Set(labels.map(function (label) {
+    return String(label !== null && label !== void 0 ? label : '');
+  })));
+  if (uniqueLabels.length <= 1) return false;
+  var availableWidth = Math.max(chartWidth - AXIS_HORIZONTAL_PADDING, 240);
+  var estimatedWidth = uniqueLabels.reduce(function (total, label) {
+    return total + Math.max(28, estimateLabelWidth(label) + 16);
+  }, 0);
+  return estimatedWidth > availableWidth;
+};
+export var resolveChartLocale = function resolveChartLocale(locale) {
+  return locale !== null && locale !== void 0 && locale.toLowerCase().startsWith('zh') ? 'zh-CN' : 'en-US';
+};
+export var getCartesianLayout = function getCartesianLayout(_ref) {
+  var xLabels = _ref.xLabels,
+    chartWidth = _ref.chartWidth;
+  if (!shouldUseAngledXAxisLabels(xLabels, chartWidth)) return {};
+  var tailLabel = xLabels === null || xLabels === void 0 ? void 0 : xLabels[xLabels.length - 1];
+  var labelWidth = estimateLabelWidth(tailLabel);
+  var projectedHalfWidth = (labelWidth + 12) * Math.SQRT1_2 / 2;
+  return {
+    marginRight: Math.min(ANGLED_LABEL_MARGIN_RIGHT_MAX, Math.max(ANGLED_LABEL_MARGIN_RIGHT_MIN, Math.ceil(projectedHalfWidth + ANGLED_LABEL_EDGE_GAP)))
+  };
+};
+export var getCartesianAxis = function getCartesianAxis(_ref2) {
+  var axisXTitle = _ref2.axisXTitle,
+    axisYTitle = _ref2.axisYTitle,
+    xLabels = _ref2.xLabels,
+    chartWidth = _ref2.chartWidth;
+  var useAngledXAxisLabels = shouldUseAngledXAxisLabels(xLabels, chartWidth);
+  return {
+    x: _objectSpread({
+      title: axisXTitle || false
+    }, useAngledXAxisLabels ? {
+      labelTransform: 'rotate(45)',
+      labelAutoRotate: false
+    } : {}),
+    y: {
+      title: axisYTitle || false
+    }
+  };
+};
+export var getColorLegend = function getColorLegend(visible) {
+  return visible ? {
+    color: {}
+  } : false;
+};

package/dist/esm/util/crosshair-axis-labels.d.ts

@@ -0,0 +1,9 @@
+import { type Chart } from '@antv/g2';
+import type { VisualizationTheme } from '../types';
+/**
+ * Bridges G2 tooltip crosshairs to axis value tags.
+ *
+ * G2 does not currently expose axis tags for tooltip crosshairs, so this adapter
+ * reads the rule geometry created by G2 5.4 and renders labels with LineCrosshair.
+ */
+export declare const bindCrosshairAxisLabels: (chart: Chart, theme: VisualizationTheme) => (() => void);

package/dist/esm/util/crosshair-axis-labels.js

@@ -0,0 +1,328 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { LineCrosshair } from '@antv/component';
+import { selectPlotArea } from '@antv/g2';
+import { CHART_FONT_FAMILY, getChartVisualTokens } from "./tokens";
+var formatCrosshairAxisValue = function formatCrosshairAxisValue(value, formatter, precision) {
+  if (value === undefined || value === null || value === '') return '';
+  try {
+    var formatted = formatter === null || formatter === void 0 ? void 0 : formatter(value);
+    if (formatted !== undefined && formatted !== null) return String(formatted);
+  } catch (_unused) {
+    // Fall back to the original value when a scale formatter rejects it.
+  }
+  if (value instanceof Date) return value.toLocaleString();
+  if (typeof value === 'number' && Number.isFinite(value) && precision !== undefined) {
+    return value.toFixed(precision);
+  }
+  return String(value);
+};
+var getNumberPrecision = function getNumberPrecision(value) {
+  var _coefficient$split$;
+  if (!Number.isFinite(value) || value === 0) return 0;
+  var _Math$abs$toExponenti = Math.abs(value).toExponential().split('e'),
+    _Math$abs$toExponenti2 = _slicedToArray(_Math$abs$toExponenti, 2),
+    coefficient = _Math$abs$toExponenti2[0],
+    _Math$abs$toExponenti3 = _Math$abs$toExponenti2[1],
+    exponentText = _Math$abs$toExponenti3 === void 0 ? '0' : _Math$abs$toExponenti3;
+  var coefficientPrecision = ((_coefficient$split$ = coefficient.split('.')[1]) === null || _coefficient$split$ === void 0 ? void 0 : _coefficient$split$.length) || 0;
+  return Math.max(0, coefficientPrecision - Number(exponentText));
+};
+var getCrosshairScalePrecision = function getCrosshairScalePrecision(scale) {
+  var _scale$getTicks;
+  var ticks = scale === null || scale === void 0 || (_scale$getTicks = scale.getTicks) === null || _scale$getTicks === void 0 ? void 0 : _scale$getTicks.call(scale);
+  if (!Array.isArray(ticks) || ticks.length < 2) return undefined;
+  var interval = Number.POSITIVE_INFINITY;
+  for (var index = 1; index < ticks.length; index += 1) {
+    var current = Number(ticks[index]);
+    var previous = Number(ticks[index - 1]);
+    var difference = Math.abs(current - previous);
+    if (Number.isFinite(difference) && difference > 0) interval = Math.min(interval, difference);
+  }
+  if (!Number.isFinite(interval)) return undefined;
+  return Math.min(getNumberPrecision(interval) + 2, 20);
+};
+var getCrosshairTagStyle = function getCrosshairTagStyle(theme, tokens) {
+  return {
+    lineLineWidth: 0,
+    lineStrokeOpacity: 0,
+    linePointerEvents: 'none',
+    tagPadding: [4, 7],
+    tagRadius: 6,
+    tagBackgroundFill: tokens.textPrimary,
+    tagBackgroundStroke: 'transparent',
+    tagBackgroundLineWidth: 0,
+    tagBackgroundShadowColor: theme === 'dark' ? 'rgba(0, 0, 0, 0.38)' : 'rgba(15, 23, 42, 0.18)',
+    tagBackgroundShadowBlur: 8,
+    tagBackgroundShadowOffsetY: 2,
+    tagLabelFill: tokens.background,
+    tagLabelFillOpacity: 1,
+    tagLabelFontFamily: CHART_FONT_FAMILY,
+    tagLabelFontSize: 11,
+    tagLabelFontWeight: 500,
+    tagLabelLineWidth: 0,
+    tagPointerEvents: 'none'
+  };
+};
+var clamp = function clamp(value, min, max) {
+  return Math.min(Math.max(value, Math.min(min, max)), Math.max(min, max));
+};
+var invertCrosshairValue = function invertCrosshairValue(scale, value) {
+  if (!scale || typeof scale.invert !== 'function' || value === undefined) return undefined;
+  if (typeof scale.getBandWidth === 'function') {
+    var _scale$getOptions;
+    var domain = (_scale$getOptions = scale.getOptions) === null || _scale$getOptions === void 0 || (_scale$getOptions = _scale$getOptions.call(scale)) === null || _scale$getOptions === void 0 ? void 0 : _scale$getOptions.domain;
+    if (!Array.isArray(domain) || domain.length === 0 || !Number.isFinite(Number(value))) {
+      return undefined;
+    }
+    var nearestValue = domain[0];
+    var nearestDistance = Number.POSITIVE_INFINITY;
+    var _iterator = _createForOfIteratorHelper(domain),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var _scale$map;
+        var domainValue = _step.value;
+        var start = Number((_scale$map = scale.map) === null || _scale$map === void 0 ? void 0 : _scale$map.call(scale, domainValue));
+        var bandWidth = Number(scale.getBandWidth(domainValue)) || 0;
+        var distance = Math.abs(start + bandWidth / 2 - Number(value));
+        if (Number.isFinite(distance) && distance < nearestDistance) {
+          nearestValue = domainValue;
+          nearestDistance = distance;
+        }
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+    return nearestValue;
+  }
+  try {
+    return scale.invert(value);
+  } catch (_unused2) {
+    return undefined;
+  }
+};
+var getTooltipPlot = function getTooltipPlot(context) {
+  var _context$canvas;
+  var root = (_context$canvas = context.canvas) === null || _context$canvas === void 0 ? void 0 : _context$canvas.getRoot();
+  if (!root) return undefined;
+
+  // G2 5.4 stores tooltip rules on the plot display object. Keep that version-specific
+  // detail isolated here while using the public plot selector for discovery.
+  return selectPlotArea(root);
+};
+var getCartesianView = function getCartesianView(context) {
+  var _context$views;
+  return (_context$views = context.views) === null || _context$views === void 0 ? void 0 : _context$views.find(function (_ref) {
+    var coordinate = _ref.coordinate,
+      scale = _ref.scale;
+    return Boolean((scale === null || scale === void 0 ? void 0 : scale.x) && (scale === null || scale === void 0 ? void 0 : scale.y)) && typeof (coordinate === null || coordinate === void 0 ? void 0 : coordinate.invert) === 'function';
+  });
+};
+var getRuleLine = function getRuleLine(rule) {
+  var _rule$style, _rule$style2, _rule$style3, _rule$style4;
+  var x1 = Number(rule === null || rule === void 0 || (_rule$style = rule.style) === null || _rule$style === void 0 ? void 0 : _rule$style.x1);
+  var x2 = Number(rule === null || rule === void 0 || (_rule$style2 = rule.style) === null || _rule$style2 === void 0 ? void 0 : _rule$style2.x2);
+  var y1 = Number(rule === null || rule === void 0 || (_rule$style3 = rule.style) === null || _rule$style3 === void 0 ? void 0 : _rule$style3.y1);
+  var y2 = Number(rule === null || rule === void 0 || (_rule$style4 = rule.style) === null || _rule$style4 === void 0 ? void 0 : _rule$style4.y2);
+  if (![x1, x2, y1, y2].every(Number.isFinite)) return undefined;
+  return {
+    x1: x1,
+    x2: x2,
+    y1: y1,
+    y2: y2
+  };
+};
+var getPlotOffset = function getPlotOffset(plot) {
+  var _plot$getLocalPositio;
+  var _ref2 = ((_plot$getLocalPositio = plot.getLocalPosition) === null || _plot$getLocalPositio === void 0 ? void 0 : _plot$getLocalPositio.call(plot)) || [],
+    _ref3 = _slicedToArray(_ref2, 2),
+    _ref3$ = _ref3[0],
+    x = _ref3$ === void 0 ? 0 : _ref3$,
+    _ref3$2 = _ref3[1],
+    y = _ref3$2 === void 0 ? 0 : _ref3$2;
+  return [Number.isFinite(Number(x)) ? Number(x) : 0, Number.isFinite(Number(y)) ? Number(y) : 0];
+};
+var invertCoordinate = function invertCoordinate(view, point) {
+  try {
+    var inverted = view.coordinate.invert(point);
+    if (!Array.isArray(inverted) || inverted.length < 2) return undefined;
+    var x = Number(inverted[0]);
+    var y = Number(inverted[1]);
+    return Number.isFinite(x) && Number.isFinite(y) ? [x, y] : undefined;
+  } catch (_unused3) {
+    return undefined;
+  }
+};
+
+/**
+ * Bridges G2 tooltip crosshairs to axis value tags.
+ *
+ * G2 does not currently expose axis tags for tooltip crosshairs, so this adapter
+ * reads the rule geometry created by G2 5.4 and renders labels with LineCrosshair.
+ */
+export var bindCrosshairAxisLabels = function bindCrosshairAxisLabels(chart, theme) {
+  if (!chart || typeof chart.on !== 'function') return function () {
+    return undefined;
+  };
+  var tagStyle = getCrosshairTagStyle(theme, getChartVisualTokens(theme));
+  var boundPlot = null;
+  var xCrosshair = null;
+  var yCrosshair = null;
+  var latestPointerY = null;
+  var latestXValue;
+  var destroyCrosshairs = function destroyCrosshairs() {
+    var _xCrosshair, _yCrosshair;
+    (_xCrosshair = xCrosshair) === null || _xCrosshair === void 0 || _xCrosshair.destroy();
+    (_yCrosshair = yCrosshair) === null || _yCrosshair === void 0 || _yCrosshair.destroy();
+    xCrosshair = null;
+    yCrosshair = null;
+    boundPlot = null;
+  };
+  var hideCrosshairs = function hideCrosshairs() {
+    for (var _i = 0, _arr = [xCrosshair, yCrosshair]; _i < _arr.length; _i++) {
+      var crosshair = _arr[_i];
+      if (crosshair) crosshair.style.visibility = 'hidden';
+    }
+  };
+  var resetCrosshairs = function resetCrosshairs() {
+    latestPointerY = null;
+    latestXValue = undefined;
+    hideCrosshairs();
+  };
+  var ensureCrosshairs = function ensureCrosshairs(plot, xLine, yLine, xText, yText) {
+    if (boundPlot !== plot) destroyCrosshairs();
+    if (xCrosshair && yCrosshair) return;
+    var layer = plot.parentNode || plot;
+    var _getPlotOffset = getPlotOffset(plot),
+      _getPlotOffset2 = _slicedToArray(_getPlotOffset, 2),
+      plotX = _getPlotOffset2[0],
+      plotY = _getPlotOffset2[1];
+    var xStart = [xLine.x1 + plotX, xLine.y1 + plotY];
+    var xEnd = [xLine.x2 + plotX, xLine.y2 + plotY];
+    var yStart = [yLine.x1 + plotX, yLine.y1 + plotY];
+    var yEnd = [yLine.x2 + plotX, yLine.y2 + plotY];
+    if (!xCrosshair) {
+      xCrosshair = new LineCrosshair({
+        style: _objectSpread(_objectSpread({}, tagStyle), {}, {
+          startPos: xStart,
+          endPos: xEnd,
+          tagText: xText,
+          tagPosition: 'end'
+        })
+      });
+      xCrosshair.style.zIndex = 7;
+      xCrosshair.style.pointerEvents = 'none';
+      layer.appendChild(xCrosshair);
+    }
+    if (!yCrosshair) {
+      yCrosshair = new LineCrosshair({
+        style: _objectSpread(_objectSpread({}, tagStyle), {}, {
+          startPos: yStart,
+          endPos: yEnd,
+          tagText: yText,
+          tagPosition: 'start'
+        })
+      });
+      yCrosshair.style.zIndex = 7;
+      yCrosshair.style.pointerEvents = 'none';
+      layer.appendChild(yCrosshair);
+    }
+    boundPlot = plot;
+  };
+  var updateCrosshairs = function updateCrosshairs(event) {
+    var _event$offsetY, _latestXValue, _invertCrosshairValue, _event$data, _view$scale$x$getForm, _view$scale$x, _view$scale$y$getForm, _view$scale$y, _plot$ruleY, _plot$ruleX;
+    var context = chart.getContext();
+    var plot = getTooltipPlot(context);
+    var view = getCartesianView(context);
+    if (!plot || !view) {
+      hideCrosshairs();
+      return;
+    }
+    var verticalRule = getRuleLine(plot.ruleY);
+    var horizontalRule = getRuleLine(plot.ruleX);
+    if (!verticalRule || !horizontalRule) {
+      hideCrosshairs();
+      return;
+    }
+    var _getPlotOffset3 = getPlotOffset(plot),
+      _getPlotOffset4 = _slicedToArray(_getPlotOffset3, 2),
+      plotX = _getPlotOffset4[0],
+      plotY = _getPlotOffset4[1];
+    var eventY = Number((_event$offsetY = event.offsetY) !== null && _event$offsetY !== void 0 ? _event$offsetY : event.canvasY);
+    var globalY = Number.isFinite(eventY) ? eventY : latestPointerY;
+    var pointerY = Number.isFinite(globalY) ? Number(globalY) - plotY : horizontalRule.y1;
+    var x = clamp(verticalRule.x1, horizontalRule.x1, horizontalRule.x2);
+    var y = clamp(pointerY, verticalRule.y1, verticalRule.y2);
+    var invertedPosition = invertCoordinate(view, [x, y]);
+    var xValue = (_latestXValue = latestXValue) !== null && _latestXValue !== void 0 ? _latestXValue : invertCrosshairValue(view.scale.x, invertedPosition === null || invertedPosition === void 0 ? void 0 : invertedPosition[0]);
+    var yValue = (_invertCrosshairValue = invertCrosshairValue(view.scale.y, invertedPosition === null || invertedPosition === void 0 ? void 0 : invertedPosition[1])) !== null && _invertCrosshairValue !== void 0 ? _invertCrosshairValue : (_event$data = event.data) === null || _event$data === void 0 || (_event$data = _event$data.items) === null || _event$data === void 0 || (_event$data = _event$data[0]) === null || _event$data === void 0 ? void 0 : _event$data.value;
+    var xText = formatCrosshairAxisValue(xValue, (_view$scale$x$getForm = (_view$scale$x = view.scale.x).getFormatter) === null || _view$scale$x$getForm === void 0 ? void 0 : _view$scale$x$getForm.call(_view$scale$x));
+    var yText = formatCrosshairAxisValue(yValue, (_view$scale$y$getForm = (_view$scale$y = view.scale.y).getFormatter) === null || _view$scale$y$getForm === void 0 ? void 0 : _view$scale$y$getForm.call(_view$scale$y), getCrosshairScalePrecision(view.scale.y));
+    if (!xText || !yText) {
+      hideCrosshairs();
+      return;
+    }
+    if ((_plot$ruleY = plot.ruleY) !== null && _plot$ruleY !== void 0 && _plot$ruleY.style) {
+      plot.ruleY.style.x1 = x;
+      plot.ruleY.style.x2 = x;
+    }
+    if ((_plot$ruleX = plot.ruleX) !== null && _plot$ruleX !== void 0 && _plot$ruleX.style) {
+      plot.ruleX.style.y1 = y;
+      plot.ruleX.style.y2 = y;
+    }
+    var displayVerticalRule = _objectSpread(_objectSpread({}, verticalRule), {}, {
+      x1: x,
+      x2: x
+    });
+    var displayHorizontalRule = _objectSpread(_objectSpread({}, horizontalRule), {}, {
+      y1: y,
+      y2: y
+    });
+    ensureCrosshairs(plot, displayVerticalRule, displayHorizontalRule, xText, yText);
+    if (!xCrosshair || !yCrosshair) return;
+    xCrosshair.setText(xText);
+    xCrosshair.setPointer([x + plotX, verticalRule.y2 + plotY]);
+    xCrosshair.style.visibility = 'visible';
+    yCrosshair.setText(yText);
+    yCrosshair.setPointer([horizontalRule.x1 + plotX, y + plotY]);
+    yCrosshair.style.visibility = 'visible';
+  };
+  var onPointerMove = function onPointerMove(event) {
+    var _event$offsetY2;
+    var y = Number((_event$offsetY2 = event.offsetY) !== null && _event$offsetY2 !== void 0 ? _event$offsetY2 : event.canvasY);
+    if (Number.isFinite(y)) latestPointerY = y;
+    updateCrosshairs(event);
+  };
+  var onTooltipShow = function onTooltipShow(event) {
+    var _event$data2;
+    if (!event.nativeEvent) return;
+    if (((_event$data2 = event.data) === null || _event$data2 === void 0 || (_event$data2 = _event$data2.data) === null || _event$data2 === void 0 ? void 0 : _event$data2.x) !== undefined) latestXValue = event.data.data.x;
+    updateCrosshairs(event);
+  };
+  chart.on('tooltip:show', onTooltipShow);
+  chart.on('tooltip:hide', resetCrosshairs);
+  chart.on('plot:pointermove', onPointerMove);
+  chart.on('plot:pointerleave', resetCrosshairs);
+  return function () {
+    var _chart$off, _chart$off2, _chart$off3, _chart$off4;
+    (_chart$off = chart.off) === null || _chart$off === void 0 || _chart$off.call(chart, 'tooltip:show', onTooltipShow);
+    (_chart$off2 = chart.off) === null || _chart$off2 === void 0 || _chart$off2.call(chart, 'tooltip:hide', resetCrosshairs);
+    (_chart$off3 = chart.off) === null || _chart$off3 === void 0 || _chart$off3.call(chart, 'plot:pointermove', onPointerMove);
+    (_chart$off4 = chart.off) === null || _chart$off4 === void 0 || _chart$off4.call(chart, 'plot:pointerleave', resetCrosshairs);
+    destroyCrosshairs();
+  };
+};

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

@@ -0,0 +1,6 @@
+export * from './animation';
+export * from './components';
+export * from './crosshair-axis-labels';
+export * from './interaction';
+export * from './theme';
+export * from './tokens';

package/dist/esm/util/index.js

@@ -0,0 +1,6 @@
+export * from "./animation";
+export * from "./components";
+export * from "./crosshair-axis-labels";
+export * from "./interaction";
+export * from "./theme";
+export * from "./tokens";