source: frontend/node_modules/css-declaration-sorter/src/main.mjs

Last change on this file was 9af201e, checked in by MBK <marija.karapandzova@…>, 11 days ago

Fix frontend appearance

  • Property mode set to 100644
File size: 3.9 KB
Line 
1import { shorthandData } from './shorthand-data.mjs';
2import { bubbleSort } from './bubble-sort.mjs';
3
4const builtInOrders = [
5 'alphabetical',
6 'concentric-css',
7 'smacss',
8];
9
10export const cssDeclarationSorter = ({ order = 'alphabetical', keepOverrides = false } = {}) => ({
11 postcssPlugin: 'css-declaration-sorter',
12 OnceExit (css) {
13 let withKeepOverrides = comparator => comparator;
14 if (keepOverrides) {
15 withKeepOverrides = withOverridesComparator(shorthandData);
16 }
17
18 if (typeof order === 'function') {
19 return processCss({ css, comparator: withKeepOverrides(order) });
20 }
21
22 if (!builtInOrders.includes(order))
23 return Promise.reject(
24 Error([
25 `Invalid built-in order '${order}' provided.`,
26 `Available built-in orders are: ${builtInOrders}`,
27 ].join('\n'))
28 );
29
30 return import(`../orders/${order}.mjs`)
31 .then(({ properties }) => processCss({
32 css,
33 comparator: withKeepOverrides(orderComparator(properties)),
34 }));
35 },
36});
37
38cssDeclarationSorter.postcss = true;
39
40// Kept for backward compatibility
41export default cssDeclarationSorter;
42
43function processCss ({ css, comparator }) {
44 const comments = [];
45 const rulesCache = [];
46
47 css.walk(node => {
48 const nodes = node.nodes;
49 const type = node.type;
50
51 if (type === 'comment') {
52 // Don't do anything to root comments or the last newline comment
53 const isNewlineNode = node.raws.before && node.raws.before.includes('\n');
54 const lastNewlineNode = isNewlineNode && !node.next();
55 const onlyNode = !node.prev() && !node.next() || !node.parent;
56
57 if (lastNewlineNode || onlyNode || node.parent.type === 'root') {
58 return;
59 }
60
61 if (isNewlineNode) {
62 const pairedNode = node.next() || node.prev();
63 if (pairedNode) {
64 comments.unshift({
65 'comment': node,
66 'pairedNode': pairedNode,
67 'insertPosition': node.next() ? 'Before' : 'After',
68 });
69 node.remove();
70 }
71 } else {
72 const pairedNode = node.prev() || node.next();
73 if (pairedNode) {
74 comments.push({
75 'comment': node,
76 'pairedNode': pairedNode,
77 'insertPosition': 'After',
78 });
79 node.remove();
80 }
81 }
82 return;
83 }
84
85 // Add rule-like nodes to a cache so that we can remove all
86 // comment nodes before we start sorting.
87 const isRule = type === 'rule' || type === 'atrule';
88 if (isRule && nodes && nodes.length > 1) {
89 rulesCache.push(nodes);
90 }
91 });
92
93 // Perform a sort once all comment nodes are removed
94 rulesCache.forEach(nodes => {
95 sortCssDeclarations({ nodes, comparator });
96 });
97
98 // Add comments back to the nodes they are paired with
99 comments.forEach(node => {
100 const pairedNode = node.pairedNode;
101 node.comment.remove();
102 pairedNode.parent && pairedNode.parent['insert' + node.insertPosition](pairedNode, node.comment);
103 });
104}
105
106function sortCssDeclarations ({ nodes, comparator }) {
107 bubbleSort(nodes, (a, b) => {
108 if (a.type === 'decl' && b.type === 'decl') {
109 return comparator(a.prop, b.prop);
110 } else {
111 return compareDifferentType(a, b);
112 }
113 });
114}
115
116function withOverridesComparator (shorthandData) {
117 return function (comparator) {
118 return function (a, b) {
119 a = removeVendorPrefix(a);
120 b = removeVendorPrefix(b);
121
122 if (shorthandData[a] && shorthandData[a].includes(b)) return 0;
123 if (shorthandData[b] && shorthandData[b].includes(a)) return 0;
124
125 return comparator(a, b);
126 };
127 };
128}
129
130function orderComparator (order) {
131 return function (a, b) {
132 return order.indexOf(a) - order.indexOf(b);
133 };
134}
135
136function compareDifferentType (a, b) {
137 if (b.type === 'atrule' || a.type === 'atrule') {
138 return 0;
139 }
140
141 return a.type === 'decl' ? -1 : b.type === 'decl' ? 1 : 0;
142}
143
144function removeVendorPrefix (property) {
145 return property.replace(/^-\w+-/, '');
146}
Note: See TracBrowser for help on using the repository browser.