Skip to content
No description, website, or topics provided.
JavaScript TypeScript
Branch: master
Clone or download
dependabot-preview and devrelm Bump mock-raf from 1.0.0 to 1.0.1 (#31)
Bumps [mock-raf](https://github.com/FormidableLabs/mock-raf) from 1.0.0 to 1.0.1.
- [Release notes](https://github.com/FormidableLabs/mock-raf/releases)
- [Commits](FormidableLabs/mock-raf@v1.0.0...v1.0.1)

Signed-off-by: dependabot-preview[bot] <support@dependabot.com>
Latest commit 64efdf3 Sep 17, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.circleci Migrate from Travis to CircleCI (#13) Nov 9, 2018
src update ResizeObserver to be a ponyfill Aug 10, 2018
test
.gitignore
.npmignore Include src directory in npm package (Fix #11) (#12) Aug 21, 2018
CHANGELOG.md
LICENSE add LICENSE file Jun 7, 2016
README.md Migrate from Travis to CircleCI (#13) Nov 9, 2018
package.json
tsconfig.json update ResizeObserver to be a ponyfill Aug 10, 2018
tslint.json replace eslint with tslint and basic rules Aug 10, 2018
yarn.lock Bump mock-raf from 1.0.0 to 1.0.1 (#31) Sep 17, 2019

README.md

resize-observer

Build Status NPM Version

npm bundle size (minified + gzip)

This library aims to be a faithful implementation and ponyfill of the Resize Observer draft. An optional polyfill option exists as well.

Installation

resize-observer is available on NPM and Yarn:

> npm install resize-observer
> yarn add resize-observer

Setup

As a ponyfill/module

resize-observer does not install itself by default. As such, you can import it like any other module:

import { ResizeObserver } from 'resize-observer';

const ro = new ResizeObserver(() => console.log('resize observed!'));
ro.observe(document.body);

As a polyfill

resize-observer provides a file that can be referenced from your browser that automatically installs ResizeObserver on the global window object. Both minified and non-minified versions exist, and are found in the package under the dist/ directory:

<script src="/node_modules/resize-observer/dist/resize-observer.js"></script>
<script type="text/javascript">
  const ro = new window.ResizeObserver(() => alert('Observing things is super cool!'));
  /* use your ResizeObserver! */
</script>

A install method is also provided to do the same within your own code:

import { install } from 'resize-observer';

install();

const ro = new window.ResizeObserver(() => alert('Observe all the things!'));
/* ... */

Note: Calling install will always overwrite window.ResizeObserver. If you'd like to only install resize-observer when it doesn't already exist, you can add a simple check before calling install:

import { install } from 'resize-observer';

if (!window.ResizeObserver) install();

/* ... */

TypeScript definitions

resize-observer is written in TypeScript. The definition files are included in the package and should be picked up automatically.

You can’t perform that action at this time.