@fest-lib/lure 0.1.2 → 0.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +6 -6
- package/dist/lure.js +1833 -1819
- package/package.json +7 -6
package/README.md
CHANGED
|
@@ -62,7 +62,7 @@ import {
|
|
|
62
62
|
E, M, Q, createElement, H,
|
|
63
63
|
// Extensions (selected)
|
|
64
64
|
bindDraggable, grabForDrag, agWrapEvent,
|
|
65
|
-
} from "fest/lure";
|
|
65
|
+
} from "@fest-lib/lure";
|
|
66
66
|
```
|
|
67
67
|
|
|
68
68
|
### Quick Start
|
|
@@ -131,7 +131,7 @@ box.attr.id = "app2"; // example of reactive wrapper operations
|
|
|
131
131
|
`M(observable, mapper)` maps a reactive array/set into DOM. Returns a reactive fragment-like node.
|
|
132
132
|
|
|
133
133
|
```ts
|
|
134
|
-
import { observe } from "fest/object";
|
|
134
|
+
import { observe } from "@fest-lib/object";
|
|
135
135
|
|
|
136
136
|
const rxItems = iterated(["A", "B", "C"]);
|
|
137
137
|
const list = H`<ul>${M(rxItems, (x) => H`<li>${x}</li>`)}</ul>`;
|
|
@@ -184,7 +184,7 @@ const items = ["A", "B", "C"];
|
|
|
184
184
|
const listStatic = H`<ul>${items.map(x => H`<li>${x}</li>`)}</ul>`;
|
|
185
185
|
|
|
186
186
|
// Reactive list: use M(...)
|
|
187
|
-
import { observe } from "fest/object";
|
|
187
|
+
import { observe } from "@fest-lib/object";
|
|
188
188
|
const rxItems = iterated(["A", "B", "C"]);
|
|
189
189
|
const listReactive = H`<ul>${M(rxItems, (x) => H`<li>${x}</li>`)}</ul>`;
|
|
190
190
|
```
|
|
@@ -200,7 +200,7 @@ const frag = H`<div>one</div><div>two</div>`; // DocumentFragment
|
|
|
200
200
|
Pointer helpers and drag handling:
|
|
201
201
|
|
|
202
202
|
```ts
|
|
203
|
-
import { bindDraggable, grabForDrag } from "fest/lure";
|
|
203
|
+
import { bindDraggable, grabForDrag } from "@fest-lib/lure";
|
|
204
204
|
|
|
205
205
|
const target = H`<div class="draggable" />` as HTMLElement;
|
|
206
206
|
bindDraggable(target, () => console.log("drag end"));
|
|
@@ -215,8 +215,8 @@ bindDraggable(target, () => console.log("drag end"));
|
|
|
215
215
|
- `ref(...)` are reactive and will be updated when the referenced content changes
|
|
216
216
|
|
|
217
217
|
```ts
|
|
218
|
-
import { ref } from "fest/object";
|
|
219
|
-
import { H } from "fest/lure";
|
|
218
|
+
import { ref } from "@fest-lib/object";
|
|
219
|
+
import { H } from "@fest-lib/lure";
|
|
220
220
|
|
|
221
221
|
// referenced content is also a DOM element (`Text` node)
|
|
222
222
|
const txt = ref("Hello");
|