import 'package:angular2/core.dart';
import 'package:angular2/router.dart';

import 'package:angular2_rbi/directives.dart';

import 'product_component.dart';
import 'product_category_component.dart';
import 'product_detail_component.dart';

import 'tables_component.dart';

@Component(
	selector: 'my-app',
	templateUrl: 'app_component.html',
	//styleUrls: const ['app_component.css'],
	directives: const [
		ROUTER_DIRECTIVES,
		MaterialLayout
	],
	providers: const [
		ROUTER_PROVIDERS
	]
)

@RouteConfig(const [
	const Route(
		path: '/product_categories',
		name: 'ProductCategories',
		component: ProductCategoryComponent,
		useAsDefault: true
	),
	const Route(
		path: '/products_of_category/:id',
		name: 'Products',
		component: ProductComponent
	),
	const Route(
		path: '/product/:id',
		name: 'ProductDetail',
		component: ProductDetailComponent
	),
	const Route(
		path: '/tables',
		name: 'Tables',
		component: TablesComponent
	)
])

class AppComponent {
	String title = 'Tavern 2';

	@ViewChild(MaterialLayout)
	MaterialLayout layout;

}