summaryrefslogtreecommitdiff
path: root/@linaria/examples/Preact/preact-example/src/components/app.js
blob: 03b0292ec1284938eb069462d61724d38d9e424c (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
import { h, Component } from 'preact';
import { Router } from 'preact-router';

import Header from './header';

import { css } from 'linaria';
import { styled } from 'linaria/react';

// Code-splitting is automated for routes
import Home from '../routes/home';
import Profile from '../routes/profile';

const Background = styled.div`
    background-color: aliceblue;
`; 

const bluishText = css`
    color: cornflowerblue;
`

export default class App extends Component {
	
	/** Gets fired when the route changes.
	 *	@param {Object} event		"change" event from [preact-router](http://git.io/preact-router)
	 *	@param {string} event.url	The newly routed URL
	 */
	handleRoute = e => {
		this.currentUrl = e.url;
	};

	render() {
		return (
			<Background class={bluishText} id="app">
				<Header />
				<Router onChange={this.handleRoute}>
					<Home path="/" />
					<Profile path="/profile/" user="me" />
					<Profile path="/profile/:user" />
				</Router>
			</Background>
		);
	}
}