1.0.14 • Published 3 years ago

react-simple-horizontal-menu v1.0.14

Weekly downloads
-
License
MIT
Repository
-
Last release
3 years ago

React-simple-horizontal-menu

Simplest React horizontal menu library.

Features

  • React menu components for easy and fast web development.
  • Support Right-To-Left smooth scrool.
  • Low bundle size with fantastic performance.
  • Flexible menu positioning.
  • Easy styling and customisation.

Install

with npm

npm i react-simple-horizontal-menu

with yarn

yarn add react-simple-horizontal-menu

usage

import React, { useState } from 'react';
import { HorizontalMenu } from 'react-simple-horizontal-menu';
import '../../node_modules/react-simple-horizontal-menu/dist/styles/core.css';

const items = [...Array(100)].map((_, i) => {
  return {
    id: i,
    label: `No. ${i}`,
  };
});

export default function Test() {
  const [id, setId] = useState(0);

  const onChange = (_id: number) => {
    setId(_id);
  };

  const getLabel = items.find((item) => item.id === id)?.label ?? null;

  return (
    <div>
      dd
      <HorizontalMenu items={items} onChange={onChange} rtl={true} />
      <div
        style={{
          marginTop: '16px',
          display: 'flex',
          width: '100%',
          justifyContent: 'center',
        }}
      >
        Selected value: {getLabel}
      </div>
    </div>
  );
}

API

Licence

MIT @ devinoue

1.0.14

3 years ago

1.0.13

3 years ago

1.0.12

3 years ago

1.0.11

3 years ago

1.0.10

3 years ago

1.0.9

3 years ago

1.0.8

3 years ago

1.0.7

3 years ago

1.0.6

3 years ago

1.0.5

3 years ago

1.0.4

3 years ago

1.0.3

3 years ago

1.0.2

3 years ago

1.0.1

3 years ago

1.0.0

3 years ago