005cf56baf
Some checks failed
No response / noResponse (push) Has been cancelled
CI / Continuous releases (push) Has been cancelled
CI / test-dev (macos-latest) (push) Has been cancelled
CI / test-dev (ubuntu-latest) (push) Has been cancelled
CI / test-dev (windows-latest) (push) Has been cancelled
Maintenance / main (push) Has been cancelled
Scorecards supply-chain security / Scorecards analysis (push) Has been cancelled
CodeQL / Analyze (push) Has been cancelled
91 lines
3.9 KiB
Markdown
91 lines
3.9 KiB
Markdown
---
|
||
title: The Tree View is moving to MUI X
|
||
description: Migrate to the new package to start building with our powerful Tree View, now part of MUI X. Previously released MIT components will stay MIT.
|
||
date: 2023-08-21T00:00:00.000Z
|
||
authors: ['flaviendelangle']
|
||
tags: ['MUI X', 'Product']
|
||
manualCard: true
|
||
---
|
||
|
||
After more than 4 years in the lab, the [Tree View](https://mui.com/x/react-tree-view/) components have found a new home as part of MUI X.
|
||
This means we'll be dedicating even more time and effort to these complex components, to better meet the needs of both you and your users.
|
||
|
||
## TL;DR
|
||
|
||
- The Tree View is one step closer to a stable release.
|
||
- **No surprise licenses changes**. We are staying true to [our promises](https://mui-org.notion.site/Stewardship-542a2226043d4f4a96dfb429d16cf5bd).
|
||
What's MIT stays MIT.
|
||
Therefore, all the existing features and future features of the Tree View will remain MIT and free to use.
|
||
- Follow the [migration steps](/x/migration/migration-tree-view-lab/).
|
||
|
||
## What is the Tree View?
|
||
|
||
The Tree View is a component to represent hierarchical data presented as nodes in a tree-like format.
|
||
|
||
The component allows to select one or multiple nodes.
|
||
|
||
<video autoplay muted loop playsinline width="1500" height="554">
|
||
<source src="/static/blog/lab-tree-view-to-mui-x/treeview.mov" type="video/mp4">
|
||
</video>
|
||
|
||
## What is MUI X?
|
||
|
||
[MUI X](/x/) is a collection of advanced components built for complex use cases.
|
||
|
||
As opposed to the MUI Core library, which leans on the open-source community for support, MUI X components require several full-time developers dedicated to engineering and ongoing maintenance.
|
||
|
||
MUI X components are available under three licenses:
|
||
|
||
- **MIT license**, which is free to use and includes all the current (and more to come) Tree View features.
|
||
- **MUI X Pro**, a commercial license that offers features for handling large datasets and will include the most advanced features for Tree View, like virtualization.
|
||
- **MUI X Premium**, which is also commercial and includes, in addition to the Pro features, tooling for data analysis.
|
||
|
||
## Why did the Tree View move to MUI X?
|
||
|
||
Once a component is ready to leave the lab, it can either go to MUI X or MUI Core libraries.
|
||
|
||
Given the complex nature of the Tree View, it was a clear choice to group it with the other advanced components in MUI X.
|
||
|
||
Moreover, new advanced features such as virtualization and drag and drop are already on the roadmap.
|
||
|
||
The Tree View components are now available in the `@mui/x-tree-view` package which is [MIT licensed](https://unpkg.com/browse/@mui/x-tree-view/LICENSE) and includes all the current (free forever) features.
|
||
|
||
## How do I migrate?
|
||
|
||
Follow the [migration steps](/x/migration/migration-tree-view-lab/) by updating the package name and change from a default export to a named export:
|
||
|
||
```diff
|
||
-import TreeView from '@mui/lab/TreeView';
|
||
-import TreeItem from '@mui/lab/TreeItem';
|
||
+import { TreeView } from '@mui/x-tree-view/TreeView';
|
||
+import { TreeItem } from '@mui/x-tree-view/TreeItem';
|
||
```
|
||
|
||
or
|
||
|
||
```diff
|
||
-import { TreeView, TreeItem } from '@mui/lab';
|
||
+import { TreeView, TreeItem } from '@mui/x-tree-view';
|
||
```
|
||
|
||
We have prepared a codemod to help you migrate your codebase from `@mui/lab` to `@mui/x-tree-view`:
|
||
|
||
```bash
|
||
npx @mui/codemod@latest v5.0.0/tree-view-moved-to-x <path>
|
||
```
|
||
|
||
## Where is the Tree View documentation?
|
||
|
||
You can find the documentation for the Tree View component in the [MUI X docs](/x/react-tree-view/).
|
||
|
||
## What's next for the Tree View?
|
||
|
||
For now, `@mui/x-tree-view` is in alpha.
|
||
Our next goal is to work on the stability and API consistency of its components to prepare a stable release in the next few months.
|
||
|
||
Please feel free to try out the component and provide any feedback you may have.
|
||
|
||
We also have a dedicated channel in our [Discord Server](https://mui.com/r/discord/) for you to provide any feedback or concerns you have with Tree View.
|
||
|
||
Happy building!
|