feat: update

theme/utils.ts

@@ -0,0 +1,122 @@
+/**
+ * 主题工具函数
+ * 
+ * 提供主题相关的辅助函数
+ */
+
+import Colors from '@/constants/Colors';
+
+/**
+ * 根据主题获取颜色
+ * 
+ * @param theme - 主题类型 'light' | 'dark'
+ * @param colorName - 颜色名称
+ * @returns 颜色值
+ */
+export function getThemeColor(
+  theme: 'light' | 'dark',
+  colorName: keyof typeof Colors.light & keyof typeof Colors.dark
+): string {
+  return Colors[theme][colorName];
+}
+
+/**
+ * 根据主题获取所有颜色
+ * 
+ * @param theme - 主题类型 'light' | 'dark'
+ * @returns 颜色对象
+ */
+export function getThemeColors(theme: 'light' | 'dark') {
+  return Colors[theme];
+}
+
+/**
+ * 创建主题感知的样式
+ * 
+ * @param lightStyle - 浅色主题样式
+ * @param darkStyle - 深色主题样式
+ * @param theme - 当前主题
+ * @returns 合并后的样式
+ * 
+ * @example
+ * ```tsx
+ * const style = createThemedStyle(
+ *   { backgroundColor: '#fff' },
+ *   { backgroundColor: '#000' },
+ *   theme
+ * );
+ * ```
+ */
+export function createThemedStyle<T>(
+  lightStyle: T,
+  darkStyle: T,
+  theme: 'light' | 'dark'
+): T {
+  return theme === 'dark' ? darkStyle : lightStyle;
+}
+
+/**
+ * 根据主题选择值
+ * 
+ * @param lightValue - 浅色主题值
+ * @param darkValue - 深色主题值
+ * @param theme - 当前主题
+ * @returns 选中的值
+ * 
+ * @example
+ * ```tsx
+ * const fontSize = selectByTheme(14, 16, theme);
+ * ```
+ */
+export function selectByTheme<T>(
+  lightValue: T,
+  darkValue: T,
+  theme: 'light' | 'dark'
+): T {
+  return theme === 'dark' ? darkValue : lightValue;
+}
+
+/**
+ * 颜色透明度调整
+ * 
+ * @param color - 十六进制颜色值
+ * @param opacity - 透明度 0-1
+ * @returns 带透明度的颜色值
+ * 
+ * @example
+ * ```tsx
+ * const color = withOpacity('#000000', 0.5); // rgba(0, 0, 0, 0.5)
+ * ```
+ */
+export function withOpacity(color: string, opacity: number): string {
+  // 移除 # 号
+  const hex = color.replace('#', '');
+  
+  // 转换为 RGB
+  const r = parseInt(hex.substring(0, 2), 16);
+  const g = parseInt(hex.substring(2, 4), 16);
+  const b = parseInt(hex.substring(4, 6), 16);
+  
+  return `rgba(${r}, ${g}, ${b}, ${opacity})`;
+}
+
+/**
+ * 判断是否为深色主题
+ * 
+ * @param theme - 主题类型
+ * @returns 是否为深色主题
+ */
+export function isDarkTheme(theme: 'light' | 'dark'): boolean {
+  return theme === 'dark';
+}
+
+/**
+ * 判断是否为浅色主题
+ * 
+ * @param theme - 主题类型
+ * @returns 是否为浅色主题
+ */
+export function isLightTheme(theme: 'light' | 'dark'): boolean {
+  return theme === 'light';
+}
+