processor.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322
  1. (function() {
  2. var OLD_DIRECTION, Processor, SIZES, Value, utils, vendor;
  3. vendor = require('postcss/lib/vendor');
  4. Value = require('./value');
  5. utils = require('./utils');
  6. OLD_DIRECTION = /(^|[^-])(linear|radial)-gradient\(\s*(top|left|right|bottom)/i;
  7. SIZES = ['width', 'height', 'min-width', 'max-width', 'min-height', 'max-height', 'inline-size', 'min-inline-size', 'max-inline-size', 'block-size', 'min-block-size', 'max-block-size'];
  8. Processor = (function() {
  9. function Processor(prefixes) {
  10. this.prefixes = prefixes;
  11. }
  12. Processor.prototype.add = function(css, result) {
  13. var keyframes, resolution, supports, viewport;
  14. resolution = this.prefixes.add['@resolution'];
  15. keyframes = this.prefixes.add['@keyframes'];
  16. viewport = this.prefixes.add['@viewport'];
  17. supports = this.prefixes.add['@supports'];
  18. css.walkAtRules((function(_this) {
  19. return function(rule) {
  20. if (rule.name === 'keyframes') {
  21. if (!_this.disabled(rule)) {
  22. return keyframes != null ? keyframes.process(rule) : void 0;
  23. }
  24. } else if (rule.name === 'viewport') {
  25. if (!_this.disabled(rule)) {
  26. return viewport != null ? viewport.process(rule) : void 0;
  27. }
  28. } else if (rule.name === 'supports') {
  29. if (_this.prefixes.options.supports !== false && !_this.disabled(rule)) {
  30. return supports.process(rule);
  31. }
  32. } else if (rule.name === 'media' && rule.params.indexOf('-resolution') !== -1) {
  33. if (!_this.disabled(rule)) {
  34. return resolution != null ? resolution.process(rule) : void 0;
  35. }
  36. }
  37. };
  38. })(this));
  39. css.walkRules((function(_this) {
  40. return function(rule) {
  41. var j, len, ref, results, selector;
  42. if (_this.disabled(rule)) {
  43. return;
  44. }
  45. ref = _this.prefixes.add.selectors;
  46. results = [];
  47. for (j = 0, len = ref.length; j < len; j++) {
  48. selector = ref[j];
  49. results.push(selector.process(rule, result));
  50. }
  51. return results;
  52. };
  53. })(this));
  54. css.walkDecls((function(_this) {
  55. return function(decl) {
  56. var display, prefixer;
  57. if (_this.disabled(decl)) {
  58. return;
  59. }
  60. if (decl.prop === 'display' && decl.value === 'box') {
  61. result.warn('You should write display: flex by final spec ' + 'instead of display: box', {
  62. node: decl
  63. });
  64. return;
  65. }
  66. if (decl.value.indexOf('linear-gradient') !== -1) {
  67. if (OLD_DIRECTION.test(decl.value)) {
  68. result.warn('Gradient has outdated direction syntax. ' + 'New syntax is like `to left` instead of `right`.', {
  69. node: decl
  70. });
  71. }
  72. }
  73. if (decl.prop === 'text-emphasis-position') {
  74. if (decl.value === 'under' || decl.value === 'over') {
  75. result.warn('You should use 2 values for text-emphasis-position ' + 'For example, `under left` instead of just `under`.', {
  76. node: decl
  77. });
  78. }
  79. }
  80. if (SIZES.indexOf(decl.prop) !== -1) {
  81. if (decl.value.indexOf('fill-available') !== -1) {
  82. result.warn('Replace fill-available to stretch, ' + 'because spec had been changed', {
  83. node: decl
  84. });
  85. } else if (decl.value.indexOf('fill') !== -1) {
  86. result.warn('Replace fill to stretch, because spec had been changed', {
  87. node: decl
  88. });
  89. }
  90. }
  91. if (_this.prefixes.options.flexbox !== false) {
  92. if (decl.prop === 'grid-row-end' && decl.value.indexOf('span') === -1) {
  93. result.warn('IE supports only grid-row-end with span. ' + 'You should add grid: false option to Autoprefixer ' + 'and use some JS grid polyfill for full spec support', {
  94. node: decl
  95. });
  96. }
  97. if (decl.prop === 'grid-row') {
  98. if (decl.value.indexOf('/') !== -1 && decl.value.indexOf('span') === -1) {
  99. result.warn('IE supports only grid-row with / and span. ' + 'You should add grid: false option to Autoprefixer ' + 'and use some JS grid polyfill for full spec support', {
  100. node: decl
  101. });
  102. }
  103. }
  104. }
  105. if (decl.prop === 'transition' || decl.prop === 'transition-property') {
  106. return _this.prefixes.transition.add(decl, result);
  107. } else if (decl.prop === 'align-self') {
  108. display = _this.displayType(decl);
  109. if (display !== 'grid' && _this.prefixes.options.flexbox !== false) {
  110. prefixer = _this.prefixes.add['align-self'];
  111. if (prefixer && prefixer.prefixes) {
  112. prefixer.process(decl);
  113. }
  114. }
  115. if (display !== 'flex' && _this.prefixes.options.grid !== false) {
  116. prefixer = _this.prefixes.add['grid-row-align'];
  117. if (prefixer && prefixer.prefixes) {
  118. return prefixer.process(decl);
  119. }
  120. }
  121. } else {
  122. prefixer = _this.prefixes.add[decl.prop];
  123. if (prefixer && prefixer.prefixes) {
  124. return prefixer.process(decl);
  125. }
  126. }
  127. };
  128. })(this));
  129. return css.walkDecls((function(_this) {
  130. return function(decl) {
  131. var j, len, ref, unprefixed, value;
  132. if (_this.disabled(decl)) {
  133. return;
  134. }
  135. unprefixed = _this.prefixes.unprefixed(decl.prop);
  136. ref = _this.prefixes.values('add', unprefixed);
  137. for (j = 0, len = ref.length; j < len; j++) {
  138. value = ref[j];
  139. value.process(decl, result);
  140. }
  141. return Value.save(_this.prefixes, decl);
  142. };
  143. })(this));
  144. };
  145. Processor.prototype.remove = function(css) {
  146. var checker, j, len, ref, resolution;
  147. resolution = this.prefixes.remove['@resolution'];
  148. css.walkAtRules((function(_this) {
  149. return function(rule, i) {
  150. if (_this.prefixes.remove['@' + rule.name]) {
  151. if (!_this.disabled(rule)) {
  152. return rule.parent.removeChild(i);
  153. }
  154. } else if (rule.name === 'media' && rule.params.indexOf('-resolution') !== -1) {
  155. return resolution != null ? resolution.clean(rule) : void 0;
  156. }
  157. };
  158. })(this));
  159. ref = this.prefixes.remove.selectors;
  160. for (j = 0, len = ref.length; j < len; j++) {
  161. checker = ref[j];
  162. css.walkRules((function(_this) {
  163. return function(rule, i) {
  164. if (checker.check(rule)) {
  165. if (!_this.disabled(rule)) {
  166. return rule.parent.removeChild(i);
  167. }
  168. }
  169. };
  170. })(this));
  171. }
  172. return css.walkDecls((function(_this) {
  173. return function(decl, i) {
  174. var k, len1, notHack, ref1, ref2, rule, unprefixed;
  175. if (_this.disabled(decl)) {
  176. return;
  177. }
  178. rule = decl.parent;
  179. unprefixed = _this.prefixes.unprefixed(decl.prop);
  180. if (decl.prop === 'transition' || decl.prop === 'transition-property') {
  181. _this.prefixes.transition.remove(decl);
  182. }
  183. if ((ref1 = _this.prefixes.remove[decl.prop]) != null ? ref1.remove : void 0) {
  184. notHack = _this.prefixes.group(decl).down(function(other) {
  185. return _this.prefixes.normalize(other.prop) === unprefixed;
  186. });
  187. if (unprefixed === 'flex-flow') {
  188. notHack = true;
  189. }
  190. if (notHack && !_this.withHackValue(decl)) {
  191. if (decl.raw('before').indexOf("\n") > -1) {
  192. _this.reduceSpaces(decl);
  193. }
  194. rule.removeChild(i);
  195. return;
  196. }
  197. }
  198. ref2 = _this.prefixes.values('remove', unprefixed);
  199. for (k = 0, len1 = ref2.length; k < len1; k++) {
  200. checker = ref2[k];
  201. if (checker.check(decl.value)) {
  202. unprefixed = checker.unprefixed;
  203. notHack = _this.prefixes.group(decl).down(function(other) {
  204. return other.value.indexOf(unprefixed) !== -1;
  205. });
  206. if (notHack) {
  207. rule.removeChild(i);
  208. return;
  209. } else if (checker.clean) {
  210. checker.clean(decl);
  211. return;
  212. }
  213. }
  214. }
  215. };
  216. })(this));
  217. };
  218. Processor.prototype.withHackValue = function(decl) {
  219. return decl.prop === '-webkit-background-clip' && decl.value === 'text';
  220. };
  221. Processor.prototype.disabled = function(node) {
  222. var other, status;
  223. if (this.prefixes.options.grid === false && node.type === 'decl') {
  224. if (node.prop === 'display' && node.value.indexOf('grid') !== -1) {
  225. return true;
  226. }
  227. if (node.prop.indexOf('grid') !== -1 || node.prop === 'justify-items') {
  228. return true;
  229. }
  230. }
  231. if (this.prefixes.options.flexbox === false && node.type === 'decl') {
  232. if (node.prop === 'display' && node.value.indexOf('flex') !== -1) {
  233. return true;
  234. }
  235. other = ['order', 'justify-content', 'align-items', 'align-content'];
  236. if (node.prop.indexOf('flex') !== -1 || other.indexOf(node.prop) !== -1) {
  237. return true;
  238. }
  239. }
  240. if (node._autoprefixerDisabled != null) {
  241. return node._autoprefixerDisabled;
  242. } else if (node.nodes) {
  243. status = void 0;
  244. node.each(function(i) {
  245. if (i.type !== 'comment') {
  246. return;
  247. }
  248. if (/(!\s*)?autoprefixer:\s*off/i.test(i.text)) {
  249. status = false;
  250. return false;
  251. } else if (/(!\s*)?autoprefixer:\s*on/i.test(i.text)) {
  252. status = true;
  253. return false;
  254. }
  255. });
  256. return node._autoprefixerDisabled = status != null ? !status : node.parent ? this.disabled(node.parent) : false;
  257. } else if (node.parent) {
  258. return node._autoprefixerDisabled = this.disabled(node.parent);
  259. } else {
  260. return false;
  261. }
  262. };
  263. Processor.prototype.reduceSpaces = function(decl) {
  264. var diff, parts, prevMin, stop;
  265. stop = false;
  266. this.prefixes.group(decl).up(function(other) {
  267. return stop = true;
  268. });
  269. if (stop) {
  270. return;
  271. }
  272. parts = decl.raw('before').split("\n");
  273. prevMin = parts[parts.length - 1].length;
  274. diff = false;
  275. return this.prefixes.group(decl).down(function(other) {
  276. var last;
  277. parts = other.raw('before').split("\n");
  278. last = parts.length - 1;
  279. if (parts[last].length > prevMin) {
  280. if (diff === false) {
  281. diff = parts[last].length - prevMin;
  282. }
  283. parts[last] = parts[last].slice(0, -diff);
  284. return other.raws.before = parts.join("\n");
  285. }
  286. });
  287. };
  288. Processor.prototype.displayType = function(decl) {
  289. var i, j, len, ref;
  290. ref = decl.parent.nodes;
  291. for (j = 0, len = ref.length; j < len; j++) {
  292. i = ref[j];
  293. if (i.prop === 'display') {
  294. if (i.value.indexOf('flex') !== -1) {
  295. return 'flex';
  296. } else if (i.value.indexOf('grid') !== -1) {
  297. return 'grid';
  298. }
  299. }
  300. }
  301. return false;
  302. };
  303. return Processor;
  304. })();
  305. module.exports = Processor;
  306. }).call(this);