react-sprite-animator/lib/index.js

A react component that loads sprite image and the runs it as an animation

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
Object.defineProperty(exports, "useSprite", {
  enumerable: true,
  get: function get() {
    return _useSprite.useSprite;
  }
});
Object.defineProperty(exports, "loadImage", {
  enumerable: true,
  get: function get() {
    return _useSprite.loadImage;
  }
});
exports.SpriteAnimator = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _useSprite = require("./useSprite");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var noop = function noop() {};

var propTypes = {
  className: _propTypes.default.string,
  width: _propTypes.default.number,
  height: _propTypes.default.number,
  sprite: _propTypes.default.string,
  scale: _propTypes.default.number,
  direction: _propTypes.default.string,
  shouldAnimate: _propTypes.default.bool,
  loop: _propTypes.default.bool,
  startFrame: _propTypes.default.number,
  fps: _propTypes.default.number,
  stopLastFrame: _propTypes.default.bool,
  onError: _propTypes.default.func,
  onLoad: _propTypes.default.func,
  onEnd: _propTypes.default.func,
  frameCount: _propTypes.default.number,
  wrapAfter: _propTypes.default.number,
  frame: _propTypes.default.number,
  reset: _propTypes.default.bool
};

var SpriteAnimator = function SpriteAnimator(_ref) {
  var startFrame = _ref.startFrame,
      sprite = _ref.sprite,
      width = _ref.width,
      height = _ref.height,
      direction = _ref.direction,
      onError = _ref.onError,
      onLoad = _ref.onLoad,
      onEnd = _ref.onEnd,
      frameCount = _ref.frameCount,
      fps = _ref.fps,
      shouldAnimate = _ref.shouldAnimate,
      stopLastFrame = _ref.stopLastFrame,
      reset = _ref.reset,
      frame = _ref.frame,
      className = _ref.className,
      scale = _ref.scale,
      wrapAfter = _ref.wrapAfter;
  var style = (0, _useSprite.useSprite)({
    startFrame: startFrame,
    sprite: sprite,
    width: width,
    height: height,
    direction: direction,
    onError: onError,
    onLoad: onLoad,
    onEnd: onEnd,
    frameCount: frameCount,
    fps: fps,
    shouldAnimate: shouldAnimate,
    stopLastFrame: stopLastFrame,
    reset: reset,
    frame: frame,
    scale: scale,
    wrapAfter: wrapAfter
  });
  return /*#__PURE__*/_react.default.createElement("div", {
    className: className,
    style: style
  });
};

exports.SpriteAnimator = SpriteAnimator;
SpriteAnimator.propTypes = propTypes;
SpriteAnimator.defaultProps = {
  scale: 1,
  direction: 'horizontal',
  shouldAnimate: true,
  loop: true,
  startFrame: 0,
  fps: 60,
  onError: noop,
  onLoad: noop,
  onEnd: noop
};