syntax-test.v2.html

<let
	to-binding-context>
</let>

<div
	promise.bind="">
	<template
		pending>
		Pending content
	</template>
	<template
		then=""
		then.from-view="">
		Data content
	</template>
	<template
		catch=""
		catch.from-view="">
		Error content
	</template>
</div>

<template
	as-custom-element="">
	<bindable
		property=""
		mode=""
		attribute="">
	</bindable>
</template>

<import
	from="">
</import>

<containerless>

<capture>

<input
	model.bind=""
	matcher.bind=""/>

<select
	model.bind=""
	matcher.bind="">
</select>

<au-slot
	name=""
	expose.bind="">
</au-slot>

<au-compose
	component.bind=""
	template=""
	template.bind=""
	model.bind=""
	view-model.ref=""
	scope-behavior="">
</au-compose>

<a
	load=""
	external>
</a>

<au-viewport
	fallback=""
	name=""
	default=""
	used-by=""
	default.bind="">
</au-viewport>

<validation-container
	errors.from-view="">
</validation-container>

<au-dialog-container>
<au-dialog-overlay>

<div
	property.bind=""
	property.one-time=""
	property.to-view=""
	property.from-view=""
	property.one-way=""
	property.two-way=""

	change.trigger=""
	change.capture=""

	ref=""
	element.ref=""
	view-model.ref=""
	custom-attribute.ref=""
	controller.ref=""

	class="classname1 classname2 classname3"
	classname.class="viewModelVariable"
	class.bind="'classname ${ viewModelVariable }'"

	style="width: 1px; height: 1px;"
	style='width: 1px; height: 1px;'

	style="width: ${ test }px; height: ${ test }px;"
	style='width: ${ test }px; height: ${ test }px;'

	style="background-image: url('https://source.unsplash.com/random/${ w > 0 ? w : '50' }x${ h > 0 ? h : '50' }/?wallpapers');"
	style='background-image: url("https://source.unsplash.com/random/${ w > 0 ? w : "50" }x${ h > 0 ? h : "50" }/?wallpapers");'

	background.style="viewModelVariable"
	style.bind="styleObject"

	if=""
	else
	case=""
	default-case

	if.bind=""
	show.bind=""
	hide.bind=""
	switch.bind=""
	case.bind=""

	repeat.for=""

	pattern.attr=""

	au-slot=""

	portal=""

	validation-errors.from-view=""

	t=""
	t.bind=""
	t-params.bind=""

	property.state=""
	change.dispatch=""

	...$attr>
	${ test }
</div>