Package Exports

@kodemonki/react-child-sequence

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@kodemonki/react-child-sequence) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

kodemonki/react-child-sequence

Plays a sequence of child image objects. It absolutely positions the remaining images over the top with visibility set to hidden. It then cycles through setting the visibility to visible for the current image.

Updates

Changed frameRate prop to fps (frames per second) to make it less strange
Added className and style object passing to children
Removed dummy first image
Added propTypes
added defaultProps
Added Es-lint to build
Cleaned up function binding

Install

$ npm install @kodemonki/react-child-sequence

Props

autoPlay : boolean - play sequence
loop : boolean - repeat sequence
yoyo : boolean - replay in reverse
fps : number - frames per second

Usage

import { Sequence } from "@kodemonki/react-child-sequence";

//Images

import image1 from "./PathToImage1.jpg";
import image2 from "./PathToImage2.jpg";
import image3 from "./PathToImage3.jpg";

//Defaults

<Sequence>
  <img src={image1} />
  <img src={image2} />
  <img src={image3} />
</Sequence>

//Optional

<Sequence
    autoPlay={true}
    loop={true}
    yoyo={true}
    fps={29}
    style={...}
    className="className"
>
  <img src={image1} style={...} className="className" alt={"Alt text"}/>
  <img src={image2} style={...} className="className" alt={"Alt text"}/>
  <img src={image3} style={...} className="className" alt={"Alt text"}/>
</Sequence>