Use standard side effects in Elements.kt (#1793)

JetBrains · Feb 4, 2022 · 6aaeddc · 6aaeddc
1 parent 6ba538c
commit 6aaeddc
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 23 deletions.
diff --git a/web/core/src/jsMain/kotlin/org/jetbrains/compose/web/elements/Elements.kt b/web/core/src/jsMain/kotlin/org/jetbrains/compose/web/elements/Elements.kt
@@ -697,15 +697,14 @@ fun TextArea(
             this.copyFrom(textAreaAttrsBuilder)
         },
         content = {
-            DomSideEffect(keyForRestoringControlledState.value, textAreaRestoreControlledStateEffect)
+            DisposableEffect(keyForRestoringControlledState.value) {
+                restoreControlledTextAreaState(element = scopeElement)
+                onDispose { }
+            }
         }
     )
 }
 
-private val textAreaRestoreControlledStateEffect: DomEffectScope.(HTMLTextAreaElement) -> Unit = {
-    restoreControlledTextAreaState(element = it)
-}
-
 @Composable
 fun Nav(
     attrs: AttrBuilderContext<HTMLElement>? = null,
@@ -933,12 +932,11 @@ fun Style(
             }
         },
     ) {
-        DomSideEffect(cssRules) { style ->
-            (style.sheet as? CSSStyleSheet)?.let { cssStylesheet ->
-                setCSSRules(cssStylesheet, cssRules)
-                onDispose {
-                    clearCSSRules(cssStylesheet)
-                }
+        DisposableEffect(cssRules) {
+            val cssStylesheet = scopeElement.sheet as? CSSStyleSheet
+            cssStylesheet?.setCSSRules(cssRules)
+            onDispose {
+                cssStylesheet?.clearCSSRules()
             }
         }
     }
@@ -959,6 +957,12 @@ inline fun Style(
     Style(applyAttrs, builder.cssRules)
 }
 
+private fun CSSStyleSheet.clearCSSRules() {
+    repeat(cssRules.length) {
+        deleteRule(0)
+    }
+}
+
 /**
  * Adds <input> element of [type].
  *
@@ -1017,15 +1021,14 @@ fun <K> Input(
             if (type == InputType.Radio) {
                 DisposeRadioGroupEffect()
             }
-            DomSideEffect(keyForRestoringControlledState.value, inputRestoreControlledStateEffect)
+            DisposableEffect(keyForRestoringControlledState.value) {
+                restoreControlledInputState(inputElement = scopeElement)
+                onDispose { }
+            }
         }
     )
 }
 
-private val inputRestoreControlledStateEffect: DomEffectScope.(HTMLInputElement) -> Unit = {
-    restoreControlledInputState(inputElement = it)
-}
-
 @Composable
 fun <K> Input(type: InputType<K>) {
     Input(type) {}

diff --git a/web/core/src/jsMain/kotlin/org/jetbrains/compose/web/elements/Style.kt b/web/core/src/jsMain/kotlin/org/jetbrains/compose/web/elements/Style.kt
@@ -7,15 +7,10 @@ import org.w3c.dom.css.CSSStyleRule
 import org.jetbrains.compose.web.css.*
 import org.w3c.dom.css.CSSStyleSheet
 
-internal fun clearCSSRules(sheet: CSSStyleSheet) {
-    repeat(sheet.cssRules.length) {
-        sheet.deleteRule(0)
-    }
-}
 
-internal fun setCSSRules(sheet: CSSStyleSheet, cssRules: CSSRuleDeclarationList) {
+internal fun CSSStyleSheet.setCSSRules(cssRules: CSSRuleDeclarationList) {
     cssRules.forEach { cssRule ->
-        sheet.addRule(cssRule)
+        addRule(cssRule)
     }
 }