tech: biome format

Author: SevereCloud

.eslintrc.json

@@ -18,16 +18,20 @@
       "spread": true
     }
   },
-  "extends": [
-    "plugin:@vkontakte/eslint-plugin/react-typescript", // "Preset 1"
-    "prettier" // "Preset 2" (overrides "Preset 1")
-  ],
+  "extends": ["plugin:@vkontakte/eslint-plugin/react-typescript"],
   "rules": {
     "@typescript-eslint/method-signature-style": "error",
     "@typescript-eslint/explicit-member-accessibility": "off", // [Reason] overrides "Preset 1"
     "@typescript-eslint/no-unnecessary-condition": "off", // [Reason] overrides "Preset 1"
     "@typescript-eslint/no-magic-numbers": "off", // [Reason] overrides "Preset 1"
     "@typescript-eslint/no-non-null-assertion": "off", // [Reason] overrides "Preset 1"
+    "@typescript-eslint/indent": "off",
+    "@typescript-eslint/no-extra-parens": "off",
+    "@typescript-eslint/quotes": "off",
+    "react/jsx-indent": "off",
+    "space-before-function-paren": "off",
+    "comma-spacing": "off",
+    "max-len": "off",
     "@typescript-eslint/ban-ts-comment": [
       "error",
       {

.github/dependabot.yml

@@ -69,10 +69,6 @@ updates:
         patterns:
           - 'size-limit'
           - '@size-limit/*'
-      prettier:
-        patterns:
-          - 'prettier'
-          - '@vkontakte/prettier-config'
       swc:
         patterns:
           - '@swc/*'

.github/workflows/pull_request_common.yml

@@ -1,4 +1,4 @@
-name: 'Pull Request / Common'
+name: "Pull Request / Common"
 
 on:
   pull_request:
@@ -24,14 +24,14 @@ jobs:
         uses: ./.github/actions/add-label-to-pull-request
         with:
           issue_number: ${{ github.event.pull_request.number }}
-          label: 'ci:cherry-pick:patch'
+          label: "ci:cherry-pick:patch"
 
       - name: VKUI-tokens
         if: ${{ github.event.pull_request.user.login == 'dependabot[bot]' && contains(github.event.pull_request.title, '@vkontakte/vkui-tokens') }}
         uses: ./.github/actions/add-label-to-pull-request
         with:
           issue_number: ${{ github.event.pull_request.number }}
-          label: 'vkui-tokens'
+          label: "vkui-tokens"
 
   check-dependabot-pr:
     runs-on: ubuntu-latest
@@ -118,5 +118,5 @@ jobs:
 
       - name: Node setup
         uses: ./.github/actions/node-setup
-      - name: Run Prettier
-        run: yarn run lint:prettier
+      - name: Run Biome format
+        run: yarn run lint:biome-format

.github/workflows/pull_request_packages.yml

@@ -189,7 +189,7 @@ jobs:
         working-directory: packages/vkui
         run: |
           yarn run build
-          yarn run -T prettier ./dist --write
+          yarn run -T biome format --write ./dist
 
       - name: Checkout target
         run: |
@@ -208,7 +208,7 @@ jobs:
         working-directory: packages/vkui
         run: |
           yarn run build
-          yarn run -T prettier ./dist --write
+          yarn run -T biome format --write ./dist
 
       - name: Generate diff
         id: generate-diff

.vscode/extensions.json

@@ -5,7 +5,7 @@
   // List of extensions which should be recommended for users of this workspace.
   "recommendations": [
     "stylelint.vscode-stylelint",
-    "esbenp.prettier-vscode",
+    "biomejs.biome",
     "unifiedjs.vscode-mdx",
     "dbaeumer.vscode-eslint",
     "clinyong.vscode-css-modules",

benchmark/.eslintrc.json

@@ -4,7 +4,7 @@
     "node": true,
     "browser": true
   },
-  "extends": ["plugin:react-hooks/recommended", "prettier"],
+  "extends": ["plugin:react-hooks/recommended"],
   "plugins": ["import", "unicorn"],
   "parser": "@typescript-eslint/parser",
   "parserOptions": {

biome.json

@@ -0,0 +1,90 @@
+{
+  "$schema": "https://biomejs.dev/schemas/2.3.2/schema.json",
+  "vcs": { "enabled": true, "clientKind": "git", "useIgnoreFile": true },
+  "files": { "ignoreUnknown": true },
+  "formatter": {
+    "enabled": true,
+    "formatWithErrors": false,
+    "indentStyle": "space",
+    "indentWidth": 2,
+    "lineEnding": "lf",
+    "lineWidth": 100,
+    "attributePosition": "auto",
+    "bracketSameLine": false,
+    "bracketSpacing": true,
+    "expand": "auto",
+    "useEditorconfig": true,
+    "includes": [
+      "**",
+      "!**/node_modules",
+      "!**/dist",
+      "!**/coverage",
+      "!**/.idea",
+      "!.vscode/*",
+      ".vscode/extensions.json",
+      "!**/test-results.json",
+      "!**/a11y-results.json",
+      "!**/lint-results.json",
+      "!**/e2e-results.json",
+      "!**/.nyc_output",
+      "!**/.nyc_a11y_output",
+      "!**/__diff_output__",
+      "!**/.cache",
+      "!**/tmp/",
+      "!.github/**/*.md",
+      "!**/target/",
+      "!**/fixture/",
+      "!**/__testfixtures__",
+      "!**/storybook-static/",
+      "!**/playwright-report/",
+      "!**/blob-report/",
+      "!**/all-blob-reports/",
+      "!**/.next/",
+      "!**/out/",
+      "!**/.docgen/",
+      "!packages/vkui/**/*.css.d.ts",
+      "!packages/vkui-floating-ui/**/*.d.ts",
+      "!packages/vkui-floating-ui/**/*.d.mts",
+      "!packages/vkui-floating-ui/**/*.mjs",
+      "!packages/vkui-floating-ui/**/*.esm.js",
+      "!packages/vkui-floating-ui/**/*.umd.js",
+      "!packages/vkui-floating-ui/**/package.json",
+      "packages/vkui-floating-ui/package.json",
+      "!packages/vkui-date-fns-tz/**/*.d.ts",
+      "!packages/vkui-date-fns-tz/**/*.js",
+      "!.yarn/*",
+      "!**/package.json"
+    ]
+  },
+  "linter": { "enabled": false },
+  "javascript": {
+    "formatter": {
+      "jsxQuoteStyle": "double",
+      "quoteProperties": "preserve",
+      "trailingCommas": "all",
+      "semicolons": "always",
+      "arrowParentheses": "always",
+      "bracketSameLine": false,
+      "quoteStyle": "single",
+      "attributePosition": "auto",
+      "bracketSpacing": true
+    }
+  },
+  "css": {
+    "formatter": {
+      "quoteStyle": "single"
+    },
+    "parser": {
+      "cssModules": true
+    }
+  },
+  "html": {
+    "formatter": {
+      "indentScriptAndStyle": false,
+      "selfCloseVoidElements": "always"
+    }
+  },
+  "assist": {
+    "enabled": false
+  }
+}

package.json

@@ -11,6 +11,7 @@
     "@project-tools/stylelint-plugin-vkui": "workspace:1.0.0"
   },
   "devDependencies": {
+    "@biomejs/biome": "2.3.2",
     "@csstools/postcss-global-data": "3.1.0",
     "@morev/stylelint-testing-library": "^1.0.2",
     "@playwright/experimental-ct-react": "1.56.1",
@@ -41,7 +42,6 @@
     "@vitest/coverage-v8": "^4.0.4",
     "@vitest/eslint-plugin": "^1.3.25",
     "@vkontakte/eslint-plugin": "^2.0.0",
-    "@vkontakte/prettier-config": "^0.2.1",
     "@vkontakte/stylelint-config": "^4.1.0",
     "@vkontakte/vkui-tokens": "4.70.0",
     "autoprefixer": "^10.4.21",
@@ -55,12 +55,10 @@
     "diff2html-cli": "^5.2.15",
     "dotenv": "^17.2.3",
     "eslint": "^8.56.0",
-    "eslint-config-prettier": "^9.1.0",
     "eslint-import-resolver-alias": "^1.1.2",
     "eslint-plugin-compat": "^6.0.2",
     "eslint-plugin-import": "^2.32.0",
     "eslint-plugin-jsdoc": "^61.1.9",
-    "eslint-plugin-prettier": "^5.2.1",
     "eslint-plugin-react": "^7.33.2",
     "eslint-plugin-react-compiler": "0.0.0-experimental-56229e1-20240813",
     "eslint-plugin-react-hooks": "^7.0.1",
@@ -80,7 +78,6 @@
     "postcss-logical": "^8.1.0",
     "postcss-modules": "^6.0.1",
     "postcss-value-parser": "^4.2.0",
-    "prettier": "^3.6.2",
     "process": "^0.11.10",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
@@ -94,7 +91,6 @@
     "stylelint-config-standard": "^39.0.1",
     "stylelint-media-use-custom-media": "^4.0.0",
     "stylelint-order": "^7.0.0",
-    "stylelint-prettier": "^5.0.3",
     "stylelint-use-logical": "^2.1.2",
     "stylelint-value-no-unknown-custom-properties": "^6.0.1",
     "swc-loader": "^0.2.6",
@@ -131,11 +127,11 @@
     "test:e2e:ci": "yarn workspace @vkontakte/vkui run test:e2e:ci",
     "test:e2e-update:ci": "yarn workspace @vkontakte/vkui run test:e2e-update:ci",
     "test:coverage": "npx nyc report --reporter=lcov",
-    "lint": "yarn lint:generated-files && concurrently 'yarn:lint:types' 'yarn:lint:types:vkui-date-fns-tz' 'yarn:lint:es' 'yarn:lint:style' 'yarn:lint:prettier'",
+    "lint": "yarn lint:generated-files && concurrently 'yarn:lint:types' 'yarn:lint:types:vkui-date-fns-tz' 'yarn:lint:es' 'yarn:lint:style' 'yarn:lint:biome-format'",
     "lint:es": "eslint . --ext .jsx,.js,.ts,.tsx --cache --cache-location .cache/.eslintcache",
     "lint:es:ci": "yarn lint:es -o lint-results.json -f json",
     "lint:style": "cross-env LINT_PRECOMMIT_RUN=1 stylelint '**/*.css' --cache --cache-location .cache/.stylelintcache",
-    "lint:prettier": "prettier --check --ignore-unknown --cache --cache-location .cache/.prettiercache .",
+    "lint:biome-format": "biome format .",
     "lint:types": "concurrently 'yarn:lint:types:*'",
     "lint:types:root": "tsc --incremental --emitDeclarationOnly --declaration --tsBuildInfoFile .cache/.tsbuildinfo",
     "lint:types:vkui-date-fns-tz": "yarn workspace @vkontakte/vkui-date-fns-tz run lint:types",
@@ -148,15 +144,15 @@
   },
   "lint-staged": {
     "*.{ts,tsx,js,jsx}": [
-      "prettier --check",
+      "biome format --no-errors-on-unmatched",
       "eslint"
     ],
     "*.css": [
-      "prettier --check",
+      "biome format --no-errors-on-unmatched",
       "cross-env LINT_PRECOMMIT_RUN=1 stylelint --allow-empty-input"
     ],
     "*.{json,md,mdx}": [
-      "prettier --check"
+      "biome format --no-errors-on-unmatched"
     ]
   },
   "packageManager": "[email protected]+sha512.c38cafb5c7bb273f3926d04e55e1d8c9dfa7d9c3ea1f36a4868fa028b9e5f72298f0b7f401ad5eb921749eb012eb1c3bb74bf7503df3ee43fd600d14a018266f",
@@ -167,6 +163,5 @@
       "packages/*",
       "tools/*"
     ]
-  },
-  "prettier": "@vkontakte/prettier-config"
+  }
 }

packages/vkui/scripts/generateCSSCustomMedias.mjs

@@ -38,8 +38,8 @@ export const getCustomMedias = async () => {
     '--sizeX-regular': widthPlus(BREAKPOINTS.SMALL_TABLET),
     '--sizeX-compact': widthMinus(BREAKPOINTS.SMALL_TABLET),
 
-    '--sizeY-compact': `(pointer: fine) and ${widthPlus(BREAKPOINTS.SMALL_TABLET)}, ${heightMinus(BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT)}`, // prettier-ignore
-    '--sizeY-regular': `(pointer: coarse) and ${heightPlus(BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT)}, (pointer: none) and ${heightPlus(BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT)}, ${widthMinus(BREAKPOINTS.SMALL_TABLET)} and ${heightPlus(BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT)}`, // prettier-ignore
+    '--sizeY-compact': `(pointer: fine) and ${widthPlus(BREAKPOINTS.SMALL_TABLET)}, ${heightMinus(BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT)}`,
+    '--sizeY-regular': `(pointer: coarse) and ${heightPlus(BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT)}, (pointer: none) and ${heightPlus(BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT)}, ${widthMinus(BREAKPOINTS.SMALL_TABLET)} and ${heightPlus(BREAKPOINTS.MOBILE_LANDSCAPE_HEIGHT)}`,
 
     '--hover-has': '(hover: hover) and (pointer: fine)', // см. https://github.com/VKCOM/VKUI/issues/3469
     '--hover-has-not': '(hover: none)',
@@ -49,8 +49,8 @@ export const getCustomMedias = async () => {
 
     '--reduce-motion': 'screen and (prefers-reduced-motion: reduce)',
 
-    '--desktop': `${widthPlus(BREAKPOINTS.SMALL_TABLET)} and (pointer: fine), ${widthPlus(BREAKPOINTS.SMALL_TABLET)} and ${heightPlus(BREAKPOINTS.MEDIUM_HEIGHT)}`, // prettier-ignore
-    '--mobile': `${widthMinus(BREAKPOINTS.SMALL_TABLET)}, (pointer: none) and ${heightMinus(BREAKPOINTS.MEDIUM_HEIGHT)}, (pointer: coarse) and ${heightMinus(BREAKPOINTS.MEDIUM_HEIGHT)}`, // prettier-ignore
+    '--desktop': `${widthPlus(BREAKPOINTS.SMALL_TABLET)} and (pointer: fine), ${widthPlus(BREAKPOINTS.SMALL_TABLET)} and ${heightPlus(BREAKPOINTS.MEDIUM_HEIGHT)}`,
+    '--mobile': `${widthMinus(BREAKPOINTS.SMALL_TABLET)}, (pointer: none) and ${heightMinus(BREAKPOINTS.MEDIUM_HEIGHT)}, (pointer: coarse) and ${heightMinus(BREAKPOINTS.MEDIUM_HEIGHT)}`,
 
     '--viewWidth-desktopPlus': MEDIA_QUERIES.DESKTOP_PLUS,
 
@@ -76,13 +76,17 @@ async function main() {
   const dataRaw = [];
 
   dataRaw.push('/* ⚠️ Документ сгенерирован автоматически */');
-  dataRaw.push('/* 📝 Если требуется изменения, то запустите команду `yarn workspace @vkontakte/vkui run generate:css-custom-medias` */'); // prettier-ignore
+  dataRaw.push(
+    '/* 📝 Если требуется изменения, то запустите команду `yarn workspace @vkontakte/vkui run generate:css-custom-medias` */',
+  );
   dataRaw.push('');
   dataRaw.push('/* stylelint-disable */');
   dataRaw.push(
     Object.entries(customMedias)
       .map(([key, value]) => {
-        return ['/* prettier-ignore */', `@custom-media ${key} ${value};`].join('\n');
+        return ['/* biome-ignore format: для красоты */', `@custom-media ${key} ${value};`].join(
+          '\n',
+        );
       })
       .join('\n'),
   );

packages/vkui/src/components/ActionSheet/ActionSheet.module.css

@@ -31,14 +31,14 @@
 }
 
 .opening {
-  /* prettier-ignore */
-  animation: animation-actionsheet-slide-up var(--vkui--animation_duration_m) var(--vkui--animation_easing_platform);
+  animation: animation-actionsheet-slide-up var(--vkui--animation_duration_m)
+    var(--vkui--animation_easing_platform);
 }
 
 .closing {
   opacity: 0;
-  /* prettier-ignore */
-  animation: animation-actionsheet-slide-down var(--vkui--animation_duration_m) var(--vkui--animation_easing_platform);
+  animation: animation-actionsheet-slide-down var(--vkui--animation_duration_m)
+    var(--vkui--animation_easing_platform);
 }
 
 .title + .description {