commit
83fd8dd6c4
|
@ -4,3 +4,4 @@ dist
|
||||||
.DS_Store
|
.DS_Store
|
||||||
flow-coverage
|
flow-coverage
|
||||||
build
|
build
|
||||||
|
.docz
|
|
@ -0,0 +1,8 @@
|
||||||
|
---
|
||||||
|
name: Home
|
||||||
|
route: /
|
||||||
|
---
|
||||||
|
|
||||||
|
# UI Components
|
||||||
|
|
||||||
|
Please navigate on the left menu side to know more about the app's components
|
|
@ -8,17 +8,26 @@ import { styles } from './styles';
|
||||||
|
|
||||||
// TODO: Not sure this is the best approach to styling
|
// TODO: Not sure this is the best approach to styling
|
||||||
// in a StyledComponents-powered application
|
// in a StyledComponents-powered application
|
||||||
const Wrapper = styled.div`${styles.wrapper}`;
|
const Wrapper = styled.div`
|
||||||
|
${styles.wrapper}
|
||||||
|
`;
|
||||||
|
|
||||||
export const SidebarComponent = () => (
|
type MenuItem = { route: string, label: string };
|
||||||
|
|
||||||
|
type Props = {
|
||||||
|
options?: MenuItem[],
|
||||||
|
};
|
||||||
|
|
||||||
|
export const SidebarComponent = ({ options }: Props) => (
|
||||||
<Wrapper>
|
<Wrapper>
|
||||||
{MENU_OPTIONS.map(item => (
|
{(options || []).map(item => (
|
||||||
<Link
|
<Link key={item.route} to={item.route}>
|
||||||
key={item.route}
|
|
||||||
to={item.route}
|
|
||||||
>
|
|
||||||
{item.label}
|
{item.label}
|
||||||
</Link>
|
</Link>
|
||||||
))}
|
))}
|
||||||
</Wrapper>
|
</Wrapper>
|
||||||
);
|
);
|
||||||
|
|
||||||
|
SidebarComponent.defaultProps = {
|
||||||
|
options: MENU_OPTIONS,
|
||||||
|
};
|
||||||
|
|
|
@ -0,0 +1,16 @@
|
||||||
|
---
|
||||||
|
name: Sidebar
|
||||||
|
---
|
||||||
|
|
||||||
|
import { Playground, PropsTable } from 'docz'
|
||||||
|
import { SidebarComponent } from './index.js'
|
||||||
|
|
||||||
|
# Sidebar
|
||||||
|
|
||||||
|
<PropsTable of={SidebarComponent} />
|
||||||
|
|
||||||
|
## Basic usage
|
||||||
|
|
||||||
|
<Playground>
|
||||||
|
<SidebarComponent />
|
||||||
|
</Playground>
|
|
@ -0,0 +1,8 @@
|
||||||
|
/* eslint-disable import/no-extraneous-dependencies */
|
||||||
|
import { css } from 'docz-plugin-css';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
title: 'ZCash',
|
||||||
|
description: 'ZCash UI Documentation',
|
||||||
|
plugins: [css()],
|
||||||
|
};
|
|
@ -17,7 +17,9 @@
|
||||||
"electron:pack": "yarn electron:prepare && electron-builder --dir",
|
"electron:pack": "yarn electron:prepare && electron-builder --dir",
|
||||||
"electron:dist": "yarn electron:prepare && electron-builder",
|
"electron:dist": "yarn electron:prepare && electron-builder",
|
||||||
"preelectron:prepare": "yarn build",
|
"preelectron:prepare": "yarn build",
|
||||||
"icon:build": "./node_modules/.bin/electron-icon-maker --input=build-assets/icon.png --output=./build"
|
"icon:build": "./node_modules/.bin/electron-icon-maker --input=build-assets/icon.png --output=./build",
|
||||||
|
"docz:dev": "docz dev",
|
||||||
|
"docz:build": "docz build"
|
||||||
},
|
},
|
||||||
"author": {
|
"author": {
|
||||||
"name": "André Neves",
|
"name": "André Neves",
|
||||||
|
@ -38,6 +40,8 @@
|
||||||
"concurrently": "^4.1.0",
|
"concurrently": "^4.1.0",
|
||||||
"cross-env": "^5.2.0",
|
"cross-env": "^5.2.0",
|
||||||
"css-loader": "^1.0.1",
|
"css-loader": "^1.0.1",
|
||||||
|
"docz": "^0.12.13",
|
||||||
|
"docz-plugin-css": "^0.11.0",
|
||||||
"electron": "^3.0.10",
|
"electron": "^3.0.10",
|
||||||
"electron-builder": "^20.36.2",
|
"electron-builder": "^20.36.2",
|
||||||
"electron-icon-maker": "^0.0.4",
|
"electron-icon-maker": "^0.0.4",
|
||||||
|
|
Loading…
Reference in New Issue