https://github.com/itsaladin/react-native-tree-menu

React Native Tree Menu NPM Package
https://github.com/itsaladin/react-native-tree-menu

react-native react-native-dropdown-tree react-native-tree-menu

Last synced: 18 days ago
JSON representation

React Native Tree Menu NPM Package

• Host: GitHub
• URL: https://github.com/itsaladin/react-native-tree-menu
• Owner: itsaladin
• License: mit
• Created: 2023-08-28T17:01:40.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-09-10T05:38:03.000Z (over 1 year ago)
• Last Synced: 2024-12-15T06:18:31.736Z (about 1 month ago)
• Topics: react-native, react-native-dropdown-tree, react-native-tree-menu
• Language: TypeScript
• Homepage: https://www.npmjs.com/package/@itsaladin/react-native-tree-menu
• Size: 495 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        
# react-native-tree-menu

React Native menu tree for nested menu or nested dropdown with selection box. 👈👈👈💖💖💖✌️✌️✌️

#### React/React Native App Screenshots

| ![Screenshot a](screenshots/a.png) | ![Screenshot b](screenshots/b.png) | ![Screenshot c](screenshots/c.png) |

| ---------------------------------- | ---------------------------------- | ---------------------------------- |

### Install Peer Dependencies

Cherag UI uses `reaact-native-vector-icons` for icons. You must install it and configure it for your project. See its [documentation](https://github.com/oblador/react-native-vector-icons#installation) for more information about setting it up for Android, IOS or Web.

## Installation

Using Yarn:

```sh

yarn add @itsaladin/react-native-tree-menu

```

Using NPM:

```sh

npm install @itsaladin/react-native-tree-menu

```

## Usage

```js

import React, { useState } from 'react';

import { StyleSheet, View } from 'react-native';

import { MenuTree } from '@itsaladin/react-native-tree-menu';

const dataSet = [

  {

    label: 'Name A 1',

    checked: true,

    id: 1,

    childrenNodes: [

      {

        label: 'Name A 2',

        checked: true,

        id: 2,

        childrenNodes: [

          {

            label: 'Name A 3',

            checked: true,

            id: 3,

          },

        ],

      },

    ],

  },

  {

    label: 'Name B 1',

    checked: true,

    id: 4,

    childrenNodes: [

      {

        label: 'Name B 2',

        checked: true,

        id: 5,

        childrenNodes: [

          {

            label: 'Name B 3',

            checked: true,

            id: 6,

          },

        ],

      },

      {

        label: 'Name B 4',

        checked: true,

        id: 7,

        childrenNodes: [

          {

            label: 'Name B 5',

            checked: true,

            id: 8,

          },

        ],

      },

    ],

  },

];

const App = () => {

  const [data, setData] = useState(dataSet);

  return (

    

      

    

  );

};

```

## Contributing

See the [contributing guide](CONTRIBUTING.md) to learn how to contribute to the repository and the development workflow.

## License

MIT

---

Made with [create-react-native-library](https://github.com/callstack/react-native-builder-bob)