Add missing form HTML elements

DATALIST, FIELDSET, LEGEND, METER, OUTPUT, PROGRESS see https://developer.mozilla.org/en-US/docs/Web/HTML/Element
JetBrains · Jun 14, 2021 · 18ff668 · 18ff668
1 parent 84cee1b
commit 18ff668
Show file tree

Hide file tree

Showing 3 changed files with 104 additions and 0 deletions.
diff --git a/web/core/src/jsMain/kotlin/androidx/compose/web/elements/Base.kt b/web/core/src/jsMain/kotlin/androidx/compose/web/elements/Base.kt
@@ -21,21 +21,27 @@ import org.w3c.dom.HTMLAreaElement
 import org.w3c.dom.HTMLAudioElement
 import org.w3c.dom.HTMLBRElement
 import org.w3c.dom.HTMLButtonElement
+import org.w3c.dom.HTMLDataListElement
 import org.w3c.dom.HTMLDivElement
 import org.w3c.dom.HTMLElement
+import org.w3c.dom.HTMLFieldSetElement
 import org.w3c.dom.HTMLFormElement
 import org.w3c.dom.HTMLHRElement
 import org.w3c.dom.HTMLHeadingElement
 import org.w3c.dom.HTMLImageElement
 import org.w3c.dom.HTMLInputElement
 import org.w3c.dom.HTMLLIElement
 import org.w3c.dom.HTMLLabelElement
+import org.w3c.dom.HTMLLegendElement
 import org.w3c.dom.HTMLMapElement
+import org.w3c.dom.HTMLMeterElement
 import org.w3c.dom.HTMLOListElement
 import org.w3c.dom.HTMLOptGroupElement
 import org.w3c.dom.HTMLOptionElement
+import org.w3c.dom.HTMLOutputElement
 import org.w3c.dom.HTMLParagraphElement
 import org.w3c.dom.HTMLPreElement
+import org.w3c.dom.HTMLProgressElement
 import org.w3c.dom.HTMLSelectElement
 import org.w3c.dom.HTMLSpanElement
 import org.w3c.dom.HTMLStyleElement
@@ -105,6 +111,13 @@ interface ElementBuilder<TElement : Element> {
         val Track: ElementBuilder<HTMLTrackElement> = ElementBuilderImplementation("track")
         val Video: ElementBuilder<HTMLVideoElement> = ElementBuilderImplementation("video")
 
+        val Datalist: ElementBuilder<HTMLDataListElement> = ElementBuilderImplementation("datalist")
+        val Fieldset: ElementBuilder<HTMLFieldSetElement> = ElementBuilderImplementation("fieldset")
+        val Legend: ElementBuilder<HTMLLegendElement> = ElementBuilderImplementation("legend")
+        val Meter: ElementBuilder<HTMLMeterElement> = ElementBuilderImplementation("meter")
+        val Output: ElementBuilder<HTMLOutputElement> = ElementBuilderImplementation("output")
+        val Progress: ElementBuilder<HTMLProgressElement> = ElementBuilderImplementation("progress")
+
         val Div: ElementBuilder<HTMLDivElement> = ElementBuilderImplementation("div")
         val A: ElementBuilder<HTMLAnchorElement> = ElementBuilderImplementation("a")
         val Input: ElementBuilder<HTMLInputElement> = ElementBuilderImplementation("input")

diff --git a/web/core/src/jsMain/kotlin/androidx/compose/web/elements/Elements.kt b/web/core/src/jsMain/kotlin/androidx/compose/web/elements/Elements.kt
@@ -20,21 +20,27 @@ import org.w3c.dom.HTMLAreaElement
 import org.w3c.dom.HTMLAudioElement
 import org.w3c.dom.HTMLBRElement
 import org.w3c.dom.HTMLButtonElement
+import org.w3c.dom.HTMLDataListElement
 import org.w3c.dom.HTMLDivElement
 import org.w3c.dom.HTMLElement
+import org.w3c.dom.HTMLFieldSetElement
 import org.w3c.dom.HTMLFormElement
 import org.w3c.dom.HTMLHeadingElement
 import org.w3c.dom.HTMLHRElement
 import org.w3c.dom.HTMLImageElement
 import org.w3c.dom.HTMLInputElement
 import org.w3c.dom.HTMLLIElement
 import org.w3c.dom.HTMLLabelElement
+import org.w3c.dom.HTMLLegendElement
 import org.w3c.dom.HTMLMapElement
+import org.w3c.dom.HTMLMeterElement
 import org.w3c.dom.HTMLOListElement
 import org.w3c.dom.HTMLOptGroupElement
 import org.w3c.dom.HTMLOptionElement
+import org.w3c.dom.HTMLOutputElement
 import org.w3c.dom.HTMLParagraphElement
 import org.w3c.dom.HTMLPreElement
+import org.w3c.dom.HTMLProgressElement
 import org.w3c.dom.HTMLSelectElement
 import org.w3c.dom.HTMLSpanElement
 import org.w3c.dom.HTMLTableCaptionElement
@@ -160,6 +166,78 @@ fun Video(
     )
 }
 
+@Composable
+fun Datalist(
+    attrs: AttrBuilderContext<HTMLDataListElement> = {},
+    content: ContentBuilder<HTMLDataListElement>? = null
+) {
+    TagElement(
+        elementBuilder = ElementBuilder.Datalist,
+        applyAttrs = attrs,
+        content = content
+    )
+}
+
+@Composable
+fun Fieldset(
+    attrs: AttrBuilderContext<HTMLFieldSetElement> = {},
+    content: ContentBuilder<HTMLFieldSetElement>? = null
+) {
+    TagElement(
+        elementBuilder = ElementBuilder.Fieldset,
+        applyAttrs = attrs,
+        content = content
+    )
+}
+
+@Composable
+fun Legend(
+    attrs: AttrBuilderContext<HTMLLegendElement> = {},
+    content: ContentBuilder<HTMLLegendElement>? = null
+) {
+    TagElement(
+        elementBuilder = ElementBuilder.Legend,
+        applyAttrs = attrs,
+        content = content
+    )
+}
+
+@Composable
+fun Meter(
+    attrs: AttrBuilderContext<HTMLMeterElement> = {},
+    content: ContentBuilder<HTMLMeterElement>? = null
+) {
+    TagElement(
+        elementBuilder = ElementBuilder.Meter,
+        applyAttrs = attrs,
+        content = content
+    )
+}
+
+@Composable
+fun Output(
+    attrs: AttrBuilderContext<HTMLOutputElement> = {},
+    content: ContentBuilder<HTMLOutputElement>? = null
+) {
+    TagElement(
+        elementBuilder = ElementBuilder.Output,
+        applyAttrs = attrs,
+        content = content
+    )
+}
+
+@Composable
+fun Progress(
+    attrs: AttrBuilderContext<HTMLProgressElement> = {},
+    content: ContentBuilder<HTMLProgressElement>? = null
+) {
+    TagElement(
+        elementBuilder = ElementBuilder.Progress,
+        applyAttrs = attrs,
+        content = content
+    )
+}
+
 @Composable
 fun Text(value: String) {
     ComposeNode<DomNodeWrapper, DomApplier>(

diff --git a/web/core/src/jsTest/kotlin/elements/ElementsTests.kt b/web/core/src/jsTest/kotlin/elements/ElementsTests.kt
@@ -22,8 +22,10 @@ import org.jetbrains.compose.web.dom.Code
 import org.jetbrains.compose.web.dom.Col
 import org.jetbrains.compose.web.dom.Colgroup
 import org.jetbrains.compose.web.dom.ContentBuilder
+import org.jetbrains.compose.web.dom.Datalist
 import org.jetbrains.compose.web.dom.Div
 import org.jetbrains.compose.web.dom.Em
+import org.jetbrains.compose.web.dom.Fieldset
 import org.jetbrains.compose.web.dom.Footer
 import org.jetbrains.compose.web.dom.Form
 import org.jetbrains.compose.web.dom.H1
@@ -38,13 +40,17 @@ import org.jetbrains.compose.web.dom.Hr
 import org.jetbrains.compose.web.dom.I
 import org.jetbrains.compose.web.dom.Img
 import org.jetbrains.compose.web.dom.Label
+import org.jetbrains.compose.web.dom.Legend
 import org.jetbrains.compose.web.dom.Main
+import org.jetbrains.compose.web.dom.Meter
 import org.jetbrains.compose.web.dom.Nav
 import org.jetbrains.compose.web.dom.Ol
 import org.jetbrains.compose.web.dom.OptGroup
 import org.jetbrains.compose.web.dom.Option
+import org.jetbrains.compose.web.dom.Output
 import org.jetbrains.compose.web.dom.P
 import org.jetbrains.compose.web.dom.Pre
+import org.jetbrains.compose.web.dom.Progress
 import org.jetbrains.compose.web.dom.Section
 import org.jetbrains.compose.web.dom.Select
 import org.jetbrains.compose.web.dom.Small
@@ -82,6 +88,13 @@ class ElementsTests {
             Pair({ Track() }, "TRACK"),
             Pair({ Video() }, "VIDEO"),
 
+            Pair({ Datalist() }, "DATALIST"),
+            Pair({ Fieldset() }, "FIELDSET"),
+            Pair({ Legend() }, "LEGEND"),
+            Pair({ Meter() }, "METER"),
+            Pair({ Output() }, "OUTPUT"),
+            Pair({ Progress() }, "PROGRESS"),
+
             Pair({ Div() }, "DIV"),
             Pair({ A() }, "A"),
             Pair({ Button() }, "BUTTON"),