npm i preact-nominal-allocator<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Preact Nominal Allocator Demo</title>
<script type="module" defer>
import { Component, render, h } from "https://unpkg.com/[email protected]?module";
import htm from "https://unpkg.com/htm?module";
import preset from "https://unpkg.com/[email protected]";
import { create } from "https://unpkg.com/[email protected]";
import NominalAllocator from "./js/out.js";
const html = htm.bind(h);
const jss = create(preset());
const style = {
allocatorContainer: {
display: "flex"
},
allocatorButtonPlus: {
fontSize: 18
},
allocatorButtonMinus: {
fontSize: 18
},
allocatorNumberInput: {}
};
const { classes } = jss.createStyleSheet(style).attach();
render(
html`
<${NominalAllocator}
min="${0}"
max="${12}"
onUpdate="${console.log}"
styles="${classes}"
/>
`,
document.body
);
</script>
</head>
<body></body>
</html>- Attributes:
minlowest input valuemaxhighest input valueonUpdateused to update the current value
NominalAllocator inserts inline classes via JSS. It
allows users to customize its style (via styles attribute) by adjusting
classes like .allocatorContainer,.allocatorButtonPlus,
.allocatorButtonMinus, and .allocatorNumberInput.
$ git clone [email protected]:TimDaub/preact-nominal-allocator.git
$ cd preact-nominal-allocator
$ npm i
$ npm run dev- Add
disabledprop
- Initial release
See LICENSE file or package.json.