From f144db6f109807cc9a60ed766090df2b3ec9d139 Mon Sep 17 00:00:00 2001 From: Joris Date: Sun, 23 Mar 2025 11:56:31 +0100 Subject: Add withState4 and withState5 --- src/rx.ts | 81 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 81 insertions(+) (limited to 'src') diff --git a/src/rx.ts b/src/rx.ts index a7d88f2..afcebac 100644 --- a/src/rx.ts +++ b/src/rx.ts @@ -11,6 +11,8 @@ export type Html | WithState | WithState2 | WithState3 + | WithState4 + | WithState5 | Array | Rx @@ -41,6 +43,18 @@ interface WithState3 { getChildren: (v1: Var, v2: Var, v3: Var) => Html } +interface WithState4 { + type: 'WithState4' + init: [A, B, C, D] + getChildren: (v1: Var, v2: Var, v3: Var, v4: Var) => Html +} + +interface WithState5 { + type: 'WithState5' + init: [A, B, C, D, E] + getChildren: (v1: Var, v2: Var, v3: Var, v4: Var, v5: Var) => Html +} + interface Attributes { [key: string]: Rx | AttributeValue } @@ -60,6 +74,7 @@ function isHtml(x: any): x is Html { || isWithState(x) || isWithState2(x) || isWithState3(x) + || isWithState4(x) || isRx(x) || Array.isArray(x)) } @@ -130,6 +145,22 @@ export function withState3(init: [A, B, C], getChildren: (v1: Var, v } } +export function withState4(init: [A, B, C, D], getChildren: (v1: Var, v2: Var, v3: Var, v4: Var) => Html): WithState4 { + return { + type: 'WithState4', + init, + getChildren + } +} + +export function withState5(init: [A, B, C, D, E], getChildren: (v1: Var, v2: Var, v3: Var, v4: Var, v5: Var) => Html): WithState5 { + return { + type: 'WithState5', + init, + getChildren + } +} + // Rx export type RxAble = Rx | A @@ -480,6 +511,48 @@ function appendChild(state: State, element: Element, child: Html, lastAdded?: No remove: () => appendRes.remove(), lastAdded: appendRes.lastAdded } + } else if (isWithState4(child)) { + const { init, getChildren } = child + const [ init1, init2, init3, init4 ] = init + const v1 = state.register(init1) + const v2 = state.register(init2) + const v3 = state.register(init3) + const v4 = state.register(init4) + const children = getChildren(v1, v2, v3, v4) + const appendRes = appendChild(state, element, children) + return { + cancel: () => { + appendRes.cancel() + state.unregister(v1) + state.unregister(v2) + state.unregister(v3) + state.unregister(v4) + }, + remove: () => appendRes.remove(), + lastAdded: appendRes.lastAdded + } + } else if (isWithState5(child)) { + const { init, getChildren } = child + const [ init1, init2, init3, init4, init5 ] = init + const v1 = state.register(init1) + const v2 = state.register(init2) + const v3 = state.register(init3) + const v4 = state.register(init4) + const v5 = state.register(init5) + const children = getChildren(v1, v2, v3, v4, v5) + const appendRes = appendChild(state, element, children) + return { + cancel: () => { + appendRes.cancel() + state.unregister(v1) + state.unregister(v2) + state.unregister(v3) + state.unregister(v4) + state.unregister(v5) + }, + remove: () => appendRes.remove(), + lastAdded: appendRes.lastAdded + } } else if (isRx(child)) { const rxBase = document.createTextNode('') appendNode(element, rxBase, lastAdded) @@ -531,6 +604,14 @@ function isWithState3(x: any): x is WithState3 { return x !== undefined && x.type === "WithState3" } +function isWithState4(x: any): x is WithState4 { + return x !== undefined && x.type === "WithState4" +} + +function isWithState5(x: any): x is WithState5 { + return x !== undefined && x.type === "WithState5" +} + function appendNode(base: Element, node: Node, lastAdded?: Node) { if (lastAdded !== undefined) { base.insertBefore(node, lastAdded.nextSibling) -- cgit v1.2.3