@taiga-ui/prettier-config 0.437.0 → 0.439.0

package/index.js

@@ -1,18 +1,4 @@
-const attributeOptions = {
-    attributeGroups: [
-        '$ANGULAR_STRUCTURAL_DIRECTIVE',
-        '$ANGULAR_ELEMENT_REF',
-        '$ID',
-        '$DEFAULT',
-        '$CLASS',
-        '$ANGULAR_ANIMATION',
-        '$ANGULAR_ANIMATION_INPUT',
-        '$ANGULAR_INPUT',
-        '$ANGULAR_TWO_WAY_BINDING',
-        '$ANGULAR_OUTPUT',
-    ],
-    attributeSort: 'ASC',
-};
+const path = require('node:path');
 
 module.exports = {
     $schema: 'https://json.schemastore.org/prettierrc',
@@ -51,7 +37,7 @@ module.exports = {
                 parser: 'json-stringify',
                 plugins: [
                     require.resolve(
-                        require('node:path').resolve(
+                        path.resolve(
                             __dirname,
                             'plugins',
                             'prettier-plugin-sort-package.js',
@@ -87,23 +73,54 @@ module.exports = {
             files: ['*.html'],
             options: {
                 parser: 'angular',
+                attributeGroups: [
+                    '$ANGULAR_STRUCTURAL_DIRECTIVE',
+                    '$ANGULAR_ELEMENT_REF',
+                    '$ID',
+                    '$DEFAULT',
+                    '$CLASS',
+                    '$ANGULAR_ANIMATION',
+                    '$ANGULAR_ANIMATION_INPUT',
+                    '$ANGULAR_INPUT',
+                    '$ANGULAR_TWO_WAY_BINDING',
+                    '$ANGULAR_OUTPUT',
+                ],
+                attributeSort: 'ASC',
                 printWidth: 120,
-                ...attributeOptions,
             },
         },
         {
-            files: ['*.js', '*.ts'],
+            files: ['*.js'],
             options: {
-                ...attributeOptions,
                 parser: 'typescript',
                 printWidth: 90,
             },
         },
+        {
+            files: ['*.ts'],
+            options: {
+                parser: 'typescript-embedded-ts',
+                plugins: [
+                    require.resolve(
+                        path.resolve(
+                            __dirname,
+                            'plugins',
+                            'prettier-plugin-embedded-ts.js',
+                        ),
+                    ),
+                ],
+                printWidth: 90,
+            },
+        },
         {
             files: '*.svg',
-            options: require(
-                require('node:path').resolve(__dirname, 'options', 'svg.js'),
-            ),
+            options: {
+                parser: 'html',
+                plugins: [require.resolve('prettier-plugin-organize-attributes')],
+                attributeGroups: ['^(id|name)$', '^x$', '^y$', '^xmlns$', '$DEFAULT'],
+                printWidth: 120,
+                singleAttributePerLine: false,
+            },
         },
     ],
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@taiga-ui/prettier-config",
-    "version": "0.437.0",
+    "version": "0.439.0",
     "description": "Taiga-ui prettier config",
     "keywords": [
         "prettier",

package/plugins/prettier-plugin-embedded-ts.js

@@ -0,0 +1,207 @@
+const prettier = require('prettier');
+const estreePlugin = require('prettier/plugins/estree');
+const typescriptPlugin = require('prettier/plugins/typescript');
+
+const {hardline, indent} = prettier.doc.builders;
+const baseParser = typescriptPlugin.parsers.typescript;
+const basePrinter = estreePlugin.printers.estree;
+
+const EMBEDDED_PARSER = 'typescript';
+const PARSER_NAME = 'typescript-embedded-ts';
+const AST_FORMAT = 'estree-embedded-ts';
+
+const MARKERS = new Set(['TS', 'TYPESCRIPT']);
+
+const parsers = {
+    [PARSER_NAME]: {
+        ...baseParser,
+        astFormat: AST_FORMAT,
+        async parse(text, options) {
+            const ast = await baseParser.parse(text, options);
+
+            markEmbeddedTemplateLiterals(ast, text);
+
+            return ast;
+        },
+    },
+};
+
+const printers = {
+    [AST_FORMAT]: {
+        ...basePrinter,
+        embed(path, options) {
+            const {node} = path;
+
+            if (options.embeddedLanguageFormatting === 'off') {
+                return basePrinter.embed?.(path, options);
+            }
+
+            if (
+                node?.type === 'TemplateLiteral' &&
+                node.__embeddedParser === EMBEDDED_PARSER &&
+                node.expressions?.length === 0 &&
+                node.quasis?.length === 1
+            ) {
+                return async (textToDoc) => {
+                    const source = node.quasis[0].value.raw;
+                    const doc = await textToDoc(source, {
+                        ...options,
+                        parser: EMBEDDED_PARSER,
+                    });
+
+                    return ['`', indent([hardline, doc]), hardline, '`'];
+                };
+            }
+
+            return basePrinter.embed?.(path, options);
+        },
+    },
+};
+
+function markEmbeddedTemplateLiterals(ast, text) {
+    const comments = collectComments(ast)
+        .filter(isSupportedMarker)
+        .sort((a, b) => getEnd(a) - getEnd(b));
+
+    if (!comments.length) {
+        return;
+    }
+
+    visit(ast, (node) => {
+        if (
+            node?.type !== 'TemplateLiteral' ||
+            node.expressions?.length !== 0 ||
+            node.quasis?.length !== 1
+        ) {
+            return;
+        }
+
+        const start = getStart(node);
+
+        if (start == null) {
+            return;
+        }
+
+        const marker = findDirectMarkerBefore(comments, start, text);
+
+        if (marker) {
+            node.__embeddedParser = EMBEDDED_PARSER;
+        }
+    });
+}
+
+function findDirectMarkerBefore(comments, nodeStart, text) {
+    let candidate = null;
+
+    for (const comment of comments) {
+        const end = getEnd(comment);
+
+        if (end == null || end > nodeStart) {
+            continue;
+        }
+
+        const between = text.slice(end, nodeStart);
+
+        if (/^\s*$/.test(between)) {
+            candidate = comment;
+        }
+    }
+
+    return candidate;
+}
+
+function isSupportedMarker(comment) {
+    if (!comment || comment.type !== 'Block') {
+        return false;
+    }
+
+    return MARKERS.has(comment.value.trim().toUpperCase());
+}
+
+function collectComments(ast) {
+    const comments = [];
+    const seen = new Set();
+
+    const push = (comment) => {
+        if (!comment || typeof comment !== 'object') {
+            return;
+        }
+
+        const key = `${getStart(comment)}:${getEnd(comment)}:${comment.type}:${comment.value}`;
+
+        if (seen.has(key)) {
+            return;
+        }
+
+        seen.add(key);
+        comments.push(comment);
+    };
+
+    if (Array.isArray(ast.comments)) {
+        ast.comments.forEach(push);
+    }
+
+    visit(ast, (node) => {
+        if (Array.isArray(node.comments)) {
+            node.comments.forEach(push);
+        }
+
+        if (Array.isArray(node.leadingComments)) {
+            node.leadingComments.forEach(push);
+        }
+
+        if (Array.isArray(node.trailingComments)) {
+            node.trailingComments.forEach(push);
+        }
+    });
+
+    return comments;
+}
+
+function visit(value, fn) {
+    walk(value);
+
+    function walk(node) {
+        if (!node || typeof node !== 'object') {
+            return;
+        }
+
+        if (Array.isArray(node)) {
+            for (const item of node) {
+                walk(item);
+            }
+
+            return;
+        }
+
+        fn(node);
+
+        for (const [key, child] of Object.entries(node)) {
+            if (
+                key === 'loc' ||
+                key === 'range' ||
+                key === 'comments' ||
+                key === 'leadingComments' ||
+                key === 'trailingComments' ||
+                key === 'parent'
+            ) {
+                continue;
+            }
+
+            walk(child);
+        }
+    }
+}
+
+function getStart(node) {
+    return typeof node?.start === 'number' ? node.start : node?.range?.[0];
+}
+
+function getEnd(node) {
+    return typeof node?.end === 'number' ? node.end : node?.range?.[1];
+}
+
+module.exports = {
+    parsers,
+    printers,
+};

package/options/svg.js

@@ -1,7 +0,0 @@
-module.exports = {
-    parser: 'html',
-    plugins: [require.resolve('prettier-plugin-organize-attributes')],
-    attributeGroups: ['^(id|name)$', '^x$', '^y$', '^xmlns$', '$DEFAULT'],
-    printWidth: 120,
-    singleAttributePerLine: false,
-};