Start sharing components as a team!Share components as a team!Join Bit to build your applications faster.Get Started Free

timing-functions

v3.2.0arrow_drop_down
v3.2.0
STATUS
Passing
DOWNLOADS
0
VISIBILITY
Public
PUBLISHED
8 months ago
SIZE
854 B
String to represent common easing functions as demonstrated here: (github.com/jaukia/easie).
1 contributor
Use timing-functions in your project ?
Copied
npm i @bit/styled-components.polished.mixins.timing-functions
Set Bit as a scoped registryLearn more
npm config set '@bit:registry' https://node.bit.dev
Component Example
React
React
Vue
Angular
Add dependency... help_outline
Just
import
any of the 1 million components
and packages in Bit or NPM to the example.
import Button from '@bit/grommet.grommet.button';
import Lodash from 'lodash';
toggle layout
modifieddraft
chevron_left
chevron_right
mixins/timingFunctions ()

String to represent common easing functions as demonstrated here: (github.com/jaukia/easie).

Example
// Styles as object usage
const styles = {
  'transitionTimingFunction': timingFunctions('easeInQuad')
}

// styled-components usage
 const div = styled.div`
  transitionTimingFunction: ___CSS_0___;
`

// CSS as JS Output

'div': {
  'transitionTimingFunction': 'cubic-bezier(0.550,  0.085, 0.680, 0.530)',
}
Test Summary

should return easeInBack cubic-bezier

Pass

should return easeInCirc cubic-bezier

Pass

should return easeInCubic cubic-bezier

Pass

should return easeInExpo cubic-bezier

Pass

should return easeInQuad cubic-bezier

Pass

should return easeInQuart cubic-bezier

Pass

should return easeInQuint cubic-bezier

Pass

should return easeInSine cubic-bezier

Pass

should return easeOutBack cubic-bezier

Pass

should return easeOutCirc cubic-bezier

Pass

should return easeOutCubic cubic-bezier

Pass

should return easeOutExpo cubic-bezier

Pass

should return easeOutQuad cubic-bezier

Pass

should return easeOutQuart cubic-bezier

Pass

should return easeOutQuint cubic-bezier

Pass

should return easeOutSine cubic-bezier

Pass

should return easeInOutBack cubic-bezier

Pass

should return easeInOutCirc cubic-bezier

Pass

should return easeInOutCubic cubic-bezier

Pass

should return easeInOutExpo cubic-bezier

Pass

should return easeInOutQuad cubic-bezier

Pass

should return easeInOutQuart cubic-bezier

Pass

should return easeInOutQuint cubic-bezier

Pass

should return easeInOutSine cubic-bezier

Pass