react-native-sortables/dist/module/providers/shared/hooks/useTeleportedItemPosition.js

Powerful Sortable Components for Flexible Content Reordering in React Native

"use strict";

import { interpolate, measure, useAnimatedReaction, useDerivedValue } from 'react-native-reanimated';
import { useMutableValue } from '../../../integrations/reanimated';
import { useCommonValuesContext } from '../CommonValuesProvider';
import { usePortalContext } from '../PortalProvider';
export default function useTeleportedItemPosition(key, isActive, activationAnimationProgress) {
  const {
    activeItemAbsolutePosition
  } = usePortalContext() ?? {};
  const {
    containerRef,
    itemPositions
  } = useCommonValuesContext();
  const dropStartValues = useMutableValue(null);

  // Drop start values calculation reaction
  useAnimatedReaction(() => ({
    active: isActive.value
  }), ({
    active
  }) => {
    if (active) {
      dropStartValues.value = null;
    } else if (activeItemAbsolutePosition?.value && itemPositions.value[key]) {
      dropStartValues.value = {
        fromAbsolute: activeItemAbsolutePosition.value,
        progress: activationAnimationProgress.value,
        toRelative: itemPositions.value[key]
      };
    }
  });
  const absoluteItemPosition = useDerivedValue(() => {
    if (dropStartValues.value) {
      const measurements = measure(containerRef);
      if (!measurements) {
        return null;
      }
      const {
        fromAbsolute,
        progress,
        toRelative
      } = dropStartValues.value;
      const animate = (source, target) => interpolate(activationAnimationProgress.value, [progress, 0], [source, target]);
      return {
        x: animate(fromAbsolute.x, measurements.pageX + toRelative.x),
        y: animate(fromAbsolute.y, measurements.pageY + toRelative.y)
      };
    }
    return activeItemAbsolutePosition?.value ?? null;
  });

  // Drop start values updater on target position change
  useAnimatedReaction(() => itemPositions.value[key], position => {
    if (isActive.value || activationAnimationProgress.value === 0 || !position || !absoluteItemPosition.value) {
      return;
    }
    dropStartValues.value = {
      fromAbsolute: absoluteItemPosition.value,
      progress: activationAnimationProgress.value,
      toRelative: position
    };
  });
  return absoluteItemPosition;
}
//# sourceMappingURL=useTeleportedItemPosition.js.map