taro-uno-ui 0.9.0 → 1.0.0

package/src/theme/variables.ts

@@ -185,91 +185,110 @@ export class CSSVariableGenerator {
         name: 'colors',
         prefix: 'color',
         variables: [
-          'primary', 'primaryLight', 'primaryDark',
-          'secondary', 'success', 'warning', 'error', 'info',
-          'text', 'textSecondary', 'textDisabled', 'textInverse',
-          'background', 'backgroundCard', 'backgroundInput', 'backgroundMask',
-          'border', 'borderLight', 'borderFocus',
-          'shadow', 'shadowLight', 'brand', 'accent', 'link', 'divider'
+          'primary',
+          'primaryLight',
+          'primaryDark',
+          'secondary',
+          'success',
+          'warning',
+          'error',
+          'info',
+          'text',
+          'textSecondary',
+          'textDisabled',
+          'textInverse',
+          'background',
+          'backgroundCard',
+          'backgroundInput',
+          'backgroundMask',
+          'border',
+          'borderLight',
+          'borderFocus',
+          'shadow',
+          'shadowLight',
+          'brand',
+          'accent',
+          'link',
+          'divider',
         ],
         inheritance: [
           {
             parent: 'primary',
             child: 'primaryLight',
-            transform: (value) => this.lightenColor(value, 0.2)
+            transform: (value) => this.lightenColor(value, 0.2),
           },
           {
             parent: 'primary',
             child: 'primaryDark',
-            transform: (value) => this.darkenColor(value, 0.2)
-          }
-        ]
+            transform: (value) => this.darkenColor(value, 0.2),
+          },
+        ],
       },
       {
         name: 'spacing',
         prefix: 'spacing',
-        variables: ['xs', 'sm', 'md', 'lg', 'xl', 'xxl', 'padding', 'margin', 'gap']
+        variables: ['xs', 'sm', 'md', 'lg', 'xl', 'xxl', 'padding', 'margin', 'gap'],
       },
       {
         name: 'typography',
         prefix: 'font',
-        variables: ['family-sans', 'family-serif', 'family-mono', 'family-heading']
+        variables: ['family-sans', 'family-serif', 'family-mono', 'family-heading'],
       },
       {
         name: 'fontSize',
         prefix: 'text',
-        variables: ['xs', 'sm', 'base', 'lg', 'xl', '2xl', '3xl', '4xl', '5xl']
+        variables: ['xs', 'sm', 'base', 'lg', 'xl', '2xl', '3xl', '4xl', '5xl'],
       },
       {
         name: 'fontWeight',
         prefix: 'weight',
-        variables: ['light', 'normal', 'medium', 'semibold', 'bold']
+        variables: ['light', 'normal', 'medium', 'semibold', 'bold'],
       },
       {
         name: 'lineHeight',
         prefix: 'leading',
-        variables: ['tight', 'normal', 'relaxed', 'loose']
+        variables: ['tight', 'normal', 'relaxed', 'loose'],
       },
       {
         name: 'letterSpacing',
         prefix: 'tracking',
-        variables: ['tight', 'normal', 'wide']
+        variables: ['tight', 'normal', 'wide'],
       },
       {
         name: 'borderRadius',
         prefix: 'radius',
-        variables: ['none', 'sm', 'md', 'lg', 'xl', 'full', 'circle']
+        variables: ['none', 'sm', 'md', 'lg', 'xl', 'full', 'circle'],
       },
       {
         name: 'shadow',
         prefix: 'shadow',
-        variables: ['none', 'sm', 'md', 'lg', 'xl', '2xl', 'inner']
+        variables: ['none', 'sm', 'md', 'lg', 'xl', '2xl', 'inner'],
       },
       {
         name: 'animation',
         prefix: 'duration',
-        variables: ['fast', 'normal', 'slow']
+        variables: ['fast', 'normal', 'slow'],
       },
       {
         name: 'easing',
         prefix: 'ease',
-        variables: ['linear', 'ease', 'easeIn', 'easeOut', 'easeInOut']
+        variables: ['linear', 'ease', 'easeIn', 'easeOut', 'easeInOut'],
       },
       {
         name: 'breakpoints',
         prefix: 'breakpoint',
-        variables: ['xs', 'sm', 'md', 'lg', 'xl', 'xxl']
+        variables: ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'],
       },
       {
         name: 'zIndex',
         prefix: 'z',
-        variables: ['dropdown', 'sticky', 'fixed', 'modal', 'popover', 'tooltip']
+        variables: ['dropdown', 'sticky', 'fixed', 'modal', 'popover', 'tooltip'],
       },
       {
         name: 'transition',
         prefix: 'transition',
-        variables: ['base', 'fast', 'slow']
-      }
+        variables: ['base', 'fast', 'slow'],
+      },
     ];
   }
 
@@ -279,28 +298,28 @@ export class CSSVariableGenerator {
 
     // 生成颜色变量
     variables.colors = this.generateColorVariables();
-    
+
     // 生成间距变量
     variables.spacing = this.generateSpacingVariables();
-    
+
     // 生成字体变量
     variables.typography = this.generateTypographyVariables();
-    
+
     // 生成边框变量
     variables.borderRadius = this.generateBorderRadiusVariables();
-    
+
     // 生成阴影变量
     variables.shadow = this.generateShadowVariables();
-    
+
     // 生成动画变量
     variables.animation = this.generateAnimationVariables();
-    
+
     // 生成断点变量
     variables.breakpoints = this.generateBreakpointVariables();
-    
+
     // 生成Z-index变量
     variables.zIndex = this.generateZIndexVariables();
-    
+
     // 生成过渡变量
     variables.transition = this.generateTransitionVariables();
 
@@ -310,7 +329,7 @@ export class CSSVariableGenerator {
   // 生成颜色变量
   private generateColorVariables(): CSSVariables['colors'] {
     const { colors } = this.theme;
-    
+
     return {
       primary: colors.primary,
       primaryLight: this.lightenColor(colors.primary, 0.2),
@@ -343,7 +362,7 @@ export class CSSVariableGenerator {
   // 生成间距变量
   private generateSpacingVariables(): CSSVariables['spacing'] {
     const { spacing } = this.theme;
-    
+
     return {
       xs: `${spacing.xs}px`,
       sm: `${spacing.sm}px`,
@@ -360,7 +379,7 @@ export class CSSVariableGenerator {
   // 生成字体变量
   private generateTypographyVariables(): CSSVariables['typography'] {
     const { typography } = this.theme;
-    
+
     return {
       fontFamily: {
         sans: typography.fontFamily.sans.join(', '),
@@ -403,7 +422,7 @@ export class CSSVariableGenerator {
   // 生成边框变量
   private generateBorderRadiusVariables(): CSSVariables['borderRadius'] {
     const { borderRadius } = this.theme;
-    
+
     return {
       none: `${borderRadius.none}px`,
       sm: `${borderRadius.sm}px`,
@@ -418,7 +437,7 @@ export class CSSVariableGenerator {
   // 生成阴影变量
   private generateShadowVariables(): CSSVariables['shadow'] {
     const { shadow } = this.theme;
-    
+
     return {
       none: shadow.none,
       sm: shadow.sm,
@@ -433,7 +452,7 @@ export class CSSVariableGenerator {
   // 生成动画变量
   private generateAnimationVariables(): CSSVariables['animation'] {
     const { animation } = this.theme;
-    
+
     return {
       duration: animation.duration,
       easing: animation.easing,
@@ -443,7 +462,7 @@ export class CSSVariableGenerator {
   // 生成断点变量
   private generateBreakpointVariables(): CSSVariables['breakpoints'] {
     const { breakpoints } = this.theme.spacing;
-    
+
     return {
       xs: `${breakpoints.xs}px`,
       sm: `${breakpoints.sm}px`,
@@ -469,7 +488,7 @@ export class CSSVariableGenerator {
   // 生成过渡变量
   private generateTransitionVariables(): CSSVariables['transition'] {
     const { animation } = this.theme;
-    
+
     return {
       base: `all ${animation.duration.normal} ${animation.easing.easeInOut}`,
       fast: `all ${animation.duration.fast} ${animation.easing.easeInOut}`,
@@ -480,9 +499,9 @@ export class CSSVariableGenerator {
   // 生成CSS变量字符串
   public generateCSSString(): string {
     const variables = this.generateVariables();
-    
+
     let css = ':root {\n';
-    
+
     // 递归生成变量
     const generateSection = (obj: any, prefix: string = '') => {
       Object.entries(obj).forEach(([key, value]) => {
@@ -494,10 +513,10 @@ export class CSSVariableGenerator {
         }
       });
     };
-    
+
     generateSection(variables);
     css += '}\n';
-    
+
     // 生成暗色主题变量
     css += '[data-theme="dark"] {\n';
     const darkVariables = this.generateDarkThemeVariables();
@@ -505,14 +524,14 @@ export class CSSVariableGenerator {
       css += `  --${key}: ${value};\n`;
     });
     css += '}\n';
-    
+
     return css;
   }
 
   // 生成暗色主题变量
   private generateDarkThemeVariables(): Record<string, string> {
     const darkColors = this.generateColorVariables();
-    
+
     return {
       'color-text': darkColors.text,
       'color-text-secondary': darkColors.textSecondary,
@@ -534,22 +553,22 @@ export class CSSVariableGenerator {
   private lightenColor(hex: string, amount: number): string {
     const rgb = this.hexToRgb(hex);
     if (!rgb) return hex;
-    
+
     const r = Math.min(255, Math.floor(rgb.r + (255 - rgb.r) * amount));
     const g = Math.min(255, Math.floor(rgb.g + (255 - rgb.g) * amount));
     const b = Math.min(255, Math.floor(rgb.b + (255 - rgb.b) * amount));
-    
+
     return this.rgbToHex(r, g, b);
   }
 
   private darkenColor(hex: string, amount: number): string {
     const rgb = this.hexToRgb(hex);
     if (!rgb) return hex;
-    
+
     const r = Math.max(0, Math.floor(rgb.r * (1 - amount)));
     const g = Math.max(0, Math.floor(rgb.g * (1 - amount)));
     const b = Math.max(0, Math.floor(rgb.b * (1 - amount)));
-    
+
     return this.rgbToHex(r, g, b);
   }
 
@@ -580,4 +599,4 @@ export const generateCSSVariablesString = (theme: ThemeConfig): string => {
   return generator.generateCSSString();
 };
 
-export default CSSVariableGenerator;
+export default CSSVariableGenerator;

package/src/types/accessibility.ts

@@ -1,51 +1,50 @@
 export interface AccessibilityState {
-    disabled?: boolean;
-    selected?: boolean;
-    checked?: boolean | 'mixed';
-    expanded?: boolean;
-    busy?: boolean;
-    pressed?: boolean;
+  disabled?: boolean;
+  selected?: boolean;
+  checked?: boolean | 'mixed';
+  expanded?: boolean;
+  busy?: boolean;
+  pressed?: boolean;
 }
 
 export interface AccessibilityValue {
-    min?: number;
-    max?: number;
-    now?: number;
-    text?: string;
+  min?: number;
+  max?: number;
+  now?: number;
+  text?: string;
 }
 
 export interface AccessibilityProps {
-    accessible?: boolean;
-    accessibilityLabel?: string;
-    accessibilityRole?: string;
-    accessibilityHint?: string;
-    accessibilityState?: AccessibilityState;
-    accessibilityValue?: AccessibilityValue;
-    accessibilityId?: string;
-    accessibilityLiveRegion?: 'none' | 'polite' | 'assertive';
+  accessible?: boolean;
+  accessibilityLabel?: string;
+  accessibilityRole?: string;
+  accessibilityHint?: string;
+  accessibilityState?: AccessibilityState;
+  accessibilityValue?: AccessibilityValue;
+  accessibilityId?: string;
+  accessibilityLiveRegion?: 'none' | 'polite' | 'assertive';
 }
 
 export interface AccessibilityActionEvent {
-    nativeEvent: {
-        actionName: string;
-        actionTarget?: string;
-    };
+  nativeEvent: {
+    actionName: string;
+    actionTarget?: string;
+  };
 }
 
 export interface AccessibilityEvents {
-    onAccessibilityAction?: (event: AccessibilityActionEvent) => void;
-    onAccessibilityFocus?: (event: any) => void;
-    onAccessibilityHintChange?: (event: any) => void;
-    onAccessibilityStateChange?: (event: any) => void;
-    onAccessibilityValueChange?: (event: any) => void;
-    onAccessibilityLabelChange?: (event: any) => void;
-    onAccessibilityRoleChange?: (event: any) => void;
-    onAccessibilityRequest?: (event: AccessibilityActionEvent) => void;
-    onAccessibilityDone?: (event: any) => void;
-    onAccessibilityCancel?: (event: any) => void;
-    onAccessibilityError?: (event: any) => void;
-    onAccessibilityWarning?: (event: any) => void;
-    onAccessibilityInfo?: (event: any) => void;
-    onAccessibilitySuccess?: (event: any) => void;
+  onAccessibilityAction?: (event: AccessibilityActionEvent) => void;
+  onAccessibilityFocus?: (event: any) => void;
+  onAccessibilityHintChange?: (event: any) => void;
+  onAccessibilityStateChange?: (event: any) => void;
+  onAccessibilityValueChange?: (event: any) => void;
+  onAccessibilityLabelChange?: (event: any) => void;
+  onAccessibilityRoleChange?: (event: any) => void;
+  onAccessibilityRequest?: (event: AccessibilityActionEvent) => void;
+  onAccessibilityDone?: (event: any) => void;
+  onAccessibilityCancel?: (event: any) => void;
+  onAccessibilityError?: (event: any) => void;
+  onAccessibilityWarning?: (event: any) => void;
+  onAccessibilityInfo?: (event: any) => void;
+  onAccessibilitySuccess?: (event: any) => void;
 }
-

package/src/types/button.ts

@@ -37,10 +37,7 @@ export type ButtonStatus = 'normal' | 'loading' | 'disabled' | 'active';
 export type ButtonIconPosition = 'left' | 'right';
 
 /** 按钮原生属性类型 */
-export type ButtonNativeProps = Omit<
-  React.ButtonHTMLAttributes<HTMLButtonElement>,
-  'size' | 'type' | 'onClick'
->;
+export type ButtonNativeProps = Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'size' | 'type' | 'onClick'>;
 
 // ==================== Button属性类型 ====================
 
@@ -286,37 +283,38 @@ export interface ButtonUtils {
 /** 按钮尺寸验证器 */
 export const buttonSizeValidator: Validator<ButtonSize> = createValidator(
   (value): value is ButtonSize => ['xs', 'sm', 'md', 'lg', 'xl'].includes(value as ButtonSize),
-  'Invalid button size. Must be one of: xs, sm, md, lg, xl'
+  'Invalid button size. Must be one of: xs, sm, md, lg, xl',
 );
 
 /** 按钮类型验证器 */
 export const buttonTypeValidator: Validator<ButtonType> = createValidator(
-  (value): value is ButtonType => ['default', 'primary', 'secondary', 'success', 'warning', 'error', 'info'].includes(value as ButtonType),
-  'Invalid button type. Must be one of: default, primary, secondary, success, warning, error, info'
+  (value): value is ButtonType =>
+    ['default', 'primary', 'secondary', 'success', 'warning', 'error', 'info'].includes(value as ButtonType),
+  'Invalid button type. Must be one of: default, primary, secondary, success, warning, error, info',
 );
 
 /** 按钮变体验证器 */
 export const buttonVariantValidator: Validator<ButtonVariant> = createValidator(
   (value): value is ButtonVariant => ['solid', 'outline', 'ghost', 'text'].includes(value as ButtonVariant),
-  'Invalid button variant. Must be one of: solid, outline, ghost, text'
+  'Invalid button variant. Must be one of: solid, outline, ghost, text',
 );
 
 /** 按钮形状验证器 */
 export const buttonShapeValidator: Validator<ButtonShape> = createValidator(
   (value): value is ButtonShape => ['default', 'rounded', 'circle', 'square'].includes(value as ButtonShape),
-  'Invalid button shape. Must be one of: default, rounded, circle, square'
+  'Invalid button shape. Must be one of: default, rounded, circle, square',
 );
 
 /** 按钮状态验证器 */
 export const buttonStatusValidator: Validator<ButtonStatus> = createValidator(
   (value): value is ButtonStatus => ['normal', 'loading', 'disabled', 'active'].includes(value as ButtonStatus),
-  'Invalid button status. Must be one of: normal, loading, disabled, active'
+  'Invalid button status. Must be one of: normal, loading, disabled, active',
 );
 
 /** 按钮图标位置验证器 */
 export const buttonIconPositionValidator: Validator<ButtonIconPosition> = createValidator(
   (value): value is ButtonIconPosition => ['left', 'right'].includes(value as ButtonIconPosition),
-  'Invalid button icon position. Must be one of: left, right'
+  'Invalid button icon position. Must be one of: left, right',
 );
 
 // ==================== Button类型守卫 ====================
@@ -354,9 +352,9 @@ export function isValidButtonIconPosition(value: unknown): value is ButtonIconPo
 /** 检查是否为有效的按钮属性 */
 export function isValidButtonProps(props: unknown): props is ButtonProps {
   if (!props || typeof props !== 'object') return false;
-  
+
   const obj = props as Record<string, unknown>;
-  
+
   // 验证基本属性类型
   if (obj['size'] !== undefined && !isValidButtonSize(obj['size'])) return false;
   if (obj['type'] !== undefined && !isValidButtonType(obj['type'])) return false;
@@ -364,34 +362,34 @@ export function isValidButtonProps(props: unknown): props is ButtonProps {
   if (obj['shape'] !== undefined && !isValidButtonShape(obj['shape'])) return false;
   if (obj['status'] !== undefined && !isValidButtonStatus(obj['status'])) return false;
   if (obj['iconPosition'] !== undefined && !isValidButtonIconPosition(obj['iconPosition'])) return false;
-  
+
   // 验证布尔值属性
   const booleanProps = ['block', 'danger', 'loading', 'disabled', 'ripple', 'shadow', 'bordered'];
   for (const prop of booleanProps) {
     if (obj[prop] !== undefined && !isBoolean(obj[prop])) return false;
   }
-  
+
   // 验证字符串属性
   const stringProps = ['className', 'loadingText', 'color', 'backgroundColor', 'textColor', 'borderColor'];
   for (const prop of stringProps) {
     if (obj[prop] !== undefined && !isString(obj[prop])) return false;
   }
-  
+
   // 验证数字属性
   const numberProps = ['animationDuration', 'groupIndex', 'groupSize'];
   for (const prop of numberProps) {
     if (obj[prop] !== undefined && !isNumber(obj[prop])) return false;
   }
-  
+
   // 验证函数属性
   const functionProps = ['onClick', 'onPressIn', 'onPressOut', 'onLongPress'];
   for (const prop of functionProps) {
     if (obj[prop] !== undefined && !isFunction(obj[prop])) return false;
   }
-  
+
   // 验证React元素属性
   if (obj['icon'] !== undefined && !isReactElement(obj['icon']) && !isString(obj['icon'])) return false;
-  
+
   return true;
 }
 
@@ -477,17 +475,17 @@ export function createButtonClassName(props: Partial<ButtonProps>): string {
     'taro-uno-button--bordered': !!bordered,
   };
 
-  return classNames(
-    ...baseClasses,
-    conditionalClasses,
-    className
-  );
+  return classNames(...baseClasses, conditionalClasses, className);
 }
 
 /** 计算按钮最终状态 */
 export function calculateFinalStatus(props: Partial<ButtonProps>): ButtonStatus {
-  const { loading = defaultButtonProps.loading, disabled = defaultButtonProps.disabled, status = defaultButtonProps.status } = props;
-  
+  const {
+    loading = defaultButtonProps.loading,
+    disabled = defaultButtonProps.disabled,
+    status = defaultButtonProps.status,
+  } = props;
+
   if (loading) return 'loading';
   if (disabled) return 'disabled';
   return status || 'normal';
@@ -559,4 +557,4 @@ export function formatButtonStatus(status: ButtonStatus): string {
 
 // ==================== 导出 ====================
 
-export * from './index';
+export * from './index';

package/src/types/component-props.ts

@@ -61,7 +61,12 @@ export interface LoadingProps extends BaseComponentProps {
 
 // ==================== 复合组件属性接口 ====================
 export interface StandardComponentProps
-  extends SizeableProps, VariantProps, StatusProps, ShapeProps, DisabledProps, LoadingProps {
+  extends SizeableProps,
+    VariantProps,
+    StatusProps,
+    ShapeProps,
+    DisabledProps,
+    LoadingProps {
   /** 组件唯一标识 */
   id?: string;
   /** 无障碍标签 */

package/src/types/glob.d.ts

@@ -0,0 +1,4 @@
+declare module 'glob' {
+  export function glob(pattern: string, options?: any): Promise<string[]>;
+  export function sync(pattern: string, options?: any): string[];
+}

package/src/types/index.ts

@@ -15,7 +15,6 @@ export * from './utils';
 // 导出Button组件专用类型
 export * from './button';
 
-
 // 导出标准化组件类型
 export * from './standardized-components';
 
@@ -54,7 +53,8 @@ export type Variant = 'default' | 'primary' | 'secondary' | 'success' | 'warning
 export type Status = 'default' | 'loading' | 'disabled' | 'error' | 'success';
 
 /** 通用组件属性接口 */
-export interface BaseComponentProps {
+export interface BaseComponentProps
+  extends Partial<Omit<React.HTMLAttributes<HTMLElement>, 'className' | 'style' | 'children' | 'onClick'>> {
   /** 自定义类名 */
   className?: string;
   /** 自定义样式 */

package/src/types/standardized-components.ts

@@ -97,8 +97,14 @@ export interface ClickableProps extends BaseComponentProps {
 
 /** 标准组件属性 - 组合所有常用属性 */
 export interface StandardComponentProps
-  extends SizeableProps, VariantProps, StatusProps, ShapeProps,
-          DisabledProps, ReadonlyProps, LoadingProps, ClickableProps {
+  extends SizeableProps,
+    VariantProps,
+    StatusProps,
+    ShapeProps,
+    DisabledProps,
+    ReadonlyProps,
+    LoadingProps,
+    ClickableProps {
   /** 组件唯一标识 */
   id?: string;
   /** 数据属性 */
@@ -541,4 +547,4 @@ export type ExtractComponentProps<T> = T extends React.ComponentType<infer P> ?
 /** 组件引用提取类型 */
 export type ExtractComponentRef<T> = T extends React.RefObject<infer R> ? R : never;
 
-// ==================== 导出 ====================
+// ==================== 导出 ====================