@defra/docusaurus-theme-govuk 0.0.3-alpha → 0.0.4-alpha

package/index.js

@@ -91,6 +91,13 @@ module.exports = function themeGovuk(context, options) {
         return path.resolve(pkgDir, main);
       }
 
+      // Use MiniCssExtractPlugin for production/server builds, style-loader for dev/client
+      let MiniCssExtractPlugin;
+      if (!isServer && process.env.NODE_ENV === 'production') {
+        MiniCssExtractPlugin = require('mini-css-extract-plugin');
+        if (!config.plugins) config.plugins = [];
+        config.plugins.push(new MiniCssExtractPlugin({ filename: 'assets/css/govuk-theme.[contenthash].css' }));
+      }
       return {
         // Also resolve webpack loaders from the theme's own node_modules.
         // When consumed via file: (local dev), loaders like style-loader,
@@ -212,7 +219,9 @@ module.exports = function themeGovuk(context, options) {
             {
               test: /\.scss$/,
               use: [
-                'style-loader',
+                (!isServer && process.env.NODE_ENV === 'production')
+                  ? require('mini-css-extract-plugin').loader
+                  : 'style-loader',
                 {
                   loader: 'css-loader',
                   options: {
@@ -234,10 +243,6 @@ module.exports = function themeGovuk(context, options) {
                   loader: 'sass-loader',
                   options: {
                     implementation: require(require.resolve('sass', { paths: [siteDir] })),
-                    // Override GOV.UK asset path to include the Docusaurus baseUrl.
-                    // The default '../../assets/' produces URLs without baseUrl,
-                    // causing 404s when baseUrl is not '/'.
-                    // Only prepend for SCSS/Sass files — plain CSS can't use Sass variables.
                     additionalData: (content, loaderContext) => {
                       if (/\.scss$|\.sass$/.test(loaderContext.resourcePath)) {
                         return `$govuk-assets-path: '${baseUrl}assets/';\n` + content;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@defra/docusaurus-theme-govuk",
-  "version": "0.0.3-alpha",
+  "version": "0.0.4-alpha",
   "description": "A Docusaurus theme implementing the GOV.UK Design System for consistent, accessible documentation sites",
   "main": "index.js",
   "license": "MIT",
@@ -41,5 +41,8 @@
   },
   "engines": {
     "node": ">=18.0"
+  },
+  "devDependencies": {
+    "mini-css-extract-plugin": "^2.10.0"
   }
 }

package/src/lib/react-foundry-router-shim.js

@@ -43,13 +43,9 @@ export const useIsActive = () => {
 
   return (href, exact = true) => {
     const target = URI.parse(href, location.pathname);
-    const dir = target.pathname.endsWith('/') ? target.pathname : target.pathname + '/';
-    // Root path '/' should only match exactly, not as a prefix for all paths
-    const pathStart = target.pathname === '' || (target.pathname !== '/' && location.pathname.startsWith(dir));
-    const pathMatch = target.pathname === '' || location.pathname === target.pathname;
+    const pathMatch = location.pathname === target.pathname;
     const queryMatch = includes(location.query, target.query);
-    const activeExact = !!(pathMatch && queryMatch);
-    return exact ? activeExact : !!(activeExact || (pathStart && queryMatch));
+    return pathMatch && queryMatch;
   };
 };
 

package/src/theme/Layout/index.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import '../../css/theme.scss';
 import {SkipLink, Header, Footer, PhaseBanner, ServiceNavigation, NavigationMenu} from '@not-govuk/simple-components';
 import {useLocation} from '@docusaurus/router';
 import Head from '@docusaurus/Head';