Browse Source

Remove helper DOM builder elements from the public scope

pull/851/head
Shagen Ogandzhanian 4 years ago
parent
commit
8a072a356e
  1. 98
      web/core/src/jsMain/kotlin/androidx/compose/web/elements/Base.kt
  2. 311
      web/core/src/jsMain/kotlin/androidx/compose/web/elements/Elements.kt
  3. 32
      web/core/src/jsMain/kotlin/androidx/compose/web/elements/InputElements.kt
  4. 47
      web/core/src/jsMain/kotlin/androidx/compose/web/elements/Style.kt
  5. 2
      web/integration-core/src/jsMain/kotlin/androidx/compose/web/sample/tests/EventsTests.kt

98
web/core/src/jsMain/kotlin/androidx/compose/web/elements/Base.kt

@ -93,104 +93,6 @@ class DisposableEffectHolder(
var effect: (DisposableEffectScope.(Element) -> DisposableEffectResult)? = null
)
interface ElementBuilder<TElement : Element> {
fun create(): TElement
private open class ElementBuilderImplementation<TElement : Element>(private val tagName: String) : ElementBuilder<TElement> {
private val el: Element by lazy { document.createElement(tagName) }
override fun create(): TElement = el.cloneNode() as TElement
}
companion object {
fun <TElement : Element> createBuilder(tagName: String): ElementBuilder<TElement> {
return object : ElementBuilderImplementation<TElement>(tagName) {}
}
val Address: ElementBuilder<HTMLElement> = ElementBuilderImplementation("address")
val Article: ElementBuilder<HTMLElement> = ElementBuilderImplementation("article")
val Aside: ElementBuilder<HTMLElement> = ElementBuilderImplementation("aside")
val Header: ElementBuilder<HTMLElement> = ElementBuilderImplementation("header")
val Area: ElementBuilder<HTMLAreaElement> = ElementBuilderImplementation("area")
val Audio: ElementBuilder<HTMLAudioElement> = ElementBuilderImplementation("audio")
val Map: ElementBuilder<HTMLMapElement> = ElementBuilderImplementation("map")
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 Embed: ElementBuilder<HTMLEmbedElement> = ElementBuilderImplementation("embed")
val Iframe: ElementBuilder<HTMLIFrameElement> = ElementBuilderImplementation("iframe")
val Object: ElementBuilder<HTMLObjectElement> = ElementBuilderImplementation("object")
val Param: ElementBuilder<HTMLParamElement> = ElementBuilderImplementation("param")
val Picture: ElementBuilder<HTMLPictureElement> = ElementBuilderImplementation("picture")
val Source: ElementBuilder<HTMLSourceElement> = ElementBuilderImplementation("source")
val Div: ElementBuilder<HTMLDivElement> = ElementBuilderImplementation("div")
val A: ElementBuilder<HTMLAnchorElement> = ElementBuilderImplementation("a")
val Input: ElementBuilder<HTMLInputElement> = ElementBuilderImplementation("input")
val Button: ElementBuilder<HTMLButtonElement> = ElementBuilderImplementation("button")
val H1: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h1")
val H2: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h2")
val H3: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h3")
val H4: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h4")
val H5: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h5")
val H6: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h6")
val P: ElementBuilder<HTMLParagraphElement> = ElementBuilderImplementation<HTMLParagraphElement>("p")
val Em: ElementBuilder<HTMLElement> = ElementBuilderImplementation("em")
val I: ElementBuilder<HTMLElement> = ElementBuilderImplementation("i")
val B: ElementBuilder<HTMLElement> = ElementBuilderImplementation("b")
val Small: ElementBuilder<HTMLElement> = ElementBuilderImplementation("small")
val Span: ElementBuilder<HTMLSpanElement> = ElementBuilderImplementation("span")
val Br: ElementBuilder<HTMLBRElement> = ElementBuilderImplementation("br")
val Ul: ElementBuilder<HTMLUListElement> = ElementBuilderImplementation("ul")
val Ol: ElementBuilder<HTMLOListElement> = ElementBuilderImplementation("ol")
val Li: ElementBuilder<HTMLLIElement> = ElementBuilderImplementation("li")
val Img: ElementBuilder<HTMLImageElement> = ElementBuilderImplementation("img")
val Form: ElementBuilder<HTMLFormElement> = ElementBuilderImplementation("form")
val Select: ElementBuilder<HTMLSelectElement> = ElementBuilderImplementation("select")
val Option: ElementBuilder<HTMLOptionElement> = ElementBuilderImplementation("option")
val OptGroup: ElementBuilder<HTMLOptGroupElement> = ElementBuilderImplementation("optgroup")
val Section: ElementBuilder<HTMLElement> = ElementBuilderImplementation("section")
val TextArea: ElementBuilder<HTMLTextAreaElement> = ElementBuilderImplementation("textarea")
val Nav: ElementBuilder<HTMLElement> = ElementBuilderImplementation("nav")
val Pre: ElementBuilder<HTMLPreElement> = ElementBuilderImplementation("pre")
val Code: ElementBuilder<HTMLElement> = ElementBuilderImplementation("code")
val Main: ElementBuilder<HTMLElement> = ElementBuilderImplementation("main")
val Footer: ElementBuilder<HTMLElement> = ElementBuilderImplementation("footer")
val Hr: ElementBuilder<HTMLHRElement> = ElementBuilderImplementation("hr")
val Label: ElementBuilder<HTMLLabelElement> = ElementBuilderImplementation("label")
val Table: ElementBuilder<HTMLTableElement> = ElementBuilderImplementation("table")
val Caption: ElementBuilder<HTMLTableCaptionElement> = ElementBuilderImplementation("caption")
val Col: ElementBuilder<HTMLTableColElement> = ElementBuilderImplementation("col")
val Colgroup: ElementBuilder<HTMLTableColElement> = ElementBuilderImplementation("colgroup")
val Tr: ElementBuilder<HTMLTableRowElement> = ElementBuilderImplementation("tr")
val Thead: ElementBuilder<HTMLTableSectionElement> = ElementBuilderImplementation("thead")
val Th: ElementBuilder<HTMLTableCellElement> = ElementBuilderImplementation("th")
val Td: ElementBuilder<HTMLTableCellElement> = ElementBuilderImplementation("td")
val Tbody: ElementBuilder<HTMLTableSectionElement> = ElementBuilderImplementation("tbody")
val Tfoot: ElementBuilder<HTMLTableSectionElement> = ElementBuilderImplementation("tfoot")
val Style: ElementBuilder<HTMLStyleElement> = ElementBuilderImplementation("style")
}
}
@Composable
fun <TElement : Element> TagElement(
elementBuilder: ElementBuilder<TElement>,

311
web/core/src/jsMain/kotlin/androidx/compose/web/elements/Elements.kt

@ -8,6 +8,10 @@ import org.jetbrains.compose.web.DomApplier
import org.jetbrains.compose.web.DomNodeWrapper
import kotlinx.browser.document
import org.jetbrains.compose.web.attributes.*
import org.jetbrains.compose.web.css.CSSRuleDeclarationList
import org.jetbrains.compose.web.css.StyleSheetBuilder
import org.jetbrains.compose.web.css.StyleSheetBuilderImpl
import org.w3c.dom.Element
import org.w3c.dom.HTMLAnchorElement
import org.w3c.dom.HTMLAreaElement
import org.w3c.dom.HTMLAudioElement
@ -23,6 +27,7 @@ import org.w3c.dom.HTMLHeadingElement
import org.w3c.dom.HTMLHRElement
import org.w3c.dom.HTMLIFrameElement
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
@ -41,27 +46,128 @@ import org.w3c.dom.HTMLProgressElement
import org.w3c.dom.HTMLSelectElement
import org.w3c.dom.HTMLSourceElement
import org.w3c.dom.HTMLSpanElement
import org.w3c.dom.HTMLStyleElement
import org.w3c.dom.HTMLTableCaptionElement
import org.w3c.dom.HTMLTableCellElement
import org.w3c.dom.HTMLTableColElement
import org.w3c.dom.HTMLTableElement
import org.w3c.dom.HTMLTableRowElement
import org.w3c.dom.HTMLTableSectionElement
import org.w3c.dom.HTMLTextAreaElement
import org.w3c.dom.HTMLTrackElement
import org.w3c.dom.HTMLUListElement
import org.w3c.dom.HTMLVideoElement
import org.w3c.dom.Text
import org.w3c.dom.css.CSSStyleSheet
typealias AttrBuilderContext<T> = AttrsBuilder<T>.() -> Unit
typealias ContentBuilder<T> = @Composable ElementScope<T>.() -> Unit
private open class ElementBuilderImplementation<TElement : Element>(private val tagName: String) : ElementBuilder<TElement> {
private val el: Element by lazy { document.createElement(tagName) }
override fun create(): TElement = el.cloneNode() as TElement
}
private val Address: ElementBuilder<HTMLElement> = ElementBuilderImplementation("address")
private val Article: ElementBuilder<HTMLElement> = ElementBuilderImplementation("article")
private val Aside: ElementBuilder<HTMLElement> = ElementBuilderImplementation("aside")
private val Header: ElementBuilder<HTMLElement> = ElementBuilderImplementation("header")
private val Area: ElementBuilder<HTMLAreaElement> = ElementBuilderImplementation("area")
private val Audio: ElementBuilder<HTMLAudioElement> = ElementBuilderImplementation("audio")
private val Map: ElementBuilder<HTMLMapElement> = ElementBuilderImplementation("map")
private val Track: ElementBuilder<HTMLTrackElement> = ElementBuilderImplementation("track")
private val Video: ElementBuilder<HTMLVideoElement> = ElementBuilderImplementation("video")
private val Datalist: ElementBuilder<HTMLDataListElement> = ElementBuilderImplementation("datalist")
private val Fieldset: ElementBuilder<HTMLFieldSetElement> = ElementBuilderImplementation("fieldset")
private val Legend: ElementBuilder<HTMLLegendElement> = ElementBuilderImplementation("legend")
private val Meter: ElementBuilder<HTMLMeterElement> = ElementBuilderImplementation("meter")
private val Output: ElementBuilder<HTMLOutputElement> = ElementBuilderImplementation("output")
private val Progress: ElementBuilder<HTMLProgressElement> = ElementBuilderImplementation("progress")
private val Embed: ElementBuilder<HTMLEmbedElement> = ElementBuilderImplementation("embed")
private val Iframe: ElementBuilder<HTMLIFrameElement> = ElementBuilderImplementation("iframe")
private val Object: ElementBuilder<HTMLObjectElement> = ElementBuilderImplementation("object")
private val Param: ElementBuilder<HTMLParamElement> = ElementBuilderImplementation("param")
private val Picture: ElementBuilder<HTMLPictureElement> = ElementBuilderImplementation("picture")
private val Source: ElementBuilder<HTMLSourceElement> = ElementBuilderImplementation("source")
private val Div: ElementBuilder<HTMLDivElement> = ElementBuilderImplementation("div")
private val A: ElementBuilder<HTMLAnchorElement> = ElementBuilderImplementation("a")
private val Input: ElementBuilder<HTMLInputElement> = ElementBuilderImplementation("input")
private val Button: ElementBuilder<HTMLButtonElement> = ElementBuilderImplementation("button")
private val H1: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h1")
private val H2: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h2")
private val H3: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h3")
private val H4: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h4")
private val H5: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h5")
private val H6: ElementBuilder<HTMLHeadingElement> = ElementBuilderImplementation("h6")
private val P: ElementBuilder<HTMLParagraphElement> = ElementBuilderImplementation<HTMLParagraphElement>("p")
private val Em: ElementBuilder<HTMLElement> = ElementBuilderImplementation("em")
private val I: ElementBuilder<HTMLElement> = ElementBuilderImplementation("i")
private val B: ElementBuilder<HTMLElement> = ElementBuilderImplementation("b")
private val Small: ElementBuilder<HTMLElement> = ElementBuilderImplementation("small")
private val Span: ElementBuilder<HTMLSpanElement> = ElementBuilderImplementation("span")
private val Br: ElementBuilder<HTMLBRElement> = ElementBuilderImplementation("br")
private val Ul: ElementBuilder<HTMLUListElement> = ElementBuilderImplementation("ul")
private val Ol: ElementBuilder<HTMLOListElement> = ElementBuilderImplementation("ol")
private val Li: ElementBuilder<HTMLLIElement> = ElementBuilderImplementation("li")
private val Img: ElementBuilder<HTMLImageElement> = ElementBuilderImplementation("img")
private val Form: ElementBuilder<HTMLFormElement> = ElementBuilderImplementation("form")
private val Select: ElementBuilder<HTMLSelectElement> = ElementBuilderImplementation("select")
private val Option: ElementBuilder<HTMLOptionElement> = ElementBuilderImplementation("option")
private val OptGroup: ElementBuilder<HTMLOptGroupElement> = ElementBuilderImplementation("optgroup")
private val Section: ElementBuilder<HTMLElement> = ElementBuilderImplementation("section")
private val TextArea: ElementBuilder<HTMLTextAreaElement> = ElementBuilderImplementation("textarea")
private val Nav: ElementBuilder<HTMLElement> = ElementBuilderImplementation("nav")
private val Pre: ElementBuilder<HTMLPreElement> = ElementBuilderImplementation("pre")
private val Code: ElementBuilder<HTMLElement> = ElementBuilderImplementation("code")
private val Main: ElementBuilder<HTMLElement> = ElementBuilderImplementation("main")
private val Footer: ElementBuilder<HTMLElement> = ElementBuilderImplementation("footer")
private val Hr: ElementBuilder<HTMLHRElement> = ElementBuilderImplementation("hr")
private val Label: ElementBuilder<HTMLLabelElement> = ElementBuilderImplementation("label")
private val Table: ElementBuilder<HTMLTableElement> = ElementBuilderImplementation("table")
private val Caption: ElementBuilder<HTMLTableCaptionElement> = ElementBuilderImplementation("caption")
private val Col: ElementBuilder<HTMLTableColElement> = ElementBuilderImplementation("col")
private val Colgroup: ElementBuilder<HTMLTableColElement> = ElementBuilderImplementation("colgroup")
private val Tr: ElementBuilder<HTMLTableRowElement> = ElementBuilderImplementation("tr")
private val Thead: ElementBuilder<HTMLTableSectionElement> = ElementBuilderImplementation("thead")
private val Th: ElementBuilder<HTMLTableCellElement> = ElementBuilderImplementation("th")
private val Td: ElementBuilder<HTMLTableCellElement> = ElementBuilderImplementation("td")
private val Tbody: ElementBuilder<HTMLTableSectionElement> = ElementBuilderImplementation("tbody")
private val Tfoot: ElementBuilder<HTMLTableSectionElement> = ElementBuilderImplementation("tfoot")
val Style: ElementBuilder<HTMLStyleElement> = ElementBuilderImplementation("style")
fun interface ElementBuilder<TElement : Element> {
fun create(): TElement
companion object {
fun <TElement : Element> createBuilder(tagName: String): ElementBuilder<TElement> {
return object : ElementBuilderImplementation<TElement>(tagName) {}
}
}
}
@Composable
fun Address(
attrs: AttrBuilderContext<HTMLElement>? = null,
content: ContentBuilder<HTMLElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Address,
elementBuilder = Address,
applyAttrs = attrs,
content = content
)
@ -73,7 +179,7 @@ fun Article(
content: ContentBuilder<HTMLElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Article,
elementBuilder = Article,
applyAttrs = attrs,
content = content
)
@ -85,7 +191,7 @@ fun Aside(
content: ContentBuilder<HTMLElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Aside,
elementBuilder = Aside,
applyAttrs = attrs,
content = content
)
@ -97,7 +203,7 @@ fun Header(
content: ContentBuilder<HTMLElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Header,
elementBuilder = Header,
applyAttrs = attrs,
content = content
)
@ -109,7 +215,7 @@ fun Area(
content: ContentBuilder<HTMLAreaElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Area,
elementBuilder = Area,
applyAttrs = attrs,
content = content
)
@ -121,7 +227,7 @@ fun Audio(
content: ContentBuilder<HTMLAudioElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Audio,
elementBuilder = Audio,
applyAttrs = attrs,
content = content
)
@ -133,7 +239,7 @@ fun HTMLMap(
content: ContentBuilder<HTMLMapElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Map,
elementBuilder = Map,
applyAttrs = attrs,
content = content
)
@ -145,7 +251,7 @@ fun Track(
content: ContentBuilder<HTMLTrackElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Track,
elementBuilder = Track,
applyAttrs = attrs,
content = content
)
@ -157,7 +263,7 @@ fun Video(
content: ContentBuilder<HTMLVideoElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Video,
elementBuilder = Video,
applyAttrs = attrs,
content = content
)
@ -169,7 +275,7 @@ fun Datalist(
content: ContentBuilder<HTMLDataListElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Datalist,
elementBuilder = Datalist,
applyAttrs = attrs,
content = content
)
@ -181,7 +287,7 @@ fun Fieldset(
content: ContentBuilder<HTMLFieldSetElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Fieldset,
elementBuilder = Fieldset,
applyAttrs = attrs,
content = content
)
@ -193,7 +299,7 @@ fun Legend(
content: ContentBuilder<HTMLLegendElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Legend,
elementBuilder = Legend,
applyAttrs = attrs,
content = content
)
@ -205,7 +311,7 @@ fun Meter(
content: ContentBuilder<HTMLMeterElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Meter,
elementBuilder = Meter,
applyAttrs = attrs,
content = content
)
@ -217,7 +323,7 @@ fun Output(
content: ContentBuilder<HTMLOutputElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Output,
elementBuilder = Output,
applyAttrs = attrs,
content = content
)
@ -229,7 +335,7 @@ fun Progress(
content: ContentBuilder<HTMLProgressElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Progress,
elementBuilder = Progress,
applyAttrs = attrs,
content = content
)
@ -241,7 +347,7 @@ fun Embed(
content: ContentBuilder<HTMLEmbedElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Embed,
elementBuilder = Embed,
applyAttrs = attrs,
content = content
)
@ -253,7 +359,7 @@ fun Iframe(
content: ContentBuilder<HTMLIFrameElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Iframe,
elementBuilder = Iframe,
applyAttrs = attrs,
content = content
)
@ -265,7 +371,7 @@ fun Object(
content: ContentBuilder<HTMLObjectElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Object,
elementBuilder = Object,
applyAttrs = attrs,
content = content
)
@ -277,7 +383,7 @@ fun Param(
content: ContentBuilder<HTMLParamElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Param,
elementBuilder = Param,
applyAttrs = attrs,
content = content
)
@ -289,7 +395,7 @@ fun Picture(
content: ContentBuilder<HTMLPictureElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Picture,
elementBuilder = Picture,
applyAttrs = attrs,
content = content
)
@ -301,7 +407,7 @@ fun Source(
content: ContentBuilder<HTMLSourceElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Source,
elementBuilder = Source,
applyAttrs = attrs,
content = content
)
@ -323,7 +429,7 @@ fun Div(
content: ContentBuilder<HTMLDivElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Div,
elementBuilder = Div,
applyAttrs = attrs,
content = content
)
@ -336,7 +442,7 @@ fun A(
content: ContentBuilder<HTMLAnchorElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.A,
elementBuilder = A,
applyAttrs = {
if (href != null) {
this.href(href)
@ -353,107 +459,107 @@ fun A(
fun Button(
attrs: AttrBuilderContext<HTMLButtonElement>? = null,
content: ContentBuilder<HTMLButtonElement>? = null
) = TagElement(elementBuilder = ElementBuilder.Button, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = Button, applyAttrs = attrs, content = content)
@Composable
fun H1(
attrs: AttrBuilderContext<HTMLHeadingElement>? = null,
content: ContentBuilder<HTMLHeadingElement>? = null
) = TagElement(elementBuilder = ElementBuilder.H1, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = H1, applyAttrs = attrs, content = content)
@Composable
fun H2(
attrs: AttrBuilderContext<HTMLHeadingElement>? = null,
content: ContentBuilder<HTMLHeadingElement>? = null
) = TagElement(elementBuilder = ElementBuilder.H2, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = H2, applyAttrs = attrs, content = content)
@Composable
fun H3(
attrs: AttrBuilderContext<HTMLHeadingElement>? = null,
content: ContentBuilder<HTMLHeadingElement>? = null
) = TagElement(elementBuilder = ElementBuilder.H3, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = H3, applyAttrs = attrs, content = content)
@Composable
fun H4(
attrs: AttrBuilderContext<HTMLHeadingElement>? = null,
content: ContentBuilder<HTMLHeadingElement>? = null
) = TagElement(elementBuilder = ElementBuilder.H4, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = H4, applyAttrs = attrs, content = content)
@Composable
fun H5(
attrs: AttrBuilderContext<HTMLHeadingElement>? = null,
content: ContentBuilder<HTMLHeadingElement>? = null
) = TagElement(elementBuilder = ElementBuilder.H5, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = H5, applyAttrs = attrs, content = content)
@Composable
fun H6(
attrs: AttrBuilderContext<HTMLHeadingElement>? = null,
content: ContentBuilder<HTMLHeadingElement>? = null
) = TagElement(elementBuilder = ElementBuilder.H6, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = H6, applyAttrs = attrs, content = content)
@Composable
fun P(
attrs: AttrBuilderContext<HTMLParagraphElement>? = null,
content: ContentBuilder<HTMLParagraphElement>? = null
) = TagElement(elementBuilder = ElementBuilder.P, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = P, applyAttrs = attrs, content = content)
@Composable
fun Em(
attrs: AttrBuilderContext<HTMLElement>? = null,
content: ContentBuilder<HTMLElement>? = null
) = TagElement(elementBuilder = ElementBuilder.Em, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = Em, applyAttrs = attrs, content = content)
@Composable
fun I(
attrs: AttrBuilderContext<HTMLElement>? = null,
content: ContentBuilder<HTMLElement>? = null
) = TagElement(elementBuilder = ElementBuilder.I, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = I, applyAttrs = attrs, content = content)
@Composable
fun B(
attrs: AttrBuilderContext<HTMLElement>? = null,
content: ContentBuilder<HTMLElement>? = null
) = TagElement(elementBuilder = ElementBuilder.B, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = B, applyAttrs = attrs, content = content)
@Composable
fun Small(
attrs: AttrBuilderContext<HTMLElement>? = null,
content: ContentBuilder<HTMLElement>? = null
) = TagElement(elementBuilder = ElementBuilder.Small, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = Small, applyAttrs = attrs, content = content)
@Composable
fun Span(
attrs: AttrBuilderContext<HTMLSpanElement>? = null,
content: ContentBuilder<HTMLSpanElement>? = null
) = TagElement(elementBuilder = ElementBuilder.Span, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = Span, applyAttrs = attrs, content = content)
@Composable
fun Br(attrs: AttrBuilderContext<HTMLBRElement>? = null) =
TagElement(elementBuilder = ElementBuilder.Br, applyAttrs = attrs, content = null)
TagElement(elementBuilder = Br, applyAttrs = attrs, content = null)
@Composable
fun Ul(
attrs: AttrBuilderContext<HTMLUListElement>? = null,
content: ContentBuilder<HTMLUListElement>? = null
) = TagElement(elementBuilder = ElementBuilder.Ul, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = Ul, applyAttrs = attrs, content = content)
@Composable
fun Ol(
attrs: AttrBuilderContext<HTMLOListElement>? = null,
content: ContentBuilder<HTMLOListElement>? = null
) = TagElement(elementBuilder = ElementBuilder.Ol, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = Ol, applyAttrs = attrs, content = content)
@Composable
fun DOMScope<HTMLOListElement>.Li(
attrs: AttrBuilderContext<HTMLLIElement>? = null,
content: ContentBuilder<HTMLLIElement>? = null
) = TagElement(elementBuilder = ElementBuilder.Li, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = Li, applyAttrs = attrs, content = content)
@Composable
fun DOMScope<HTMLUListElement>.Li(
attrs: AttrBuilderContext<HTMLLIElement>? = null,
content: ContentBuilder<HTMLLIElement>? = null
) = TagElement(elementBuilder = ElementBuilder.Li, applyAttrs = attrs, content = content)
) = TagElement(elementBuilder = Li, applyAttrs = attrs, content = content)
@Composable
fun Img(
@ -461,7 +567,7 @@ fun Img(
alt: String = "",
attrs: AttrBuilderContext<HTMLImageElement>? = null
) = TagElement(
elementBuilder = ElementBuilder.Img,
elementBuilder = Img,
applyAttrs = {
src(src).alt(alt)
if (attrs != null) {
@ -477,7 +583,7 @@ fun Form(
attrs: AttrBuilderContext<HTMLFormElement>? = null,
content: ContentBuilder<HTMLFormElement>? = null
) = TagElement(
elementBuilder = ElementBuilder.Form,
elementBuilder = Form,
applyAttrs = {
if (!action.isNullOrEmpty()) action(action)
if (attrs != null) {
@ -492,7 +598,7 @@ fun Select(
attrs: AttrBuilderContext<HTMLSelectElement>? = null,
content: ContentBuilder<HTMLSelectElement>? = null
) = TagElement(
elementBuilder = ElementBuilder.Select,
elementBuilder = Select,
applyAttrs = attrs,
content = content
)
@ -503,7 +609,7 @@ fun Option(
attrs: AttrBuilderContext<HTMLOptionElement>? = null,
content: ContentBuilder<HTMLOptionElement>? = null
) = TagElement(
elementBuilder = ElementBuilder.Option,
elementBuilder = Option,
applyAttrs = {
value(value)
if (attrs != null) {
@ -519,7 +625,7 @@ fun OptGroup(
attrs: AttrBuilderContext<HTMLOptGroupElement>? = null,
content: ContentBuilder<HTMLOptGroupElement>? = null
) = TagElement(
elementBuilder = ElementBuilder.OptGroup,
elementBuilder = OptGroup,
applyAttrs = {
label(label)
if (attrs != null) {
@ -534,7 +640,7 @@ fun Section(
attrs: AttrBuilderContext<HTMLElement>? = null,
content: ContentBuilder<HTMLElement>? = null
) = TagElement(
elementBuilder = ElementBuilder.Section,
elementBuilder = Section,
applyAttrs = attrs,
content = content
)
@ -544,7 +650,7 @@ fun TextArea(
attrs: (TextAreaAttrsBuilder.() -> Unit)? = null,
value: String
) = TagElement(
elementBuilder = ElementBuilder.TextArea,
elementBuilder = TextArea,
applyAttrs = {
val taab = TextAreaAttrsBuilder()
if (attrs != null) {
@ -562,7 +668,7 @@ fun Nav(
attrs: AttrBuilderContext<HTMLElement>? = null,
content: ContentBuilder<HTMLElement>? = null
) = TagElement(
elementBuilder = ElementBuilder.Nav,
elementBuilder = Nav,
applyAttrs = attrs,
content = content
)
@ -573,7 +679,7 @@ fun Pre(
content: ContentBuilder<HTMLPreElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Pre,
elementBuilder = Pre,
applyAttrs = attrs,
content = content
)
@ -585,7 +691,7 @@ fun Code(
content: ContentBuilder<HTMLElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Code,
elementBuilder = Code,
applyAttrs = attrs,
content = content
)
@ -597,7 +703,7 @@ fun Main(
content: ContentBuilder<HTMLElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Main,
elementBuilder = Main,
applyAttrs = attrs,
content = content
)
@ -609,7 +715,7 @@ fun Footer(
content: ContentBuilder<HTMLElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Footer,
elementBuilder = Footer,
applyAttrs = attrs,
content = content
)
@ -620,7 +726,7 @@ fun Hr(
attrs: AttrBuilderContext<HTMLHRElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Hr,
elementBuilder = Hr,
applyAttrs = attrs,
content = null
)
@ -633,7 +739,7 @@ fun Label(
content: ContentBuilder<HTMLLabelElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Label,
elementBuilder = Label,
applyAttrs = {
if (forId != null) {
forId(forId)
@ -652,7 +758,7 @@ fun Table(
content: ContentBuilder<HTMLTableElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Table,
elementBuilder = Table,
applyAttrs = attrs,
content = content
)
@ -664,7 +770,7 @@ fun Caption(
content: ContentBuilder<HTMLTableCaptionElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Caption,
elementBuilder = Caption,
applyAttrs = attrs,
content = content
)
@ -675,7 +781,7 @@ fun Col(
attrs: AttrBuilderContext<HTMLTableColElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Col,
elementBuilder = Col,
applyAttrs = attrs,
content = null
)
@ -687,7 +793,7 @@ fun Colgroup(
content: ContentBuilder<HTMLTableColElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Colgroup,
elementBuilder = Colgroup,
applyAttrs = attrs,
content = content
)
@ -699,7 +805,7 @@ fun Tr(
content: ContentBuilder<HTMLTableRowElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Tr,
elementBuilder = Tr,
applyAttrs = attrs,
content = content
)
@ -711,7 +817,7 @@ fun Thead(
content: ContentBuilder<HTMLTableSectionElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Thead,
elementBuilder = Thead,
applyAttrs = attrs,
content = content
)
@ -723,7 +829,7 @@ fun Th(
content: ContentBuilder<HTMLTableCellElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Th,
elementBuilder = Th,
applyAttrs = attrs,
content = content
)
@ -735,7 +841,7 @@ fun Td(
content: ContentBuilder<HTMLTableCellElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Td,
elementBuilder = Td,
applyAttrs = attrs,
content = content
)
@ -747,7 +853,7 @@ fun Tbody(
content: ContentBuilder<HTMLTableSectionElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Tbody,
elementBuilder = Tbody,
applyAttrs = attrs,
content = content
)
@ -759,8 +865,83 @@ fun Tfoot(
content: ContentBuilder<HTMLTableSectionElement>? = null
) {
TagElement(
elementBuilder = ElementBuilder.Tfoot,
elementBuilder = Tfoot,
applyAttrs = attrs,
content = content
)
}
/**
* Use this function to mount the <style> tag into the DOM tree.
*
* @param cssRules - is a list of style rules.
* Usually, it's [androidx.compose.web.css.StyleSheet] instance
*/
@Composable
inline fun Style(
noinline applyAttrs: (AttrsBuilder<HTMLStyleElement>.() -> Unit)? = null,
cssRules: CSSRuleDeclarationList
) {
TagElement(
elementBuilder = Style,
applyAttrs = {
if (applyAttrs != null) {
applyAttrs()
}
},
) {
DomSideEffect(cssRules) { style ->
(style.sheet as? CSSStyleSheet)?.let { cssStylesheet ->
setCSSRules(cssStylesheet, cssRules)
onDispose {
clearCSSRules(cssStylesheet)
}
}
}
}
}
/**
* Use this function to mount the <style> tag into the DOM tree.
*
* @param rulesBuild allows to define the style rules using [StyleSheetBuilder]
*/
@Composable
inline fun Style(
noinline applyAttrs: (AttrsBuilder<HTMLStyleElement>.() -> Unit)? = null,
rulesBuild: StyleSheetBuilder.() -> Unit
) {
val builder = StyleSheetBuilderImpl()
builder.rulesBuild()
Style(applyAttrs, builder.cssRules)
}
@Composable
fun <K> Input(
type: InputType<K>,
attrs: InputAttrsBuilder<K>.() -> Unit
) {
TagElement(
elementBuilder = Input,
applyAttrs = {
val inputAttrsBuilder = InputAttrsBuilder(type)
inputAttrsBuilder.type(type)
inputAttrsBuilder.attrs()
this.copyFrom(inputAttrsBuilder)
},
content = null
)
}
@Composable
fun <K> Input(type: InputType<K>) {
TagElement(
elementBuilder = Input,
applyAttrs = {
val inputAttrsBuilder = InputAttrsBuilder(type)
inputAttrsBuilder.type(type)
this.copyFrom(inputAttrsBuilder)
},
content = null
)
}

32
web/core/src/jsMain/kotlin/androidx/compose/web/elements/InputElements.kt

@ -159,34 +159,4 @@ fun UrlInput(value: String = "", attrsBuilder: InputAttrsBuilder<String>.() -> U
@NonRestartableComposable
fun WeekInput(value: String = "", attrsBuilder: InputAttrsBuilder<String>.() -> Unit = {}) {
Input(type = InputType.Week, attrs = { applyAttrsWithStringValue(value, attrsBuilder) })
}
@Composable
fun <K> Input(
type: InputType<K>,
attrs: InputAttrsBuilder<K>.() -> Unit
) {
TagElement(
elementBuilder = ElementBuilder.Input,
applyAttrs = {
val inputAttrsBuilder = InputAttrsBuilder(type)
inputAttrsBuilder.type(type)
inputAttrsBuilder.attrs()
this.copyFrom(inputAttrsBuilder)
},
content = null
)
}
@Composable
fun <K> Input(type: InputType<K>) {
TagElement(
elementBuilder = ElementBuilder.Input,
applyAttrs = {
val inputAttrsBuilder = InputAttrsBuilder(type)
inputAttrsBuilder.type(type)
this.copyFrom(inputAttrsBuilder)
},
content = null
)
}
}

47
web/core/src/jsMain/kotlin/androidx/compose/web/elements/Style.kt

@ -1,59 +1,12 @@
package org.jetbrains.compose.web.dom
import androidx.compose.runtime.Composable
import org.jetbrains.compose.web.attributes.AttrsBuilder
import org.w3c.dom.HTMLStyleElement
import org.w3c.dom.css.CSSGroupingRule
import org.w3c.dom.css.CSSRule
import org.w3c.dom.css.CSSStyleDeclaration
import org.w3c.dom.css.CSSStyleRule
import org.w3c.dom.css.StyleSheet
import org.jetbrains.compose.web.css.*
import org.w3c.dom.css.CSSStyleSheet
/**
* Use this function to mount the <style> tag into the DOM tree.
*
* @param rulesBuild allows to define the style rules using [StyleSheetBuilder]
*/
@Composable
inline fun Style(
crossinline applyAttrs: AttrsBuilder<HTMLStyleElement>.() -> Unit = {},
rulesBuild: StyleSheetBuilder.() -> Unit
) {
val builder = StyleSheetBuilderImpl()
builder.rulesBuild()
Style(applyAttrs, builder.cssRules)
}
/**
* Use this function to mount the <style> tag into the DOM tree.
*
* @param cssRules - is a list of style rules.
* Usually, it's [androidx.compose.web.css.StyleSheet] instance
*/
@Composable
inline fun Style(
crossinline applyAttrs: AttrsBuilder<HTMLStyleElement>.() -> Unit = {},
cssRules: CSSRuleDeclarationList
) {
TagElement(
elementBuilder = ElementBuilder.Style,
applyAttrs = {
applyAttrs()
},
) {
DomSideEffect(cssRules) { style ->
(style.sheet as? CSSStyleSheet)?.let { cssStylesheet ->
setCSSRules(cssStylesheet, cssRules)
onDispose {
clearCSSRules(cssStylesheet)
}
}
}
}
}
fun clearCSSRules(sheet: CSSStyleSheet) {
repeat(sheet.cssRules.length) {
sheet.deleteRule(0)

2
web/integration-core/src/jsMain/kotlin/androidx/compose/web/sample/tests/EventsTests.kt

@ -6,9 +6,7 @@ import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import org.jetbrains.compose.web.attributes.*
import org.jetbrains.compose.web.css.*
import org.jetbrains.compose.web.css.selectors.attr
import org.jetbrains.compose.web.dom.*
import org.jetbrains.compose.web.dom.ElementBuilder.Companion.Div
class EventsTests {

Loading…
Cancel
Save