From 2ffd4b15b729c94e992171f7a11cdb67f0dcb091 Mon Sep 17 00:00:00 2001
From: Louis Escher <66965600+louisescher@users.noreply.github.com>
Date: Wed, 15 Jan 2025 13:09:54 +0100
Subject: [PATCH] Add ability to use custom CSS files for customization

---
 packages/studiocms_ui/src/integration.ts | 17 +++++++++++++++++
 1 file changed, 17 insertions(+)

diff --git a/packages/studiocms_ui/src/integration.ts b/packages/studiocms_ui/src/integration.ts
index c45e440..5d43faf 100644
--- a/packages/studiocms_ui/src/integration.ts
+++ b/packages/studiocms_ui/src/integration.ts
@@ -34,6 +34,7 @@ export default function integration(options: Options = {}): AstroIntegration {
 		hooks: {
 			'astro:config:setup': (params) => {
 				const { injectScript, updateConfig } = params;
+				const { resolve: rootResolve } = createResolver(params.config.root.pathname);
 
 				updateConfig({
 					vite: {
@@ -57,6 +58,22 @@ export default function integration(options: Options = {}): AstroIntegration {
 				});
 
 				injectScript('page-ssr', `import 'studiocms:ui/global-css';`);
+
+				if (options.customCss) {
+					const customCss = viteVirtualModulePluginBuilder(
+						'studiocms:ui/custom-css',
+						'sui-custom-css',
+						`import '${rootResolve(options.customCss)}'`
+					);
+
+					updateConfig({
+						vite: {
+							plugins: [customCss()]
+						}
+					});
+
+					injectScript('page-ssr', `import 'studiocms:ui/custom-css';`);
+				}
 			},
 		},
 	};