diff options
| author | Joris | 2025-03-17 13:23:15 +0100 |
|---|---|---|
| committer | Joris | 2025-03-17 13:23:15 +0100 |
| commit | 1435f9e28aff7ab791c29f7d3017fa5baae2649b (patch) | |
| tree | a81e731f947b6bba3b1e859dd9ec0eb588a79cde /src | |
| parent | 47fd76920584bbbcde634395398f1640421eb60d (diff) | |
Add withState2 and withState3
Diffstat (limited to 'src')
| -rw-r--r-- | src/rx.ts | 74 |
1 files changed, 74 insertions, 0 deletions
@@ -9,6 +9,8 @@ export type Html | number | Tag | WithState<any> + | WithState2<any, any> + | WithState3<any, any, any> | Array<Html> | Rx<Html> @@ -27,6 +29,18 @@ interface WithState<A> { getChildren: (v: Var<A>) => Html } +interface WithState2<A, B> { + type: 'WithState2' + init: [A, B] + getChildren: (v1: Var<A>, v2: Var<B>) => Html +} + +interface WithState3<A, B, C> { + type: 'WithState3' + init: [A, B, C] + getChildren: (v1: Var<A>, v2: Var<B>, v3: Var<C>) => Html +} + interface Attributes { [key: string]: Rx<AttributeValue> | AttributeValue } @@ -44,6 +58,8 @@ function isHtml(x: any): x is Html { || typeof x === 'number' || isTag(x) || isWithState(x) + || isWithState2(x) + || isWithState3(x) || isRx(x) || Array.isArray(x)) } @@ -98,6 +114,22 @@ export function withState<A>(init: A, getChildren: (v: Var<A>) => Html): WithSta } } +export function withState2<A, B>(init: [A, B], getChildren: (v1: Var<A>, v2: Var<B>) => Html): WithState2<A, B> { + return { + type: 'WithState2', + init, + getChildren + } +} + +export function withState3<A, B, C>(init: [A, B, C], getChildren: (v1: Var<A>, v2: Var<B>, v3: Var<C>) => Html): WithState3<A, B, C> { + return { + type: 'WithState3', + init, + getChildren + } +} + // Rx export type RxAble<A> = Rx<A> | A @@ -412,6 +444,40 @@ function appendChild(state: State, element: Element, child: Html, lastAdded?: No remove: () => appendRes.remove(), lastAdded: appendRes.lastAdded } + } else if (isWithState2(child)) { + const { init, getChildren } = child + const [ init1, init2 ] = init + const v1 = state.register(init1) + const v2 = state.register(init2) + const children = getChildren(v1, v2) + const appendRes = appendChild(state, element, children) + return { + cancel: () => { + appendRes.cancel() + state.unregister(v1) + state.unregister(v2) + }, + remove: () => appendRes.remove(), + lastAdded: appendRes.lastAdded + } + } else if (isWithState3(child)) { + const { init, getChildren } = child + const [ init1, init2, init3 ] = init + const v1 = state.register(init1) + const v2 = state.register(init2) + const v3 = state.register(init3) + const children = getChildren(v1, v2, v3) + const appendRes = appendChild(state, element, children) + return { + cancel: () => { + appendRes.cancel() + state.unregister(v1) + state.unregister(v2) + state.unregister(v3) + }, + remove: () => appendRes.remove(), + lastAdded: appendRes.lastAdded + } } else if (isRx(child)) { const rxBase = document.createTextNode('') appendNode(element, rxBase, lastAdded) @@ -455,6 +521,14 @@ function isWithState<A>(x: any): x is WithState<A> { return x !== undefined && x.type === "WithState" } +function isWithState2<A, B>(x: any): x is WithState2<A, B> { + return x !== undefined && x.type === "WithState2" +} + +function isWithState3<A, B, C>(x: any): x is WithState3<A, B, C> { + return x !== undefined && x.type === "WithState3" +} + function appendNode(base: Element, node: Node, lastAdded?: Node) { if (lastAdded !== undefined) { base.insertBefore(node, lastAdded.nextSibling) |