Skip to content

nosferatu500/theme-file-explorer

 
 

Repository files navigation

React Sortable Tree File Explorer Theme

theme appearance

Features

  • You can click anywhere on a node to drag it.
  • More compact design, with indentation alone used to represent tree depth.

Usage

npm install --save @nosferatu500/theme-file-explorer
import React, { Component } from 'react'; import SortableTree from 'react-sortable-tree'; import FileExplorerTheme from '@nosferatu500/theme-file-explorer'; export default class Tree extends Component { constructor(props) { super(props); this.state = { treeData: [{ title: 'src/', children: [{ title: 'index.js' }] }], }; } render() { return ( <div style={{ height: 400 }}> <SortableTree treeData={this.state.treeData} onChange={treeData => this.setState({ treeData })} theme={FileExplorerTheme} /> </div> ); } }

Packages

No packages published

Languages

  • JavaScript 71.6%
  • SCSS 28.4%