Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
IntersectionObserver FFIs for PureScript.
// @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;
}
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
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment