diff --git a/examples/Default/index.jsx b/examples/Default/index.jsx index 29d4e97..3b8397b 100644 --- a/examples/Default/index.jsx +++ b/examples/Default/index.jsx @@ -1,4 +1,6 @@ import Breadcrumbs from '@trendmicro/react-breadcrumbs'; +import { Button, ButtonGroup } from '@trendmicro/react-buttons'; +import Dropdown, { MenuItem } from '@trendmicro/react-dropdown'; import ensureArray from 'ensure-array'; import React, { PureComponent } from 'react'; import styled from 'styled-components'; @@ -29,7 +31,7 @@ export default class extends PureComponent { 'home': 'Home', 'devices': ['Devices'], 'reports': ['Reports'], - 'settings/policy': ['Settings', 'Policy'], + 'settings/policies': ['Settings', 'Policies'], 'settings/network': ['Settings', 'Network'] }; @@ -50,14 +52,50 @@ export default class extends PureComponent { ); } + + navigate = (pathname) => () => { + this.setState({ selected: pathname }); + }; + render() { const { expanded, selected } = this.state; return (
+
+ + + + + + + Settings + + + + Policies + + + Network + + + + +
- + @@ -89,7 +127,7 @@ export default class extends PureComponent { Settings - + Policies diff --git a/examples/index.jsx b/examples/index.jsx index a19044b..475303f 100644 --- a/examples/index.jsx +++ b/examples/index.jsx @@ -1,6 +1,7 @@ import 'trendmicro-ui/dist/css/trendmicro-ui.css'; -import '@trendmicro/react-buttons/dist/react-buttons.css'; import '@trendmicro/react-breadcrumbs/dist/react-breadcrumbs.css'; +import '@trendmicro/react-buttons/dist/react-buttons.css'; +import '@trendmicro/react-dropdown/dist/react-dropdown.css'; import { Button } from '@trendmicro/react-buttons'; import React from 'react'; import ReactDOM from 'react-dom';