Fix hoistUseStatements not working with multiline imports

src/utils/processResources.js

@@ -1,7 +1,9 @@
 import logger from './logger';
 
+// Matches opening and closing parenthesis across multiple lines
+const multilineParenthesisRegex = '\\([\\s\\S]*?\\);?';
 // Finds any @use statement
-const useRegex = '^@use .*\n?$';
+const useRegex = `^@use \\S*(?: with ${multilineParenthesisRegex}|.*)?\n?$`;
 // Same as above, but adds the m (multiline) flag
 const useRegexTest = new RegExp(useRegex, 'm');
 // Makes sure that only the last instance of `useRegex` variable is found

test/__snapshots__/index.test.js.snap

@@ -72,6 +72,32 @@ div {
 "
 `;
 
+exports[`sass-resources-loader hoisting should work with multiline @use statements 1`] = `
+"@use 'shared/index' with (
+    $text-color: blue
+);
+
+$text-color: $ccc;
+
+@mixin my-mixin {
+    background-color: gray;
+    color: white;
+}
+
+@function always-blue() {
+    @return blue;
+}
+
+div {
+    @include secret.my-mixin;
+
+    p {
+        color: secret.always-blue();
+    }
+}
+"
+`;
+
 exports[`sass-resources-loader imports should preserve import method 1`] = `
 "@use 'shared/index' as secret;
 @import 'shared/variables';

test/index.test.js

@@ -211,6 +211,17 @@ describe('sass-resources-loader', () => {
       const output = require('./output/hoist3').default;
       expect(output).toMatchSnapshot();
     }));
+
+    it('should work with multiline @use statements', () => execTest('hoist-multiline', {
+      resources: [
+        path.resolve(__dirname, './scss/shared/_variables.scss'),
+      ],
+      hoistUseStatements: true,
+    }).then(() => {
+      // eslint-disable-next-line global-require
+      const output = require('./output/hoist-multiline').default;
+      expect(output).toMatchSnapshot();
+    }));
   });
 
   describe('imports', () => {

test/scss/hoist-multiline.scss

@@ -0,0 +1,11 @@
+@use 'shared/index' with (
+    $text-color: blue
+);
+
+div {
+    @include secret.my-mixin;
+
+    p {
+        color: secret.always-blue();
+    }
+}