@@ -28,32 +28,32 @@ and renders declaratively using `lit-html`. See the [lit-html guide](https://lit
28
28
for additional information on how to create templates for lit-element.
29
29
30
30
``` ts
31
- import {LitElement , html , css , customElement , property } from ' lit-element' ;
31
+ import {LitElement , html , css , customElement , property } from ' lit-element' ;
32
32
33
- // This decorator defines the element.
34
- @customElement (' my-element' )
35
- export class MyElement extends LitElement {
33
+ // This decorator defines the element.
34
+ @customElement (' my-element' )
35
+ export class MyElement extends LitElement {
36
36
37
- // This decorator creates a property accessor that triggers rendering and
38
- // an observed attribute.
39
- @property ()
40
- mood = ' great' ;
37
+ // This decorator creates a property accessor that triggers rendering and
38
+ // an observed attribute.
39
+ @property ()
40
+ mood = ' great' ;
41
41
42
- static styles = css `
43
- span {
44
- color: green;
45
- } ` ;
42
+ static styles = css `
43
+ span {
44
+ color: green;
45
+ } ` ;
46
46
47
- // Render element DOM by returning a `lit-html` template.
48
- render() {
49
- return html ` Web Components are <span>${this .mood }</span>! ` ;
50
- }
47
+ // Render element DOM by returning a `lit-html` template.
48
+ render() {
49
+ return html ` Web Components are <span>${this .mood }</span>! ` ;
50
+ }
51
51
52
- }
52
+ }
53
53
```
54
54
55
55
``` html
56
- <my-element mood =" awesome" ></my-element >
56
+ <my-element mood =" awesome" ></my-element >
57
57
```
58
58
59
59
Note, this example uses decorators to create properties. Decorators are a proposed
0 commit comments