index.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. 'use strict';
  2. exports.__esModule = true;
  3. var _has = require('has');
  4. var _has2 = _interopRequireDefault(_has);
  5. var _postcss = require('postcss');
  6. var _postcss2 = _interopRequireDefault(_postcss);
  7. var _postcssValueParser = require('postcss-value-parser');
  8. var _postcssValueParser2 = _interopRequireDefault(_postcssValueParser);
  9. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  10. function getValues(list, _ref, index) {
  11. var value = _ref.value;
  12. if (index % 2 === 0) {
  13. return [].concat(list, [parseFloat(value)]);
  14. }
  15. return list;
  16. }
  17. function matrix3d(node, values) {
  18. // matrix3d(a, b, 0, 0, c, d, 0, 0, 0, 0, 1, 0, tx, ty, 0, 1) => matrix(a, b, c, d, tx, ty)
  19. if (values[15] && values[2] === 0 && values[3] === 0 && values[6] === 0 && values[7] === 0 && values[8] === 0 && values[9] === 0 && values[10] === 1 && values[11] === 0 && values[14] === 0 && values[15] === 1) {
  20. var nodes = node.nodes;
  21. node.value = 'matrix';
  22. node.nodes = [nodes[0], // a
  23. nodes[1], // ,
  24. nodes[2], // b
  25. nodes[3], // ,
  26. nodes[8], // c
  27. nodes[9], // ,
  28. nodes[10], // d
  29. nodes[11], // ,
  30. nodes[24], // tx
  31. nodes[25], // ,
  32. nodes[26]];
  33. }
  34. }
  35. var rotate3dMappings = [['rotateX', [1, 0, 0]], // rotate3d(1, 0, 0, a) => rotateX(a)
  36. ['rotateY', [0, 1, 0]], // rotate3d(0, 1, 0, a) => rotateY(a)
  37. ['rotate', [0, 0, 1]]];
  38. function rotate3dMatch(values) {
  39. return values.reduce(function (list, arg, i) {
  40. return list.filter(function (value) {
  41. return value[1][i] === arg;
  42. });
  43. }, rotate3dMappings);
  44. }
  45. function rotate3d(node, values) {
  46. var nodes = node.nodes;
  47. if (!nodes[6]) {
  48. return;
  49. }
  50. var match = rotate3dMatch(values.slice(0, 3));
  51. if (match.length) {
  52. node.value = match[0][0];
  53. node.nodes = [nodes[6]];
  54. }
  55. }
  56. function rotateZ(node) {
  57. // rotateZ(rz) => rotate(rz)
  58. node.value = 'rotate';
  59. }
  60. function scale(node, values) {
  61. var nodes = node.nodes;
  62. if (!nodes[2]) {
  63. return;
  64. }
  65. var first = values[0];
  66. var second = values[1];
  67. // scale(sx, sy) => scale(sx)
  68. if (first === second) {
  69. node.nodes = [nodes[0]];
  70. return;
  71. }
  72. // scale(sx, 1) => scaleX(sx)
  73. if (second === 1) {
  74. node.value = 'scaleX';
  75. node.nodes = [nodes[0]];
  76. return;
  77. }
  78. // scale(1, sy) => scaleY(sy)
  79. if (first === 1) {
  80. node.value = 'scaleY';
  81. node.nodes = [nodes[2]];
  82. return;
  83. }
  84. }
  85. function scale3d(node, values) {
  86. var nodes = node.nodes;
  87. if (!nodes[4]) {
  88. return;
  89. }
  90. var first = values[0];
  91. var second = values[1];
  92. var third = values[2];
  93. // scale3d(sx, 1, 1) => scaleX(sx)
  94. if (second === 1 && third === 1) {
  95. node.value = 'scaleX';
  96. node.nodes = [nodes[0]];
  97. return;
  98. }
  99. // scale3d(1, sy, 1) => scaleY(sy)
  100. if (first === 1 && third === 1) {
  101. node.value = 'scaleY';
  102. node.nodes = [nodes[2]];
  103. return;
  104. }
  105. // scale3d(1, 1, sz) => scaleZ(sz)
  106. if (first === 1 && second === 1) {
  107. node.value = 'scaleZ';
  108. node.nodes = [nodes[4]];
  109. return;
  110. }
  111. }
  112. function translate(node, values) {
  113. var nodes = node.nodes;
  114. if (!nodes[2]) {
  115. return;
  116. }
  117. // translate(tx, 0) => translate(tx)
  118. if (values[1] === 0) {
  119. node.nodes = [nodes[0]];
  120. return;
  121. }
  122. // translate(0, ty) => translateY(ty)
  123. if (values[0] === 0) {
  124. node.value = 'translateY';
  125. node.nodes = [nodes[2]];
  126. return;
  127. }
  128. }
  129. function translate3d(node, values) {
  130. var nodes = node.nodes;
  131. // translate3d(0, 0, tz) => translateZ(tz)
  132. if (nodes[4] && values[0] === 0 && values[1] === 0) {
  133. node.value = 'translateZ';
  134. node.nodes = [nodes[4]];
  135. }
  136. }
  137. var reducers = {
  138. matrix3d: matrix3d,
  139. rotate3d: rotate3d,
  140. rotateZ: rotateZ,
  141. scale: scale,
  142. scale3d: scale3d,
  143. translate: translate,
  144. translate3d: translate3d
  145. };
  146. function reduce(node) {
  147. var nodes = node.nodes;
  148. var type = node.type;
  149. var value = node.value;
  150. if (type === 'function' && (0, _has2.default)(reducers, value)) {
  151. reducers[value](node, nodes.reduce(getValues, []));
  152. }
  153. return false;
  154. }
  155. exports.default = _postcss2.default.plugin('postcss-reduce-transforms', function () {
  156. return function (css) {
  157. css.walkDecls(/transform$/, function (decl) {
  158. decl.value = (0, _postcssValueParser2.default)(decl.value).walk(reduce).toString();
  159. });
  160. };
  161. });
  162. module.exports = exports['default'];