polymer-litdeprecated

Simple mixin for Polymer giving access to Lit-HTML

Usage no npm install needed!

<script type="module">
  import polymerLit from 'https://cdn.skypack.dev/polymer-lit';
</script>

README

DEPRECATED: Since the orignial LitElement now works as the alternative to the Polymer base class, I won't continue this Mixin which does the same :) Please use the https://github.com/Polymer/lit-element in your projects!

Polymer Lit-HTML Mixin

Mixin for Polymer which gives you ability to render your element with lit-html, it's based on the original polymer-lit repository, but it's goal to work with polymer and not decorate an HTMLElement.

Installation

yarn add polymer-lit

Usage for Polymer 3.x

import {Element as PolymerElement} from '/node_modules/@polymer/polymer/polymer-element.js';
import {Lit} from '/node_modules/polymer-lit/polymer-lit.js';
import {html} from '/node_modules/lit-html/lit-html.js';

class MyElement extends Lit(PolymerElement)
{
    static get properties() { return {
        // ...
    }};

    render() {
        return html`
            <style>:host { display: block; }</style>
            <slot></slot>
        `;
    }
}

customElements.define('my-element', MyElement);