lite-s

A simple state manage library with pull-push based design.

Inspired from S.js and a talk about SolidJS

Installation

Option 1: Import npm package

Install from npm:

# install with npm
npm i lite-s
# or pnpm
pnpm i lite-s
# or yarn
yarn add lite-s

Import as typescript package / esm package:

// using named import
import { S } from 'lite-s'
// or using default import
import S from 'lite-s'

Import as commonjs package

let { S } = require('lite-s')

Option 2: Import esm package over CDN

<script type="module">
  import { S } from 'https://cdn.jsdelivr.net/npm/[email protected]/core.mjs'
</script>

Option 3: Import iife library over CDN

<script src="https://cdn.jsdelivr.net/npm/[email protected]/s.js"></script>
<script>
  let state = S(1)
</script>

Usage Example

let a = S(1)
let b = S(2)
let c = () => a.value + b.value
let text = S.map(() => `${a} + ${b} = ${c()}`)

let dom = {
  a: document.createElement('input'),
  b: document.createElement('input'),
  c: document.createTextNode(text),
}

dom.a.type = 'number'
dom.a.value = a.value
dom.a.addEventListener('input', e => (a.value = e.target.valueAsNumber))

dom.b.type = 'number'
dom.b.value = b.value
dom.b.addEventListener('input', e => (b.value = e.target.valueAsNumber))

S.run(() => (dom.c.textContent = text))

document.body.appendChild(dom.a)
document.body.appendChild(dom.b)
document.body.appendChild(dom.c)

License

This project is licensed with BSD-2-Clause

This is free, libre, and open-source software. It comes down to four essential freedoms [ref]:

• The freedom to run the program as you wish, for any purpose
• The freedom to study how the program works, and change it so it does your computing as you wish
• The freedom to redistribute copies so you can help others
• The freedom to distribute copies of your modified versions to others