1 | "use strict";
|
---|
2 |
|
---|
3 | function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
|
---|
4 |
|
---|
5 | function _createForOfIteratorHelperLoose(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; return function () { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } it = o[Symbol.iterator](); return it.next.bind(it); }
|
---|
6 |
|
---|
7 | function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
---|
8 |
|
---|
9 | function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
---|
10 |
|
---|
11 | function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
---|
12 |
|
---|
13 | function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _defaults(subClass, superClass); }
|
---|
14 |
|
---|
15 | function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
---|
16 |
|
---|
17 | var parser = require('postcss-value-parser');
|
---|
18 |
|
---|
19 | var range = require('normalize-range');
|
---|
20 |
|
---|
21 | var OldValue = require('../old-value');
|
---|
22 |
|
---|
23 | var Value = require('../value');
|
---|
24 |
|
---|
25 | var utils = require('../utils');
|
---|
26 |
|
---|
27 | var IS_DIRECTION = /top|left|right|bottom/gi;
|
---|
28 |
|
---|
29 | var Gradient = /*#__PURE__*/function (_Value) {
|
---|
30 | _inheritsLoose(Gradient, _Value);
|
---|
31 |
|
---|
32 | function Gradient() {
|
---|
33 | var _this;
|
---|
34 |
|
---|
35 | for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
---|
36 | args[_key] = arguments[_key];
|
---|
37 | }
|
---|
38 |
|
---|
39 | _this = _Value.call.apply(_Value, [this].concat(args)) || this;
|
---|
40 |
|
---|
41 | _defineProperty(_assertThisInitialized(_this), "directions", {
|
---|
42 | top: 'bottom',
|
---|
43 | left: 'right',
|
---|
44 | bottom: 'top',
|
---|
45 | right: 'left'
|
---|
46 | });
|
---|
47 |
|
---|
48 | _defineProperty(_assertThisInitialized(_this), "oldDirections", {
|
---|
49 | 'top': 'left bottom, left top',
|
---|
50 | 'left': 'right top, left top',
|
---|
51 | 'bottom': 'left top, left bottom',
|
---|
52 | 'right': 'left top, right top',
|
---|
53 | 'top right': 'left bottom, right top',
|
---|
54 | 'top left': 'right bottom, left top',
|
---|
55 | 'right top': 'left bottom, right top',
|
---|
56 | 'right bottom': 'left top, right bottom',
|
---|
57 | 'bottom right': 'left top, right bottom',
|
---|
58 | 'bottom left': 'right top, left bottom',
|
---|
59 | 'left top': 'right bottom, left top',
|
---|
60 | 'left bottom': 'right top, left bottom'
|
---|
61 | });
|
---|
62 |
|
---|
63 | return _this;
|
---|
64 | }
|
---|
65 |
|
---|
66 | var _proto = Gradient.prototype;
|
---|
67 |
|
---|
68 | /**
|
---|
69 | * Change degrees for webkit prefix
|
---|
70 | */
|
---|
71 | _proto.replace = function replace(string, prefix) {
|
---|
72 | var ast = parser(string);
|
---|
73 |
|
---|
74 | for (var _iterator = _createForOfIteratorHelperLoose(ast.nodes), _step; !(_step = _iterator()).done;) {
|
---|
75 | var node = _step.value;
|
---|
76 |
|
---|
77 | if (node.type === 'function' && node.value === this.name) {
|
---|
78 | node.nodes = this.newDirection(node.nodes);
|
---|
79 | node.nodes = this.normalize(node.nodes);
|
---|
80 |
|
---|
81 | if (prefix === '-webkit- old') {
|
---|
82 | var changes = this.oldWebkit(node);
|
---|
83 |
|
---|
84 | if (!changes) {
|
---|
85 | return false;
|
---|
86 | }
|
---|
87 | } else {
|
---|
88 | node.nodes = this.convertDirection(node.nodes);
|
---|
89 | node.value = prefix + node.value;
|
---|
90 | }
|
---|
91 | }
|
---|
92 | }
|
---|
93 |
|
---|
94 | return ast.toString();
|
---|
95 | }
|
---|
96 | /**
|
---|
97 | * Replace first token
|
---|
98 | */
|
---|
99 | ;
|
---|
100 |
|
---|
101 | _proto.replaceFirst = function replaceFirst(params) {
|
---|
102 | for (var _len2 = arguments.length, words = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
|
---|
103 | words[_key2 - 1] = arguments[_key2];
|
---|
104 | }
|
---|
105 |
|
---|
106 | var prefix = words.map(function (i) {
|
---|
107 | if (i === ' ') {
|
---|
108 | return {
|
---|
109 | type: 'space',
|
---|
110 | value: i
|
---|
111 | };
|
---|
112 | }
|
---|
113 |
|
---|
114 | return {
|
---|
115 | type: 'word',
|
---|
116 | value: i
|
---|
117 | };
|
---|
118 | });
|
---|
119 | return prefix.concat(params.slice(1));
|
---|
120 | }
|
---|
121 | /**
|
---|
122 | * Convert angle unit to deg
|
---|
123 | */
|
---|
124 | ;
|
---|
125 |
|
---|
126 | _proto.normalizeUnit = function normalizeUnit(str, full) {
|
---|
127 | var num = parseFloat(str);
|
---|
128 | var deg = num / full * 360;
|
---|
129 | return deg + "deg";
|
---|
130 | }
|
---|
131 | /**
|
---|
132 | * Normalize angle
|
---|
133 | */
|
---|
134 | ;
|
---|
135 |
|
---|
136 | _proto.normalize = function normalize(nodes) {
|
---|
137 | if (!nodes[0]) return nodes;
|
---|
138 |
|
---|
139 | if (/-?\d+(.\d+)?grad/.test(nodes[0].value)) {
|
---|
140 | nodes[0].value = this.normalizeUnit(nodes[0].value, 400);
|
---|
141 | } else if (/-?\d+(.\d+)?rad/.test(nodes[0].value)) {
|
---|
142 | nodes[0].value = this.normalizeUnit(nodes[0].value, 2 * Math.PI);
|
---|
143 | } else if (/-?\d+(.\d+)?turn/.test(nodes[0].value)) {
|
---|
144 | nodes[0].value = this.normalizeUnit(nodes[0].value, 1);
|
---|
145 | } else if (nodes[0].value.includes('deg')) {
|
---|
146 | var num = parseFloat(nodes[0].value);
|
---|
147 | num = range.wrap(0, 360, num);
|
---|
148 | nodes[0].value = num + "deg";
|
---|
149 | }
|
---|
150 |
|
---|
151 | if (nodes[0].value === '0deg') {
|
---|
152 | nodes = this.replaceFirst(nodes, 'to', ' ', 'top');
|
---|
153 | } else if (nodes[0].value === '90deg') {
|
---|
154 | nodes = this.replaceFirst(nodes, 'to', ' ', 'right');
|
---|
155 | } else if (nodes[0].value === '180deg') {
|
---|
156 | nodes = this.replaceFirst(nodes, 'to', ' ', 'bottom');
|
---|
157 | } else if (nodes[0].value === '270deg') {
|
---|
158 | nodes = this.replaceFirst(nodes, 'to', ' ', 'left');
|
---|
159 | }
|
---|
160 |
|
---|
161 | return nodes;
|
---|
162 | }
|
---|
163 | /**
|
---|
164 | * Replace old direction to new
|
---|
165 | */
|
---|
166 | ;
|
---|
167 |
|
---|
168 | _proto.newDirection = function newDirection(params) {
|
---|
169 | if (params[0].value === 'to') {
|
---|
170 | return params;
|
---|
171 | }
|
---|
172 |
|
---|
173 | IS_DIRECTION.lastIndex = 0; // reset search index of global regexp
|
---|
174 |
|
---|
175 | if (!IS_DIRECTION.test(params[0].value)) {
|
---|
176 | return params;
|
---|
177 | }
|
---|
178 |
|
---|
179 | params.unshift({
|
---|
180 | type: 'word',
|
---|
181 | value: 'to'
|
---|
182 | }, {
|
---|
183 | type: 'space',
|
---|
184 | value: ' '
|
---|
185 | });
|
---|
186 |
|
---|
187 | for (var i = 2; i < params.length; i++) {
|
---|
188 | if (params[i].type === 'div') {
|
---|
189 | break;
|
---|
190 | }
|
---|
191 |
|
---|
192 | if (params[i].type === 'word') {
|
---|
193 | params[i].value = this.revertDirection(params[i].value);
|
---|
194 | }
|
---|
195 | }
|
---|
196 |
|
---|
197 | return params;
|
---|
198 | }
|
---|
199 | /**
|
---|
200 | * Look for at word
|
---|
201 | */
|
---|
202 | ;
|
---|
203 |
|
---|
204 | _proto.isRadial = function isRadial(params) {
|
---|
205 | var state = 'before';
|
---|
206 |
|
---|
207 | for (var _iterator2 = _createForOfIteratorHelperLoose(params), _step2; !(_step2 = _iterator2()).done;) {
|
---|
208 | var param = _step2.value;
|
---|
209 |
|
---|
210 | if (state === 'before' && param.type === 'space') {
|
---|
211 | state = 'at';
|
---|
212 | } else if (state === 'at' && param.value === 'at') {
|
---|
213 | state = 'after';
|
---|
214 | } else if (state === 'after' && param.type === 'space') {
|
---|
215 | return true;
|
---|
216 | } else if (param.type === 'div') {
|
---|
217 | break;
|
---|
218 | } else {
|
---|
219 | state = 'before';
|
---|
220 | }
|
---|
221 | }
|
---|
222 |
|
---|
223 | return false;
|
---|
224 | }
|
---|
225 | /**
|
---|
226 | * Change new direction to old
|
---|
227 | */
|
---|
228 | ;
|
---|
229 |
|
---|
230 | _proto.convertDirection = function convertDirection(params) {
|
---|
231 | if (params.length > 0) {
|
---|
232 | if (params[0].value === 'to') {
|
---|
233 | this.fixDirection(params);
|
---|
234 | } else if (params[0].value.includes('deg')) {
|
---|
235 | this.fixAngle(params);
|
---|
236 | } else if (this.isRadial(params)) {
|
---|
237 | this.fixRadial(params);
|
---|
238 | }
|
---|
239 | }
|
---|
240 |
|
---|
241 | return params;
|
---|
242 | }
|
---|
243 | /**
|
---|
244 | * Replace `to top left` to `bottom right`
|
---|
245 | */
|
---|
246 | ;
|
---|
247 |
|
---|
248 | _proto.fixDirection = function fixDirection(params) {
|
---|
249 | params.splice(0, 2);
|
---|
250 |
|
---|
251 | for (var _iterator3 = _createForOfIteratorHelperLoose(params), _step3; !(_step3 = _iterator3()).done;) {
|
---|
252 | var param = _step3.value;
|
---|
253 |
|
---|
254 | if (param.type === 'div') {
|
---|
255 | break;
|
---|
256 | }
|
---|
257 |
|
---|
258 | if (param.type === 'word') {
|
---|
259 | param.value = this.revertDirection(param.value);
|
---|
260 | }
|
---|
261 | }
|
---|
262 | }
|
---|
263 | /**
|
---|
264 | * Add 90 degrees
|
---|
265 | */
|
---|
266 | ;
|
---|
267 |
|
---|
268 | _proto.fixAngle = function fixAngle(params) {
|
---|
269 | var first = params[0].value;
|
---|
270 | first = parseFloat(first);
|
---|
271 | first = Math.abs(450 - first) % 360;
|
---|
272 | first = this.roundFloat(first, 3);
|
---|
273 | params[0].value = first + "deg";
|
---|
274 | }
|
---|
275 | /**
|
---|
276 | * Fix radial direction syntax
|
---|
277 | */
|
---|
278 | ;
|
---|
279 |
|
---|
280 | _proto.fixRadial = function fixRadial(params) {
|
---|
281 | var first = [];
|
---|
282 | var second = [];
|
---|
283 | var a, b, c, i, next;
|
---|
284 |
|
---|
285 | for (i = 0; i < params.length - 2; i++) {
|
---|
286 | a = params[i];
|
---|
287 | b = params[i + 1];
|
---|
288 | c = params[i + 2];
|
---|
289 |
|
---|
290 | if (a.type === 'space' && b.value === 'at' && c.type === 'space') {
|
---|
291 | next = i + 3;
|
---|
292 | break;
|
---|
293 | } else {
|
---|
294 | first.push(a);
|
---|
295 | }
|
---|
296 | }
|
---|
297 |
|
---|
298 | var div;
|
---|
299 |
|
---|
300 | for (i = next; i < params.length; i++) {
|
---|
301 | if (params[i].type === 'div') {
|
---|
302 | div = params[i];
|
---|
303 | break;
|
---|
304 | } else {
|
---|
305 | second.push(params[i]);
|
---|
306 | }
|
---|
307 | }
|
---|
308 |
|
---|
309 | params.splice.apply(params, [0, i].concat(second, [div], first));
|
---|
310 | };
|
---|
311 |
|
---|
312 | _proto.revertDirection = function revertDirection(word) {
|
---|
313 | return this.directions[word.toLowerCase()] || word;
|
---|
314 | }
|
---|
315 | /**
|
---|
316 | * Round float and save digits under dot
|
---|
317 | */
|
---|
318 | ;
|
---|
319 |
|
---|
320 | _proto.roundFloat = function roundFloat(_float, digits) {
|
---|
321 | return parseFloat(_float.toFixed(digits));
|
---|
322 | }
|
---|
323 | /**
|
---|
324 | * Convert to old webkit syntax
|
---|
325 | */
|
---|
326 | ;
|
---|
327 |
|
---|
328 | _proto.oldWebkit = function oldWebkit(node) {
|
---|
329 | var nodes = node.nodes;
|
---|
330 | var string = parser.stringify(node.nodes);
|
---|
331 |
|
---|
332 | if (this.name !== 'linear-gradient') {
|
---|
333 | return false;
|
---|
334 | }
|
---|
335 |
|
---|
336 | if (nodes[0] && nodes[0].value.includes('deg')) {
|
---|
337 | return false;
|
---|
338 | }
|
---|
339 |
|
---|
340 | if (string.includes('px') || string.includes('-corner') || string.includes('-side')) {
|
---|
341 | return false;
|
---|
342 | }
|
---|
343 |
|
---|
344 | var params = [[]];
|
---|
345 |
|
---|
346 | for (var _iterator4 = _createForOfIteratorHelperLoose(nodes), _step4; !(_step4 = _iterator4()).done;) {
|
---|
347 | var i = _step4.value;
|
---|
348 | params[params.length - 1].push(i);
|
---|
349 |
|
---|
350 | if (i.type === 'div' && i.value === ',') {
|
---|
351 | params.push([]);
|
---|
352 | }
|
---|
353 | }
|
---|
354 |
|
---|
355 | this.oldDirection(params);
|
---|
356 | this.colorStops(params);
|
---|
357 | node.nodes = [];
|
---|
358 |
|
---|
359 | for (var _i = 0, _params = params; _i < _params.length; _i++) {
|
---|
360 | var param = _params[_i];
|
---|
361 | node.nodes = node.nodes.concat(param);
|
---|
362 | }
|
---|
363 |
|
---|
364 | node.nodes.unshift({
|
---|
365 | type: 'word',
|
---|
366 | value: 'linear'
|
---|
367 | }, this.cloneDiv(node.nodes));
|
---|
368 | node.value = '-webkit-gradient';
|
---|
369 | return true;
|
---|
370 | }
|
---|
371 | /**
|
---|
372 | * Change direction syntax to old webkit
|
---|
373 | */
|
---|
374 | ;
|
---|
375 |
|
---|
376 | _proto.oldDirection = function oldDirection(params) {
|
---|
377 | var div = this.cloneDiv(params[0]);
|
---|
378 |
|
---|
379 | if (params[0][0].value !== 'to') {
|
---|
380 | return params.unshift([{
|
---|
381 | type: 'word',
|
---|
382 | value: this.oldDirections.bottom
|
---|
383 | }, div]);
|
---|
384 | } else {
|
---|
385 | var words = [];
|
---|
386 |
|
---|
387 | for (var _iterator5 = _createForOfIteratorHelperLoose(params[0].slice(2)), _step5; !(_step5 = _iterator5()).done;) {
|
---|
388 | var node = _step5.value;
|
---|
389 |
|
---|
390 | if (node.type === 'word') {
|
---|
391 | words.push(node.value.toLowerCase());
|
---|
392 | }
|
---|
393 | }
|
---|
394 |
|
---|
395 | words = words.join(' ');
|
---|
396 | var old = this.oldDirections[words] || words;
|
---|
397 | params[0] = [{
|
---|
398 | type: 'word',
|
---|
399 | value: old
|
---|
400 | }, div];
|
---|
401 | return params[0];
|
---|
402 | }
|
---|
403 | }
|
---|
404 | /**
|
---|
405 | * Get div token from exists parameters
|
---|
406 | */
|
---|
407 | ;
|
---|
408 |
|
---|
409 | _proto.cloneDiv = function cloneDiv(params) {
|
---|
410 | for (var _iterator6 = _createForOfIteratorHelperLoose(params), _step6; !(_step6 = _iterator6()).done;) {
|
---|
411 | var i = _step6.value;
|
---|
412 |
|
---|
413 | if (i.type === 'div' && i.value === ',') {
|
---|
414 | return i;
|
---|
415 | }
|
---|
416 | }
|
---|
417 |
|
---|
418 | return {
|
---|
419 | type: 'div',
|
---|
420 | value: ',',
|
---|
421 | after: ' '
|
---|
422 | };
|
---|
423 | }
|
---|
424 | /**
|
---|
425 | * Change colors syntax to old webkit
|
---|
426 | */
|
---|
427 | ;
|
---|
428 |
|
---|
429 | _proto.colorStops = function colorStops(params) {
|
---|
430 | var result = [];
|
---|
431 |
|
---|
432 | for (var i = 0; i < params.length; i++) {
|
---|
433 | var pos = void 0;
|
---|
434 | var param = params[i];
|
---|
435 | var item = void 0;
|
---|
436 |
|
---|
437 | if (i === 0) {
|
---|
438 | continue;
|
---|
439 | }
|
---|
440 |
|
---|
441 | var color = parser.stringify(param[0]);
|
---|
442 |
|
---|
443 | if (param[1] && param[1].type === 'word') {
|
---|
444 | pos = param[1].value;
|
---|
445 | } else if (param[2] && param[2].type === 'word') {
|
---|
446 | pos = param[2].value;
|
---|
447 | }
|
---|
448 |
|
---|
449 | var stop = void 0;
|
---|
450 |
|
---|
451 | if (i === 1 && (!pos || pos === '0%')) {
|
---|
452 | stop = "from(" + color + ")";
|
---|
453 | } else if (i === params.length - 1 && (!pos || pos === '100%')) {
|
---|
454 | stop = "to(" + color + ")";
|
---|
455 | } else if (pos) {
|
---|
456 | stop = "color-stop(" + pos + ", " + color + ")";
|
---|
457 | } else {
|
---|
458 | stop = "color-stop(" + color + ")";
|
---|
459 | }
|
---|
460 |
|
---|
461 | var div = param[param.length - 1];
|
---|
462 | params[i] = [{
|
---|
463 | type: 'word',
|
---|
464 | value: stop
|
---|
465 | }];
|
---|
466 |
|
---|
467 | if (div.type === 'div' && div.value === ',') {
|
---|
468 | item = params[i].push(div);
|
---|
469 | }
|
---|
470 |
|
---|
471 | result.push(item);
|
---|
472 | }
|
---|
473 |
|
---|
474 | return result;
|
---|
475 | }
|
---|
476 | /**
|
---|
477 | * Remove old WebKit gradient too
|
---|
478 | */
|
---|
479 | ;
|
---|
480 |
|
---|
481 | _proto.old = function old(prefix) {
|
---|
482 | if (prefix === '-webkit-') {
|
---|
483 | var type = this.name === 'linear-gradient' ? 'linear' : 'radial';
|
---|
484 | var string = '-gradient';
|
---|
485 | var regexp = utils.regexp("-webkit-(" + type + "-gradient|gradient\\(\\s*" + type + ")", false);
|
---|
486 | return new OldValue(this.name, prefix + this.name, string, regexp);
|
---|
487 | } else {
|
---|
488 | return _Value.prototype.old.call(this, prefix);
|
---|
489 | }
|
---|
490 | }
|
---|
491 | /**
|
---|
492 | * Do not add non-webkit prefixes for list-style and object
|
---|
493 | */
|
---|
494 | ;
|
---|
495 |
|
---|
496 | _proto.add = function add(decl, prefix) {
|
---|
497 | var p = decl.prop;
|
---|
498 |
|
---|
499 | if (p.includes('mask')) {
|
---|
500 | if (prefix === '-webkit-' || prefix === '-webkit- old') {
|
---|
501 | return _Value.prototype.add.call(this, decl, prefix);
|
---|
502 | }
|
---|
503 | } else if (p === 'list-style' || p === 'list-style-image' || p === 'content') {
|
---|
504 | if (prefix === '-webkit-' || prefix === '-webkit- old') {
|
---|
505 | return _Value.prototype.add.call(this, decl, prefix);
|
---|
506 | }
|
---|
507 | } else {
|
---|
508 | return _Value.prototype.add.call(this, decl, prefix);
|
---|
509 | }
|
---|
510 |
|
---|
511 | return undefined;
|
---|
512 | };
|
---|
513 |
|
---|
514 | return Gradient;
|
---|
515 | }(Value);
|
---|
516 |
|
---|
517 | _defineProperty(Gradient, "names", ['linear-gradient', 'repeating-linear-gradient', 'radial-gradient', 'repeating-radial-gradient']);
|
---|
518 |
|
---|
519 | module.exports = Gradient; |
---|