open-index/open-npm huggingface dataset:
npm package: @saulpalv/use-responsive-class-effect
Description: An effect hook for setting css responsive class names on the root node using breakpoint definitions
Author: saulpalv
Latest version: 1.0.0

## A react hook for getting a variable previous state

### Install

```
npm i @saulpalv/use-responsive-class-effect

//or

yarn add @saulpalv/use-responsive-class-effect
```

### Usage

```tsx
import { muiBreakPoints, useResponsiveClassNameEffect } from "@saulpalv/use-responsive-class-effect"

export const App = () => {

    const className = useResponsiveClassNameEffect(muiBreakPoints)

    return (
        <div css={{
            /**
             * Blue background style applied on medium (md) breakpoint 
             * range 1200px > windows width > 900px
             */
            '.md &': { backgroundColor: 'blue' }
        }}>
            hello
        </div>
    )
}
```
npm package: @saulpalv/use-window-dimensions
Description: A hook for getting the current window dimensions
Author: saulpalv
Latest version: 1.0.3

## A react hook for getting a variable previous state

### Install

```
npm i @saulpalv/use-window-dimensions

//or

yarn add @saulpalv/use-window-dimensions
```

### Usage

```tsx
import type { FC } from 'react'
import { useWindowDimensions } from '@saulpalv/use-window-dimensions'

export const App: FC = () => {
  const { height, width } = useWindowDimensions()

  return (
    <div >
      <h4>Resize me</h4>
      <span>Current height is {height} </span><br/>
      <span>Current width is {width}</span>
    </div>
  )
}
```