React KeyMoveListView

Carousel, Matrix Component operated by Keyboard Input (←, ↑, →, ↓)

💽 Intro

SlideView

MatrixView

SlideView - Container

MatrixView - Container

Demo in Storybook

🌟 Major Component

• SlideView
• MatrixView
• ListView
• ViewContainer

🔨 Built With

• TypeScript
• React
• Sass

⚙️ Installation

npm i react-key-move-list-view
# or
yarn add react-key-move-list-view

🔍 Examples

Sample Keyboard Move List

import * as React from 'react';
import { ListView } from 'react-key-move-list-view';

const KeyboardListViewExample = () => {
  return (
    <ListView list={data} type="slide"/>
    // or 
    <ListView list={data} type="matrix"/>
  )
}

You can find more Examples and Demo in Storybook

🖥 Local Development

This component is managed by a storybook which is combined with develop environment and documentation. If you want to develop in local environment, clone project and develop through a storybook

git clone https://github.com/DevSoopark/react-key-move-list-view.git
yarn
yarn run storybook

🗝 License

MIT