taro-uno-ui 1.0.1 → 1.0.2

package/src/components/basic/Icon/Icon.types.ts

@@ -1,210 +0,0 @@
-import type { ReactNode, SVGAttributes } from 'react';
-
-/** 图标类型 */
-export type IconType = 'svg' | 'image' | 'font' | 'custom';
-
-/** 图标来源 */
-export type IconSource =
-  | string // URL或字体图标名称
-  | ReactNode // 自定义React节点
-  | {
-      // SVG图标数据
-      viewBox?: string;
-      path?: string;
-      paths?: string[];
-      d?: string;
-    };
-
-/** 图标尺寸 */
-export type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl';
-
-/** 图标颜色 */
-export type IconColor = string;
-
-/** 图标旋转角度 */
-export type IconRotation = 0 | 45 | 90 | 135 | 180 | 225 | 270 | 315;
-
-/** 图标状态 */
-export type IconStatus = 'normal' | 'active' | 'disabled' | 'loading';
-
-/** 图标主题 */
-export type IconTheme = 'outlined' | 'filled' | 'two-tone' | 'colored';
-
-/** 图标原生属性类型 */
-export type IconNativeProps = SVGAttributes<SVGElement>;
-
-/** 图标组件属性接口 */
-export interface IconProps extends Omit<IconNativeProps, 'size' | 'color'> {
-  /** 图标源 */
-  source: IconSource;
-  /** 图标类型 */
-  type?: IconType;
-  /** 图标尺寸 */
-  size?: IconSize | number;
-  /** 图标颜色 */
-  color?: IconColor;
-  /** 图标旋转角度 */
-  rotate?: IconRotation;
-  /** 图标状态 */
-  status?: IconStatus;
-  /** 图标主题 */
-  theme?: IconTheme;
-  /** 是否可点击 */
-  clickable?: boolean;
-  /** 是否显示加载状态 */
-  loading?: boolean;
-  /** 是否禁用 */
-  disabled?: boolean;
-  /** 自定义样式类名 */
-  className?: string;
-  /** 点击事件处理函数 */
-  onClick?: (_event: React.MouseEvent) => void;
-  /** 自定义样式 */
-  style?: React.CSSProperties;
-  /** 图标库前缀 */
-  prefix?: string;
-  /** 图标库后缀 */
-  suffix?: string;
-  /** 是否启用动画 */
-  animated?: boolean;
-  /** 动画持续时间 */
-  animationDuration?: number;
-  /** 图标组中的索引位置 */
-  groupIndex?: number;
-  /** 图标组中的总数 */
-  groupSize?: number;
-  /** 自定义加载图标 */
-  loadingIcon?: ReactNode;
-  /** 是否显示工具提示 */
-  tooltip?: string;
-  /** 工具提示位置 */
-  tooltipPosition?: 'top' | 'bottom' | 'left' | 'right';
-  /** 是否启用涟漪效果 */
-  ripple?: boolean;
-  /** 图标滤镜效果 */
-  filter?: 'none' | 'grayscale' | 'sepia' | 'blur' | 'brightness' | 'contrast' | 'hue-rotate';
-  /** 图标混合模式 */
-  blendMode?: 'normal' | 'multiply' | 'screen' | 'overlay' | 'darken' | 'lighten';
-  /** 测试标识 */
-  'data-testid'?: string;
-}
-
-/** 图标组件引用类型 */
-export type IconRef = {
-  /** 图标元素 */
-  element: SVGElement | HTMLImageElement | HTMLSpanElement | null;
-  /** 触发点击事件 */
-  click: () => void;
-  /** 设置禁用状态 */
-  setDisabled: (_disabled: boolean) => void;
-  /** 设置加载状态 */
-  setLoading: (_loading: boolean) => void;
-  /** 获取图标状态 */
-  getStatus: () => IconStatus;
-  /** 获取图标尺寸 */
-  getSize: () => IconSize | number;
-  /** 获取图标颜色 */
-  getColor: () => string;
-  /** 旋转图标 */
-  rotate: (_angle: IconRotation) => void;
-  /** 设置图标颜色 */
-  setColor: (_color: string) => void;
-  /** 设置图标尺寸 */
-  setSize: (_size: IconSize | number) => void;
-};
-
-/** 图标组属性接口 */
-export interface IconGroupProps {
-  /** 图标组内容 */
-  children: ReactNode;
-  /** 图标组尺寸 */
-  size?: IconSize | number;
-  /** 图标组颜色 */
-  color?: IconColor;
-  /** 图标组状态 */
-  status?: IconStatus;
-  /** 图标组主题 */
-  theme?: IconTheme;
-  /** 图标组间距 */
-  spacing?: number;
-  /** 图标组是否垂直排列 */
-  vertical?: boolean;
-  /** 图标组对齐方式 */
-  align?: 'start' | 'center' | 'end' | 'stretch';
-  /** 图标组自定义样式类名 */
-  className?: string;
-  /** 图标组自定义样式 */
-  style?: React.CSSProperties;
-}
-
-/** 图标工具函数接口 */
-export interface IconUtils {
-  /** 获取图标样式类名 */
-  getIconClassName: (_props: Partial<IconProps>) => string;
-  /** 获取图标样式对象 */
-  getIconStyle: (_props: Partial<IconProps>) => React.CSSProperties;
-  /** 获取图标尺寸映射 */
-  getSizeMap: () => Record<IconSize, number>;
-  /** 获取图标状态映射 */
-  getStatusMap: () => Record<IconStatus, { opacity: number; cursor: string; pointerEvents: string }>;
-  /** 验证图标属性 */
-  validateIconProps: (_props: IconProps) => boolean;
-  /** 格式化图标尺寸 */
-  formatIconSize: (_size: IconSize | number) => string;
-  /** 格式化图标类型 */
-  formatIconType: (_type: IconType) => string;
-  /** 格式化图标状态 */
-  formatIconStatus: (_status: IconStatus) => string;
-  /** 解析图标源 */
-  parseIconSource: (_source: IconSource) => { type: IconType; data: any };
-  /** 生成SVG路径 */
-  generateSVGPath: (_data: any) => ReactNode;
-  /** 生成字体图标 */
-  generateFontIcon: (_data: any) => ReactNode;
-  /** 生成图片图标 */
-  generateImageIcon: (_data: any) => ReactNode;
-  /** 生成自定义图标 */
-  generateCustomIcon: (_data: any) => ReactNode;
-  /** 检测图标类型 */
-  detectIconType: (_source: IconSource) => IconType;
-}
-
-/** 预定义图标集 */
-export interface IconSet {
-  /** 图标名称 */
-  name: string;
-  /** 图标数据 */
-  data: IconSource;
-  /** 图标类型 */
-  type: IconType;
-  /** 图标主题 */
-  theme?: IconTheme;
-  /** 图标分类 */
-  category?: string;
-  /** 图标标签 */
-  tags?: string[];
-}
-
-/** 图标库配置 */
-export interface IconLibraryConfig {
-  /** 图标库名称 */
-  name: string;
-  /** 图标库前缀 */
-  prefix: string;
-  /** 图标库类型 */
-  type: IconType;
-  /** 图标库基础URL */
-  baseUrl?: string;
-  /** 图标库CSS路径 */
-  cssPath?: string;
-  /** 图标库版本 */
-  version?: string;
-  /** 是否已加载 */
-  loaded: boolean;
-  /** 加载图标库 */
-  load: () => Promise<void>;
-  /** 获取图标URL */
-  getIconUrl: (_iconName: string) => string;
-  /** 获取图标CSS类名 */
-  getIconClassName: (_iconName: string) => string;
-}

package/src/components/basic/Icon/IconManager.ts

@@ -1,229 +0,0 @@
-/**
- * Icon Manager
- * Unified management of icon sets and utility functions for the Icon component
- */
-
-import type { IconSet, IconSource, IconType, IconTheme } from './Icon.types';
-import {
-  basicOutlinedIcons,
-  basicFilledIcons,
-  navigationOutlinedIcons,
-  actionOutlinedIcons,
-  statusColoredIcons,
-  socialColoredIcons,
-} from './Icon.data';
-
-/**
- * Icon Manager class
- * Provides methods for managing and accessing icon sets
- */
-export class IconManager {
-  private allIcons: IconSet[] = [];
-  private iconMap: Map<string, IconSet> = new Map();
-  private iconLibrary: Map<string, Map<string, IconSet>> = new Map();
-
-  constructor() {
-    // Register all icon sets
-    this.registerIcons(basicOutlinedIcons, 'basic', 'outlined');
-    this.registerIcons(basicFilledIcons, 'basic', 'filled');
-    this.registerIcons(navigationOutlinedIcons, 'navigation', 'outlined');
-    this.registerIcons(actionOutlinedIcons, 'action', 'outlined');
-    this.registerIcons(statusColoredIcons, 'status', 'colored');
-    this.registerIcons(socialColoredIcons, 'social', 'colored');
-  }
-
-  /**
-   * Register icon set with category and theme
-   */
-  registerIcons(icons: IconSet[], category: string, theme: IconTheme) {
-    icons.forEach((icon) => {
-      // Add category and theme if not already present
-      const iconWithMeta = {
-        ...icon,
-        category: icon.category || category,
-        theme: icon.theme || theme,
-      };
-
-      // Store in all icons array
-      this.allIcons.push(iconWithMeta);
-
-      // Create unique key for icon map
-      const key = `${iconWithMeta.name}:${iconWithMeta.theme}:${iconWithMeta.category}`;
-      this.iconMap.set(key, iconWithMeta);
-
-      // Store in category map
-      if (!this.iconLibrary.has(category)) {
-        this.iconLibrary.set(category, new Map());
-      }
-      const categoryMap = this.iconLibrary.get(category)!;
-      categoryMap.set(iconWithMeta.name, iconWithMeta);
-    });
-  }
-
-  /**
-   * Get icon by name, theme, and category
-   */
-  getIcon(name: string, theme: IconTheme = 'outlined', category: string = 'basic'): IconSet | undefined {
-    const key = `${name}:${theme}:${category}`;
-    return this.iconMap.get(key);
-  }
-
-  /**
-   * Get all icons
-   */
-  getAllIcons(): IconSet[] {
-    return this.allIcons;
-  }
-
-  /**
-   * Get icons by category
-   */
-  getIconsByCategory(category: string): IconSet[] {
-    const categoryMap = this.iconLibrary.get(category);
-    if (!categoryMap) return [];
-    return Array.from(categoryMap.values());
-  }
-
-  /**
-   * Get icons by theme
-   */
-  getIconsByTheme(theme: IconTheme): IconSet[] {
-    return this.allIcons.filter((icon) => icon.theme === theme);
-  }
-
-  /**
-   * Get icons by type
-   */
-  getIconsByType(type: IconType): IconSet[] {
-    return this.allIcons.filter((icon) => icon.type === type);
-  }
-
-  /**
-   * Search icons by name or tags
-   */
-  searchIcons(query: string): IconSet[] {
-    const lowerQuery = query.toLowerCase();
-    return this.allIcons.filter((icon) => {
-      return (
-        icon.name.toLowerCase().includes(lowerQuery) ||
-        icon.tags?.some((tag) => tag.toLowerCase().includes(lowerQuery)) ||
-        icon.category?.toLowerCase().includes(lowerQuery)
-      );
-    });
-  }
-
-  /**
-   * Get icon source by name
-   */
-  getIconSource(name: string, theme: IconTheme = 'outlined', category: string = 'basic'): IconSource | undefined {
-    const icon = this.getIcon(name, theme, category);
-    return icon?.data;
-  }
-
-  /**
-   * Get all categories
-   */
-  getCategories(): string[] {
-    return Array.from(this.iconLibrary.keys());
-  }
-
-  /**
-   * Get all themes
-   */
-  getThemes(): IconTheme[] {
-    const themes = new Set<IconTheme>();
-    this.allIcons.forEach((icon) => {
-      if (icon.theme) {
-        themes.add(icon.theme);
-      }
-    });
-    return Array.from(themes);
-  }
-
-  /**
-   * Check if icon exists
-   */
-  hasIcon(name: string, theme: IconTheme = 'outlined', category: string = 'basic'): boolean {
-    return this.getIcon(name, theme, category) !== undefined;
-  }
-
-  /**
-   * Get icon by name with automatic theme and category detection
-   */
-  findIcon(name: string): IconSet | undefined {
-    // Try to find icon in any theme and category
-    for (const [_, icon] of this.iconMap.entries()) {
-      if (icon.name === name) {
-        return icon;
-      }
-    }
-    return undefined;
-  }
-
-  /**
-   * Get icon statistics
-   */
-  getStats() {
-    return {
-      totalIcons: this.allIcons.length,
-      categories: this.getCategories().length,
-      themes: this.getThemes().length,
-      byCategory: Object.fromEntries(
-        this.getCategories().map((category) => [category, this.getIconsByCategory(category).length]),
-      ),
-      byTheme: Object.fromEntries(this.getThemes().map((theme) => [theme, this.getIconsByTheme(theme).length])),
-    };
-  }
-}
-
-/**
- * Create and export default IconManager instance
- */
-export const iconManager = new IconManager();
-
-/**
- * Icon utility functions
- */
-export const IconUtils = {
-  /**
-   * Get icon source by name
-   */
-  getIcon(name: string, theme: IconTheme = 'outlined', category: string = 'basic'): IconSource | undefined {
-    return iconManager.getIconSource(name, theme, category);
-  },
-
-  /**
-   * Check if icon exists
-   */
-  hasIcon(name: string, theme: IconTheme = 'outlined', category: string = 'basic'): boolean {
-    return iconManager.hasIcon(name, theme, category);
-  },
-
-  /**
-   * Get all icons
-   */
-  getAllIcons(): IconSet[] {
-    return iconManager.getAllIcons();
-  },
-
-  /**
-   * Search icons
-   */
-  searchIcons(query: string): IconSet[] {
-    return iconManager.searchIcons(query);
-  },
-
-  /**
-   * Get icon by name with automatic detection
-   */
-  findIcon(name: string): IconSet | undefined {
-    return iconManager.findIcon(name);
-  },
-
-  /**
-   * Get icon statistics
-   */
-  getStats() {
-    return iconManager.getStats();
-  },
-};

package/src/components/basic/Icon/index.tsx

@@ -1,22 +0,0 @@
-export { IconComponent, IconComponent as Icon } from './Icon';
-export type {
-  IconProps,
-  IconRef,
-  IconGroupProps,
-  IconUtils,
-  IconType,
-  IconSource,
-  IconSize,
-  IconColor,
-  IconRotation,
-  IconStatus,
-  IconTheme,
-  IconNativeProps,
-  IconSet,
-  IconLibraryConfig,
-} from './Icon.types';
-export { iconStyles } from './Icon.styles';
-
-/** 图标组件默认导出 */
-import { IconComponent } from './Icon';
-export { IconComponent as default };