| 12345678910111213141516171819202122232425262728293031323334353637 |
- import { resolveElements, getValueTransition, NativeAnimation } from 'motion-dom';
- import { invariant, secondsToMilliseconds } from 'motion-utils';
- function animateElements(elementOrSelector, keyframes, options, scope) {
- const elements = resolveElements(elementOrSelector, scope);
- const numElements = elements.length;
- invariant(Boolean(numElements), "No valid element provided.");
- const animations = [];
- for (let i = 0; i < numElements; i++) {
- const element = elements[i];
- const elementTransition = { ...options };
- /**
- * Resolve stagger function if provided.
- */
- if (typeof elementTransition.delay === "function") {
- elementTransition.delay = elementTransition.delay(i, numElements);
- }
- for (const valueName in keyframes) {
- const valueKeyframes = keyframes[valueName];
- const valueOptions = {
- ...getValueTransition(elementTransition, valueName),
- };
- valueOptions.duration && (valueOptions.duration = secondsToMilliseconds(valueOptions.duration));
- valueOptions.delay && (valueOptions.delay = secondsToMilliseconds(valueOptions.delay));
- animations.push(new NativeAnimation({
- element,
- name: valueName,
- keyframes: valueKeyframes,
- transition: valueOptions,
- allowFlatten: !elementTransition.type && !elementTransition.ease,
- }));
- }
- }
- return animations;
- }
- export { animateElements };
|