Cleanup tools (#1756)

* Use prettier own instead of eslint plugin

* Extend prettier config angular eslint

* Upgrade root prettier to 3

* Fix css syntax errors

* Change eslint ignore to prettier ignore

* Ignore formatting for outputs

* Fix lint-staged error when edited multiple files

* Bump pnpm version

* Remove unnecessary pnpm config

---------

Co-authored-by: Eric Fennis <[e-mail]>

.eslintrc.js

···
     node: true,
   },
   extends: ['airbnb-base', 'prettier'],
-  plugins: ['import', 'prettier', '@html-eslint'],
+  plugins: ['import', '@html-eslint'],
   rules: {
     'no-console': 'off',
     'no-param-reassign': 'off',
     'no-shadow': 'off',
     'no-use-before-define': 'off',
-    'prettier/prettier': [
-      'error',
-      {
-        singleQuote: true,
-        trailingComma: 'all',
-        printWidth: 100
-      },
-    ],
     'import/no-extraneous-dependencies': [
       'error',
       { devDependencies: ['**/*.test.js', '**/*.spec.js', './scripts/**'] },
···
       files: ['./icons/*.svg'],
       parser: '@html-eslint/parser',
       rules: {
-        'prettier/prettier': 'off',
         '@html-eslint/require-doctype': 'off',
         '@html-eslint/no-duplicate-attrs': 'error',
         '@html-eslint/no-inline-styles': 'error',

.github/actions/build-and-test.yml

···
       name: Install pnpm
       id: pnpm-install
       with:
-        version: 7
+        version: 8
         run_install: false
 
     - name: Get pnpm store directory

.github/actions/check-icons.yml

···
       name: Install pnpm
       id: pnpm-install
       with:
-        version: 7
+        version: 8
         run_install: false
 
     - name: Get pnpm store directory

.prettierignore

···
+pnpm-lock.yaml
+
+# lucide-angular
+packages/lucide-angular/.angular/cache
+
+# lucide-static
+packages/lucide-static/icons
+packages/lucide-static/lib
+packages/lucide-static/sprite.svg
+packages/lucide-static/tags.json
+packages/lucide-static/icon-nodes.json
+packages/lucide-static/font
+
+# lucide-svelte
+packages/lucide-svelte/src/icons/*.svelte
+packages/lucide-svelte/.svelte-kit

docs/guide/advanced/examples/global-styling-absolute-strokewidth-example/icon.css

···
 .app {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
-  grid-template-rows: 1fr 1fr 1fr
+  grid-template-rows: 1fr 1fr 1fr;
   gap: 6px;
 }

docs/guide/advanced/examples/global-styling-css-example/icon.css

···
 .app {
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
-  grid-template-rows: 1fr 1fr 1fr
+  grid-template-rows: 1fr 1fr 1fr;
   gap: 6px;
 }

lint-staged.config.mjs

···
+/**
+ * @param {string[]} filenames
+ * @returns {string}
+ */
+const filenamesToAjvOption = (filenames) => filenames.map((filename) => `-d ${filename}`).join(' ');
+
+/** @satisfies {import('lint-staged').Config} */
+const config = {
+  'icons/*.svg': [
+    'node ./scripts/optimizeStagedSvgs.mjs',
+    'node ./scripts/generateNextJSAliases.mjs',
+  ],
+  'icons/*.json': (filenames) => [
+    `ajv --spec=draft2020 -s icon.schema.json ${filenamesToAjvOption(filenames)}`,
+    `prettier --write ${filenames.join(' ')}`,
+  ],
+  'categories/*.json': (filenames) => [
+    `ajv --spec=draft2020 -s category.schema.json ${filenamesToAjvOption(filenames)}`,
+    `prettier --write ${filenames.join(' ')}`,
+  ],
+};
+
+export default config;

package.json

···
     "generate:nextJSAliases": "node ./scripts/generateNextJSAliases.mjs",
     "postinstall": "husky install",
     "lint:es": "eslint .",
+    "lint:format": "prettier \"**/*.{js,mjs,ts,jsx,tsx,html,css,scss,json,yml,yaml}\" --write",
     "lint:json:icons": "ajv --spec=draft2020 -s icon.schema.json -d 'icons/*.json' > /dev/null",
     "lint:json:categories": "ajv --spec=draft2020 -s category.schema.json -d 'categories/*.json' > /dev/null",
     "lint:json": "pnpm run lint:json:icons && pnpm run lint:json:categories",
-    "lint": "pnpm lint:es && pnpm lint:json",
+    "lint": "pnpm lint:es && pnpm lint:format && pnpm lint:json",
     "prepare": "husky install",
     "gi": "node ./scripts/generate/generateIcons.mjs"
   },
···
     "eslint-import-resolver-custom-alias": "^1.3.2",
     "eslint-import-resolver-typescript": "^3.6.1",
     "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-prettier": "^4.2.1",
     "husky": "^8.0.3",
     "lint-staged": "^13.3.0",
     "minimist": "^1.2.8",
     "node-fetch": "^3.3.2",
     "p-memoize": "^7.1.1",
-    "prettier": "2.7.1",
+    "prettier": "3.1.1",
     "semver": "^7.5.4",
     "simple-git": "^3.21.0",
     "svgo": "^3.1.0",
     "svgson": "^5.3.1"
   },
-  "lint-staged": {
-    "icons/*.svg": [
-      "node ./scripts/optimizeStagedSvgs.mjs",
-      "node ./scripts/generateNextJSAliases.mjs"
-    ],
-    "icons/*.json": [
-      "ajv --spec=draft2020 -s icon.schema.json -d",
-      "prettier --write --print-width=0"
-    ],
-    "categories/*.json": [
-      "ajv --spec=draft2020 -s category.schema.json -d",
-      "prettier --write --print-width=0"
-    ]
-  },
-  "packageManager": "pnpm@8.7.1",
+  "packageManager": "pnpm@8.14.0+sha256.9cebf61abd83f68177b29484da72da9751390eaad46dfc3072d266bfbb1ba7bf",
   "pnpm": {
-    "peerDependencyRules": {
-      "ignoreMissing": [
-        "@babel/core",
-        "@babel/preset-env"
-      ]
-    },
     "packageExtensions": {
       "vue-template-compiler": {
         "peerDependencies": {

packages/lucide-angular/.eslintrc.js

···
         'plugin:@typescript-eslint/recommended',
         'plugin:@angular-eslint/recommended',
         'plugin:@angular-eslint/template/process-inline-templates',
+        'prettier',
       ],
       rules: {
         '@angular-eslint/directive-selector': [

packages/lucide-angular/package.json

···
     "test": "ng test --no-watch --no-progress --browsers=ChromeHeadlessCI",
     "test:watch": "ng test",
     "lint": "npx eslint 'src/**/*.{js,jsx,ts,tsx,html,css,scss}' --quiet --fix",
-    "format": "npx prettier 'src/**/*.{js,jsx,ts,tsx,html,css,scss}' --write",
     "e2e": "ng e2e",
     "version": "pnpm version --git-tag-version=false"
   },
···
     "@typescript-eslint/parser": "5.48.2",
     "eslint": "^8.33.0",
     "eslint-config-prettier": "^8.5.0",
-    "eslint-plugin-prettier": "^4.2.1",
     "jasmine-core": "~4.0.0",
     "jasmine-spec-reporter": "~7.0.0",
     "karma": "~6.3.0",

packages/lucide-vue/src/createLucideIcon.ts

···
     return createElement(
       'svg',
       {
-        // eslint-disable-next-line prettier/prettier
+        // prettier-ignore
         class: [defaultClass, data.class, data.staticClass, data.attrs && data.attrs.class].filter(Boolean),
         style: [data.style, data.staticStyle, data.attrs && data.attrs.style].filter(Boolean),
         attrs: {

pnpm-lock.yaml

···
       eslint-plugin-import:
         specifier: ^2.29.1
         version: 2.29.1(@typescript-eslint/parser@6.14.0)(eslint-import-resolver-typescript@3.6.1)(eslint@8.56.0)
-      eslint-plugin-prettier:
-        specifier: ^4.2.1
-        version: 4.2.1(eslint-config-prettier@8.10.0)(eslint@8.56.0)(prettier@2.7.1)
       husky:
         specifier: ^8.0.3
         version: 8.0.3
···
         specifier: ^7.1.1
         version: 7.1.1
       prettier:
-        specifier: 2.7.1
-        version: 2.7.1
+        specifier: 3.1.1
+        version: 3.1.1
       semver:
         specifier: ^7.5.4
         version: 7.5.4
···
       eslint-config-prettier:
         specifier: ^8.5.0
         version: 8.10.0(eslint@8.56.0)
-      eslint-plugin-prettier:
-        specifier: ^4.2.1
-        version: 4.2.1(eslint-config-prettier@8.10.0)(eslint@8.56.0)(prettier@2.8.8)
       jasmine-core:
         specifier: ~4.0.0
         version: 4.0.1
···
       - supports-color
     dev: true
 
-  /eslint-plugin-prettier@4.2.1(eslint-config-prettier@8.10.0)(eslint@8.56.0)(prettier@2.7.1):
-    resolution: {integrity: sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      eslint: '>=7.28.0'
-      eslint-config-prettier: '*'
-      prettier: '>=2.0.0'
-    peerDependenciesMeta:
-      eslint-config-prettier:
-        optional: true
-    dependencies:
-      eslint: 8.56.0
-      eslint-config-prettier: 8.10.0(eslint@8.56.0)
-      prettier: 2.7.1
-      prettier-linter-helpers: 1.0.0
-    dev: true
-
-  /eslint-plugin-prettier@4.2.1(eslint-config-prettier@8.10.0)(eslint@8.56.0)(prettier@2.8.8):
-    resolution: {integrity: sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ==}
-    engines: {node: '>=12.0.0'}
-    peerDependencies:
-      eslint: '>=7.28.0'
-      eslint-config-prettier: '*'
-      prettier: '>=2.0.0'
-    peerDependenciesMeta:
-      eslint-config-prettier:
-        optional: true
-    dependencies:
-      eslint: 8.56.0
-      eslint-config-prettier: 8.10.0(eslint@8.56.0)
-      prettier: 2.8.8
-      prettier-linter-helpers: 1.0.0
-    dev: true
-
   /eslint-scope@5.1.1:
     resolution: {integrity: sha512-2NxwbF/hZ0KpepYN0cNbo+FN6XoK7GaHlQhgx/hIZl6Va0bF45RQOOwhLIy8lQDbuCiadSLCBnH2CFYquit5bw==}
     engines: {node: '>=8.0.0'}
···
 
   /fast-deep-equal@3.1.3:
     resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
-    dev: true
-
-  /fast-diff@1.3.0:
-    resolution: {integrity: sha512-VxPP4NqbUjj6MaAOafWeUn2cXWLcCtljklUtZf0Ind4XQ+QPtmA0b18zZy0jIQx+ExRVCR/ZQpBmik5lXshNsw==}
     dev: true
 
   /fast-fifo@1.3.2:
···
     engines: {node: '>= 0.8.0'}
     dev: true
 
-  /prettier-linter-helpers@1.0.0:
-    resolution: {integrity: sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w==}
-    engines: {node: '>=6.0.0'}
-    dependencies:
-      fast-diff: 1.3.0
-    dev: true
-
   /prettier@2.7.1:
     resolution: {integrity: sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==}
     engines: {node: '>=10.13.0'}
···
   /prettier@2.8.8:
     resolution: {integrity: sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==}
     engines: {node: '>=10.13.0'}
+    hasBin: true
+    dev: true
+
+  /prettier@3.1.1:
+    resolution: {integrity: sha512-22UbSzg8luF4UuZtzgiUOfcGM8s4tjBv6dJRT7j275NXsy2jb4aJa4NNveul5x4eqlF1wuhuR2RElK71RvmVaw==}
+    engines: {node: '>=14'}
     hasBin: true
     dev: true
 

prettier.config.mjs

···
+/** @satisfies {import('prettier').Config} */
+const config = {
+  singleQuote: true,
+  trailingComma: 'all',
+  printWidth: 100,
+  overrides: [
+    {
+      files: ['icons/*.json', 'categories/*.json'],
+      options: {
+        printWidth: 0,
+      },
+    },
+  ],
+};
+
+export default config;

scripts/generateSuperSVG.mjs

···
 import path from 'path';
 import { stringify, parseSync } from 'svgson';
-import prettier from 'prettier';
+import * as prettier from 'prettier';
 import { appendFile, readSvgDirectory, getCurrentDirPath } from './helpers.mjs';
 
 import readSvgs from '../packages/lucide-static/scripts/readSvgs.mjs';
···
 const ICONS_DIR = path.resolve('icons');
 const PACKAGE_DIR = path.resolve(currentDir);
 
-export default function generateSprite(svgs, packageDir) {
+async function generateSprite(svgs, packageDir) {
   const symbols = svgs.map(({ parsedSvg }, index) => {
     const itemsPerRow = 10;
     const numInRow = index % itemsPerRow;
···
   };
 
   const spriteSvg = stringify(spriteSvgObject);
-  const prettifiedSprite = prettier.format(spriteSvg, { parser: 'babel' }).replace(/;/g, '');
+  const prettifiedSprite = (await prettier.format(spriteSvg, { parser: 'babel' })).replace(/;/g, '');
 
   const xmlMeta = `<?xml version="1.0" encoding="utf-8"?>\n`;
 
···
   parsedSvg: parseSync(contents),
 }));
 
-generateSprite(parsedSvgs, PACKAGE_DIR);
+await generateSprite(parsedSvgs, PACKAGE_DIR);

scripts/render/processSvg.mjs

···
 import {optimize} from 'svgo';
-import prettier from 'prettier';
+import * as prettier from 'prettier';
 import {parseSync, stringify} from 'svgson';
 import DEFAULT_ATTRS from './default-attrs.json' assert { type: 'json' };