[Gradle, JS] Reorganize css settings with rules

#KT-38055 fixed

libraries/tools/kotlin-gradle-plugin/src/main/kotlin/org/jetbrains/kotlin/gradle/targets/js/webpack/KotlinWebpackConfig.kt

@@ -57,16 +57,19 @@ data class KotlinWebpackConfig(
                 it.add(versions.webpackDevServer)
             }
 
-            if (!cssSettings.enabled) return@also
+            if (!cssSettings.enabled || cssSettings.rules.isEmpty()) return@also
 
             it.add(versions.cssLoader)
-            when (cssSettings.mode) {
+            cssSettings.rules.forEach { rule ->
-                EXTRACT -> it.add(versions.miniCssExtractPlugin)
+                when (rule.mode) {
-                INLINE -> it.add(versions.styleLoader)
+                    EXTRACT -> it.add(versions.miniCssExtractPlugin)
-                IMPORT -> {
+                    INLINE -> it.add(versions.styleLoader)
+                    IMPORT -> {
+                    }
+                    else -> cssError()
                 }
-                else -> cssError()
             }
+
         }
 
     enum class Mode(val code: String) {
@@ -253,7 +256,7 @@ data class KotlinWebpackConfig(
     }
 
     private fun Appendable.appendCssSettings() {
-        if (!cssSettings.enabled)
+        if (!cssSettings.enabled || cssSettings.rules.isEmpty())
             return
 
         appendln(
@@ -263,53 +266,81 @@ data class KotlinWebpackConfig(
             """.trimIndent()
         )
 
-        appendln(
-            """
-        |    const use = [
-        |        {
-        |            loader: 'css-loader',
-        |            options: {},
-        |        }
-        |    ]
-            """.trimMargin()
-        )
-
         val extractedCss =
             """
-            |    const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+            |       const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-            |    use.unshift({
+            |       use.unshift({
-            |        loader: MiniCssExtractPlugin.loader,
+            |           loader: MiniCssExtractPlugin.loader,
-            |        options: {}
+            |           options: {}
-            |    })
+            |       })
-            |    config.plugins.push(new MiniCssExtractPlugin())
+            |       config.plugins.push(new MiniCssExtractPlugin())
             """.trimMargin()
 
         val inlinedCss =
             """
-            |    use.unshift({
+            |       use.unshift({
-            |        loader: 'style-loader',
+            |           loader: 'style-loader',
-            |        options: {}
+            |           options: {}
-            |    })
+            |       })
-            |    
+            |       
             """.trimMargin()
 
-        when (cssSettings.mode) {
+        cssSettings.rules.forEach { rule ->
-            EXTRACT -> appendln(extractedCss)
+            appendln(
-            INLINE -> appendln(inlinedCss)
+                """
-            IMPORT -> {
+            |    ;(function(config) {
+            """.trimMargin()
+            )
+            appendln(
+                """
+            |       const use = [
+            |           {
+            |               loader: 'css-loader',
+            |               options: {},
+            |           }
+            |       ]
+            """.trimMargin()
+            )
+
+            when (rule.mode) {
+                EXTRACT -> appendln(extractedCss)
+                INLINE -> appendln(inlinedCss)
+                IMPORT -> {
+                }
+                else -> cssError()
             }
-            else -> cssError()
-        }
 
-        appendln(
+            val excluded = rule.exclude.let {
-            """
+                if (it.isNotEmpty()) {
-            |    config.module.rules.push({
+                    "[${it.joinToString()}]"
-            |        test: /\.css${'$'}/,
+                } else null
-            |        use: use
+            }
-            |    })
+
+            val included = rule.include.let {
+                if (it.isNotEmpty()) {
+                    "[${it.joinToString()}]"
+                } else null
+            }
+
+            appendln(
+                """
+            |       config.module.rules.push({
+            |           test: /\.css${'$'}/,
+            |           use: use,
+            |           ${excluded?.let { "exclude: $it," } ?: ""}
+            |           ${included?.let { "include: $it" } ?: ""}
+            |       })
 
             """.trimMargin()
-        )
+            )
+
+            appendln(
+                """
+            |   })(config);
+            
+            """.trimMargin()
+            )
+        }
 
         appendln(
             """

libraries/tools/kotlin-gradle-plugin/src/main/kotlin/org/jetbrains/kotlin/gradle/targets/js/webpack/KotlinWebpackCssSettings.kt

@@ -6,14 +6,46 @@
 package org.jetbrains.kotlin.gradle.targets.js.webpack
 
 import org.gradle.api.tasks.Input
+import org.gradle.api.tasks.Internal
+import org.gradle.api.tasks.Nested
 import org.jetbrains.kotlin.gradle.targets.js.webpack.KotlinWebpackCssMode.INLINE
 
 data class KotlinWebpackCssSettings(
     @Input
     var enabled: Boolean = true,
 
+    @Nested
+    var rules: MutableList<KotlinWebpackCssRule> = mutableListOf(
+        KotlinWebpackCssRule()
+    )
+) {
+    @get:Internal
+    var mode: String
+        get() =
+            rules
+                .singleOrNull()
+                ?.mode ?: singleRuleError()
+        set(value) {
+            rules.singleOrNull()
+                ?.let {
+                    it.mode = value
+                } ?: singleRuleError()
+        }
+
+    private fun singleRuleError(): Nothing {
+        throw error("CSS mode shortcut can be applied only with one css rule")
+    }
+}
+
+data class KotlinWebpackCssRule(
     @Input
-    var mode: String = INLINE
+    var mode: String = INLINE,
+
+    @Input
+    var include: MutableList<String> = mutableListOf(),
+
+    @Input
+    var exclude: MutableList<String> = mutableListOf()
 )
 
 object KotlinWebpackCssMode {