diff --git a/CHANGELOG.md b/CHANGELOG.md index 0c7fab0e763..4f93341a450 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,10 @@ ## 0.10.6 +* `Common` + * `JS`: + * Add `ResizeObserver` functionality + ## 0.10.5 * `Versions` diff --git a/common/src/jsMain/kotlin/dev/inmo/micro_utils/common/ResizeObserver.kt b/common/src/jsMain/kotlin/dev/inmo/micro_utils/common/ResizeObserver.kt new file mode 100644 index 00000000000..f35eb20ff58 --- /dev/null +++ b/common/src/jsMain/kotlin/dev/inmo/micro_utils/common/ResizeObserver.kt @@ -0,0 +1,56 @@ +package dev.inmo.micro_utils.common + +import org.w3c.dom.* +import kotlin.js.Json +import kotlin.js.json + +external class ResizeObserver( + callback: (Array, ResizeObserver) -> Unit +) { + fun observe(target: Element, options: Json = definedExternally) + + fun unobserve(target: Element) + + fun disconnect() +} + +external class ResizeObserverEntry { + val borderBoxSize: Int? + val contentBoxSize: Int? + val devicePixelContentBoxSize: Int? + val contentRect: DOMRectReadOnly +} + +fun ResizeObserverEntry.sizeOrThrow(): Int { + return contentBoxSize ?: borderBoxSize ?: devicePixelContentBoxSize ?: error("Unable to find default size in entry $this") +} + +fun ResizeObserver.observe(target: Element, options: ResizeObserverObserveOptions) = observe( + target, + json( + "box" to options.box ?.name + ) +) + +class ResizeObserverObserveOptions( + val box: Box? = null +) { + sealed interface Box { + val name: String + + object Content : Box { + override val name: String + get() = "content-box" + } + + object Border : Box { + override val name: String + get() = "border-box" + } + + object DevicePixelContent : Box { + override val name: String + get() = "device-pixel-content-box" + } + } +}