diff options
Diffstat (limited to 'src/lib/components/Window')
-rw-r--r-- | src/lib/components/Window/Window.tsx (renamed from src/lib/components/Window/Window.js) | 18 | ||||
-rw-r--r-- | src/lib/components/Window/WindowSurface.tsx (renamed from src/lib/components/Window/WindowSurface/WindowSurface.js) | 12 | ||||
-rw-r--r-- | src/lib/components/Window/types.ts | 11 |
3 files changed, 33 insertions, 8 deletions
diff --git a/src/lib/components/Window/Window.js b/src/lib/components/Window/Window.tsx index 027213f..ea8e264 100644 --- a/src/lib/components/Window/Window.js +++ b/src/lib/components/Window/Window.tsx @@ -2,10 +2,17 @@ import React from 'react'; import { Typography, Divider, makeStyles } from '@material-ui/core'; -import WindowSurface from './WindowSurface/WindowSurface'; +import WindowSurface from './WindowSurface'; +import { SurfaceSize, SurfacePosition } from './types'; -const useStyles = makeStyles(theme => ({ +interface PropTypes { + type: 'primary' | 'secondary' | 'mono'; + name?: string; +} + + +const useStyles = makeStyles((theme: any) => ({ header: { padding: theme.spacing(1, 0, 1, 2), background: theme.palette.background.elevation2, @@ -13,14 +20,14 @@ const useStyles = makeStyles(theme => ({ })); -const Window = ({ type, name, children }) => { +const Window: React.FC<PropTypes> = ({ type, name, children }) => { const classes = useStyles(); - const size = { + const size: SurfaceSize = { height: '85vh', }; - const position = { + const position: SurfacePosition = { bottom: '3vh', }; @@ -51,5 +58,4 @@ const Window = ({ type, name, children }) => { ); }; - export default Window; diff --git a/src/lib/components/Window/WindowSurface/WindowSurface.js b/src/lib/components/Window/WindowSurface.tsx index 7859bf6..701a767 100644 --- a/src/lib/components/Window/WindowSurface/WindowSurface.js +++ b/src/lib/components/Window/WindowSurface.tsx @@ -2,8 +2,16 @@ import React from 'react'; import { Paper, makeStyles } from '@material-ui/core'; +import { SurfaceSize, SurfacePosition } from './types'; -const useStyles = makeStyles(theme => ({ + +interface PropTypes { + size: SurfaceSize; + position: SurfacePosition; +} + + +const useStyles = makeStyles((theme: any) => ({ surface: { position: 'absolute', display: 'flex', @@ -18,7 +26,7 @@ const useStyles = makeStyles(theme => ({ })); -const WindowSurface = ({ size, position, children }) => { +const WindowSurface: React.FC<PropTypes> = ({ size, position, children }) => { const classes = useStyles(); return ( diff --git a/src/lib/components/Window/types.ts b/src/lib/components/Window/types.ts new file mode 100644 index 0000000..9e18fe3 --- /dev/null +++ b/src/lib/components/Window/types.ts @@ -0,0 +1,11 @@ +export interface SurfaceSize { + height: string; + width?: string; +} + +export interface SurfacePosition { + bottom: string; + left?: string; + right?: string; +} + |