motion 10.4.0 → 10.5.0-alpha.1

package/dist/size-index.js

@@ -0,0 +1 @@
+function o(o){var t=function(o,t){var e={};for(var n in o)Object.prototype.hasOwnProperty.call(o,n)&&t.indexOf(n)<0&&(e[n]=o[n]);if(null!=o&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(n=Object.getOwnPropertySymbols(o);r<n.length;r++)t.indexOf(n[r])<0&&Object.prototype.propertyIsEnumerable.call(o,n[r])&&(e[n[r]]=o[n[r]])}return e}(o,[]);console.log(t)}function t(){console.log("test")}export{o as animate,t as test};

package/lib/index.js

@@ -0,0 +1,5 @@
+export * from "@motionone/dom";
+export function test() {
+    console.log("test");
+}
+//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAE9B,MAAM,UAAU,IAAI;IAClB,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAA;AACrB,CAAC"}

package/package.json

@@ -1,149 +1,16 @@
 {
   "name": "motion",
-  "version": "10.4.0",
-  "description": "The Motion library for the web",
+  "description": "A tiny, performant animation library for the DOM, Vue and Svelte",
+  "version": "10.5.0-alpha.1",
   "author": "Matt Perry",
   "main": "dist/main.cjs.js",
   "module": "dist/main.es.js",
   "types": "types/index.d.ts",
-  "license": "MIT",
   "sideEffects": false,
-  "keywords": [
-    "motion",
-    "animation",
-    "bezier",
-    "cubic bezier",
-    "easing",
-    "waapi"
-  ],
   "scripts": {
-    "build": "rm -rf lib dist types && tsc -p . && rollup -c && npm run measure",
-    "test": "jest --coverage --config jest.config.json --maxWorkers=2",
-    "test-react": "",
-    "test-react-ssr": "jest --coverage --config jest.config.react-ssr.json --maxWorkers=2",
-    "test-browser": "node ./cypress/scripts/collect-tests.js && start-server-and-test start-dev-server http://0.0.0.0:8000 'cypress run'",
-    "watch": "concurrently \"tsc --watch -p .\" \"rollup -c -w\" \"npm run dev\"",
-    "format": "yarn prettier --write .",
-    "postpublish": "git push --tags",
-    "prepublishOnly": "yarn test && yarn build",
-    "storybook": "start-storybook -p 6006",
-    "dev": "python -m SimpleHTTPServer",
-    "measure": "webpack --config webpack.config.js && bundlesize",
-    "build-storybook": "build-storybook"
-  },
-  "jest": {
-    "moduleFileExtensions": [
-      "ts",
-      "js"
-    ],
-    "transform": {
-      "\\.(ts)$": "../../../node_modules/ts-jest/preprocessor.js"
-    },
-    "testRegex": "/__tests__/.*\\.test.(ts|js)$",
-    "rootDir": "src",
-    "collectCoverageFrom": [
-      "**/*.{js,jsx,ts,tsx}",
-      "!**/node_modules/**",
-      "!**/__tests__/**",
-      "!**/worklet/**"
-    ],
-    "coverageDirectory": "<rootDir>/../coverage"
+    "build": "rm -rf lib dist types && tsc -p . && rollup -c"
   },
   "dependencies": {
-    "framer-motion": "^4.1.17",
-    "hey-listen": "^1.0.8",
-    "tslib": "^2.3.0"
-  },
-  "peerDependencies": {
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2"
-  },
-  "peerDependenciesMeta": {
-    "react": {
-      "optional": true
-    },
-    "react-dom": {
-      "optional": true
-    }
-  },
-  "devDependencies": {
-    "@babel/core": "^7.13.16",
-    "@rollup/plugin-commonjs": "^19.0.0",
-    "@rollup/plugin-node-resolve": "^11.2.0",
-    "@rollup/plugin-replace": "^2.4.1",
-    "@testing-library/dom": "^8.1.0",
-    "@testing-library/jest-dom": "^5.14.1",
-    "@testing-library/react": "^12.0.0",
-    "@types/jest": "^26.0.21",
-    "@types/react": "^17.0.15",
-    "@types/react-dom": "^17.0.9",
-    "babel-loader": "^8.2.2",
-    "bundlesize": "^0.18.1",
-    "canvas": "^2.8.0",
-    "concurrently": "^6.2.0",
-    "convert-tsconfig-paths-to-webpack-aliases": "^0.9.2",
-    "cypress": "^7.6.0",
-    "gsap": "^3.7.1",
-    "husky": "=4",
-    "jest": "^26.6.3",
-    "jest-watch-typeahead": "^0.6.1",
-    "lint-staged": ">=10",
-    "prettier": "2.2.1",
-    "rollup": "^2.52.3",
-    "rollup-plugin-terser": "^7.0.2",
-    "start-server-and-test": "^1.12.5",
-    "terser-webpack-plugin": "^4.2.3",
-    "ts-jest": "^26.5.4",
-    "ts-loader": "^8.3.0",
-    "typescript": "^4.4.0-beta",
-    "web-animations-js": "^2.3.2",
-    "webpack": "^5.58.1",
-    "webpack-cli": "^4.8.0"
-  },
-  "husky": {
-    "hooks": {
-      "pre-commit": "lint-staged"
-    }
-  },
-  "lint-staged": {
-    "**/*": "prettier --write --ignore-unknown"
-  },
-  "eslintConfig": {
-    "overrides": [
-      {
-        "files": [
-          "**/*.stories.*"
-        ],
-        "rules": {
-          "import/no-anonymous-default-export": "off"
-        }
-      }
-    ]
-  },
-  "bundlesize": [
-    {
-      "path": "./dist/size-animate-dom.js",
-      "maxSize": "3.3 kB"
-    },
-    {
-      "path": "./dist/size-animate-style.js",
-      "maxSize": "2.9 kB"
-    },
-    {
-      "path": "./dist/size-timeline-dom.js",
-      "maxSize": "4.2 kB"
-    },
-    {
-      "path": "./dist/size-spring.js",
-      "maxSize": "1 kB"
-    },
-    {
-      "path": "./dist/size-react.js",
-      "maxSize": "4.5 kB"
-    },
-    {
-      "path": "./dist/size-webpack-animate.js",
-      "maxSize": "3.4 kB"
-    }
-  ]
+    "@motionone/dom": "^10.5.0-alpha.1"
+  }
 }

package/types/index.d.ts

@@ -1,7 +1,3 @@
-export { animate } from "./targets/dom/animate.js";
-export { animateStyle } from "./targets/dom/animate-style.js";
-export { timeline } from "./targets/dom/timeline/index.js";
-export { stagger } from "./utils/stagger.js";
-export { spring } from "./targets/js/easing/spring/index.js";
-export { glide } from "./targets/js/easing/glide/index.js";
-export * from "./targets/dom/types";
+export * from "@motionone/dom";
+export declare function test(): void;
+//# sourceMappingURL=index.d.ts.map

package/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAE9B,wBAAgB,IAAI,SAEnB"}

package/CHANGELOG.md

@@ -1,103 +0,0 @@
-# Changelog
-
-Motion One adheres to [Semantic Versioning](http://semver.org/).
-
-## [10.4.0] [2021-10-18]
-
-### Added
-
-- **Spring and glide in timeline:** `timeline` now supports animations with `ease: spring()` and `ease: glide()`.
-
-## [10.3.2] [2021-10-18]
-
-### Fixed
-
-- Fixing animation interruption for independent transform animations in Safari and Firefox. [Issue (sponsors only)](https://github.com/motiondivision/motion/issues/27)
-
-## [10.3.1] [2021-10-12]
-
-### Fixed
-
-- Fixing a bug in `stagger` and `animate`.
-
-## [10.3.0] [2021-10-11]
-
-### New
-
-- **Glide:** Animate transforms with realistic [glide](https://motion.dev/dom/glide) that can be used to mimic momentum scroll.
-
-### Fixed
-
-- Fixing a bug where sometimes velocity wasn't being correctly passed to the next animation.
-
-## [10.2.1] [2021-10-06]
-
-### Fixed
-
-- Ensuring `duration` is always passed correctly to the independent transform polyfill.
-
-## [10.2.0] [2021-10-05]
-
-### New
-
-- **Springs:** Animate transforms with realistic [spring](https://motion.dev/dom/spring) simulations.
-
-## [10.1.3] [2021-10-01]
-
-### Fixed
-
-- **Fill both for timelines:** Extends `fill: "both"` effect from `10.1.2` to `timeline`.
-
-## [10.1.2] [2021-10-01]
-
-### Fixed
-
-- **Fill both:** Previously, if an animation had a delay and an initially-defined first keyframe (`opacity: [0, 1]`) the animation would start from its rendered style to that first keyframe. Now, the initial keyframe gets stretched to the very start of the whole animation by setting `fill: "both"`. [Issue (sponsors only)](https://github.com/motiondivision/motion/issues/20)
-
-## [10.1.1] [2021-09-28]
-
-### Fixed
-
-- **Scrub to end:** Setting `currentTime` to `duration` was removing the animation effect. This has been fixed by setting `fill: "forwards"` on the WAAPI animation. This won't affect memory consumption as animations are flattened into styles and removed on finish. [Issue (sponsors only)](https://github.com/motiondivision/motion/issues/21)
-
-### Changed
-
-- **Removed Popmotion dependency:** Reduced the number of dependencies by moving Popmotion utilities inside Motion One. Filesize remains unaffected in most environments but will be lower in Skypack and other distributors that don't support tree-shaking.
-
-## [10.1.0] [2021-09-27]
-
-### New
-
-- **Duration:** The duration of timelines is usually automatically calculated from its defined animations. It can now be read from the new read-only `duration` prop on [animation controls](http://motion.dev/dom/controls).
-
-### Changed
-
-- **Performance:** Before Motion One starts a new animation, it stops the old one. Stopping an animation commits its styles, which can cause a style recalculation. Now, when an animation finishes, we delete the reference to the old animation. Additionally, we check the animation status isn't `"finished"` before committing styles within `stop`. This prevents unnecessary style recalculations.
-
-## [10.0.3] [2021-09-25]
-
-### Fixed
-
-- Fixed formatting of changelog for website publication.
-
-## [10.0.2] [2021-09-24]
-
-### Changed
-
-- Generating `finished` promise on-demand.
-
-### Fixed
-
-- Catching promise in `animate` and `timeline` to prevent errors whenever a sub-animation is cancelled.
-
-## [10.0.1] [2021-09-22]
-
-### Changed
-
-- Removed links to repo from Readme.
-
-## [10.0.0] [2021-09-12]
-
-### New
-
-- First publish

package/LICENSE

@@ -1,21 +0,0 @@
-MIT License
-
-Copyright (c) 2021 Matt Perry
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.

package/dist/react.cjs.js

@@ -1,9 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var index = require('./targets/react/index.cjs.js');
-
-
-
-exports.animated = index.animated;

package/dist/react.es.js

@@ -1 +0,0 @@
-export { animated } from './targets/react/index.es.js';

package/dist/size-animate-dom.js

@@ -1 +0,0 @@
-const t=new WeakMap;function e(e){return t.has(e)||t.set(e,{transforms:[],animations:{},generators:{},prevGeneratorState:{}}),t.get(e)}const n=()=>{},a=t=>t,i=["","X","Y","Z"],r={x:"translateX",y:"translateY",z:"translateZ"},s={syntax:"<angle>",initialValue:"0deg",toDefaultUnit:t=>t+"deg"},o={translate:{syntax:"<length-percentage>",initialValue:"0px",toDefaultUnit:t=>t+"px"},rotate:s,scale:{syntax:"<number>",initialValue:1,toDefaultUnit:a},skew:s},c=new Map,l=t=>`--motion-${t}`,u=["x","y","z"];["translate","scale","rotate","skew"].forEach((t=>{i.forEach((e=>{u.push(t+e),c.set(l(t+e),o[t])}))}));const h=(t,e)=>u.indexOf(t)-u.indexOf(e),f=new Set(u),m=t=>f.has(t),d=t=>t.sort(h).reduce(p,"").trim(),p=(t,e)=>`${t} ${e}(var(${l(e)}))`,y=t=>t.startsWith("--"),g=new Set;const v=t=>1e3*t,S=t=>"number"==typeof t,T=t=>Array.isArray(t)&&!S(t[0]),w=t=>"object"==typeof t&&Boolean(t.createAnimation),b=t=>(t=>Array.isArray(t)&&S(t[0]))(t)?x(t):t,x=([t,e,n,a])=>`cubic-bezier(${t}, ${e}, ${n}, ${a})`,k=t=>document.createElement("div").animate(t,{duration:.001}),A={cssRegisterProperty:()=>"undefined"!=typeof CSS&&Object.hasOwnProperty.call(CSS,"registerProperty"),waapi:()=>Object.hasOwnProperty.call(Element.prototype,"animate"),partialKeyframes:()=>{try{k({opacity:[1]})}catch(t){return!1}return!0},finished:()=>Boolean(k({opacity:[0,1]}).finished)},M={},D={};for(const t in A)D[t]=()=>(void 0===M[t]&&(M[t]=A[t]()),M[t]);const O={duration:.3,delay:0,endDelay:0,repeat:0,easing:"ease"},P=(t,e,n)=>(((1-3*n+3*e)*t+(3*n-6*e))*t+3*e)*t;function j(t,e,n,i){if(t===e&&n===i)return a;const r=e=>function(t,e,n,a,i){let r,s,o=0;do{s=e+(n-e)/2,r=P(s,a,i)-t,r>0?n=s:e=s}while(Math.abs(r)>1e-7&&++o<12);return s}(e,0,1,t,n);return t=>0===t||1===t?t:P(r(t),e,i)}const V=(t,e="end")=>n=>{const a=(n="end"===e?Math.min(n,.999):Math.max(n,.001))*t,i="end"===e?Math.floor(a):Math.ceil(a);return r=0,s=1,o=i/t,Math.min(Math.max(o,r),s);var r,s,o},$={ease:j(.25,.1,.25,1),"ease-in":j(.42,0,1,1),"ease-in-out":j(.42,0,.58,1),"ease-out":j(0,0,.58,1)},E=/\((.*?)\)/;function R(t){if("function"==typeof t)return t;if(Array.isArray(t))return j(...t);if($[t])return $[t];if(t.startsWith("steps")){const e=E.exec(t);if(e){const t=e[1].split(",");return V(parseFloat(t[0]),t[1].trim())}}return a}const U=(t,e,n)=>-n*t+n*e+t,q=(t,e,n)=>e-t==0?1:(n-t)/(e-t);function C(t,e){const n=t[t.length-1];for(let a=1;a<=e;a++){const i=q(0,e,a);t.push(U(n,1,i))}}function F(t,e=function(t){const e=[0];return C(e,t-1),e}(t.length),n=a){const i=t.length,r=i-e.length;return r>0&&C(e,r),a=>{let r=0;for(;r<i-2&&!(a<e[r+1]);r++);let s=(o=q(e[r],e[r+1],a),Math.min(1,Math.max(o,0)));var o;const c=function(t,e){return T(t)?t[((t,e,n)=>{const a=e-t;return((n-t)%a+a)%a+t})(0,t.length,e)]:t}(n,r);return s=c(s),U(t[r],t[r+1],s)}}class W{constructor(t,e=[0,1],{easing:n=O.easing,duration:a=O.duration,delay:i=O.delay,endDelay:r=O.endDelay,repeat:s=O.repeat,offset:o,direction:c="normal"}={}){this.startTime=0,this.rate=1,this.t=0,this.cancelTimestamp=0,this.playState="idle",this.finished=new Promise(((t,e)=>{this.resolve=t,this.reject=e}));const l=a*(s+1);w(n)&&(n="ease");const u=F(e,o,T(n)?n.map(R):R(n));this.tick=e=>{this.pauseTime&&(e=this.pauseTime);let n=(e-this.startTime)*this.rate;this.t=n,n/=1e3,n=Math.max(n-i,0),"finished"===this.playState&&(n=l);const s=n/a;let o=Math.floor(s),h=s%1;!h&&s>=1&&(h=1),1===h&&o--;const f=o%2;("reverse"===c||"alternate"===c&&f||"alternate-reverse"===c&&!f)&&(h=1-h);const m=u(n>=l?1:Math.min(h,1));t(m);"finished"===this.playState||n>=l+r?(this.playState="finished",this.resolve(m)):"idle"!==this.playState&&requestAnimationFrame(this.tick)},this.play()}play(){const t=performance.now();this.playState="running",this.pauseTime?this.startTime=t-(this.pauseTime-this.startTime):this.startTime||(this.startTime=t),this.pauseTime=void 0,requestAnimationFrame(this.tick)}pause(){this.playState="paused",this.pauseTime=performance.now()}finish(){this.playState="finished",this.tick(0)}cancel(){this.playState="idle",this.tick(this.cancelTimestamp),this.reject(!1)}reverse(){this.rate*=-1}commitStyles(){this.cancelTimestamp=performance.now()}get currentTime(){return this.t}set currentTime(t){this.pauseTime||0===this.rate?this.pauseTime=t:this.startTime=performance.now()-t/this.rate}get playbackRate(){return this.rate}set playbackRate(t){this.rate=t}}const z=(t,e)=>{let n=y(e)?t.style.getPropertyValue(e):getComputedStyle(t)[e];if(!n&&0!==n){const t=c.get(e);t&&(n=t.initialValue)}return n};function B(t){if(t)try{"finished"!==t.playState&&t.commitStyles(),t.cancel()}catch(t){}}function G(t,a,i,s={}){let o,{duration:u=O.duration,delay:h=O.delay,endDelay:f=O.endDelay,repeat:p=O.repeat,easing:x=O.easing,direction:k,offset:A,allowWebkitAcceleration:M=!1}=s;const P=e(t);let j=D.waapi(),V=n;const $=m(a);$&&((t,n)=>{r[n]&&(n=r[n]);const{transforms:a}=e(t);var i,s;s=n,-1===(i=a).indexOf(s)&&i.push(s),t.style.transform=d(a)})(t,a);const E=function(t){return r[t]&&(t=r[t]),m(t)?l(t):t}(a),R=c.get(E);return B(P.animations[E]),()=>{const e=()=>{var e,n;return null!==(n=null!==(e=z(t,E))&&void 0!==e?e:null==R?void 0:R.initialValue)&&void 0!==n?n:0};let a=function(t,e){for(let n=0;n<t.length;n++)null===t[n]&&(t[n]=n?t[n-1]:e());return t}((t=>Array.isArray(t)?t:[t])(i),e);if(w(x)){const t=x.createAnimation(a,e,$,E,P);x=t.easing,void 0!==t.keyframes&&(a=t.keyframes),void 0!==t.duration&&(u=t.duration)}if(y(E)?(V=((t,e)=>n=>t.style.setProperty(e,n))(t,E),D.cssRegisterProperty()?function(t){if(!g.has(t)){g.add(t);try{const{syntax:e,initialValue:n}=c.has(t)?c.get(t):{};CSS.registerProperty({name:t,inherits:!1,syntax:e,initialValue:n})}catch(t){}}}(E):j=!1):V=((t,e)=>n=>t.style[e]=n)(t,E),j){R&&(a=a.map((t=>S(t)?R.toDefaultUnit(t):t))),D.partialKeyframes()||1!==a.length||a.unshift(e());const i={delay:v(h),duration:v(u),endDelay:v(f),easing:T(x)?void 0:b(x),direction:k,iterations:p+1,fill:"both"};o=t.animate({[E]:a,offset:A,easing:T(x)?x.map(b):void 0},i),o.finished||(o.finished=new Promise(((t,e)=>{o.onfinish=t,o.oncancel=e})));const r=a[a.length-1];o.finished.then((()=>{V(r),o.cancel()})).catch(n),M||(o.playbackRate=1.000001)}else if($&&a.every(S)){if(1===a.length&&a.unshift(parseFloat(e())),R){const t=V;V=e=>t(R.toDefaultUnit(e))}o=new W(V,a,Object.assign(Object.assign({},s),{duration:u,easing:x}))}else{const t=a[a.length-1];V(R&&S(t)?R.toDefaultUnit(t):t)}return P.animations[E]=o,null==o||o.finished.then((()=>{P.animations[E]=void 0,P.generators[E]=void 0,P.prevGeneratorState[E]=void 0})).catch(n),o}}const K=(t,e)=>t[e]?Object.assign(Object.assign({},t),t[e]):Object.assign({},t);const X=t=>t(),Y=t=>t.animations[0],Z={get:(t,e)=>{var a,i;switch(e){case"duration":return t.duration;case"currentTime":let r=(null===(a=Y(t))||void 0===a?void 0:a[e])||0;return r?r/1e3:0;case"playbackRate":return null===(i=Y(t))||void 0===i?void 0:i[e];case"finished":return t.finished||(t.finished=Promise.all(t.animations.map(H)).catch(n)),t.finished;case"stop":return()=>t.animations.forEach(B);default:return()=>t.animations.forEach((t=>t[e]()))}},set:(t,e,n)=>{switch(e){case"currentTime":n=v(n);case"currentTime":case"playbackRate":for(let a=0;a<t.animations.length;a++)t.animations[a][e]=n;return!0}return!1}},H=t=>t.finished;function I(t,e,n){return"function"==typeof t?t(e,n):t}function J(t,e,n={}){var a;t=function(t,e){var n;return"string"==typeof t?e?(null!==(n=e[t])&&void 0!==n||(e[t]=document.querySelectorAll(t)),t=e[t]):t=document.querySelectorAll(t):t instanceof Element&&(t=[t]),Array.from(t)}(t);const i=t.length,r=[];for(let a=0;a<i;a++){const s=t[a];for(const t in e){const o=K(n,t);o.delay=I(o.delay,a,i);const c=G(s,t,e[t],o);r.push(c)}}return s=r,o=null!==(a=n.duration)&&void 0!==a?a:O.duration,new Proxy({animations:s.map(X).filter(Boolean),duration:o},Z);var s,o}export{J as animate};

package/dist/size-animate-style.js

@@ -1 +0,0 @@
-const t=new WeakMap;function e(e){return t.has(e)||t.set(e,{transforms:[],animations:{},generators:{},prevGeneratorState:{}}),t.get(e)}const a=()=>{},n=t=>t,i=["","X","Y","Z"],s={x:"translateX",y:"translateY",z:"translateZ"},r={syntax:"<angle>",initialValue:"0deg",toDefaultUnit:t=>t+"deg"},o={translate:{syntax:"<length-percentage>",initialValue:"0px",toDefaultUnit:t=>t+"px"},rotate:r,scale:{syntax:"<number>",initialValue:1,toDefaultUnit:n},skew:r},l=new Map,c=t=>`--motion-${t}`,h=["x","y","z"];["translate","scale","rotate","skew"].forEach((t=>{i.forEach((e=>{h.push(t+e),l.set(c(t+e),o[t])}))}));const u=(t,e)=>h.indexOf(t)-h.indexOf(e),f=new Set(h),p=t=>f.has(t),m=t=>t.sort(u).reduce(y,"").trim(),y=(t,e)=>`${t} ${e}(var(${c(e)}))`,d=t=>t.startsWith("--"),g=new Set;const v=t=>1e3*t,S=t=>"number"==typeof t,T=t=>Array.isArray(t)&&!S(t[0]),w=t=>"object"==typeof t&&Boolean(t.createAnimation),x=t=>(t=>Array.isArray(t)&&S(t[0]))(t)?b(t):t,b=([t,e,a,n])=>`cubic-bezier(${t}, ${e}, ${a}, ${n})`,k=t=>document.createElement("div").animate(t,{duration:.001}),M={cssRegisterProperty:()=>"undefined"!=typeof CSS&&Object.hasOwnProperty.call(CSS,"registerProperty"),waapi:()=>Object.hasOwnProperty.call(Element.prototype,"animate"),partialKeyframes:()=>{try{k({opacity:[1]})}catch(t){return!1}return!0},finished:()=>Boolean(k({opacity:[0,1]}).finished)},A={},D={};for(const t in M)D[t]=()=>(void 0===A[t]&&(A[t]=M[t]()),A[t]);const P={duration:.3,delay:0,endDelay:0,repeat:0,easing:"ease"},O=(t,e,a)=>(((1-3*a+3*e)*t+(3*a-6*e))*t+3*e)*t;function V(t,e,a,i){if(t===e&&a===i)return n;const s=e=>function(t,e,a,n,i){let s,r,o=0;do{r=e+(a-e)/2,s=O(r,n,i)-t,s>0?a=r:e=r}while(Math.abs(s)>1e-7&&++o<12);return r}(e,0,1,t,a);return t=>0===t||1===t?t:O(s(t),e,i)}const $=(t,e="end")=>a=>{const n=(a="end"===e?Math.min(a,.999):Math.max(a,.001))*t,i="end"===e?Math.floor(n):Math.ceil(n);return s=0,r=1,o=i/t,Math.min(Math.max(o,s),r);var s,r,o},j={ease:V(.25,.1,.25,1),"ease-in":V(.42,0,1,1),"ease-in-out":V(.42,0,.58,1),"ease-out":V(0,0,.58,1)},U=/\((.*?)\)/;function R(t){if("function"==typeof t)return t;if(Array.isArray(t))return V(...t);if(j[t])return j[t];if(t.startsWith("steps")){const e=U.exec(t);if(e){const t=e[1].split(",");return $(parseFloat(t[0]),t[1].trim())}}return n}const C=(t,e,a)=>-a*t+a*e+t,E=(t,e,a)=>e-t==0?1:(a-t)/(e-t);function F(t,e){const a=t[t.length-1];for(let n=1;n<=e;n++){const i=E(0,e,n);t.push(C(a,1,i))}}function W(t,e=function(t){const e=[0];return F(e,t-1),e}(t.length),a=n){const i=t.length,s=i-e.length;return s>0&&F(e,s),n=>{let s=0;for(;s<i-2&&!(n<e[s+1]);s++);let r=(o=E(e[s],e[s+1],n),Math.min(1,Math.max(o,0)));var o;const l=function(t,e){return T(t)?t[((t,e,a)=>{const n=e-t;return((a-t)%n+n)%n+t})(0,t.length,e)]:t}(a,s);return r=l(r),C(t[s],t[s+1],r)}}class z{constructor(t,e=[0,1],{easing:a=P.easing,duration:n=P.duration,delay:i=P.delay,endDelay:s=P.endDelay,repeat:r=P.repeat,offset:o,direction:l="normal"}={}){this.startTime=0,this.rate=1,this.t=0,this.cancelTimestamp=0,this.playState="idle",this.finished=new Promise(((t,e)=>{this.resolve=t,this.reject=e}));const c=n*(r+1);w(a)&&(a="ease");const h=W(e,o,T(a)?a.map(R):R(a));this.tick=e=>{this.pauseTime&&(e=this.pauseTime);let a=(e-this.startTime)*this.rate;this.t=a,a/=1e3,a=Math.max(a-i,0),"finished"===this.playState&&(a=c);const r=a/n;let o=Math.floor(r),u=r%1;!u&&r>=1&&(u=1),1===u&&o--;const f=o%2;("reverse"===l||"alternate"===l&&f||"alternate-reverse"===l&&!f)&&(u=1-u);const p=h(a>=c?1:Math.min(u,1));t(p);"finished"===this.playState||a>=c+s?(this.playState="finished",this.resolve(p)):"idle"!==this.playState&&requestAnimationFrame(this.tick)},this.play()}play(){const t=performance.now();this.playState="running",this.pauseTime?this.startTime=t-(this.pauseTime-this.startTime):this.startTime||(this.startTime=t),this.pauseTime=void 0,requestAnimationFrame(this.tick)}pause(){this.playState="paused",this.pauseTime=performance.now()}finish(){this.playState="finished",this.tick(0)}cancel(){this.playState="idle",this.tick(this.cancelTimestamp),this.reject(!1)}reverse(){this.rate*=-1}commitStyles(){this.cancelTimestamp=performance.now()}get currentTime(){return this.t}set currentTime(t){this.pauseTime||0===this.rate?this.pauseTime=t:this.startTime=performance.now()-t/this.rate}get playbackRate(){return this.rate}set playbackRate(t){this.rate=t}}const q=(t,e)=>{let a=d(e)?t.style.getPropertyValue(e):getComputedStyle(t)[e];if(!a&&0!==a){const t=l.get(e);t&&(a=t.initialValue)}return a};function B(t,n,i,r={}){let o,{duration:h=P.duration,delay:u=P.delay,endDelay:f=P.endDelay,repeat:y=P.repeat,easing:b=P.easing,direction:k,offset:M,allowWebkitAcceleration:A=!1}=r;const O=e(t);let V=D.waapi(),$=a;const j=p(n);j&&((t,a)=>{s[a]&&(a=s[a]);const{transforms:n}=e(t);var i,r;r=a,-1===(i=n).indexOf(r)&&i.push(r),t.style.transform=m(n)})(t,n);const U=function(t){return s[t]&&(t=s[t]),p(t)?c(t):t}(n),R=l.get(U);return function(t){if(t)try{"finished"!==t.playState&&t.commitStyles(),t.cancel()}catch(t){}}(O.animations[U]),()=>{const e=()=>{var e,a;return null!==(a=null!==(e=q(t,U))&&void 0!==e?e:null==R?void 0:R.initialValue)&&void 0!==a?a:0};let n=function(t,e){for(let a=0;a<t.length;a++)null===t[a]&&(t[a]=a?t[a-1]:e());return t}((t=>Array.isArray(t)?t:[t])(i),e);if(w(b)){const t=b.createAnimation(n,e,j,U,O);b=t.easing,void 0!==t.keyframes&&(n=t.keyframes),void 0!==t.duration&&(h=t.duration)}if(d(U)?($=((t,e)=>a=>t.style.setProperty(e,a))(t,U),D.cssRegisterProperty()?function(t){if(!g.has(t)){g.add(t);try{const{syntax:e,initialValue:a}=l.has(t)?l.get(t):{};CSS.registerProperty({name:t,inherits:!1,syntax:e,initialValue:a})}catch(t){}}}(U):V=!1):$=((t,e)=>a=>t.style[e]=a)(t,U),V){R&&(n=n.map((t=>S(t)?R.toDefaultUnit(t):t))),D.partialKeyframes()||1!==n.length||n.unshift(e());const i={delay:v(u),duration:v(h),endDelay:v(f),easing:T(b)?void 0:x(b),direction:k,iterations:y+1,fill:"both"};o=t.animate({[U]:n,offset:M,easing:T(b)?b.map(x):void 0},i),o.finished||(o.finished=new Promise(((t,e)=>{o.onfinish=t,o.oncancel=e})));const s=n[n.length-1];o.finished.then((()=>{$(s),o.cancel()})).catch(a),A||(o.playbackRate=1.000001)}else if(j&&n.every(S)){if(1===n.length&&n.unshift(parseFloat(e())),R){const t=$;$=e=>t(R.toDefaultUnit(e))}o=new z($,n,Object.assign(Object.assign({},r),{duration:h,easing:b}))}else{const t=n[n.length-1];$(R&&S(t)?R.toDefaultUnit(t):t)}return O.animations[U]=o,null==o||o.finished.then((()=>{O.animations[U]=void 0,O.generators[U]=void 0,O.prevGeneratorState[U]=void 0})).catch(a),o}}export{B as animateStyle};

package/dist/size-react.js

@@ -1 +0,0 @@
-import*as t from"react";import{useRef as e,useEffect as n,useState as r,createContext as i,useContext as s,forwardRef as o,createElement as a,useMemo as c}from"react";const l=new WeakMap;function u(t){return l.has(t)||l.set(t,{transforms:[],animations:{},generators:{},prevGeneratorState:{}}),l.get(t)}const p=()=>{},h=t=>t,f=["","X","Y","Z"],y={x:"translateX",y:"translateY",z:"translateZ"},m={syntax:"<angle>",initialValue:"0deg",toDefaultUnit:t=>t+"deg"},d={translate:{syntax:"<length-percentage>",initialValue:"0px",toDefaultUnit:t=>t+"px"},rotate:m,scale:{syntax:"<number>",initialValue:1,toDefaultUnit:h},skew:m},g=new Map,v=t=>`--motion-${t}`,w=["x","y","z"];["translate","scale","rotate","skew"].forEach((t=>{f.forEach((e=>{w.push(t+e),g.set(v(t+e),d[t])}))}));const b=(t,e)=>w.indexOf(t)-w.indexOf(e),O=new Set(w),S=t=>O.has(t),x=t=>t.sort(b).reduce(j,"").trim(),j=(t,e)=>`${t} ${e}(var(${v(e)}))`,P=t=>t.startsWith("--"),T=new Set;const V=t=>1e3*t,A=t=>"number"==typeof t,k=t=>Array.isArray(t)&&!A(t[0]),M=t=>"object"==typeof t&&Boolean(t.createAnimation),D=t=>(t=>Array.isArray(t)&&A(t[0]))(t)?E(t):t,E=([t,e,n,r])=>`cubic-bezier(${t}, ${e}, ${n}, ${r})`,$=t=>document.createElement("div").animate(t,{duration:.001}),C={cssRegisterProperty:()=>"undefined"!=typeof CSS&&Object.hasOwnProperty.call(CSS,"registerProperty"),waapi:()=>Object.hasOwnProperty.call(Element.prototype,"animate"),partialKeyframes:()=>{try{$({opacity:[1]})}catch(t){return!1}return!0},finished:()=>Boolean($({opacity:[0,1]}).finished)},L={},U={};for(const t in C)U[t]=()=>(void 0===L[t]&&(L[t]=C[t]()),L[t]);const I={duration:.3,delay:0,endDelay:0,repeat:0,easing:"ease"},R=(t,e,n)=>(((1-3*n+3*e)*t+(3*n-6*e))*t+3*e)*t;function B(t,e,n,r){if(t===e&&n===r)return h;const i=e=>function(t,e,n,r,i){let s,o,a=0;do{o=e+(n-e)/2,s=R(o,r,i)-t,s>0?n=o:e=o}while(Math.abs(s)>1e-7&&++a<12);return o}(e,0,1,t,n);return t=>0===t||1===t?t:R(i(t),e,r)}const F=(t,e="end")=>n=>{const r=(n="end"===e?Math.min(n,.999):Math.max(n,.001))*t,i="end"===e?Math.floor(r):Math.ceil(r);return s=0,o=1,a=i/t,Math.min(Math.max(a,s),o);var s,o,a},W={ease:B(.25,.1,.25,1),"ease-in":B(.42,0,1,1),"ease-in-out":B(.42,0,.58,1),"ease-out":B(0,0,.58,1)},z=/\((.*?)\)/;function q(t){if("function"==typeof t)return t;if(Array.isArray(t))return B(...t);if(W[t])return W[t];if(t.startsWith("steps")){const e=z.exec(t);if(e){const t=e[1].split(",");return F(parseFloat(t[0]),t[1].trim())}}return h}const G=(t,e,n)=>-n*t+n*e+t,K=(t,e,n)=>e-t==0?1:(n-t)/(e-t);function X(t,e){const n=t[t.length-1];for(let r=1;r<=e;r++){const i=K(0,e,r);t.push(G(n,1,i))}}function Y(t,e=function(t){const e=[0];return X(e,t-1),e}(t.length),n=h){const r=t.length,i=r-e.length;return i>0&&X(e,i),i=>{let s=0;for(;s<r-2&&!(i<e[s+1]);s++);let o=(a=K(e[s],e[s+1],i),Math.min(1,Math.max(a,0)));var a;const c=function(t,e){return k(t)?t[((t,e,n)=>{const r=e-t;return((n-t)%r+r)%r+t})(0,t.length,e)]:t}(n,s);return o=c(o),G(t[s],t[s+1],o)}}class Z{constructor(t,e=[0,1],{easing:n=I.easing,duration:r=I.duration,delay:i=I.delay,endDelay:s=I.endDelay,repeat:o=I.repeat,offset:a,direction:c="normal"}={}){this.startTime=0,this.rate=1,this.t=0,this.cancelTimestamp=0,this.playState="idle",this.finished=new Promise(((t,e)=>{this.resolve=t,this.reject=e}));const l=r*(o+1);M(n)&&(n="ease");const u=Y(e,a,k(n)?n.map(q):q(n));this.tick=e=>{this.pauseTime&&(e=this.pauseTime);let n=(e-this.startTime)*this.rate;this.t=n,n/=1e3,n=Math.max(n-i,0),"finished"===this.playState&&(n=l);const o=n/r;let a=Math.floor(o),p=o%1;!p&&o>=1&&(p=1),1===p&&a--;const h=a%2;("reverse"===c||"alternate"===c&&h||"alternate-reverse"===c&&!h)&&(p=1-p);const f=u(n>=l?1:Math.min(p,1));t(f);"finished"===this.playState||n>=l+s?(this.playState="finished",this.resolve(f)):"idle"!==this.playState&&requestAnimationFrame(this.tick)},this.play()}play(){const t=performance.now();this.playState="running",this.pauseTime?this.startTime=t-(this.pauseTime-this.startTime):this.startTime||(this.startTime=t),this.pauseTime=void 0,requestAnimationFrame(this.tick)}pause(){this.playState="paused",this.pauseTime=performance.now()}finish(){this.playState="finished",this.tick(0)}cancel(){this.playState="idle",this.tick(this.cancelTimestamp),this.reject(!1)}reverse(){this.rate*=-1}commitStyles(){this.cancelTimestamp=performance.now()}get currentTime(){return this.t}set currentTime(t){this.pauseTime||0===this.rate?this.pauseTime=t:this.startTime=performance.now()-t/this.rate}get playbackRate(){return this.rate}set playbackRate(t){this.rate=t}}const H=(t,e)=>{let n=P(e)?t.style.getPropertyValue(e):getComputedStyle(t)[e];if(!n&&0!==n){const t=g.get(e);t&&(n=t.initialValue)}return n};function J(t,e,n,r={}){let i,{duration:s=I.duration,delay:o=I.delay,endDelay:a=I.endDelay,repeat:c=I.repeat,easing:l=I.easing,direction:h,offset:f,allowWebkitAcceleration:m=!1}=r;const d=u(t);let w=U.waapi(),b=p;const O=S(e);O&&((t,e)=>{y[e]&&(e=y[e]);const{transforms:n}=u(t);var r,i;i=e,-1===(r=n).indexOf(i)&&r.push(i),t.style.transform=x(n)})(t,e);const j=function(t){return y[t]&&(t=y[t]),S(t)?v(t):t}(e),E=g.get(j);return function(t){if(t)try{"finished"!==t.playState&&t.commitStyles(),t.cancel()}catch(t){}}(d.animations[j]),()=>{const e=()=>{var e,n;return null!==(n=null!==(e=H(t,j))&&void 0!==e?e:null==E?void 0:E.initialValue)&&void 0!==n?n:0};let u=function(t,e){for(let n=0;n<t.length;n++)null===t[n]&&(t[n]=n?t[n-1]:e());return t}((t=>Array.isArray(t)?t:[t])(n),e);if(M(l)){const t=l.createAnimation(u,e,O,j,d);l=t.easing,void 0!==t.keyframes&&(u=t.keyframes),void 0!==t.duration&&(s=t.duration)}if(P(j)?(b=((t,e)=>n=>t.style.setProperty(e,n))(t,j),U.cssRegisterProperty()?function(t){if(!T.has(t)){T.add(t);try{const{syntax:e,initialValue:n}=g.has(t)?g.get(t):{};CSS.registerProperty({name:t,inherits:!1,syntax:e,initialValue:n})}catch(t){}}}(j):w=!1):b=((t,e)=>n=>t.style[e]=n)(t,j),w){E&&(u=u.map((t=>A(t)?E.toDefaultUnit(t):t))),U.partialKeyframes()||1!==u.length||u.unshift(e());const n={delay:V(o),duration:V(s),endDelay:V(a),easing:k(l)?void 0:D(l),direction:h,iterations:c+1,fill:"both"};i=t.animate({[j]:u,offset:f,easing:k(l)?l.map(D):void 0},n),i.finished||(i.finished=new Promise(((t,e)=>{i.onfinish=t,i.oncancel=e})));const r=u[u.length-1];i.finished.then((()=>{b(r),i.cancel()})).catch(p),m||(i.playbackRate=1.000001)}else if(O&&u.every(A)){if(1===u.length&&u.unshift(parseFloat(e())),E){const t=b;b=e=>t(E.toDefaultUnit(e))}i=new Z(b,u,Object.assign(Object.assign({},r),{duration:s,easing:l}))}else{const t=u[u.length-1];b(E&&A(t)?E.toDefaultUnit(t):t)}return d.animations[j]=i,null==i||i.finished.then((()=>{d.animations[j]=void 0,d.generators[j]=void 0,d.prevGeneratorState[j]=void 0})).catch(p),i}}const N=(t,e)=>t[e]?Object.assign(Object.assign({},t),t[e]):Object.assign({},t);function Q(t,r,i,s,o,a){const c=e(r);n((()=>{const e={};if(new Set([...Object.keys(i),...Object.keys(c.current)]).forEach((t=>{let n=i[t];var r,s;(r=n,s=c.current[t],typeof r==typeof s&&(Array.isArray(r)&&Array.isArray(s)?function(t,e){const n=e.length;if(n!==t.length)return!1;for(let r=0;r<n;r++)if(e[r]!==t[r])return!1;return!0}(r,s):r===s))||(e[t]=n)})),Object.keys(e).length&&t.current){null==o||o(e);const n=[];for(const r in e){const i=J(t.current,r,e[r],N(s,r));n.push(i)}const r=n.map((t=>t())).filter(Boolean);Promise.all(r.map((t=>t.finished))).then((()=>null==a?void 0:a(e))).catch(p)}c.current=i}))}function _(t,e,n={}){return t?"string"==typeof t?n[t]:t:e?n[e]:void 0}function tt(t,e,n){if(n)for(const r in n)"options"!==r&&(t[r]=n[r],n.options&&(e[r]=N(n.options,r)))}function et(t,e,n,i,s){const[o,a]=r(!1);return(o||i)&&tt(t,e,_(n,i,s)),[o||Boolean(i),a]}var nt=i(null);var rt=0,it=function(){return rt++},st=function(){return t=it,null===(n=e(null)).current&&(n.current=t()),n.current;var t,n};function ot(t,e,{exit:r,poses:i},{exit:o}){const[a,c]=function(){var t=s(nt);if(null===t)return[!0,null];var e=t.isPresent,r=t.onExitComplete,i=t.register,o=st();return n((function(){return i(o)}),[]),!e&&r?[!1,function(){return null==r?void 0:r(o)}]:[!0]}();if(n((()=>{r||null==c||c()}),[a]),r&&!a)return tt(t,e,_(r,o,i)),c}const at=i({});function ct(r){return o((function(i,o){const l=e(null),{options:u,style:p,initial:h,hover:f,press:m,exit:d,inViewport:w,viewport:b,poses:O,onStart:j,onComplete:P,onViewportEnter:T,onViewportLeave:V,inherit:k=!0}=i,M=function(t,e){var n={};for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&e.indexOf(r)<0&&(n[r]=t[r]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(r=Object.getOwnPropertySymbols(t);i<r.length;i++)e.indexOf(r[i])<0&&Object.prototype.propertyIsEnumerable.call(t,r[i])&&(n[r[i]]=t[r[i]])}return n}(i,["options","style","initial","hover","press","exit","inViewport","viewport","poses","onStart","onComplete","onViewportEnter","onViewportLeave","inherit"]),D={initial:!0,style:!0};let E=s(at);k||(E={});const $=_(p,E.style,O),C=_(h,E.initial,O),L=Object.assign(Object.assign({},$),C),U=Object.assign(Object.assign({},C),$),I=Object.assign(Object.assign({},u),null==$?void 0:$.options),R=e(null);R.current||(R.current=function(t){const e={},n=[];for(let r in t){const i=t[r];S(r)&&(y[r]&&(r=y[r]),n.push(r),r=v(r));let s=Array.isArray(i)?i[0]:i;const o=g.get(r);o&&(s=A(i)?o.toDefaultUnit(i):i),e[r]=s}return n.length&&(e.transform=x(n)),e}(L));const B=function(t,e,{hover:n,onPointerEnter:r,onPointerLeave:i,poses:s}={},{hover:o},a){const[c,l]=et(t,e,n,o,s);return a.hover=c,n?{onPointerEnter:t=>{null==r||r(t),l(!0)},onPointerLeave:t=>{null==i||i(t),l(!1)}}:{}}(U,I,i,E,D),F=function(t,e,{press:n,onPointerDown:r,poses:i}={},{press:s},o){const[a,c]=et(t,e,n,s,i);if(o.press=a,!n)return{};const l=()=>{c(!1),window.removeEventListener("pointerup",l)};return{onPointerDown:t=>{null==r||r(t),c(!0),window.addEventListener("pointerup",l)}}}(U,I,i,E,D);!function(t,e,r,{inViewport:i,poses:s,viewport:o={},onViewportEnter:a,onViewportLeave:c},{inViewport:l},u){const{root:p,margin:h,once:f,threshold:y}=o,[m,d]=et(e,r,i,l,s);u.inViewport=m;let g=!!i||!!a||!!c;f&&m&&(g=!1),n((()=>{if(!g||"undefined"==typeof IntersectionObserver)return;const e=new IntersectionObserver((([t])=>{d(t.isIntersecting);const e=t.isIntersecting?a:c;e&&e(t)}),{root:null==p?void 0:p.current,rootMargin:h,threshold:y});return e.observe(t.current),()=>e.disconnect()}),[i,a,c,p,h,y])}(l,U,I,i,E,D);const W=ot(U,I,i,E);Q(l,L,U,I,j,(t=>{P&&P(t),W&&W()}));const z=a(r,Object.assign({},M,B,F,{style:R.current,ref:l})),q=lt.reduce(((t,e)=>(t[e]=void 0,i[e]?"string"==typeof i[e]&&D[e]&&(t[e]=i[e]):E[e]&&(t[e]=E[e]),t)),{}),G=c((()=>q),Object.values(q));return t.createElement(at.Provider,{value:G},z)}))}const lt=["initial","style","hover","press","inViewport","exit"],ut=new Map,pt=new Proxy({},{get:(t,e)=>(ut.has(e)||ut.set(e,ct(e)),ut.get(e))});export{pt as animated};

package/dist/size-spring.js

@@ -1 +0,0 @@
-const e=e=>"string"!=typeof e,t=function(t){const n=new WeakMap;return(a={})=>{const s=new Map,r=(e=0,n=100,r=0,o=!1)=>{const l=`${e}-${n}-${r}-${o}`;return s.has(l)||s.set(l,t(Object.assign({from:e,to:n,velocity:r,restSpeed:o?.05:2,restDistance:o?.01:.5},a))),s.get(l)},o=e=>(n.has(e)||n.set(e,function(e){let t,n=10,a=e.next(0);const s=[a.value];for(;!a.done&&n<1e4;)a=e.next(n),s.push(a.done?a.target:a.value),void 0===t&&a.hasReachedTarget&&(t=n),n+=10;const r=n-10;return 1===s.length&&s.push(a.value),{keyframes:s,duration:r/1e3,overshootDuration:(null!=t?t:r)/1e3}}(e)),n.get(e));return{createAnimation:(t,n,a,s,l)=>{let c,u;const i=t.length;if(a&&i<=2&&t.every(e)){const e=s&&l&&l.prevGeneratorState[s],a=e&&(1===i||2===i&&null===t[0])?e.velocity:0,h=t[i-1],v=1===i?null:t[0],g=null===v?e?e.value:parseFloat(n()):v;u=r(g,h,a,null==s?void 0:s.includes("scale"));const d=o(u);c=Object.assign(Object.assign({},d),{easing:"linear"})}else{u=r(0,100);c={easing:"ease",duration:o(u).overshootDuration}}return u&&l&&s&&(l.generators[s]=u),c}}}}((({stiffness:e=100,damping:t=10,mass:n=1,from:a=0,to:s=1,velocity:r=0,restSpeed:o=2,restDistance:l=.5}={})=>{const c={done:!1,value:a,target:s,velocity:r=r?r/1e3:0,hasReachedTarget:!1},u=((e=100,t=10,n=1)=>t/(2*Math.sqrt(e*n)))(e,t,n),i=s-a,h=Math.sqrt(e/n)/1e3,v=((e,t)=>e*Math.sqrt(1-t*t))(h,u);let g;return g=u<1?e=>s-Math.exp(-u*h*e)*((u*h*i-r)/v*Math.sin(v*e)+i*Math.cos(v*e)):e=>s-Math.exp(-h*e)*(i+(r+h*i)*e),{next:e=>{c.value=g(e),c.velocity=0===e?r:function(e,t,n){const a=Math.max(t-5,0);return function(e,t){return t?e*(1e3/t):0}(n-e(a),5)}(g,e,c.value);const t=Math.abs(c.velocity)<=o,n=Math.abs(s-c.value)<=l;var u,i,h;return c.done=t&&n,c.hasReachedTarget=(u=a,i=s,h=c.value,u<i&&h>=i||u>i&&h<=i),c}}}));export{t as spring};

package/dist/size-timeline-dom.js

@@ -1 +0,0 @@
-var t=function(){};"production"!==process.env.NODE_ENV&&(t=function(t,e){if(!t)throw new Error(e)});const e=(t,e,n)=>e-t==0?1:(n-t)/(e-t),n=()=>{},a=t=>t,i=(t,e,n)=>(((1-3*n+3*e)*t+(3*n-6*e))*t+3*e)*t;function r(t,e,n,r){if(t===e&&n===r)return a;const s=e=>function(t,e,n,a,r){let s,o,l=0;do{o=e+(n-e)/2,s=i(o,a,r)-t,s>0?n=o:e=o}while(Math.abs(s)>1e-7&&++l<12);return o}(e,0,1,t,n);return t=>0===t||1===t?t:i(s(t),e,r)}const s=(t,e="end")=>n=>{const a=(n="end"===e?Math.min(n,.999):Math.max(n,.001))*t,i="end"===e?Math.floor(a):Math.ceil(a);return r=0,s=1,o=i/t,Math.min(Math.max(o,r),s);var r,s,o},o={ease:r(.25,.1,.25,1),"ease-in":r(.42,0,1,1),"ease-in-out":r(.42,0,.58,1),"ease-out":r(0,0,.58,1)},l=/\((.*?)\)/;function c(t){if("function"==typeof t)return t;if(Array.isArray(t))return r(...t);if(o[t])return o[t];if(t.startsWith("steps")){const e=l.exec(t);if(e){const t=e[1].split(",");return s(parseFloat(t[0]),t[1].trim())}}return a}const u=t=>"number"==typeof t;function h(t,e,n){return"function"==typeof t?t(e,n):t}const f=(t,e,n)=>-n*t+n*e+t;function p(t,n){const a=t[t.length-1];for(let i=1;i<=n;i++){const r=e(0,n,i);t.push(f(a,1,r))}}function d(t){const e=[0];return p(e,t-1),e}const m=new WeakMap;function y(t){return m.has(t)||m.set(t,{transforms:[],animations:{},generators:{},prevGeneratorState:{}}),m.get(t)}function g(t,e){const n=t.indexOf(e);n>-1&&t.splice(n,1)}const v=["","X","Y","Z"],b={x:"translateX",y:"translateY",z:"translateZ"},w={syntax:"<angle>",initialValue:"0deg",toDefaultUnit:t=>t+"deg"},O={translate:{syntax:"<length-percentage>",initialValue:"0px",toDefaultUnit:t=>t+"px"},rotate:w,scale:{syntax:"<number>",initialValue:1,toDefaultUnit:a},skew:w},S=new Map,x=t=>`--motion-${t}`,T=["x","y","z"];["translate","scale","rotate","skew"].forEach((t=>{v.forEach((e=>{T.push(t+e),S.set(x(t+e),O[t])}))}));const k=(t,e)=>T.indexOf(t)-T.indexOf(e),M=new Set(T),j=t=>M.has(t),A=t=>t.sort(k).reduce(P,"").trim(),P=(t,e)=>`${t} ${e}(var(${x(e)}))`,D=t=>t.startsWith("--"),E=new Set;const V=t=>1e3*t,$=t=>Array.isArray(t)&&!u(t[0]),R=t=>"object"==typeof t&&Boolean(t.createAnimation),U=t=>(t=>Array.isArray(t)&&u(t[0]))(t)?W(t):t,W=([t,e,n,a])=>`cubic-bezier(${t}, ${e}, ${n}, ${a})`,F=t=>document.createElement("div").animate(t,{duration:.001}),q={cssRegisterProperty:()=>"undefined"!=typeof CSS&&Object.hasOwnProperty.call(CSS,"registerProperty"),waapi:()=>Object.hasOwnProperty.call(Element.prototype,"animate"),partialKeyframes:()=>{try{F({opacity:[1]})}catch(t){return!1}return!0},finished:()=>Boolean(F({opacity:[0,1]}).finished)},B={},C={};for(const t in q)C[t]=()=>(void 0===B[t]&&(B[t]=q[t]()),B[t]);const z={duration:.3,delay:0,endDelay:0,repeat:0,easing:"ease"};function G(t,e){return $(t)?t[((t,e,n)=>{const a=e-t;return((n-t)%a+a)%a+t})(0,t.length,e)]:t}function K(t,n=d(t.length),i=a){const r=t.length,s=r-n.length;return s>0&&p(n,s),a=>{let s=0;for(;s<r-2&&!(a<n[s+1]);s++);let o=(l=e(n[s],n[s+1],a),Math.min(1,Math.max(l,0)));var l;return o=G(i,s)(o),f(t[s],t[s+1],o)}}class N{constructor(t,e=[0,1],{easing:n=z.easing,duration:a=z.duration,delay:i=z.delay,endDelay:r=z.endDelay,repeat:s=z.repeat,offset:o,direction:l="normal"}={}){this.startTime=0,this.rate=1,this.t=0,this.cancelTimestamp=0,this.playState="idle",this.finished=new Promise(((t,e)=>{this.resolve=t,this.reject=e}));const u=a*(s+1);R(n)&&(n="ease");const h=K(e,o,$(n)?n.map(c):c(n));this.tick=e=>{this.pauseTime&&(e=this.pauseTime);let n=(e-this.startTime)*this.rate;this.t=n,n/=1e3,n=Math.max(n-i,0),"finished"===this.playState&&(n=u);const s=n/a;let o=Math.floor(s),c=s%1;!c&&s>=1&&(c=1),1===c&&o--;const f=o%2;("reverse"===l||"alternate"===l&&f||"alternate-reverse"===l&&!f)&&(c=1-c);const p=h(n>=u?1:Math.min(c,1));t(p);"finished"===this.playState||n>=u+r?(this.playState="finished",this.resolve(p)):"idle"!==this.playState&&requestAnimationFrame(this.tick)},this.play()}play(){const t=performance.now();this.playState="running",this.pauseTime?this.startTime=t-(this.pauseTime-this.startTime):this.startTime||(this.startTime=t),this.pauseTime=void 0,requestAnimationFrame(this.tick)}pause(){this.playState="paused",this.pauseTime=performance.now()}finish(){this.playState="finished",this.tick(0)}cancel(){this.playState="idle",this.tick(this.cancelTimestamp),this.reject(!1)}reverse(){this.rate*=-1}commitStyles(){this.cancelTimestamp=performance.now()}get currentTime(){return this.t}set currentTime(t){this.pauseTime||0===this.rate?this.pauseTime=t:this.startTime=performance.now()-t/this.rate}get playbackRate(){return this.rate}set playbackRate(t){this.rate=t}}const X=t=>Array.isArray(t)?t:[t],Y=(t,e)=>{let n=D(e)?t.style.getPropertyValue(e):getComputedStyle(t)[e];if(!n&&0!==n){const t=S.get(e);t&&(n=t.initialValue)}return n};function Z(t){if(t)try{"finished"!==t.playState&&t.commitStyles(),t.cancel()}catch(t){}}function I(t,e,a,i={}){let r,{duration:s=z.duration,delay:o=z.delay,endDelay:l=z.endDelay,repeat:c=z.repeat,easing:h=z.easing,direction:f,offset:p,allowWebkitAcceleration:d=!1}=i;const m=y(t);let g=C.waapi(),v=n;const w=j(e);w&&((t,e)=>{b[e]&&(e=b[e]);const{transforms:n}=y(t);var a,i;i=e,-1===(a=n).indexOf(i)&&a.push(i),t.style.transform=A(n)})(t,e);const O=function(t){return b[t]&&(t=b[t]),j(t)?x(t):t}(e),T=S.get(O);return Z(m.animations[O]),()=>{const e=()=>{var e,n;return null!==(n=null!==(e=Y(t,O))&&void 0!==e?e:null==T?void 0:T.initialValue)&&void 0!==n?n:0};let y=function(t,e){for(let n=0;n<t.length;n++)null===t[n]&&(t[n]=n?t[n-1]:e());return t}(X(a),e);if(R(h)){const t=h.createAnimation(y,e,w,O,m);h=t.easing,void 0!==t.keyframes&&(y=t.keyframes),void 0!==t.duration&&(s=t.duration)}if(D(O)?(v=((t,e)=>n=>t.style.setProperty(e,n))(t,O),C.cssRegisterProperty()?function(t){if(!E.has(t)){E.add(t);try{const{syntax:e,initialValue:n}=S.has(t)?S.get(t):{};CSS.registerProperty({name:t,inherits:!1,syntax:e,initialValue:n})}catch(t){}}}(O):g=!1):v=((t,e)=>n=>t.style[e]=n)(t,O),g){T&&(y=y.map((t=>u(t)?T.toDefaultUnit(t):t))),C.partialKeyframes()||1!==y.length||y.unshift(e());const a={delay:V(o),duration:V(s),endDelay:V(l),easing:$(h)?void 0:U(h),direction:f,iterations:c+1,fill:"both"};r=t.animate({[O]:y,offset:p,easing:$(h)?h.map(U):void 0},a),r.finished||(r.finished=new Promise(((t,e)=>{r.onfinish=t,r.oncancel=e})));const i=y[y.length-1];r.finished.then((()=>{v(i),r.cancel()})).catch(n),d||(r.playbackRate=1.000001)}else if(w&&y.every(u)){if(1===y.length&&y.unshift(parseFloat(e())),T){const t=v;v=e=>t(T.toDefaultUnit(e))}r=new N(v,y,Object.assign(Object.assign({},i),{duration:s,easing:h}))}else{const t=y[y.length-1];v(T&&u(t)?T.toDefaultUnit(t):t)}return m.animations[O]=r,null==r||r.finished.then((()=>{m.animations[O]=void 0,m.generators[O]=void 0,m.prevGeneratorState[O]=void 0})).catch(n),r}}const _=t=>t(),H=t=>t.animations[0],J={get:(t,e)=>{var a,i;switch(e){case"duration":return t.duration;case"currentTime":let r=(null===(a=H(t))||void 0===a?void 0:a[e])||0;return r?r/1e3:0;case"playbackRate":return null===(i=H(t))||void 0===i?void 0:i[e];case"finished":return t.finished||(t.finished=Promise.all(t.animations.map(L)).catch(n)),t.finished;case"stop":return()=>t.animations.forEach(Z);default:return()=>t.animations.forEach((t=>t[e]()))}},set:(t,e,n)=>{switch(e){case"currentTime":n=V(n);case"currentTime":case"playbackRate":for(let a=0;a<t.animations.length;a++)t.animations[a][e]=n;return!0}return!1}},L=t=>t.finished,Q=(t,e)=>t[e]?Object.assign(Object.assign({},t),t[e]):Object.assign({},t);function tt(t,e){var n;return"string"==typeof t?e?(null!==(n=e[t])&&void 0!==n||(e[t]=document.querySelectorAll(t)),t=e[t]):t=document.querySelectorAll(t):t instanceof Element&&(t=[t]),Array.from(t)}function et(t,e,n,a){var i;return u(e)?e:e.startsWith("-")||e.startsWith("+")?Math.max(0,t+parseFloat(e)):"<"===e?n:null!==(i=a.get(e))&&void 0!==i?i:t}function nt(t,e,n,a,i,r){!function(t,e,n){for(let a=0;a<t.length;a++){const i=t[a];i.at>e&&i.at<n&&(g(t,i),a--)}}(t,i,r);for(let s=0;s<e.length;s++)t.push({value:e[s],at:f(i,r,a[s]),easing:G(n,s)})}function at(t,e){return t.at===e.at?null===t.value?1:-1:t.at-e.at}function it(t,e={}){var n,a;const i=rt(t,e),r=i.map((t=>I(...t))).filter(Boolean);return s=r,o=null!==(a=null===(n=i[0])||void 0===n?void 0:n[3].duration)&&void 0!==a?a:z.duration,new Proxy({animations:s.map(_).filter(Boolean),duration:o},J);var s,o}function rt(n,a={}){var{defaultOptions:i={}}=a,r=function(t,e){var n={};for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&e.indexOf(a)<0&&(n[a]=t[a]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var i=0;for(a=Object.getOwnPropertySymbols(t);i<a.length;i++)e.indexOf(a[i])<0&&Object.prototype.propertyIsEnumerable.call(t,a[i])&&(n[a[i]]=t[a[i]])}return n}(a,["defaultOptions"]);const s=[],o=new Map,l={},c=new Map;let u=0,f=0,m=0;for(let e=0;e<n.length;e++){const[a,r,s={}]=n[e];void 0!==s.at&&(f=et(f,s.at,u,c));let y=0;const g=tt(a,l),v=g.length;for(let e=0;e<v;e++){const n=st(g[e],o);for(const a in r){const o=ot(a,n);let l=X(r[a]);const c=Q(s,a);let{duration:u=i.duration||z.duration,easing:g=i.easing||z.easing}=c;if(R(g)){const e=j(a);t(2===l.length||!e,"spring must be provided 2 keyframes within timeline");const n=g.createAnimation(l,(()=>"0"),e);g=n.easing,void 0!==n.keyframes&&(l=n.keyframes),void 0!==n.duration&&(u=n.duration)}const b=h(s.delay,e,v)||0,w=f+b,O=w+u;let{offset:S=d(l.length)}=c;1===S.length&&0===S[0]&&(S[1]=1);const x=length-l.length;x>0&&p(S,x),1===l.length&&l.unshift(null),nt(o,l,g,S,w,O),y=Math.max(b+u,y),m=Math.max(O,m)}}u=f,f+=y}return o.forEach(((t,n)=>{for(const a in t){const o=t[a];o.sort(at);const l=[],c=[],u=[];for(let t=0;t<o.length;t++){const{at:n,value:a,easing:i}=o[t];l.push(a),c.push(e(0,m,n)),u.push(i||z.easing)}0!==c[0]&&(c.unshift(0),l.unshift(l[0]),u.unshift("linear")),1!==c[c.length-1]&&(c.push(1),l.push(null)),s.push([n,a,l,Object.assign(Object.assign(Object.assign({},i),{duration:m,easing:u,offset:c}),r)])}})),s}function st(t,e){return!e.has(t)&&e.set(t,{}),e.get(t)}function ot(t,e){return e[t]||(e[t]=[]),e[t]}export{rt as createAnimationsFromTimeline,it as timeline};

package/dist/size-webpack-animate.js

@@ -1 +0,0 @@
-var t={d:(e,n)=>{for(var a in n)t.o(n,a)&&!t.o(e,a)&&Object.defineProperty(e,a,{enumerable:!0,get:n[a]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e)},e={};t.d(e,{j:()=>H});const n=new WeakMap;function a(t){return n.has(t)||n.set(t,{transforms:[],animations:{},generators:{},prevGeneratorState:{}}),n.get(t)}const i=()=>{},r=t=>t,s=["","X","Y","Z"],o={x:"translateX",y:"translateY",z:"translateZ"},l={syntax:"<angle>",initialValue:"0deg",toDefaultUnit:t=>t+"deg"},c={translate:{syntax:"<length-percentage>",initialValue:"0px",toDefaultUnit:t=>t+"px"},rotate:l,scale:{syntax:"<number>",initialValue:1,toDefaultUnit:r},skew:l},u=new Map,h=t=>`--motion-${t}`,f=["x","y","z"];["translate","scale","rotate","skew"].forEach((t=>{s.forEach((e=>{f.push(t+e),u.set(h(t+e),c[t])}))}));const m=(t,e)=>f.indexOf(t)-f.indexOf(e),d=new Set(f),p=t=>d.has(t),y=(t,e)=>`${t} ${e}(var(${h(e)}))`,g=t=>t.startsWith("--"),v=new Set,S=t=>1e3*t,b=t=>"number"==typeof t,w=t=>Array.isArray(t)&&!b(t[0]),T=t=>"object"==typeof t&&Boolean(t.createAnimation),x=t=>(t=>Array.isArray(t)&&b(t[0]))(t)?k(t):t,k=([t,e,n,a])=>`cubic-bezier(${t}, ${e}, ${n}, ${a})`,A=t=>document.createElement("div").animate(t,{duration:.001}),O={cssRegisterProperty:()=>"undefined"!=typeof CSS&&Object.hasOwnProperty.call(CSS,"registerProperty"),waapi:()=>Object.hasOwnProperty.call(Element.prototype,"animate"),partialKeyframes:()=>{try{A({opacity:[1]})}catch(t){return!1}return!0},finished:()=>Boolean(A({opacity:[0,1]}).finished)},j={},M={};for(const t in O)M[t]=()=>(void 0===j[t]&&(j[t]=O[t]()),j[t]);const P={duration:.3,delay:0,endDelay:0,repeat:0,easing:"ease"},D=(t,e,n)=>(((1-3*n+3*e)*t+(3*n-6*e))*t+3*e)*t;function V(t,e,n,a){if(t===e&&n===a)return r;return i=>0===i||1===i?i:D(function(t,e,n,a,i){let r,s,o=0;do{s=e+(n-e)/2,r=D(s,a,i)-t,r>0?n=s:e=s}while(Math.abs(r)>1e-7&&++o<12);return s}(i,0,1,t,n),e,a)}const $={ease:V(.25,.1,.25,1),"ease-in":V(.42,0,1,1),"ease-in-out":V(.42,0,.58,1),"ease-out":V(0,0,.58,1)},E=/\((.*?)\)/;function R(t){if("function"==typeof t)return t;if(Array.isArray(t))return V(...t);if($[t])return $[t];if(t.startsWith("steps")){const e=E.exec(t);if(e){const t=e[1].split(",");return((t,e="end")=>n=>{const a=(n="end"===e?Math.min(n,.999):Math.max(n,.001))*t;return i=("end"===e?Math.floor(a):Math.ceil(a))/t,Math.min(Math.max(i,0),1);var i})(parseFloat(t[0]),t[1].trim())}}return r}const U=(t,e,n)=>-n*t+n*e+t,C=(t,e,n)=>e-t==0?1:(n-t)/(e-t);function F(t,e){const n=t[t.length-1];for(let a=1;a<=e;a++){const i=C(0,e,a);t.push(U(n,1,i))}}class W{constructor(t,e=[0,1],{easing:n=P.easing,duration:a=P.duration,delay:i=P.delay,endDelay:s=P.endDelay,repeat:o=P.repeat,offset:l,direction:c="normal"}={}){this.startTime=0,this.rate=1,this.t=0,this.cancelTimestamp=0,this.playState="idle",this.finished=new Promise(((t,e)=>{this.resolve=t,this.reject=e}));const u=a*(o+1);T(n)&&(n="ease");const h=function(t,e=function(t){const e=[0];return F(e,t-1),e}(t.length),n=r){const a=t.length,i=a-e.length;return i>0&&F(e,i),i=>{let r=0;for(;r<a-2&&!(i<e[r+1]);r++);let s=(o=C(e[r],e[r+1],i),Math.min(1,Math.max(o,0)));var o;const l=function(t,e){return w(t)?t[((t,e,n)=>{const a=e-0;return((n-0)%a+a)%a+0})(0,t.length,e)]:t}(n,r);return s=l(s),U(t[r],t[r+1],s)}}(e,l,w(n)?n.map(R):R(n));this.tick=e=>{this.pauseTime&&(e=this.pauseTime);let n=(e-this.startTime)*this.rate;this.t=n,n/=1e3,n=Math.max(n-i,0),"finished"===this.playState&&(n=u);const r=n/a;let o=Math.floor(r),l=r%1;!l&&r>=1&&(l=1),1===l&&o--;const f=o%2;("reverse"===c||"alternate"===c&&f||"alternate-reverse"===c&&!f)&&(l=1-l);const m=h(n>=u?1:Math.min(l,1));t(m),"finished"===this.playState||n>=u+s?(this.playState="finished",this.resolve(m)):"idle"!==this.playState&&requestAnimationFrame(this.tick)},this.play()}play(){const t=performance.now();this.playState="running",this.pauseTime?this.startTime=t-(this.pauseTime-this.startTime):this.startTime||(this.startTime=t),this.pauseTime=void 0,requestAnimationFrame(this.tick)}pause(){this.playState="paused",this.pauseTime=performance.now()}finish(){this.playState="finished",this.tick(0)}cancel(){this.playState="idle",this.tick(this.cancelTimestamp),this.reject(!1)}reverse(){this.rate*=-1}commitStyles(){this.cancelTimestamp=performance.now()}get currentTime(){return this.t}set currentTime(t){this.pauseTime||0===this.rate?this.pauseTime=t:this.startTime=performance.now()-t/this.rate}get playbackRate(){return this.rate}set playbackRate(t){this.rate=t}}function q(t){if(t)try{"finished"!==t.playState&&t.commitStyles(),t.cancel()}catch(t){}}function z(t,e,n,r={}){let s,{duration:l=P.duration,delay:c=P.delay,endDelay:f=P.endDelay,repeat:d=P.repeat,easing:k=P.easing,direction:A,offset:O,allowWebkitAcceleration:j=!1}=r;const D=a(t);let V=M.waapi(),$=i;const E=p(e);E&&((t,e)=>{o[e]&&(e=o[e]);const{transforms:n}=a(t);var i,r;r=e,-1===(i=n).indexOf(r)&&i.push(r),t.style.transform=(t=>t.sort(m).reduce(y,"").trim())(n)})(t,e);const R=function(t){return o[t]&&(t=o[t]),p(t)?h(t):t}(e),U=u.get(R);return q(D.animations[R]),()=>{const e=()=>{var e,n;return null!==(n=null!==(e=((t,e)=>{let n=g(e)?t.style.getPropertyValue(e):getComputedStyle(t)[e];if(!n&&0!==n){const t=u.get(e);t&&(n=t.initialValue)}return n})(t,R))&&void 0!==e?e:null==U?void 0:U.initialValue)&&void 0!==n?n:0};let a=function(t,e){for(let n=0;n<t.length;n++)null===t[n]&&(t[n]=n?t[n-1]:e());return t}((t=>Array.isArray(t)?t:[t])(n),e);if(T(k)){const t=k.createAnimation(a,e,E,R,D);k=t.easing,void 0!==t.keyframes&&(a=t.keyframes),void 0!==t.duration&&(l=t.duration)}if(g(R)?($=((t,e)=>n=>t.style.setProperty(e,n))(t,R),M.cssRegisterProperty()?function(t){if(!v.has(t)){v.add(t);try{const{syntax:e,initialValue:n}=u.has(t)?u.get(t):{};CSS.registerProperty({name:t,inherits:!1,syntax:e,initialValue:n})}catch(t){}}}(R):V=!1):$=((t,e)=>n=>t.style[e]=n)(t,R),V){U&&(a=a.map((t=>b(t)?U.toDefaultUnit(t):t))),M.partialKeyframes()||1!==a.length||a.unshift(e());const n={delay:S(c),duration:S(l),endDelay:S(f),easing:w(k)?void 0:x(k),direction:A,iterations:d+1,fill:"both"};s=t.animate({[R]:a,offset:O,easing:w(k)?k.map(x):void 0},n),s.finished||(s.finished=new Promise(((t,e)=>{s.onfinish=t,s.oncancel=e})));const r=a[a.length-1];s.finished.then((()=>{$(r),s.cancel()})).catch(i),j||(s.playbackRate=1.000001)}else if(E&&a.every(b)){if(1===a.length&&a.unshift(parseFloat(e())),U){const t=$;$=e=>t(U.toDefaultUnit(e))}s=new W($,a,Object.assign(Object.assign({},r),{duration:l,easing:k}))}else{const t=a[a.length-1];$(U&&b(t)?U.toDefaultUnit(t):t)}return D.animations[R]=s,null==s||s.finished.then((()=>{D.animations[R]=void 0,D.generators[R]=void 0,D.prevGeneratorState[R]=void 0})).catch(i),s}}const B=(t,e)=>t[e]?Object.assign(Object.assign({},t),t[e]):Object.assign({},t),G=t=>t(),K=t=>t.animations[0],X={get:(t,e)=>{var n,a;switch(e){case"duration":return t.duration;case"currentTime":let r=(null===(n=K(t))||void 0===n?void 0:n[e])||0;return r?r/1e3:0;case"playbackRate":return null===(a=K(t))||void 0===a?void 0:a[e];case"finished":return t.finished||(t.finished=Promise.all(t.animations.map(Y)).catch(i)),t.finished;case"stop":return()=>t.animations.forEach(q);default:return()=>t.animations.forEach((t=>t[e]()))}},set:(t,e,n)=>{switch(e){case"currentTime":n=S(n);case"currentTime":case"playbackRate":for(let a=0;a<t.animations.length;a++)t.animations[a][e]=n;return!0}return!1}},Y=t=>t.finished;function Z(t,e,n){return"function"==typeof t?t(e,n):t}function H(t,e,n={}){var a;const i=(t=function(t,e){return"string"==typeof t?t=document.querySelectorAll(t):t instanceof Element&&(t=[t]),Array.from(t)}(t)).length,r=[];for(let a=0;a<i;a++){const s=t[a];for(const t in e){const o=B(n,t);o.delay=Z(o.delay,a,i);const l=z(s,t,e[t],o);r.push(l)}}return s=r,o=null!==(a=n.duration)&&void 0!==a?a:P.duration,new Proxy({animations:s.map(G).filter(Boolean),duration:o},X);var s,o}var I=e.j;export{I as animate};

package/dist/targets/dom/animate-style.cjs.js

@@ -1,182 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var data = require('./data.cjs.js');
-var cssVar = require('./utils/css-var.cjs.js');
-var noop = require('../../utils/noop.cjs.js');
-var time = require('./utils/time.cjs.js');
-var transforms = require('./utils/transforms.cjs.js');
-var easing = require('./utils/easing.cjs.js');
-var featureDetection = require('./utils/feature-detection.cjs.js');
-var apply = require('./utils/apply.cjs.js');
-var NumberAnimation = require('../js/NumberAnimation.cjs.js');
-var keyframes = require('./utils/keyframes.cjs.js');
-var style = require('./style.cjs.js');
-var defaults = require('./utils/defaults.cjs.js');
-var getStyleName = require('./utils/get-style-name.cjs.js');
-var isNumber = require('../../utils/is-number.cjs.js');
-var stopAnimation = require('./utils/stop-animation.cjs.js');
-
-function animateStyle(element, key, keyframesDefinition, options = {}) {
-    let animation;
-    let { duration = defaults.defaults.duration, delay = defaults.defaults.delay, endDelay = defaults.defaults.endDelay, repeat = defaults.defaults.repeat, easing: easing$1 = defaults.defaults.easing, direction, offset, allowWebkitAcceleration = false, } = options;
-    const data$1 = data.getAnimationData(element);
-    let canAnimateNatively = featureDetection.supports.waapi();
-    let render = noop.noop;
-    const valueIsTransform = transforms.isTransform(key);
-    /**
-     * If this is an individual transform, we need to map its
-     * key to a CSS variable and update the element's transform style
-     */
-    valueIsTransform && transforms.addTransformToElement(element, key);
-    const name = getStyleName.getStyleName(key);
-    /**
-     * Get definition of value, this will be used to convert numerical
-     * keyframes into the default value type.
-     */
-    const definition = transforms.transformDefinitions.get(name);
-    /**
-     * Stop the current animation, if any. Because this will trigger
-     * commitStyles (DOM writes) and we might later trigger DOM reads,
-     * this is fired now and we return a factory function to create
-     * the actual animation that can get called in batch,
-     */
-    stopAnimation.stopAnimation(data$1.animations[name]);
-    /**
-     * Batchable factory function containing all DOM reads.
-     */
-    return () => {
-        const readInitialValue = () => { var _a, _b; return (_b = (_a = style.style.get(element, name)) !== null && _a !== void 0 ? _a : definition === null || definition === void 0 ? void 0 : definition.initialValue) !== null && _b !== void 0 ? _b : 0; };
-        /**
-         * Replace null values with the previous keyframe value, or read
-         * it from the DOM if it's the first keyframe.
-         */
-        let keyframes$1 = keyframes.hydrateKeyframes(keyframes.keyframesList(keyframesDefinition), readInitialValue);
-        if (easing.isCustomEasing(easing$1)) {
-            const custom = easing$1.createAnimation(keyframes$1, readInitialValue, valueIsTransform, name, data$1);
-            easing$1 = custom.easing;
-            if (custom.keyframes !== undefined)
-                keyframes$1 = custom.keyframes;
-            if (custom.duration !== undefined)
-                duration = custom.duration;
-        }
-        /**
-         * If this is a CSS variable we need to register it with the browser
-         * before it can be animated natively. We also set it with setProperty
-         * rather than directly onto the element.style object.
-         */
-        if (cssVar.isCssVar(name)) {
-            render = apply.cssVariableRenderer(element, name);
-            if (featureDetection.supports.cssRegisterProperty()) {
-                cssVar.registerCssVariable(name);
-            }
-            else {
-                canAnimateNatively = false;
-            }
-        }
-        else {
-            render = apply.styleRenderer(element, name);
-        }
-        /**
-         * If we can animate this value with WAAPI, do so. Currently this only
-         * feature detects CSS.registerProperty but could check WAAPI too.
-         */
-        if (canAnimateNatively) {
-            /**
-             * Convert numbers to default value types. Currently this only supports
-             * transforms but it could also support other value types.
-             */
-            if (definition) {
-                keyframes$1 = keyframes$1.map((value) => isNumber.isNumber(value) ? definition.toDefaultUnit(value) : value);
-            }
-            /**
-             * If this browser doesn't support partial/implicit keyframes we need to
-             * explicitly provide one.
-             */
-            if (!featureDetection.supports.partialKeyframes() && keyframes$1.length === 1) {
-                keyframes$1.unshift(readInitialValue());
-            }
-            const animationOptions = {
-                delay: time.ms(delay),
-                duration: time.ms(duration),
-                endDelay: time.ms(endDelay),
-                easing: !easing.isEasingList(easing$1) ? easing.convertEasing(easing$1) : undefined,
-                direction,
-                iterations: repeat + 1,
-                fill: "both",
-            };
-            animation = element.animate({
-                [name]: keyframes$1,
-                offset,
-                easing: easing.isEasingList(easing$1) ? easing$1.map(easing.convertEasing) : undefined,
-            }, animationOptions);
-            /**
-             * Polyfill finished Promise in browsers that don't support it
-             */
-            if (!animation.finished) {
-                animation.finished = new Promise((resolve, reject) => {
-                    animation.onfinish = resolve;
-                    animation.oncancel = reject;
-                });
-            }
-            const target = keyframes$1[keyframes$1.length - 1];
-            animation.finished
-                .then(() => {
-                // Apply styles to target
-                render(target);
-                // Ensure fill modes don't persist
-                animation.cancel();
-            })
-                .catch(noop.noop);
-            /**
-             * This forces Webkit to run animations on the main thread by exploiting
-             * this condition:
-             * https://trac.webkit.org/browser/webkit/trunk/Source/WebCore/platform/graphics/ca/GraphicsLayerCA.cpp?rev=281238#L1099
-             *
-             * This fixes Webkit's timing bugs, like accelerated animations falling
-             * out of sync with main thread animations and massive delays in starting
-             * accelerated animations in WKWebView.
-             */
-            if (!allowWebkitAcceleration)
-                animation.playbackRate = 1.000001;
-            /**
-             * If we can't animate the value natively then we can fallback to the numbers-only
-             * polyfill for transforms. All keyframes must be numerical.
-             */
-        }
-        else if (valueIsTransform && keyframes$1.every(isNumber.isNumber)) {
-            /**
-             * If we only have a single keyframe, we need to create an initial keyframe by reading
-             * the current value from the DOM.
-             */
-            if (keyframes$1.length === 1) {
-                keyframes$1.unshift(parseFloat(readInitialValue()));
-            }
-            if (definition) {
-                const applyStyle = render;
-                render = (v) => applyStyle(definition.toDefaultUnit(v));
-            }
-            animation = new NumberAnimation.NumberAnimation(render, keyframes$1, Object.assign(Object.assign({}, options), { duration,
-                easing: easing$1 }));
-        }
-        else {
-            const target = keyframes$1[keyframes$1.length - 1];
-            render(definition && isNumber.isNumber(target)
-                ? definition.toDefaultUnit(target)
-                : target);
-        }
-        data$1.animations[name] = animation;
-        /**
-         * When an animation finishes, delete the reference to the previous animation.
-         */
-        animation === null || animation === void 0 ? void 0 : animation.finished.then(() => {
-            data$1.animations[name] = undefined;
-            data$1.generators[name] = undefined;
-            data$1.prevGeneratorState[name] = undefined;
-        }).catch(noop.noop);
-        return animation;
-    };
-}
-
-exports.animateStyle = animateStyle;