IntersectionObserver FFIs for PureScript.

IntersectionObserver.js

// @ts-check

"use strict";

/** @typedef {(entries: IntersectionObserverEntry[]) => (observer: IntersectionObserver) => () => void} CurriedIntersectionObserverCallback */

/** @type {(callback: CurriedIntersectionObserverCallback) => (options: IntersectionObserverInit) => () => IntersectionObserver} */
exports.intersectionObserver_ = function (callback) {
	return function (options) {
		return function () {
			return new IntersectionObserver(function (entries, observer) {
				callback(entries)(observer)();
			}, options);
		}
	}
}

/** @type {(observer: IntersectionObserver) => Element} */
exports.root = function (observer) {
	return observer.root;
}

/** @type {(observer: IntersectionObserver) => string} */
exports.rootMargin = function (observer) {
	return observer.rootMargin;
}

/** @type {(observer: IntersectionObserver) => readonly number[]} */
exports.thresholds = function (observer) {
	return observer.thresholds;
}

/** @type {(target: Element) => (observer: IntersectionObserver) => () => void} */
exports.observe = function (target) {
	return function (observer) {
		return function () {
			return observer.observe(target);
		}
	}
}

/** @type {(target: Element) => (observer: IntersectionObserver) => () => void} */
exports.unobserve = function (target) {
	return function (observer) {
		return function () {
			return observer.unobserve(target);
		}
	}
}

/** @type {(observer: IntersectionObserver) => () => void} */
exports.disconnect = function (observer) {
	return function () {
		observer.disconnect();
	}
}

/** @type {(observer: IntersectionObserver) => () => IntersectionObserverEntry[]} */
exports.takeRecords = function (observer) {
	return function () {
		return observer.takeRecords()
	}
}

/** @type {(entry: IntersectionObserverEntry) => number} */
exports.time = function (entry) {
	return entry.time;
}

/** @type {(entry: IntersectionObserverEntry) => ClientRect | DOMRect} */
exports.rootBounds_ = function (entry) {
	return entry.rootBounds;
}

/** @type {(entry: IntersectionObserverEntry) => ClientRect | DOMRect} */
exports.boundingClientRect = function (entry) {
	return entry.boundingClientRect;
}

/** @type {(entry: IntersectionObserverEntry) => ClientRect | DOMRect} */
exports.intersectionRect = function (entry) {
	return entry.intersectionRect;
}

/** @type {(entry: IntersectionObserverEntry) => boolean} */
exports.isIntersecting = function (entry) {
	return entry.isIntersecting;
}

/** @type {(entry: IntersectionObserverEntry) => number} */
exports.intersectionRatio = function (entry) {
	return entry.intersectionRatio;
}

/** @type {(entry: IntersectionObserverEntry) => Element} */
exports.target = function (entry) {
	return entry.target;
}

IntersectionObserver.purs

module IntersectionObserver
  ( IntersectionObserver
  , IntersectionObserverEntry
  , IntersectionObserverInitFields
  , intersectionObserver
  , root
  , rootMargin
  , thresholds
  , observe
  , unobserve
  , disconnect
  , takeRecords
  , time
  , rootBounds
  , boundingClientRect
  , intersectionRect
  , isIntersecting
  , intersectionRatio
  , target
  ) where

import Prelude

import Data.Maybe (Maybe)
import Data.Nullable (Nullable, toMaybe)
import Effect (Effect)
import Prim.Row (class Union)
import Web.DOM (Element)
import Web.HTML.HTMLElement (DOMRect)

foreign import data IntersectionObserver :: Type

foreign import data IntersectionObserverEntry :: Type

type IntersectionObserverInitFields =
  ( root :: Element
  , rootMargin :: String
  , thresholds :: Array Number
  )

foreign import intersectionObserver_
  :: forall r. (Array IntersectionObserverEntry -> IntersectionObserver -> Effect Unit) -> Record r -> Effect IntersectionObserver

intersectionObserver
  :: forall r r'. Union r r' IntersectionObserverInitFields
  => (Array IntersectionObserverEntry -> IntersectionObserver -> Effect Unit)
  -> Record r
  -> Effect IntersectionObserver
intersectionObserver = intersectionObserver_

foreign import root :: IntersectionObserver -> Element

foreign import rootMargin :: IntersectionObserver -> String

foreign import thresholds :: IntersectionObserver -> Array Number

foreign import observe :: Element -> IntersectionObserver -> Effect Unit

foreign import unobserve :: Element -> IntersectionObserver -> Effect Unit

foreign import disconnect :: IntersectionObserver -> Effect Unit

foreign import takeRecords :: IntersectionObserver -> Effect (Array IntersectionObserverEntry)

foreign import time :: IntersectionObserverEntry -> Number

foreign import rootBounds_ :: IntersectionObserverEntry -> Nullable DOMRect

rootBounds :: IntersectionObserverEntry -> Maybe DOMRect
rootBounds = toMaybe <<< rootBounds_

foreign import boundingClientRect :: IntersectionObserverEntry -> DOMRect

foreign import intersectionRect :: IntersectionObserverEntry -> DOMRect

foreign import isIntersecting :: IntersectionObserverEntry -> Boolean

foreign import intersectionRatio :: IntersectionObserverEntry -> Number

foreign import target :: IntersectionObserverEntry -> Element