{"bugs":{"url":"https://github.com/raxjs/universal-api/issues"},"dist":{"shasum":"2e682fcf91d11eb992af53f15cbeaeb24eef3a65","tarball":"https://registry.npmjs.org/universal-transition/-/universal-transition-1.1.1-0.tgz","fileCount":12,"integrity":"sha512-jwxKi7DJ1tTK3rPDiPv4tWO7SXzO+8vBicDd+7GnPMVlFH2sqIlg7yF/5aY6aywzOTjCvY6gVCannQmjIH6Q7w==","signatures":[{"sig":"MEQCIC0bpsxOwIAw9InEySGvMHE65OfYach+xoGToR8xbtO/AiASloCq2g0oLjJJ43vffOwB+4RQisTMKxiH9hYzcVB8Yw==","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":15964,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJewpjyCRA9TVsSAnZWagAAvzsQAJ4tq87yauy3xtKCfiha\nncrSTkeq1qxxWDxeXQ3YMBWtLl6NRPdmFXItw4XE3EjEoIUvv6hVSz6Ns0OJ\nkxcATojJkIpWGu2h4KQoPekYG1fX3t8nXjHztF+C+kDylfX8DElpxgGiu6Go\nPE6nEgj93NRCgyE7PKATiNzIHImkwA1xCNo7fRVYiW8/HytDwm/yzhbCy6Yg\nhMGVUgzYq/ZYb5Tt/Icbo6jOX435ArUwCR60gSRQUTWa3QOd0AUjKeSRfIOe\nKzhYaT/yQ8YcSDcleY9ueDJ8InDdCVhHNOwKvsf1vOoQvb1jBKqCxx6TA6wa\nW2t/dwEv9LriF3jXIY55c+fEq5N7kpyCpcIKYtq83SElHeKw2L3e/RIU2mh7\nC5xOGxgPH3zcXpR6ZLtOF5TeEvpmHMoHiSx666lnR4h5x+G4dx82ZyKXs+io\nwC4v0NyHLe+uuOat0SXP4H98cUaayG6obKeT2eHxPj3eAXfD3kimwO4ykuNe\nJXPUl+cQFdXDsNWOpHcd4RA65lKpIdUOBuwkrBu/JYreiF8ArVhjxxQl1k3N\n0418SSgFbqpW6DKuiK+JveBHUMNPXhNTZwUdZwLrQRnIbUYsjjNkC/lNpwaM\nU6LB2BbQqJerj1rI9LXbUJxQz1xnOt2EVnT02x64nN3WGpBgx0dKSvN6+vQ5\nXUae\r\n=1ZtX\r\n-----END PGP SIGNATURE-----\r\n"},"main":"lib/index.js","name":"universal-transition","readme":"# universal-transition [![npm](https://img.shields.io/npm/v/universal-transition.svg)](https://www.npmjs.com/package/universal-transition)\n\nUsed to create transition animation.\n\n## Supported\n\n<img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"wechatMiniprogram\" src=\"https://img.alicdn.com/tfs/TB1slcYdxv1gK0jSZFFXXb0sXXa-200-200.svg\" width=\"25px\" height=\"25px\"> <img alt=\"bytedanceMicroApp\" src=\"https://gw.alicdn.com/tfs/TB1jFtVzO_1gK0jSZFqXXcpaXXa-200-200.svg\" width=\"25px\" height=\"25px\">\n\n## Install\n\n```bash\n$ npm install universal-transition --save\n```\n\n## Usage\n\n```js\nimport transition from 'universal-transition';\n\ntransition(document.querySelector('#box'), {\n  transform: 'translate(10px, 20px) scale(1.5, 1.5) rotate(90deg)',\n  opacity: '0.5'\n}, {\n  timingFunction: 'ease',\n  delay: 0,\n  duration: 1000\n}, function() {\n  console.log('animation end');\n});\n```\n\n## Methods\n\n### `transition(domNode, styles, options, callback)`\n\n#### Supported\n\n<img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"miniApp\" src=\"https://gw.alicdn.com/tfs/TB1bBpmbRCw3KVjSZFuXXcAOpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"wechatMiniprogram\" src=\"https://img.alicdn.com/tfs/TB1slcYdxv1gK0jSZFFXXb0sXXa-200-200.svg\" width=\"25px\" height=\"25px\"> __icon_miniapp_bytedance__\n\n#### Arguments\n\n| Property | Type | Description | Required | Default | Supported |\n| --- | --- | --- | --- | --- |  --- |\n| domNode | `DOMNode`  | Specified element，mini app does not support，see below for details[mini app instructions] | yes | - |  <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> |\n| styles | `object`  | See below for details | yes | - |   |\n| options | `Object`  | options，See below for details | no | - |   |\n| callback | `function`  |  Triggered after the animation is complete，mini app does not support | no | - | <img alt=\"browser\" src=\"https://gw.alicdn.com/tfs/TB1uYFobGSs3KVjSZPiXXcsiVXa-200-200.svg\" width=\"25px\" height=\"25px\" /> <img alt=\"weex\" src=\"https://gw.alicdn.com/tfs/TB1jM0ebMaH3KVjSZFjXXcFWpXa-200-200.svg\" width=\"25px\" height=\"25px\" /> |\n\nThe properties listed below are supported for each environment, and the properties not listed are not guaranteed for each environment.\n\nstyles supported attributes and situation description：\n\n| Property | Type | Description | Default |\n| --- | --- | --- | --- |\n| styles.backgroundColor |  `color` | background color | - |\n| styles.height | `length` | Length value | - |\n| styles.width | `length` | Length value | - |\n| styles.opacity | `number` | Opacity 0-1 | - |\n| styles.transform | `string` | transform type，see below for details | - |\n\nstyles.transform supported attributes：\n\n| Property | Type | Description | Default |\n| --- | --- | --- | --- |\n| translate、translateX、translateY | `number | percentage` | Specify where the element is moved to | 0 |\n| rotate、rotateX、rotateY | `angle` | Specifies the angle at which the element is deflected | 0 |\n| scale、scaleX、scaleY| `number` | Specify multiples of zoomed in and out elements | 1 |\n\noptions：\n\n| Property | Type | Description | Default |\n| --- | --- | --- | --- |\n| options.timingFunction |  `string` | Animation effect，valid values are：\"linear\",\"ease\",\"ease-in\",\"ease-in-out\",\"ease-out\"(Unlisted values, there may be compatibility issues) | ease |\n| options.delay |  `number` | Animation delay time | 0 |\n| options.duration |  `number` | Animation duration | 0 |\n\n#### Return\n\nMini app return `export()`，other cases return `undefined`\n\n## Mini app instructions：\n\nBecause the mini app can't provide `DOMNode`, and use animation way is different. So the mini app needs to get the animation content by the `export()` method and then manually bind to the element.\n\n### Usage\n\n```html\n<view animation=\"{{transitionInfo}}\"></view>\n```\n```javascript\nPage({\n  data: {\n    transitionInfo: null,\n  },\n  onShow(){\n    const transitionInfo = transition(null, {\n      transform: 'translate(10px, 20px) scale(1.5, 1.5) rotate(90deg)',\n      opacity: '0.5'\n    }, {\n      timingFunction: 'ease',\n      delay: 0,\n      duration: 1000\n    });\n\n    this.setData({\n      transitionInfo: transitionInfo.export()\n    });\n  }\n})\n```\n","engines":{"npm":">=3.0.0"},"license":"BSD-3-Clause","scripts":{"build":"build-scripts build","start":"build-scripts start"},"_npmUser":{"name":"rax-publisher","email":"rax-public@alibaba-inc.com"},"homepage":"https://github.com/raxjs/universal-api#readme","keywords":["Rax"],"pre-commit":["lint"],"repository":{"url":"git+https://github.com/raxjs/universal-api.git","type":"git"},"_npmVersion":"6.14.4","description":"A universal transition API.","directories":{},"maintainers":[{"name":"balloonzzq","email":"zqzhuang888@qq.com"},{"name":"rax-publisher","email":"rax-public@alibaba-inc.com"},{"name":"wintercn","email":"csf178@gmail.com"},{"name":"yuanyan","email":"yuanyan.cao@gmail.com"},{"name":"zeroling","email":"wssgcg1213@qq.com"}],"_nodeVersion":"10.16.0","dependencies":{"style-unit":"^2.0.0","universal-env":"^3.0.0","universal-device":"^1.0.3","universal-unit-tool":"^1.0.0"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"rax":"^1.0.8","pre-commit":"^1.2.2","@alib/build-scripts":"^0.1.0","build-plugin-rax-component":"^0.1.0"},"_npmOperationalInternal":{"tmp":"tmp/universal-transition_1.1.1-0_1589811441892_0.21814831674347923","host":"s3://npm-registry-packages"},"_id":"universal-transition@1.1.1-0","version":"1.1.1-0"}