chore(*): added linting and formatting to CI

.github/workflows/test.yaml

@@ -9,6 +9,29 @@ on:
       - "**"
 
 jobs:
+  lint:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup node
+        uses: actions/setup-node@v4
+        with:
+          node-version: '20'
+          check-latest: true
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: latest
+      - name: Install dependencies
+        run: pnpm install
+      - name: Run ESLint on core packages
+        run: pnpm --filter="@firebase-ui/*" run lint
+      - name: Run ESLint on example apps
+        run: pnpm --filter="angular-example" --filter="nextjs" --filter="react" run lint
+      - name: Check Prettier formatting
+        run: pnpm format:check
+
   test:
     runs-on: ubuntu-latest
     steps:

.gitignore

@@ -15,6 +15,9 @@ dist-ssr
 # Angular
 .angular
 
+# Next.js
+.next
+
 # Coverage
 coverage
 

.prettierignore

@@ -13,6 +13,7 @@ releases/
 # Generated files
 *.min.js
 *.min.css
+packages/styles/dist.css
 
 # Logs
 *.log

examples/angular/eslint.config.js

@@ -16,6 +16,8 @@
 
 import js from "@eslint/js";
 import prettier from "eslint-config-prettier";
+import typescript from "@typescript-eslint/eslint-plugin";
+import typescriptParser from "@typescript-eslint/parser";
 
 export default [
   { ignores: ["dist/**", "node_modules/**", ".angular/**"] },
@@ -26,13 +28,18 @@ export default [
     languageOptions: {
       ecmaVersion: 2022,
       sourceType: "module",
+      parser: typescriptParser,
       parserOptions: {
         project: "./tsconfig.json",
       },
     },
+    plugins: {
+      "@typescript-eslint": typescript,
+    },
     rules: {
-      "no-unused-vars": ["error", { varsIgnorePattern: "^_", argsIgnorePattern: "^_" }],
-      "no-console": "warn",
+      "no-unused-vars": "off", // Use TypeScript version instead
+      "no-console": "off", // Allow console in examples
+      "no-undef": "off", // TypeScript handles this
       "prefer-const": "error",
       "no-var": "error",
       "@typescript-eslint/no-explicit-any": "warn",

examples/angular/package.json

@@ -1,6 +1,7 @@
 {
   "name": "angular-example",
   "version": "0.0.0",
+  "type": "module",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",
@@ -51,6 +52,8 @@
     "@types/jasmine": "~5.1.0",
     "@types/node": "^20.19.0",
     "eslint": "^9.22.0",
+    "@typescript-eslint/eslint-plugin": "^8.43.0",
+    "@typescript-eslint/parser": "^8.43.0",
     "eslint-config-prettier": "^9.1.0",
     "firebase": "^11",
     "jasmine-core": "~5.5.0",
@@ -64,4 +67,4 @@
     "prettier": "^3.1.1",
     "typescript": "~5.9.2"
   }
-}
+}

examples/nextjs/.eslintrc.json

@@ -0,0 +1,9 @@
+{
+  "extends": ["next/core-web-vitals"],
+  "parser": "@typescript-eslint/parser",
+  "plugins": ["@typescript-eslint"],
+  "rules": {
+    "@typescript-eslint/no-explicit-any": "warn",
+    "no-console": "off"
+  }
+}

examples/nextjs/package.json

@@ -27,6 +27,10 @@
     "@types/node": "^20",
     "@types/react": "^19",
     "@types/react-dom": "^19",
+    "eslint": "^9.22.0",
+    "eslint-config-next": "^15.1.7",
+    "@typescript-eslint/eslint-plugin": "^8.43.0",
+    "@typescript-eslint/parser": "^8.43.0",
     "postcss": "^8.5.2",
     "postcss-load-config": "^6.0.1",
     "prettier": "^3.1.1",

packages/core/eslint.config.js

@@ -41,7 +41,7 @@ export default [
       "@typescript-eslint": tseslint,
     },
     rules: {
-      "no-unused-vars": "off", // Turn off base rule
+      "no-unused-vars": "off",
       "no-console": "warn",
       "prefer-const": "error",
       "no-var": "error",
@@ -75,7 +75,7 @@ export default [
       "@typescript-eslint": tseslint,
     },
     rules: {
-      "no-unused-vars": "off", // Turn off base rule
+      "no-unused-vars": "off",
       "no-console": "warn",
       "prefer-const": "error",
       "no-var": "error",

packages/styles/package.json

@@ -16,7 +16,9 @@
     "./tailwind": "./src/base.css",
     "./themes/*": "./src/themes/*.css"
   },
-  "sideEffects": ["**/*.css"],
+  "sideEffects": [
+    "**/*.css"
+  ],
   "files": [
     "dist.css",
     "src"

packages/styles/src.css

@@ -22,7 +22,7 @@
 
 @layer theme, components, utilities;
 
- /* Bring in theme vars so Tailwind can resolve tokens in @apply */
+/* Bring in theme vars so Tailwind can resolve tokens in @apply */
 @import "tailwindcss/theme.css" layer(theme);
 
 /* Load utilities so @apply can expand, but do NOT emit any utility classes */

packages/styles/src/base.css

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
- @layer theme {
+@layer theme {
   :root {
     /* The primary color is used for the button and link colors */
     --fui-primary: var(--color-black);