lucid-ui
Version:
A UI component library from AppNexus.
25 lines (24 loc) • 1.87 kB
JavaScript
import _ from 'lodash';
import React, { useState } from 'react';
import { VerticalListMenu } from '../../../index';
export default () => {
const [currentList, setCurrentList] = useState('one');
const [selectedIndices, setSelectedIndices] = useState([0]);
const handleSelect = (currentList, index) => {
setCurrentList(currentList);
setSelectedIndices([index]);
};
return (React.createElement(VerticalListMenu, { style: { width: 250 }, onSelect: _.partial(handleSelect, 'one'), selectedIndices: currentList === 'one' ? selectedIndices : [] },
React.createElement(VerticalListMenu.Item, null, "Level one"),
React.createElement(VerticalListMenu.Item, { hasExpander: true },
"Level one with VerticalListMenu",
React.createElement(VerticalListMenu, { onSelect: _.partial(handleSelect, 'two'), selectedIndices: currentList === 'two' ? selectedIndices : [] },
React.createElement(VerticalListMenu.Item, null, "Level two"),
React.createElement(VerticalListMenu.Item, { hasExpander: true },
"Level two with VerticalListMenu and lots of text. Lorem quos natus mollitia nihil quasi! Necessitatibus corporis aliquam quam laborum nesciunt quaerat. Nostrum distinctio officiis adipisci nulla unde repellat. Soluta eaque ex obcaecati molestiae provident aspernatur sit! Expedita et.",
React.createElement(VerticalListMenu, { onSelect: _.partial(handleSelect, 'three'), selectedIndices: currentList === 'three' ? selectedIndices : [] }, _.times(50, n => {
return (React.createElement(VerticalListMenu.Item, { key: n }, "Level three"));
}))),
React.createElement(VerticalListMenu.Item, null, "Level two"))),
React.createElement(VerticalListMenu.Item, null, "Level one")));
};