@dt-workspace/react-native-heatmap/lib/module/utils/animation.js

A modern, highly customizable React Native heatmap component library inspired by GitHub's contribution calendar

"use strict";

/**
 * Animation utilities for React Native Heatmap
 * Provides smooth entry animations and transitions
 */

/**
 * Default animation configuration
 */
export const DEFAULT_ANIMATION_CONFIG = {
  enabled: true,
  duration: 300,
  easing: 'ease-out',
  staggerDelay: 10,
  entryAnimation: 'fade',
  useNativeDriver: true
};

/**
 * Animation timing function mapping
 */
export const ANIMATION_EASING = {
  'linear': 'linear',
  'ease': 'ease',
  'ease-in': 'ease-in',
  'ease-out': 'ease-out',
  'ease-in-out': 'ease-in-out'
};

/**
 * Calculate staggered delay for cell animations
 */
export function calculateStaggerDelay(index, _totalCells, config) {
  const {
    staggerDelay = 0,
    entryAnimation = 'fade'
  } = config;
  if (entryAnimation === 'none' || staggerDelay === 0) {
    return 0;
  }

  // For large datasets, limit stagger to avoid long delays
  const maxDelay = Math.min(staggerDelay * 50, 500);
  const delay = index * staggerDelay % maxDelay;
  return delay;
}

/**
 * Get animation style for entry animation
 */
export function getEntryAnimationStyle(entryAnimation, progress) {
  switch (entryAnimation) {
    case 'fade':
      return {
        opacity: progress
      };
    case 'scale':
      return {
        opacity: progress,
        transform: [{
          scale: 0.3 + progress * 0.7
        }]
      };
    case 'slide':
      return {
        opacity: progress,
        transform: [{
          translateY: (1 - progress) * 20
        }]
      };
    case 'none':
    default:
      return {
        opacity: 1
      };
  }
}

/**
 * Create animation sequence for multiple cells
 */
export function createCellAnimationSequence(cellCount, config) {
  const animations = [];
  for (let i = 0; i < cellCount; i++) {
    const delay = calculateStaggerDelay(i, cellCount, config);
    animations.push({
      delay,
      duration: config.duration
    });
  }
  return animations;
}

/**
 * Merge animation configurations
 */
export function mergeAnimationConfig(defaultConfig, userConfig) {
  return {
    ...defaultConfig,
    ...userConfig
  };
}

/**
 * Check if animations are supported
 */
export function isAnimationSupported() {
  try {
    // Check if reanimated is available
    require('react-native-reanimated');
    return true;
  } catch {
    return false;
  }
}

/**
 * Get optimal animation duration based on dataset size
 */
export function getOptimalAnimationDuration(cellCount, baseDuration = 300) {
  // For large datasets, reduce animation duration to improve performance
  if (cellCount > 500) {
    return Math.max(baseDuration * 0.5, 150);
  }
  if (cellCount > 200) {
    return Math.max(baseDuration * 0.7, 200);
  }
  return baseDuration;
}
//# sourceMappingURL=animation.js.map