{"bugs":{"url":"https://github.com/raxjs/universal-api/issues"},"dist":{"shasum":"33803430ebded43a4548986fcee03edca9b9a715","tarball":"https://registry.npmjs.org/universal-transition/-/universal-transition-1.0.1-beta.3.tgz","fileCount":28,"integrity":"sha512-FA5jfhuWKoPnM5V1dtPqS8JBBEnsmasNQu4jsEMo87N35KOC39AAP94ryWJErsPDhf1gyDdBsxhhviky/M/9+w==","signatures":[{"sig":"MEUCIQDK/P82odZb7vf3keZn/Z3VCzW41Hef/aXYnnT+K8nvzAIgWsbv3x7rLv2ozVG5gMylG0o2YCiFjFepeUPnlwCSPnA=","keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA"}],"unpackedSize":27667,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdwSTUCRA9TVsSAnZWagAA4p8QAJ6EeJeQNTqcZ4A1lyoW\njiG3S1y3obJunyOOVSrqqEtNmkTy/w556DMKx9zeR70+JU5PRJGWaS+uf33I\nhQtAFRva8RYA+guiC+3VWa/zpKPQF3ajvgiX1q8gmj4rZuxlzdv0OBxQOUps\nGRT86qPTrxz0tnIeTM9xKJaHWuMRl1bH0KyrWwYnpvey6ExqzOrOV3ogcSgU\nvxYefqL5JBBXKNE+tFK+YJ6fhPJ1jSG80nnMY348+NcnYpFMB3wctnBQUT/3\n/z6d2hRT/vlZLGHp6fQvUelSbk2/o7By0cFRIDEVdNH5y4sNKKit2rZDvbz5\nsTr8TowY9sRSuRzu1ZQ8cDvRa7JRMAe2VS0VpKoJofn7NnHS8bNZ1g1Fdrv3\nJGgH6py43da6a3E6CpZnPRFP4vIsmLM4HHZqD7hs8j8QMiQZB66fP1fJiob0\nIbjwkzskK52++TV3/3O5FxrSASNOhcorvbe3gNGXcvwG04vqTUotGrIMzwoG\nLSlSbbzKyBf3DS552+P/ec/lLdAsU3i/HhDf4iLAis8VtEmHNmIOPPnioXBM\nd0aHqxOb/QRgo8pUL+bnisiZZ6npneHaAlvpVQihAt/IkcBhJ1rsPWCCcTnf\nrX2a4kUonxz9rezO8rzcEgewg52o5btjWkblwcKzXqZ2fuEaSID2tVoWtdz1\nNjqD\r\n=NOFj\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```","license":"BSD-3-Clause","scripts":{"lint":"eslint --ext .js --ext .jsx --ext .ts --ext .tsx ./src","test":"rax-scripts test","build":"rax-scripts build","start":"rax-scripts start","prebuild":"npm run lint && npm run test","prepublish":"npm run build"},"_npmUser":{"name":"balloonzzq","email":"zqzhuang888@qq.com"},"homepage":"https://github.com/raxjs/universal-api#readme","keywords":["universal"],"pre-commit":["lint","test"],"repository":{"url":"git+https://github.com/raxjs/universal-api.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":"^2.0.0","universal-env":"^2.0.0"},"_hasShrinkwrap":false,"readmeFilename":"README.md","devDependencies":{"rax":"^1.0.8","eslint":"5.15.1","pre-commit":"^1.2.2","@types/jest":"^24.0.18","rax-scripts":"^2.0.0","babel-eslint":"^10.0.2","eslint-config-rax":"^0.0.0","eslint-plugin-react":"^7.12.4","eslint-plugin-import":"^2.18.2","rax-plugin-component":"^0.1.9","@typescript-eslint/parser":"^1.7.0","@typescript-eslint/eslint-plugin":"^1.7.0"},"_npmOperationalInternal":{"tmp":"tmp/universal-transition_1.0.1-beta.3_1572938964377_0.9040103301551328","host":"s3://npm-registry-packages"},"_id":"universal-transition@1.0.1-beta.3","version":"1.0.1-beta.3"}