{"bugs":{"url":"https://github.com/alibaba/rax/issues"},"dist":{"shasum":"8c42dca40b925c9b0dc44b595460aea79d2b4e23","tarball":"https://registry.npmjs.org/universal-transition/-/universal-transition-1.0.0-beta.3.tgz","fileCount":13,"integrity":"sha512-rTyul5mY001zVV8adZ0XhjWLkyyYWJFvsDYTuqnVN8JrXKvAuCFyW2GTBRiIJ6CTi2J1v3YIwcDE4awjUV2oEA==","signatures":[{"sig":"MEYCIQDVvDhrEmK54ZaDuEvmh60/iI0cvYiFdI6bFbqC8VnawQIhAMS8GBWY4gU1bp6fLrCjqWhYuB3Gdc90DA+hP+q6gof/","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":25156,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdSTvlCRA9TVsSAnZWagAAP2cQAJCTLEjZD718Z9ijLCpL\nowArfCPU++DfSJjxkedqT4jPvf/QrNZ0en7wTrANjXqsF6P0LmQMsNRb31t2\nkvzLikeSYwhM2Y538Da+3A+NOhy3fv8yR7NSnN243Yb8efmnbyx/zCuF5/JT\nMqXnybC/3mi3UNBnFNUgorYP75yXF0my3E41Fo6IlKFsdvVq0vQiWwLBxM5C\no57y4quGG3Ax96ZXuH3bAKsBS3LyHJOvAir/5U4XkjrwDj8Q5D/6UTx1lQOe\n2uYhoEcA7ngxTlUctnZpJFaprz3mA6T+LsoNDWo82oZAfl8O7P/Tuv4G34Pw\nOZRT9TtpVZ2hPdeVVXeU3XS4JGAKHmI995sWXb9puNOV28oS/L80tRQEsR5I\nxiK4uaRTZB4433D8gV+7waxtsTw7msP6FFvI83YBqSK0tcO7MMZg48l7+sK2\nT7soNvt4IoC9eLMZ7Yy4srI3C2Mw//szrD8SD/CZ8hXHN/uzLi3qVc7ai+hU\nHQyi91trnuWpkXEf0McLJLfJO30XLtS+3dpvfyE/cnQM556ewaaTi4t+LkRJ\nqWgwJxmiX8AoVo9sVDi5MlkBZrHJDiMLBAy0/ZC49FW4lyBFCo+Ow/hkhonD\nnU7bGgRUWQl1WMGIIPVRUI2ReGditplFlOcVbYZ0e2Kd3S+oRzqOIL1X5zTX\nKwiC\r\n=ITnk\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\" />\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\" />\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```","gitHead":"61a3bf4e3404947cd448aff0aa92db538f32287f","license":"BSD-3-Clause","scripts":{"lint":"eslint --ext .js --ext .jsx ./src","test":"rax-scripts test","build":"rax-scripts build --type 'component'","start":"rax-scripts start --type 'component' -p 8000","prebuild":"npm run lint && npm run test","prepublish":"npm run build"},"_npmUser":{"name":"balloonzzq","email":"zqzhuang888@qq.com"},"homepage":"https://github.com/alibaba/rax#readme","keywords":["universal"],"pre-commit":["lint","test"],"repository":{"url":"git+https://github.com/raxjs/universal-transition.git","type":"git"},"_npmVersion":"6.10.1","description":"A universal transition API.","directories":{},"maintainers":[{"name":"balloonzzq","email":"zqzhuang888@qq.com"},{"name":"wintercn","email":"csf178@gmail.com"},{"name":"yacheng","email":"narutosun2@163.com"},{"name":"yuanyan","email":"yuanyan.cao@gmail.com"},{"name":"zeroling","email":"wssgcg1213@qq.com"}],"_nodeVersion":"9.11.1","dependencies":{"style-unit":"^0.6.5","universal-env":"^1.0.1"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"rax":"0.6.7","debug":"^4.1.1","eslint":"^6.1.0","pre-commit":"^1.2.2","rax-scripts":"^1.3.10","babel-eslint":"^10.0.2","eslint-config-rax":"^0.0.0","eslint-plugin-react":"^7.12.4","eslint-plugin-import":"^2.18.2"},"_npmOperationalInternal":{"tmp":"tmp/universal-transition_1.0.0-beta.3_1565080549186_0.8216273843648527","host":"s3://npm-registry-packages"},"_id":"universal-transition@1.0.0-beta.3","version":"1.0.0-beta.3"}