hyperapp-is 0.1.5 → 0.1.7

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.npm.md DELETED
@@ -1,107 +0,0 @@
1
- # hyperapp-is
2
-
3
- Lightweight. Declarative. Composable.
4
-
5
- Reusable component foundation library for Hyperapp v2.
6
-
7
- State-structure independent design + RAF-based animation system.
8
-
9
- ---
10
-
11
- ## Features
12
-
13
- - State-path based reusable component design
14
- - Local state helpers
15
- `getLocalState`, `setLocalState`, `createLocalKey`
16
- - Action composition utility
17
- `concatAction`
18
- - Class / props utilities
19
- `getClassList`, `deleteKeys`
20
- - requestAnimationFrame task system
21
- `RAFTask`, `subscription_RAFManager`
22
- - Built-in animated Carousel component
23
-
24
- ---
25
-
26
- ## Installation
27
-
28
- ``` bash
29
- npm install hyperapp-is
30
- ```
31
-
32
- Peer dependencies:
33
-
34
- - hyperapp v2
35
- - hyperapp-jsx-pragma (when using JSX)
36
-
37
- ---
38
-
39
- ## Basic Usage (Carousel Example)
40
-
41
- ``` ts
42
- import { app } from "hyperapp"
43
- import h from "hyperapp-jsx-pragma"
44
- import {
45
- RAFTask, subscription_RAFManager,
46
- Carousel, effect_InitCarousel
47
- } from "hyperapp-is"
48
-
49
- interface State {
50
- tasks: RAFTask<State>[]
51
- }
52
-
53
- const initState: State = {
54
- tasks: []
55
- }
56
-
57
- app({
58
- node: document.getElementById("app") as HTMLElement,
59
- init: [initState, effect_InitCarousel(["tasks"], {
60
- id : "carousel",
61
- duration: 2000,
62
- delay : 1000,
63
- step : 1
64
- })],
65
-
66
- subscriptions: (state) => [
67
- subscription_RAFManager(state, ["tasks"])
68
- ],
69
-
70
- view: (state) => (<Carousel
71
- state = { state }
72
- id = "carousel"
73
- keyNames = { ["tasks"] }
74
- >
75
- <div>Slide 1</div>
76
- <div>Slide 2</div>
77
- <div>Slide 3</div>
78
- </Carousel>)
79
- })
80
- ```
81
-
82
- ---
83
-
84
- ## Concept
85
-
86
- hyperapp-is allows components to:
87
-
88
- - Remain independent from root state structure
89
- - Store internal state without polluting user state
90
- - Compose actions safely
91
- - Manage animations declaratively via RAFTask
92
-
93
- Designed for building reusable UI components on top of Hyperapp.
94
-
95
- ---
96
-
97
- ## Documentation
98
-
99
- Full documentation and detailed design notes are available on GitHub:
100
-
101
- https://github.com/is4416/hyperapp-is
102
-
103
- ---
104
-
105
- ## License
106
-
107
- MIT