AshleyGrant

<template>
  <div style="height: 125px; min-width: 150px; width: 100%;" ref="canvasContainer">
    <canvas ref="canvas" width.one-way="canvasContainer.offsetWidth"></canvas>
  </div>
</template>

AshleyGrant

<template>
  <require from="./sortable-custom-attribute"></require>
  
  <ul sortable="array.bind: left; options.bind: { group: 'test' }">
    <li repeat.for="item of left">${item}</li>
  </ul>
  <ul sortable="array.bind: right; options.bind: { group: 'test' }">
    <li repeat.for="item of right">${item}</li>
  </ul>
</template>

AshleyGrant

<template>
  See console
  <button click.delegate="change()">Change</button>
</template>

AshleyGrant

<template>
    <require from="./button-row"></require>
    <button-row repeat.for="btnRow of btnRowArray" label.bind="btnRow.label" buttons.bind="btnRow.buttons"></button-row>
</template>

AshleyGrant

<template>
  <require from="./dynamic-expression-binding-behavior"></require>
  <require from="./debug"></require>
  
  
  <form role="form">
    <div class="form-group col-sm-7" repeat.for="field of fields">
      <label for="${field.expression}">
        ${field.label}:
      </label>

AshleyGrant

<template>
  <ul>
    <li repeat.for="item of array | sort:theConfig">${item}</li>
  </ul>
</template> 

AshleyGrant

<template>
  About us!
</template>

AshleyGrant

<template>
  <input type="checkbox" checked.bind="isChecked" /><br>
  ${text}
</template>

AshleyGrant

<template>
  <h1>${message}</h1>
</template>

AshleyGrant

<template>
  <form>
    <label repeat.for="item of items">
      <input type="radio" name="test" value.bind="item" checked.bind="selected">
      ${item}
    </label>
    <button type="reset">Reset</button>
  </form>
  selected = '${selected}'
</template>