v1.1.1

Fixes

• Re-publish v1.1.0 to include types

v1.1.0

Features

• Add MultipleIntersectionObserver component (86bd57c, #95)

---

For performance, use MultipleIntersectionObserver to observe multiple elements. This avoids creating standalone observers per component.

<script>
  import { MultipleIntersectionObserver } from "svelte-intersection-observer";

  let ref1;
  let ref2;

  $: elements = [ref1, ref2];
</script>

<MultipleIntersectionObserver {elements} let:elementIntersections>
  <header>
    <div class:intersecting={elementIntersections.get(ref1)}>
      Item 1: {elementIntersections.get(ref1) ? "✓" : "✗"}
    </div>
    <div class:intersecting={elementIntersections.get(ref2)}>
      Item 2: {elementIntersections.get(ref2) ? "✓" : "✗"}
    </div>
  </header>

  <div bind:this={ref1}>Item 1</div>
  <div bind:this={ref2}>Item 2</div>
</MultipleIntersectionObserver>

v1.0.0

Breaking Changes

• Drop support for bundled ESM/UMD; code is only distributed as Svelte files
• Remove IntersectionObserverProps or Entry TypeScript interfaces from IntersectionObserver.svelte.d.ts

Use the Svelte ComponentProps utility to extract component props.

import IntersectionObserver from "svelte-intersection-observer";
import type { ComponentProps } from "svelte";

type Props = ComponentProps<IntersectionObserver>;

Fixes

• element and root prop types should be null | HTMLElement to support TypeScript strict mode
• Add exports field to package.json

v0.10.2

Fixes

• add exports field to package.json to resolve Vite development warnings (8b2f824, branch)

v0.10.1

Fixes

• fix threshold prop type to be number | number[] (6992399, #70 by @kevinkace)

v0.10.0

Features

• mark observer for garbage collection after disconnecting (b961e16)

Documentation

• make prop descriptions consistent with docs (5944a6b)

Refactoring

• omit redundant null from element and root types as HTMLElement is already nullable (41a3609)

v0.9.2

This is a patch release to refresh the documentation published to NPM/Yarn.

Documentation

• add let: directive example
• update component prop descriptions
• use Svelte syntax highlighting for on:observe, on:intersect examples

v0.9.1

Documentation

• update the "Once" example to include the "svelte-intersection-observer" import
• rename example svite to vite

Refactoring

• inline entry prop typedef
• remove @event, @slot artifacts used by sveld to generate initial TypeScript definitions

v0.9.0

• improve TypeScript definitions for dispatched events
  • on:observe: event.detail.isIntersecting is a boolean
  • on:intersect: event.detail.isIntersecting can only be true

<IntersectionObserver
  on:observe={(e) => {
    console.log(e.detail.isIntersecting); // boolean
  }}
  on:intersect={(e) => {
    console.log(e.detail.isIntersecting); // true
  }}
/>

v0.8.0

• use .svelte.d.ts as the extension for the component TypeScript definition