@polymer/lit-element

WebJar for @polymer/lit-element

License

License

BSD 3-Clause
GroupId

GroupId

org.webjars.bowergithub.polymer
ArtifactId

ArtifactId

lit-element
Last Version

Last Version

0.6.1
Release Date

Release Date

Type

Type

jar
Description

Description

@polymer/lit-element
WebJar for @polymer/lit-element
Project URL

Project URL

http://webjars.org
Source Code Management

Source Code Management

https://github.com/polymer/lit-element

Download lit-element

How to add to project

<!-- https://jarcasting.com/artifacts/org.webjars.bowergithub.polymer/lit-element/ -->
<dependency>
    <groupId>org.webjars.bowergithub.polymer</groupId>
    <artifactId>lit-element</artifactId>
    <version>0.6.1</version>
</dependency>
// https://jarcasting.com/artifacts/org.webjars.bowergithub.polymer/lit-element/
implementation 'org.webjars.bowergithub.polymer:lit-element:0.6.1'
// https://jarcasting.com/artifacts/org.webjars.bowergithub.polymer/lit-element/
implementation ("org.webjars.bowergithub.polymer:lit-element:0.6.1")
'org.webjars.bowergithub.polymer:lit-element:jar:0.6.1'
<dependency org="org.webjars.bowergithub.polymer" name="lit-element" rev="0.6.1">
  <artifact name="lit-element" type="jar" />
</dependency>
@Grapes(
@Grab(group='org.webjars.bowergithub.polymer', module='lit-element', version='0.6.1')
)
libraryDependencies += "org.webjars.bowergithub.polymer" % "lit-element" % "0.6.1"
[org.webjars.bowergithub.polymer/lit-element "0.6.1"]

Dependencies

compile (1)

Group / Artifact Type Version
org.webjars.bowergithub.polymer : lit-html jar [0.11.4,0.12)

Project Modules

There are no modules declared in this project.

LitElement

A simple base class for creating fast, lightweight web components with lit-html.

Build Status Published on npm Join our Slack Published on webcomponents.org Mentioned in Awesome lit-html

Documentation

Full documentation is available at lit-element.polymer-project.org.

Overview

LitElement uses lit-html to render into the element's Shadow DOM and adds API to help manage element properties and attributes. LitElement reacts to changes in properties and renders declaratively using lit-html. See the lit-html guide for additional information on how to create templates for lit-element.

    import {LitElement, html, css, customElement, property} from 'lit-element';

    // This decorator defines the element.
    @customElement('my-element')
    export class MyElement extends LitElement {

      // This decorator creates a property accessor that triggers rendering and
      // an observed attribute.
      @property()
      mood = 'great';

      static styles = css`
        span {
          color: green;
        }`;

      // Render element DOM by returning a `lit-html` template.
      render() {
        return html`Web Components are <span>${this.mood}</span>!`;
      }

    }
    <my-element mood="awesome"></my-element>

Note, this example uses decorators to create properties. Decorators are a proposed standard currently available in TypeScript or Babel. LitElement also supports a vanilla JavaScript method of declaring reactive properties.

Examples

Installation

From inside your project folder, run:

$ npm install lit-element

To install the web components polyfills needed for older browsers:

$ npm i -D @webcomponents/webcomponentsjs

Supported Browsers

The last 2 versions of all modern browsers are supported, including Chrome, Safari, Opera, Firefox, Edge. In addition, Internet Explorer 11 is also supported.

Edge and Internet Explorer 11 require the web components polyfills.

Contributing

Please see CONTRIBUTING.md.

org.webjars.bowergithub.polymer

Polymer

Versions

Version
0.6.1
0.6.0-dev.6
0.6.0