# @environment-safe/tween > ESM compatible tween functions Latest version **0.0.1** (published 2024-01-15) · MIT license · 0 weekly downloads ## Install ```sh npm install @environment-safe/tween pnpm add @environment-safe/tween yarn add @environment-safe/tween bun add @environment-safe/tween ``` ## Health **Score 30/100 (F)** — status: abandoned. Positive: has types; esm support; no vulnerabilities; high quality score. Warnings: low downloads; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.0.1 | | Published | 2024-01-15 | | First published | 2024-01-15 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Dependencies | 1 | | Unpacked size | 1.2 MB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 0 | | Author | Abbey Hawk Sparrow | | Maintainers | khrome | | Keywords | penner, tween, animate, esm, module | ## Links - npm: https://www.npmjs.com/package/@environment-safe/tween - Repository: https://github.com/environment-safe/tween - Issues: https://github.com/environment-safe/tween/issues - npm.io page: https://npm.io/package/@environment-safe/tween ## Dependencies (1) - [browser-or-node](https://npm.io/package/browser-or-node.md) ^2.1.1 ## Alternatives - [@luma.gl/experimental](https://npm.io/package/@luma.gl/experimental.md) — 77.1K weekly downloads - [persona-harness](https://npm.io/package/persona-harness.md) — 4.7K weekly downloads - [@tsparticles/effect-bubble](https://npm.io/package/@tsparticles/effect-bubble.md) — 4.6K weekly downloads - [f3d](https://npm.io/package/f3d.md) — 730 weekly downloads - [spark-html-motion](https://npm.io/package/spark-html-motion.md) — 298 weekly downloads ## Recent versions - 0.0.1 (latest) — 2024-01-15 ## README @environment-safe/tween ======================= Robert Penner's tweening functions as used in [tween-functions](https://github.com/chenglou/tween-functions), and unlike [@tweenjs/tween.js](https://www.npmjs.com/package/@tweenjs/tween.js) it's not written in a metalanguage so the source can be directly included without build, but it does include types built with jsdoc. Penner's original functions uses the change in value rather than final value as parameter. [tween-functions](https://github.com/chenglou/tween-functions) changed this to finalValue, which I continue to support. Usage ----- ## API `tweenFunction.tweenName(currentTime, beginValue, endValue, totalDuration)` ## Examples
`@environment-safe/tween` supports legacy usage of commonjs, modern ESM, can be built with either of those or may be directly included in the browser with ESM. No build is required in your library or ours.
CommonJS

```js const { Tween } = require('@environment-safe/tween'); Tween.easeInQuad(1, 0, 50, 5); // => 2 ```

ES Modules

```js import { Tween } from '@environment-safe/tween'; Tween.easeInQuad(1, 0, 50, 5); // => 2 ```

HTML

```html ```

### Available functions: - [linear](https://environment-safe.github.io/tween/docs/global.html#linearAlineartweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInQuad](https://environment-safe.github.io/tween/docs/global.html#easeInQuadAeaseInQuadtweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutQuad](https://environment-safe.github.io/tween/docs/global.html#easeOutQuadAeaseOutQuadtweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutQuad](https://environment-safe.github.io/tween/docs/global.html#easeInOutQuadAeaseInOutQuadtweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInCubic](https://environment-safe.github.io/tween/docs/global.html#easeInCubicAeaseInCubictweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutCubic](https://environment-safe.github.io/tween/docs/global.html#easeOutCubicAeaseOutCubictweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutCubic](https://environment-safe.github.io/tween/docs/global.html#easeInOutCubicAeaseInOutCubictweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInQuart](https://environment-safe.github.io/tween/docs/global.html#easeInQuartAeaseInQuarttweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutQuart](https://environment-safe.github.io/tween/docs/global.html#easeOutQuartAeaseOutQuarttweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutQuart](https://environment-safe.github.io/tween/docs/global.html#easeInOutQuartAeaseInOutQuarttweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInQuint](https://environment-safe.github.io/tween/docs/global.html#easeInQuintAeaseInQuinttweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutQuint](https://environment-safe.github.io/tween/docs/global.html#easeOutQuintAeaseOutQuinttweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutQuint](https://environment-safe.github.io/tween/docs/global.html#easeInOutQuintAeaseInOutQuinttweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInSine](https://environment-safe.github.io/tween/docs/global.html#easeInSineAeaseInSinetweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutSine](https://environment-safe.github.io/tween/docs/global.html#easeOutSineAeaseOutSinetweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutSine](https://environment-safe.github.io/tween/docs/global.html#easeInOutSineAeaseInOutSinetweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInExpo](https://environment-safe.github.io/tween/docs/global.html#easeInExpoAeaseInExpotweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutExpo](https://environment-safe.github.io/tween/docs/global.html#easeOutExpoAeaseOutExpotweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutExpo](https://environment-safe.github.io/tween/docs/global.html#easeInOutExpoAeaseInOutExpotweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInCirc](https://environment-safe.github.io/tween/docs/global.html#easeInCircAeaseInCirctweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutCirc](https://environment-safe.github.io/tween/docs/global.html#easeOutCircAeaseOutCirctweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutCirc](https://environment-safe.github.io/tween/docs/global.html#easeInOutCircAeaseInOutCirctweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInElastic](https://environment-safe.github.io/tween/docs/global.html#easeInElasticAeaseInElastictweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutElastic](https://environment-safe.github.io/tween/docs/global.html#easeOutElasticAeaseOutElastictweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutElastic](https://environment-safe.github.io/tween/docs/global.html#easeInOutElasticAeaseInOutElastictweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInBack](https://environment-safe.github.io/tween/docs/global.html#easeInBackAeaseInBacktweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutBack](https://environment-safe.github.io/tween/docs/global.html#easeOutBackAeaseOutBacktweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutBack](https://environment-safe.github.io/tween/docs/global.html#easeInOutBackAeaseInOutBacktweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInBounce](https://environment-safe.github.io/tween/docs/global.html#easeInBounceAeaseInBouncetweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeOutBounce](https://environment-safe.github.io/tween/docs/global.html#easeOutBounceAeaseOutBouncetweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) - [easeInOutBounce](https://environment-safe.github.io/tween/docs/global.html#easeInOutBounceAeaseInOutBouncetweenaccordingto%253Cahref=%2522http://robertpenner.com/easing/%2522%253ERobertPenner'seasingfunctions%253C/a%253E) You can see a demo of all the easing functions in action by running: ```bash npm run demo ``` Testing ------- Run the es module tests to test the root modules ```bash npm run import-test ``` to run the same test inside the browser: ```bash npm run browser-test ``` to run the same test headless in chrome: ```bash npm run headless-browser-test ``` to run the same test inside docker: ```bash npm run container-test ``` Run the commonjs tests against the `/dist` commonjs source (generated with the `build-commonjs` target). ```bash npm run require-test ``` Development ----------- All work is done in the .mjs files and will be transpiled on commit to commonjs and tested. If the above tests pass, then attempt a commit which will generate .d.ts files alongside the `src` files and commonjs classes in `dist` --- _Source: https://npm.io/package/@environment-safe/tween · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._