Bundle use-local-storage-state package with @guardian/react-crossword (#2040)

* Extend Rollup config to allow bundling of external module

Author: jamesmockett

.changeset/warm-bears-sink.md

@@ -0,0 +1,5 @@
+---
+'@guardian/react-crossword': minor
+---
+
+Bundles `use-local-storage-state` package to enable consumers of the crossword package to transpile if required in order to support older browsers

configs/rollup/rollup.config.js

@@ -19,40 +19,52 @@ const output = {
 	preserveModulesRoot: 'src',
 };
 
-/** @type {Plugins} */
-const defaultPlugins = [
+/**
+ * @param {import('rollup-plugin-node-externals').ExternalsOptions} externalsOptions
+ * @returns {Plugins}
+ */
+
+const defaultPlugins = (externalsOptions) => [
 	nodeResolve({
 		extensions: ['.cjs', '.mjs', '.js', '.jsx', '.ts', '.tsx', '.json'],
 	}),
 	commonjs(),
 	json(),
-	nodeExternals(),
+	nodeExternals(externalsOptions),
 ];
 
 /**
  * @param {object} param0
  * @param {Plugins} [param0.plugins]
  * @param {Input} [param0.input]
+ * @param {import('rollup-plugin-node-externals').ExternalsOptions} [param0.externalsOptions]
+ * @param {import("rollup").RollupOptions["output"]} [param0.cjsOutputOptions]
  * @returns {import("rollup").RollupOptions[]}
  */
-export default ({ input = defaultInput, plugins = [] } = {}) => [
+export default ({
+	input = defaultInput,
+	plugins = [],
+	externalsOptions,
+	cjsOutputOptions,
+} = {}) => [
 	{
 		input,
 		output,
-		plugins: [...defaultPlugins, ...plugins, esbuild()],
+		plugins: [...defaultPlugins(externalsOptions), ...plugins, esbuild()],
 	},
 	{
 		input,
 		output: {
 			...output,
+			...cjsOutputOptions,
 			format: 'cjs',
 			entryFileNames: '[name].cjs',
 		},
-		plugins: [...defaultPlugins, ...plugins, esbuild()],
+		plugins: [...defaultPlugins(externalsOptions), ...plugins, esbuild()],
 	},
 	{
 		input,
 		output,
-		plugins: [...defaultPlugins, ...plugins, dts()],
+		plugins: [...defaultPlugins(externalsOptions), ...plugins, dts()],
 	},
 ];

libs/@guardian/react-crossword/rollup.config.js

@@ -2,4 +2,6 @@ import config from '../../../configs/rollup/rollup.config.js';
 
 export default config({
 	input: 'src/index.ts',
+	externalsOptions: { exclude: 'use-local-storage-state' },
+	cjsOutputOptions: { exports: 'named' },
 });