@agions/taroviz 1.1.0 → 1.2.0

package/src/core/types/platform.ts

@@ -0,0 +1,325 @@
+/**
+ * 支持的平台类型
+ */
+export enum PlatformType {
+  H5 = 'h5',
+  WEAPP = 'weapp', // 微信小程序
+  ALIPAY = 'alipay', // 支付宝小程序
+  SWAN = 'swan', // 百度小程序
+  TT = 'tt', // 字节跳动小程序
+  QQ = 'qq', // QQ小程序
+  JD = 'jd', // 京东小程序
+  HARMONY = 'harmony', // 鸿蒙OS
+  DD = 'dd', // 钉钉小程序
+  QYWX = 'qywx', // 企业微信小程序
+  LARK = 'lark', // 飞书小程序
+  KWAI = 'kwai', // 快手小程序
+}
+
+// 导出平台类型字符串联合类型
+export type Platform = `${PlatformType}` | 'web' | 'ks';
+
+/**
+ * 事件处理器类型
+ */
+export type EventHandler = (params: any) => void;
+
+/**
+ * 适配器通用选项
+ */
+export interface AdapterOptions {
+  /**
+   * 平台类型
+   */
+  platform?: Platform;
+
+  /**
+   * 画布ID
+   */
+  canvasId?: string;
+
+  /**
+   * 宽度
+   */
+  width?: number | string;
+
+  /**
+   * 高度
+   */
+  height?: number | string;
+
+  /**
+   * 主题
+   */
+  theme?: string | object;
+
+  /**
+   * 是否自动调整大小
+   */
+  autoResize?: boolean;
+
+  /**
+   * 设备像素比
+   */
+  devicePixelRatio?: number;
+
+  /**
+   * 初始化回调
+   */
+  onInit?: (instance: any) => void;
+
+  /**
+   * 容器引用
+   */
+  containerRef?: any;
+
+  /**
+   * 图表选项
+   */
+  option?: any;
+
+  /**
+   * 渲染器类型
+   */
+  renderer?: 'canvas' | 'svg';
+
+  /**
+   * 样式对象
+   */
+  style?: any;
+
+  /**
+   * CSS类名
+   */
+  className?: string;
+}
+
+/**
+ * H5环境适配器选项
+ */
+export interface H5AdapterOptions extends AdapterOptions {
+  /**
+   * 容器引用
+   */
+  containerRef?: React.RefObject<HTMLDivElement>;
+
+  /**
+   * 图表选项
+   */
+  option?: any;
+
+  /**
+   * 是否不合并选项
+   */
+  notMerge?: boolean;
+
+  /**
+   * 是否延迟更新
+   */
+  lazyUpdate?: boolean;
+
+  /**
+   * 样式
+   */
+  style?: React.CSSProperties;
+
+  /**
+   * 类名
+   */
+  className?: string;
+
+  /**
+   * 渲染器类型
+   */
+  renderer?: 'canvas' | 'svg';
+}
+
+/**
+ * 小程序适配器基础选项
+ */
+export interface MiniAppAdapterOptions extends AdapterOptions {
+  /**
+   * 小程序组件实例
+   */
+  componentInstance?: any;
+
+  /**
+   * 是否禁用touch事件
+   */
+  disableTouch?: boolean;
+
+  /**
+   * 渲染模式
+   */
+  renderMode?: '2d' | 'webgl';
+
+  /**
+   * 图表配置选项
+   */
+  option?: any;
+
+  /**
+   * 样式属性
+   */
+  style?: React.CSSProperties;
+}
+
+/**
+ * 微信小程序适配器选项
+ */
+export interface WeappAdapterOptions extends MiniAppAdapterOptions {
+  /**
+   * 微信特有选项
+   */
+  weappOptions?: {
+    /**
+     * 是否启用右侧菜单
+     */
+    enableContextMenu?: boolean;
+
+    /**
+     * 是否启用跨端同层渲染
+     */
+    enableCrossPageTransfer?: boolean;
+  };
+}
+
+/**
+ * 支付宝小程序适配器选项
+ */
+export interface AlipayAdapterOptions extends MiniAppAdapterOptions {
+  /**
+   * 支付宝特有选项
+   */
+  alipayOptions?: {
+    /**
+     * 是否启用离屏渲染
+     */
+    enableOffscreenRendering?: boolean;
+  };
+}
+
+/**
+ * 百度小程序适配器选项
+ */
+export interface SwanAdapterOptions extends MiniAppAdapterOptions {
+  /**
+   * 百度智能小程序特有选项
+   */
+  swanOptions?: {
+    /**
+     * 是否启用复杂交互
+     */
+    enableComplexInteraction?: boolean;
+
+    /**
+     * 是否启用性能优化
+     */
+    enablePerformanceOptimization?: boolean;
+  };
+}
+
+/**
+ * 鸿蒙OS适配器选项
+ */
+export interface HarmonyAdapterOptions extends AdapterOptions {
+  /**
+   * 鸿蒙特有选项
+   */
+  harmonyOptions?: {
+    /**
+     * 是否启用硬件加速
+     */
+    enableHardwareAcceleration?: boolean;
+  };
+}
+
+/**
+ * 适配器接口
+ */
+export interface Adapter {
+  /**
+   * 初始化图表
+   */
+  init(): any;
+
+  /**
+   * 获取图表实例
+   */
+  getInstance(): any;
+
+  /**
+   * 设置图表配置项
+   */
+  setOption(option: any, opts?: any): void;
+
+  /**
+   * 获取图表宽度
+   */
+  getWidth(): number;
+
+  /**
+   * 获取图表高度
+   */
+  getHeight(): number;
+
+  /**
+   * 获取DOM元素
+   */
+  getDom(): HTMLElement | null;
+
+  /**
+   * 调整图表大小
+   */
+  resize(opts?: any): void;
+
+  /**
+   * 触发图表行为
+   */
+  dispatchAction(payload: any): void;
+
+  /**
+   * 转换为DataURL
+   */
+  convertToDataURL(opts?: any): string | undefined;
+
+  /**
+   * 清空图表
+   */
+  clear(): void;
+
+  /**
+   * 获取DataURL
+   */
+  getDataURL(opts?: any): string | undefined;
+
+  /**
+   * 绑定事件
+   */
+  on(eventName: string, handler: EventHandler, context?: object): void;
+
+  /**
+   * 解绑事件
+   */
+  off(eventName: string, handler?: EventHandler): void;
+
+  /**
+   * 显示加载动画
+   */
+  showLoading(opts?: object): void;
+
+  /**
+   * 隐藏加载动画
+   */
+  hideLoading(): void;
+
+  /**
+   * 销毁图表实例
+   */
+  dispose(): void;
+
+  /**
+   * 渲染图表
+   */
+  render(): JSX.Element;
+}

package/src/core/utils/__tests__/common.test.ts

@@ -0,0 +1,52 @@
+import { deepMerge, debounce, throttle } from '../index';
+
+describe('Common Utils', () => {
+  describe('deepMerge', () => {
+    it('should merge two objects deeply', () => {
+      const target = { a: 1, b: { c: 2 } };
+      const source = { b: { d: 3 }, e: 4 };
+      const result = deepMerge(target, source);
+
+      expect(result).toEqual({ a: 1, b: { c: 2, d: 3 }, e: 4 });
+    });
+
+    it('should return the target object when source is empty', () => {
+      const target = { a: 1, b: { c: 2 } };
+      const source = {};
+      const result = deepMerge(target, source);
+
+      expect(result).toEqual(target);
+    });
+  });
+
+  describe('debounce', () => {
+    it('should debounce a function call', done => {
+      let count = 0;
+      const debouncedFn = debounce(() => {
+        count++;
+        done();
+      }, 100);
+
+      debouncedFn();
+      debouncedFn();
+      debouncedFn();
+
+      expect(count).toBe(0);
+    });
+  });
+
+  describe('throttle', () => {
+    it('should throttle a function call', () => {
+      let count = 0;
+      const throttledFn = throttle(() => {
+        count++;
+      }, 100);
+
+      throttledFn();
+      throttledFn();
+      throttledFn();
+
+      expect(count).toBe(1);
+    });
+  });
+});

package/src/core/utils/__tests__/environment.test.ts

@@ -0,0 +1,94 @@
+import { getEnvironment } from '../index';
+
+describe('Cross-Platform Compatibility', () => {
+  describe('Environment Detection', () => {
+    it('should detect client environment correctly in Jest', () => {
+      const env = getEnvironment();
+      // In Jest test environment with jsdom, it should be client-side
+      expect(env.isServer).toBe(false);
+      expect(env.isClient).toBe(true);
+    });
+
+    it('should detect web environment when window is available', () => {
+      // Mock window object for web environment
+      const originalWindow = global.window;
+      // Use any type assertion to bypass TypeScript checks for testing
+      global.window = {} as any;
+
+      // Mock wx and my objects as undefined to simulate web environment
+      Object.defineProperty(global.window, 'wx', { value: undefined, writable: true });
+      Object.defineProperty(global.window, 'my', { value: undefined, writable: true });
+
+      const env = getEnvironment();
+      expect(env.isWeb).toBe(true);
+      expect(env.isWeapp).toBe(false);
+      expect(env.isAlipay).toBe(false);
+
+      // Restore original window object
+      global.window = originalWindow;
+    });
+
+    it('should detect WeChat Mini Program environment correctly', () => {
+      // Mock window object with wx for WeChat Mini Program environment
+      const originalWindow = global.window;
+      // Use any type assertion to bypass TypeScript checks for testing
+      global.window = {} as any;
+
+      Object.defineProperty(global.window, 'wx', {
+        value: {
+          getSystemInfoSync: jest.fn(),
+        },
+        writable: true,
+      });
+      Object.defineProperty(global.window, 'my', { value: undefined, writable: true });
+
+      const env = getEnvironment();
+      expect(env.isWeapp).toBe(true);
+      expect(env.isWeb).toBe(false);
+      expect(env.isAlipay).toBe(false);
+
+      // Restore original window object
+      global.window = originalWindow;
+    });
+
+    it('should detect Alipay Mini Program environment correctly', () => {
+      // Mock window object with my for Alipay Mini Program environment
+      const originalWindow = global.window;
+      // Use any type assertion to bypass TypeScript checks for testing
+      global.window = {} as any;
+
+      Object.defineProperty(global.window, 'wx', { value: undefined, writable: true });
+      Object.defineProperty(global.window, 'my', {
+        value: {
+          getSystemInfoSync: jest.fn(),
+        },
+        writable: true,
+      });
+
+      const env = getEnvironment();
+      expect(env.isAlipay).toBe(true);
+      expect(env.isWeb).toBe(false);
+      expect(env.isWeapp).toBe(false);
+
+      // Restore original window object
+      global.window = originalWindow;
+    });
+
+    it('should return consistent environment object structure', () => {
+      const env = getEnvironment();
+
+      expect(env).toHaveProperty('isServer');
+      expect(env).toHaveProperty('isClient');
+      expect(env).toHaveProperty('isWeapp');
+      expect(env).toHaveProperty('isAlipay');
+      expect(env).toHaveProperty('isWeb');
+
+      // All properties should be boolean values
+      expect(typeof env.isServer).toBe('boolean');
+      expect(typeof env.isClient).toBe('boolean');
+      expect(typeof env.isWeapp).toBe('boolean');
+      expect(typeof env.isAlipay).toBe('boolean');
+      expect(typeof env.isWeb).toBe('boolean');
+    });
+  });
+});

package/src/core/utils/__tests__/i18n.test.ts

@@ -0,0 +1,247 @@
+import {
+  formatDateTime,
+  formatDate,
+  formatTime,
+  formatCurrency,
+  formatPercent,
+  formatNumber,
+  getSupportedLocales,
+  getSystemLocale,
+  getSystemTimeZone,
+  Localization,
+  defaultLocalization,
+} from '../i18n';
+
+describe('Internationalization Utilities', () => {
+  const testDate = new Date('2023-10-15T14:30:45.123Z');
+
+  describe('formatDateTime', () => {
+    it('should format date time with default options', () => {
+      const result = formatDateTime(testDate);
+      expect(typeof result).toBe('string');
+      expect(result).not.toBe('');
+    });
+
+    it('should format date time with different locales', () => {
+      const enResult = formatDateTime(testDate, { locale: 'en-US' });
+      const zhResult = formatDateTime(testDate, { locale: 'zh-CN' });
+      const deResult = formatDateTime(testDate, { locale: 'de-DE' });
+
+      expect(typeof enResult).toBe('string');
+      expect(typeof zhResult).toBe('string');
+      expect(typeof deResult).toBe('string');
+      expect(enResult).not.toBe(zhResult);
+      expect(enResult).not.toBe(deResult);
+    });
+
+    it('should format date time with custom styles', () => {
+      const fullResult = formatDateTime(testDate, { dateStyle: 'full', timeStyle: 'full' });
+      const shortResult = formatDateTime(testDate, { dateStyle: 'short', timeStyle: 'short' });
+
+      expect(typeof fullResult).toBe('string');
+      expect(typeof shortResult).toBe('string');
+      expect(fullResult.length).toBeGreaterThan(shortResult.length);
+    });
+  });
+
+  describe('formatDate', () => {
+    it('should format date with default options', () => {
+      const result = formatDate(testDate);
+      expect(typeof result).toBe('string');
+      expect(result).not.toBe('');
+    });
+
+    it('should format date with different locales', () => {
+      const enResult = formatDate(testDate, { locale: 'en-US' });
+      const zhResult = formatDate(testDate, { locale: 'zh-CN' });
+
+      expect(typeof enResult).toBe('string');
+      expect(typeof zhResult).toBe('string');
+      expect(enResult).not.toBe(zhResult);
+    });
+  });
+
+  describe('formatTime', () => {
+    it('should format time with default options', () => {
+      const result = formatTime(testDate);
+      expect(typeof result).toBe('string');
+      expect(result).not.toBe('');
+    });
+
+    it('should format time with different locales', () => {
+      const enResult = formatTime(testDate, { locale: 'en-US' });
+      const zhResult = formatTime(testDate, { locale: 'zh-CN' });
+
+      expect(typeof enResult).toBe('string');
+      expect(typeof zhResult).toBe('string');
+      expect(enResult).not.toBe(zhResult);
+    });
+
+    it('should format time with 12-hour format', () => {
+      const result = formatTime(testDate, { locale: 'en-US', hour12: true });
+      expect(typeof result).toBe('string');
+      expect(result).toMatch(/AM|PM/i);
+    });
+  });
+
+  describe('formatCurrency', () => {
+    it('should format currency with default options', () => {
+      const result = formatCurrency(1234.56, { currency: 'CNY' });
+      expect(typeof result).toBe('string');
+      expect(result).not.toBe('');
+    });
+
+    it('should format currency with different currencies', () => {
+      const cnyResult = formatCurrency(1234.56, { currency: 'CNY' });
+      const usdResult = formatCurrency(1234.56, { currency: 'USD' });
+      const eurResult = formatCurrency(1234.56, { currency: 'EUR' });
+
+      expect(typeof cnyResult).toBe('string');
+      expect(typeof usdResult).toBe('string');
+      expect(typeof eurResult).toBe('string');
+      expect(cnyResult).not.toBe(usdResult);
+      expect(cnyResult).not.toBe(eurResult);
+    });
+
+    it('should format currency with different locales', () => {
+      const enResult = formatCurrency(1234.56, { currency: 'USD', locale: 'en-US' });
+      const deResult = formatCurrency(1234.56, { currency: 'EUR', locale: 'de-DE' });
+
+      expect(typeof enResult).toBe('string');
+      expect(typeof deResult).toBe('string');
+      expect(enResult).not.toBe(deResult);
+    });
+  });
+
+  describe('formatPercent', () => {
+    it('should format percent with default options', () => {
+      const result = formatPercent(0.75);
+      expect(typeof result).toBe('string');
+      expect(result).not.toBe('');
+    });
+
+    it('should format percent with different locales', () => {
+      const enResult = formatPercent(0.75, { locale: 'en-US' });
+      const deResult = formatPercent(0.75, { locale: 'de-DE' });
+
+      expect(typeof enResult).toBe('string');
+      expect(typeof deResult).toBe('string');
+      expect(enResult).not.toBe(deResult);
+    });
+
+    it('should format percent with custom decimal digits', () => {
+      const result = formatPercent(0.75123, { digits: 3 });
+      expect(typeof result).toBe('string');
+    });
+  });
+
+  describe('formatNumber', () => {
+    it('should format number with default options', () => {
+      const result = formatNumber(1234.5678);
+      expect(typeof result).toBe('string');
+      expect(result).not.toBe('');
+    });
+
+    it('should format number with different locales', () => {
+      const enResult = formatNumber(1234.5678, { locale: 'en-US' });
+      const deResult = formatNumber(1234.5678, { locale: 'de-DE' });
+
+      expect(typeof enResult).toBe('string');
+      expect(typeof deResult).toBe('string');
+      expect(enResult).not.toBe(deResult);
+    });
+
+    it('should format number with custom decimal digits', () => {
+      const result = formatNumber(1234.5678, { digits: 3 });
+      expect(typeof result).toBe('string');
+    });
+
+    it('should format number without grouping', () => {
+      const result = formatNumber(1234.5678, { useGrouping: false });
+      expect(typeof result).toBe('string');
+    });
+  });
+
+  describe('getSupportedLocales', () => {
+    it('should return an array of supported locales', () => {
+      const locales = getSupportedLocales();
+      expect(Array.isArray(locales)).toBe(true);
+      expect(locales.length).toBeGreaterThan(0);
+    });
+  });
+
+  describe('getSystemLocale', () => {
+    it('should return a string', () => {
+      const locale = getSystemLocale();
+      expect(typeof locale).toBe('string');
+      expect(locale).not.toBe('');
+    });
+  });
+
+  describe('getSystemTimeZone', () => {
+    it('should return a string', () => {
+      const timeZone = getSystemTimeZone();
+      expect(typeof timeZone).toBe('string');
+      expect(timeZone).not.toBe('');
+    });
+  });
+
+  describe('Localization class', () => {
+    it('should create an instance with default options', () => {
+      const localization = new Localization();
+      expect(localization).toBeInstanceOf(Localization);
+    });
+
+    it('should create an instance with custom options', () => {
+      const localization = new Localization({ locale: 'en-US', timeZone: 'America/New_York' });
+      expect(localization).toBeInstanceOf(Localization);
+    });
+
+    it('should get and set locale', () => {
+      const localization = new Localization();
+      const initialLocale = localization.getLocale();
+
+      localization.setLocale('fr-FR');
+      expect(localization.getLocale()).toBe('fr-FR');
+      expect(localization.getLocale()).not.toBe(initialLocale);
+    });
+
+    it('should get and set timeZone', () => {
+      const localization = new Localization();
+      const initialTimeZone = localization.getTimeZone();
+
+      localization.setTimeZone('Europe/London');
+      expect(localization.getTimeZone()).toBe('Europe/London');
+      expect(localization.getTimeZone()).not.toBe(initialTimeZone);
+    });
+
+    it('should format date time using instance methods', () => {
+      const localization = new Localization({ locale: 'en-US' });
+      const result = localization.formatDateTime(testDate);
+      expect(typeof result).toBe('string');
+      expect(result).not.toBe('');
+    });
+
+    it('should format currency using instance methods', () => {
+      const localization = new Localization({ locale: 'en-US' });
+      const result = localization.formatCurrency(1234.56, { currency: 'USD' });
+      expect(typeof result).toBe('string');
+      expect(result).not.toBe('');
+    });
+  });
+
+  describe('defaultLocalization', () => {
+    it('should be an instance of Localization', () => {
+      expect(defaultLocalization).toBeInstanceOf(Localization);
+    });
+
+    it('should have format methods', () => {
+      expect(typeof defaultLocalization.formatDateTime).toBe('function');
+      expect(typeof defaultLocalization.formatDate).toBe('function');
+      expect(typeof defaultLocalization.formatTime).toBe('function');
+      expect(typeof defaultLocalization.formatCurrency).toBe('function');
+      expect(typeof defaultLocalization.formatPercent).toBe('function');
+      expect(typeof defaultLocalization.formatNumber).toBe('function');
+    });
+  });
+});