chore: add stylelint

.eslintrc.json

@@ -0,0 +1,12 @@
+{
+  "root": true,
+  "env": { "browser": true, "es2020": true },
+  "extends": [
+    "eslint:recommended",
+    "plugin:@typescript-eslint/recommended",
+    "prettier"
+  ],
+  "ignorePatterns": ["dist", ".eslintrc.cjs"],
+  "parser": "@typescript-eslint/parser",
+  "plugins": ["prettier"]
+}

.lintstagedrc.json

@@ -3,5 +3,6 @@
     "eslint --quiet --fix",
     "prettier --write --ignore-unknown"
   ],
+  "*.{css,scss}": "stylelint --fix",
   "*.{json,html}": ["prettier --write --ignore-unknown"]
 }

.stylelintignore

@@ -0,0 +1,5 @@
+node_modules
+public
+dist
+coverage
+.scannerwork

.stylelintrc.json

@@ -0,0 +1,17 @@
+{
+  "extends": [
+    "stylelint-config-standard-scss",
+    "stylelint-config-recess-order",
+    "stylelint-prettier/recommended"
+  ],
+  "rules": {
+    "custom-property-no-missing-var-function": null,
+    "selector-class-pattern": [
+      "^[a-z]([a-z0-9-]+)?(__([a-z0-9]+-?)+)?(--([a-z0-9]+-?)+){0,2}$",
+      {
+        "message": "Expected BEM naming convention for class."
+      }
+    ],
+    "declaration-no-important": true
+  }
+}

package.json

@@ -16,6 +16,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
+    "classnames": "2.5.1",
     "preact": "10.19.6"
   },
   "devDependencies": {
@@ -38,6 +39,11 @@
     "lint-staged": "15.2.2",
     "prettier": "3.2.5",
     "sass": "1.71.1",
+    "stylelint": "16.2.1",
+    "stylelint-config-recess-order": "5.0.0",
+    "stylelint-config-standard-scss": "13.0.0",
+    "stylelint-order": "6.0.4",
+    "stylelint-prettier": "5.0.0",
     "typescript": "5.4.2",
     "vite": "5.1.5",
     "vitest": "1.3.1"