diff --git a/API.md b/API.md new file mode 100644 index 0000000000..ffe9a6a9d0 --- /dev/null +++ b/API.md @@ -0,0 +1,81 @@ +# Spring configs + +```jsx +import { config } from 'react-spring' + +/* + default: { tension: 170, friction: 26 }, + gentle: { tension: 120, friction: 14 }, + wobbly: { tension: 180, friction: 12 }, + stiff: { tension: 210, friction: 20 }, +*/ +``` + +# Spring + +```jsx +class Spring extends React.PureComponent { + static propTypes = { + // Spring config ({ tension, friction }) + config: PropTypes.object, + // Will skip rendering the component if true and write to the dom directly + native: PropTypes.bool, + // Base styles, optional + from: PropTypes.object, + // Animates to ... + to: PropTypes.oneOfType([PropTypes.object, PropTypes.func]), + // Callback when the animation comes to a still-stand + onRest: PropTypes.func, + // Takes a function that receives interpolated styles + children: PropTypes.func, + // Same as children, but takes precedence if present + render: PropTypes.func, + // Prevents animation if true, you can also pass keys for individual keys + immediate: PropTypes.oneOfType([PropTypes.bool, PropTypes.arrayOf(PropTypes.string)]), + } + static defaultProps = { from: {}, to: {}, config: defaultConfig, native: false, immediate: false } +} +``` + +# SpringTransition + +```jsx +class SpringTransition extends React.PureComponent { + static propTypes = { + native: PropTypes.bool, + config: PropTypes.object, + // Base styles + from: PropTypes.object, + // Animated styles when the component is mounted + enter: PropTypes.object, + // Unmpount styles + leave: PropTypes.object, + // A collectiomn of unique keys that must match with the childrens order + keys: PropTypes.oneOfType([ + PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), + PropTypes.oneOfType([PropTypes.string, PropTypes.number]), + ]), + children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.func), PropTypes.func]), + render: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.func), PropTypes.func]), + } + + static defaultProps = { from: {}, enter: {}, leave: {}, native: false, config: defaultConfig } +} +``` + +# SpringTrail + +```jsx +class SpringTrail extends React.PureComponent { + static propTypes = { + native: PropTypes.bool, + config: PropTypes.object, + from: PropTypes.object, + to: PropTypes.object, + keys: PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.string, PropTypes.number])), + children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.func), PropTypes.func]), + render: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.func), PropTypes.func]), + } + static defaultProps = { from: {}, to: {}, native: false, config: defaultConfig } +} +``` diff --git a/CHANGELOG.md b/CHANGELOG.md new file mode 100644 index 0000000000..e69de29bb2 diff --git a/src/index.js b/src/index.js index 4aed5c0390..900c2d6a9e 100644 --- a/src/index.js +++ b/src/index.js @@ -103,7 +103,7 @@ export function createAnimation(interpolator, defaultConfig) { export function createTransition(interpolator, defaultConfig) { const Animation = createAnimation(interpolator, defaultConfig) - return class SpringTransition extends React.PureComponent { + return class extends React.PureComponent { static propTypes = { native: PropTypes.bool, config: PropTypes.object, @@ -214,7 +214,7 @@ export function createTransition(interpolator, defaultConfig) { export function createTrail(interpolator, defaultConfig) { const Animation = createAnimation(interpolator, defaultConfig) - return class SpringTrail extends React.PureComponent { + return class extends React.PureComponent { static propTypes = { native: PropTypes.bool, config: PropTypes.object,