@legendapp/motion/lib/module/LinearGradient.js

legend-motion

function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
import { isArray } from '@legendapp/tools';
import { MemoFnComponent } from '@legendapp/tools/react';
import React, { Component } from 'react';
import { createMotionAnimatedComponent } from './createMotionComponent';
let LinearGradient;
function setLinearGradientComponent(linearGradient) {
  LinearGradient = linearGradient;
}
class GradientHelper extends Component {
  render() {
    const {
      numColors,
      startX,
      startY,
      endX,
      endY,
      ...rest
    } = this.props;

    // Combine startX, startY, endX, endY back into start,end
    let start;
    if (startX !== undefined || startY !== undefined) {
      start = {
        x: startX,
        y: startY
      };
    }
    let end;
    if (endX !== undefined || endY !== undefined) {
      end = {
        x: endX,
        y: endY
      };
    }

    // Combine individual color props back into a colors array
    const colors = [];
    for (let i = 0; i < numColors; i++) {
      colors.push(rest['color' + i]);
      delete rest['color' + i];
    }
    return /*#__PURE__*/React.createElement(LinearGradient, _extends({
      colors: colors,
      start: start,
      end: end
    }, rest));
  }
}
const AnimatedGradientHelper = createMotionAnimatedComponent(GradientHelper);
function pointToXY(props, point, name) {
  if (point) {
    props[name + 'X'] = isArray(point) ? point[0] : point.x;
    props[name + 'Y'] = isArray(point) ? point[1] : point.y;
  }
}

// Create MotionLinearGradient with the same API as other Motion components, but it's more complicated because it needs to
// transform to a different set of props into the AnimatedGradientHelper.
const MotionLinearGradient = MemoFnComponent(function (props) {
  const {
    colors,
    animateProps,
    start,
    end,
    initialProps,
    ...propsOut
  } = props;
  const {
    colors: colorsAnimate,
    start: startAnimate,
    end: endAnimate,
    ...animatePropsOut
  } = animateProps;

  // Split colors array out into individual props so they can be animated
  colors === null || colors === void 0 || colors.forEach((color, i) => propsOut['color' + i] = color);
  colorsAnimate === null || colorsAnimate === void 0 || colorsAnimate.forEach((color, i) => animatePropsOut['color' + i] = color);

  // Split start/end objects out into individual props so they can be animated
  pointToXY(propsOut, start, 'start');
  pointToXY(propsOut, end, 'end');
  pointToXY(animatePropsOut, startAnimate, 'start');
  pointToXY(animatePropsOut, endAnimate, 'end');
  let numColors = (colors === null || colors === void 0 ? void 0 : colors.length) || (colorsAnimate === null || colorsAnimate === void 0 ? void 0 : colorsAnimate.length) || 0;

  // Split initialProps too if it exists
  const initialPropsOut = {};
  if (initialProps) {
    const {
      colors: colorsInitial,
      start: startInitial,
      end: endInitial
    } = animateProps;
    colorsInitial === null || colorsInitial === void 0 || colorsInitial.forEach((color, i) => initialPropsOut['color' + i] = color);
    pointToXY(initialPropsOut, startInitial, 'start');
    pointToXY(initialPropsOut, endInitial, 'end');
    if (colorsInitial) {
      numColors = colorsInitial.length;
    }
  }

  // @ts-ignore Ignore this because it won't conform to the customized props
  return /*#__PURE__*/React.createElement(AnimatedGradientHelper, _extends({
    numColors: numColors
  }, propsOut, {
    initialProps: initialPropsOut,
    animateProps: animatePropsOut
  }));
});
export { setLinearGradientComponent, MotionLinearGradient };
//# sourceMappingURL=LinearGradient.js.map