Skip to content

Commit

Permalink
feat: replace codesandbox with stackblitz
Browse files Browse the repository at this point in the history
  • Loading branch information
thebuilder committed Apr 28, 2024
1 parent f53fad6 commit efac8ee
Show file tree
Hide file tree
Showing 2 changed files with 1 addition and 26 deletions.
11 changes: 0 additions & 11 deletions .codesandbox/ci.json

This file was deleted.

16 changes: 1 addition & 15 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,8 +12,6 @@ to tell you when an element enters or leaves the viewport. Contains both a
[Hooks](#useinview-hook), [render props](#render-props) and
[plain children](#plain-children) implementation.

**Storybook Demo:**
[https://react-intersection-observer.vercel.app](https://react-intersection-observer.vercel.app)

## Features

Expand All @@ -32,13 +30,7 @@ to tell you when an element enters or leaves the viewport. Contains both a

## Installation

Install using [Yarn](https://yarnpkg.com):

```sh
yarn add react-intersection-observer
```

or NPM:
Install the package with your package manager of choice:

```sh
npm install react-intersection-observer --save
Expand Down Expand Up @@ -82,8 +74,6 @@ const Component = () => {
};
```

[![Edit useInView](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/useinview-ud2vo?fontsize=14&hidenavigation=1&theme=dark)

### Render props

To use the `<InView>` component, you pass it a function. It will be called
Expand Down Expand Up @@ -113,8 +103,6 @@ const Component = () => (
export default Component;
```

[![Edit InView render props](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/inview-render-props-hvhcb?fontsize=14&hidenavigation=1&theme=dark)

### Plain children

You can pass any element to the `<InView />`, and it will handle creating the
Expand All @@ -134,8 +122,6 @@ const Component = () => (
export default Component;
```

[![Edit InView plain children](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/inview-plain-children-vv51y?fontsize=14&hidenavigation=1&theme=dark)

> **Note**<br> When rendering a plain child, make sure you keep your HTML output
> semantic. Change the `as` to match the context, and add a `className` to style
> the `<InView />`. The component does not support Ref Forwarding, so if you
Expand Down

0 comments on commit efac8ee

Please sign in to comment.