Code examples

Method mode

Obsidium[method](element)

import { Mutation, Obsidium } from './obsidium';

// for best tree shaking
new Mutation(element)
	.on('add', nodes => console.log('>> added!', nodes))
	.on('remove', nodes => console.log('>> removed!', nodes))
	.on('attr', ({ attribute, target }) => console.log('>> attr!', attribute, target));

// standard use, with destructuring
const { resize, intersection } = Obsidium;

const ro = resize(element).on('resize', ([ent]) => ent.contentBoxSize);

const io = intersection(element).on('intersect', function ([ent]) {
	ent.isIntersecting && this.dump();
});

// subscribe
const mo = Obsidium.mutation(element).subscribe(([rec], obs) => {
	obs.dump();
	rec.target; 
});

Function mode

Obsidium(element)

// element watched for both resize & intersection occurrences
const multiObs = Obsidium<IntersectionObserver | ResizeObserver>(element)
	.on('intersect', ([ent]) => {
		ent.boundingClientRect;
	})
	.on('resize', function ([ent], _obs) {
		ent.contentBoxSize;

		// destroys only Resize observer:
		this.dump();
		_obs.dump();
		// destroys all observers:
		multiObs.dump();
	});