fix styles and bump @embroider/addon-dev & babel-plugin-ember-template-compilation

Author: aklkv

addon/babel.config.json

@@ -10,7 +10,7 @@
     ],
     "@embroider/addon-dev/template-colocation-plugin",
     [
-      "babel-plugin-ember-template-compilation",
+      "module:babel-plugin-ember-template-compilation",
       {
         "targetFormat": "hbs",
         "transforms": []

addon/eslint.config.mjs

@@ -12,7 +12,7 @@
  *     npx eslint --inspect-config
  *
  */
-import babelParser from '@babel/eslint-parser';
+import babelParser from '@babel/eslint-parser/experimental-worker';
 import js from '@eslint/js';
 import prettier from 'eslint-config-prettier';
 import ember from 'eslint-plugin-ember/recommended';

addon/package.json

@@ -62,37 +62,38 @@
     "decorator-transforms": "^2.3.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.27.4",
-    "@babel/eslint-parser": "^7.27.5",
-    "@babel/plugin-transform-typescript": "^7.27.1",
-    "@babel/runtime": "^7.27.6",
-    "@embroider/addon-dev": "^7.1.4",
-    "@eslint/js": "^9.29.0",
+    "@babel/core": "^7.28.4",
+    "@babel/eslint-parser": "^7.28.4",
+    "@babel/plugin-transform-typescript": "^7.28.0",
+    "@babel/runtime": "^7.28.4",
+    "@embroider/addon-dev": "^8.1.0",
+    "@eslint/js": "^9.36.0",
     "@glimmer/component": "^2.0.0",
     "@glint/core": "^1.5.2",
     "@glint/environment-ember-loose": "^1.5.2",
     "@glint/environment-ember-template-imports": "^1.5.2",
-    "@glint/template": "^1.5.2",
+    "@glint/template": "1.5.2",
     "@rollup/plugin-babel": "^6.0.4",
-    "@tsconfig/ember": "^3.0.10",
-    "babel-plugin-ember-template-compilation": "^2.4.1",
-    "concurrently": "^9.1.2",
-    "ember-source": "^6.5.0",
-    "ember-template-lint": "^7.9.1",
-    "eslint": "^9.29.0",
-    "eslint-config-prettier": "^10.1.5",
-    "eslint-plugin-ember": "^12.5.0",
-    "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-n": "^17.20.0",
-    "globals": "^16.2.0",
-    "prettier": "^3.5.3",
-    "prettier-plugin-ember-template-tag": "^2.0.6",
-    "rollup": "^4.43.0",
+    "@tsconfig/ember": "^3.0.11",
+    "babel-plugin-ember-template-compilation": "^3.0.1",
+    "concurrently": "^9.2.1",
+    "ember-source": "^6.7.0",
+    "ember-template-lint": "^7.9.3",
+    "eslint": "^9.36.0",
+    "eslint-config-prettier": "^10.1.8",
+    "eslint-plugin-ember": "^12.7.4",
+    "eslint-plugin-import": "^2.32.0",
+    "eslint-plugin-n": "^17.23.1",
+    "globals": "^16.4.0",
+    "prettier": "^3.6.2",
+    "prettier-plugin-ember-template-tag": "^2.1.0",
+    "rollup": "^4.52.3",
     "rollup-plugin-copy": "^3.5.0",
-    "stylelint": "^16.20.0",
-    "stylelint-config-standard": "^38.0.0",
-    "typescript": "~5.8.3",
-    "typescript-eslint": "^8.34.0"
+    "rollup-plugin-import-css": "^4.0.2",
+    "stylelint": "^16.24.0",
+    "stylelint-config-standard": "^39.0.0",
+    "typescript": "~5.9.3",
+    "typescript-eslint": "^8.45.0"
   },
   "ember": {
     "edition": "octane"
@@ -105,4 +106,4 @@
     "type": "addon",
     "version": 2
   }
-}
+}

addon/rollup.config.mjs

@@ -1,6 +1,7 @@
 import { Addon } from '@embroider/addon-dev/rollup';
 import { babel } from '@rollup/plugin-babel';
 import copy from 'rollup-plugin-copy';
+import css from 'rollup-plugin-import-css';
 
 const addon = new Addon({
   srcDir: 'src',
@@ -59,7 +60,13 @@ export default {
 
     // addons are allowed to contain imports of .css files, which we want rollup
     // to leave alone and keep in the published output.
-    addon.keepAssets(['**/*.css']),
+    // addon.keepAssets(['**/*.css']),
+
+    css({
+      output: 'styles/navigation-narrator.css',
+      preserveImports: true,
+      minify: true,
+    }),
 
     // Remove leftover build artifacts when starting a new build.
     addon.clean(),

addon/src/components/navigation-narrator.gts

@@ -5,6 +5,7 @@ import { on } from '@ember/modifier';
 import { registerDestructor } from '@ember/destroyable';
 import { schedule, cancel } from '@ember/runloop';
 
+import '../styles/navigation-narrator.css';
 import { defaultValidator } from '../utils/validators.js';
 
 import type RouterService from '@ember/routing/router-service';
@@ -36,15 +37,14 @@ export interface NavigationNarratorSignature {
   Element: HTMLElement;
 }
 
-
 /**
  * 🎧 NavigationNarrator
  *
  * Announces route changes for screen readers using a visually-hidden element,
  * and optionally renders a "Skip to main content" link.
  *
  * Usage:
- * ```gts
+ * ```gjs
  * import { NavigationNarrator } from 'ember-a11y-refocus';
  *
  * <template>

addon/src/styles/navigation-narrator.css

@@ -4,7 +4,7 @@
   height: 1px;
   padding: 0;
   overflow: hidden;
-  clip: rect(0, 0, 0, 0);
+  clip-path: inset(50%);
   white-space: nowrap;
   border: 0;
 }

package.json

@@ -20,14 +20,14 @@
   },
   "devDependencies": {
     "@glint/core": "^1.5.2",
-    "concurrently": "^9.1.2",
-    "prettier": "^3.5.3",
-    "prettier-plugin-ember-template-tag": "^2.0.6",
-    "release-plan": "^0.17.0"
+    "concurrently": "^9.2.1",
+    "prettier": "^3.6.2",
+    "prettier-plugin-ember-template-tag": "^2.1.0",
+    "release-plan": "^0.17.2"
   },
   "packageManager": "[email protected]+sha512.fce8a3dd29a4ed2ec566fb53efbb04d8c44a0f05bc6f24a73046910fb9c3ce7afa35a0980500668fa3573345bd644644fa98338fa168235c80f4aa17aa17fbef",
   "engines": {
     "node": "22.x",
     "pnpm": ">= 10"
   }
-}
+}