/unistore-lit

Unistore connector to lit and uhtml.

Primary LanguageJavaScript

unistore-lit

unistore connector to lit and uhtml (and any tagged template library).

Examples

Usage

store.js

import createStore from 'unistore';
import connectTo from 'unistore-lit';

export const store = createStore({
  list: [
    { id: 1, text: 'Do the thing!' },
    { id: 2, text: 'Do another thing!' },
  ],
});

export const connect = connectTo(store);

app.js

import { connect } from './store';

const mapStateToProps = (state) => ({
  myList: state.list,
});

export const App = connect(mapStateToProps)(
  ({ myList }) => html`
    <ul>
      ${myList.map((item) => html`<li>${item.id} - ${item.text}</li>`)}
    </ul>
  `
);

index.js

import { render } from 'lit'; // or 'uhtml'
import { store } from './store';
import { App } from './app';

const renderApp = () => render(App(), document.body);

renderApp() && store.subscribe(renderApp);