open-index/open-npm huggingface dataset:
npm package: @guins/use-simple-carousel
Description: Simple Carousel React Hook - Manage the state of sequential elements being associated as carousel without any markup constraint
Author: guins
Latest version: 0.1.2

# @guins/use-simple-carousel

> Simple Carousel React Hook - Manage the state of sequential elements being associated as carousel without any markup constraint

[![NPM](https://img.shields.io/npm/v/@guins/use-simple-carousel.svg)](https://www.npmjs.com/package/@guins/use-simple-carousel) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

## Install

```bash
npm install --save @guins/use-simple-carousel
```

## Usage

See complete examples [here](./example/src/App.js)

```tsx
import * as React from 'react'
import { useEffect } from 'react'

import { useSimpleCarousel } from '@guins/use-simple-carousel'

export function FakeCarousel() {
  const itemsLength = 5 // number of items in your carousel
  const autoPlayInterval = 1000 // interval in milliseconds (no autoPlay if 0) [default = 0]
  const initialIndex = 0 // initial carousel index [default = 0]
  const {carouselState, next, prev, goTo, onTransitionComplete} = useSimpleCarousel(itemsLength, autoPlayInterval, initialIndex)

  useEffect(() => {
    console.log('didUpdate', carouselState)

    if(carouselState.isTransitioning) {
      // custom transition here (don't forget to call `onTransitionComplete` callback after)
      onTransitionComplete()
    }
  }, [carouselState, onTransitionComplete])

  return null
}
```

## License

MIT © [guins](https://github.com/guins)

---

This hook is created using [create-react-hook](https://github.com/hermanya/create-react-hook).
npm package: @guinso/jx
Description: javascript experimental utulity library
Author: benjamin
Latest version: 1.0.5

# jx
javascript utility

## Build for development and debugging (single file, uncompressed)
npm run build

## Deploy for production (single file, compress)
npm run deply

## Test run with built-in webserver
1. npm run start
2. go to web browser and visit localhost:8080
3. check console log
npm package: @guion/use-wallet-react
Description: React library for integrating Algorand wallets into decentralized applications
Author: Doug Richar
Latest version: 4.0.1

# @txnlab/use-wallet-react

[![GitHub package.json version](https://img.shields.io/github/package-json/v/TxnLab/use-wallet?filename=packages%2Fuse-wallet-react%2Fpackage.json&label=version)](https://www.npmjs.com/package/@txnlab/use-wallet?activeTab=versions)
[![GitHub License](https://img.shields.io/github/license/TxnLab/use-wallet)](https://github.com/TxnLab/use-wallet/blob/main/LICENSE.md)

React adapter for [@txnlab/use-wallet](https://github.com/TxnLab/use-wallet)

### Visit [txnlab.gitbook.io/use-wallet](https://txnlab.gitbook.io/use-wallet) for docs, guides, and examples!