boot-function #1

Merged
SethTrowbridge merged 25 commits from boot-function into master 2023-06-21 07:53:14 -04:00
2 changed files with 41 additions and 7 deletions
Showing only changes of commit 68503424e6 - Show all commits

View File

@ -85,7 +85,6 @@ const ProxyState =(argNew:StateType)=>
//const passedFunction = inArg; //const passedFunction = inArg;
stateSet((oldState:StateType)=> stateSet((oldState:StateType)=>
{ {
console.log("function setter intercepted");
const output = inArg(oldState); const output = inArg(oldState);
stateUser.state = output; stateUser.state = output;
HMR.statesNew.set(id, stateUser); HMR.statesNew.set(id, stateUser);
@ -102,7 +101,32 @@ const ProxyState =(argNew:StateType)=>
}; };
type Storelike = Record<string, string>
const ProxyReducer =(inReducer:(inState:Storelike, inAction:string)=>Storelike, inState:Storelike)=>
{
const check = MapIndex(HMR.statesOld, HMR.statesNew.size);
const argOld = check ? check[1].state : inState;
const intercept =(inInterceptState:Storelike, inInterceptAction:string)=>
{
const capture = inReducer(inInterceptState, inInterceptAction);
const stateUser = {state:capture, set:()=>{}, reload:HMR.reloads};
HMR.statesNew.set(id, stateUser);
console.log("interepted reducer", stateUser);
return capture;
};
const id = ReactParts.useId();
const [state, dispatch] = ReactParts.useReducer(intercept, argOld as Storelike);
if(!HMR.statesNew.get(id))
{
HMR.statesNew.set(id, {state:state, set:()=>{}, reload:HMR.reloads});
}
return [state, dispatch];
};
export * from "react-original"; export * from "react-original";
export {ProxyCreate as createElement, ProxyState as useState }; export {ProxyCreate as createElement, ProxyState as useState, ProxyReducer as useReducer };
export const isProxy = true; export default {...ReactParts, createElement:ProxyCreate, useState:ProxyState, useReducer:ProxyReducer};
export default {...ReactParts, createElement:ProxyCreate, useState:ProxyState, isProxy:true};

View File

@ -1,11 +1,10 @@
import { VNode } from "https://esm.sh/v118/preact@10.15.1/src/index.js";
import React from "react"; import React from "react";
const CTXString = React.createContext("lol"); const CTXString = React.createContext("lol");
type StateBinding<T> = [get:T, set:React.StateUpdater<T>]; type StateBinding<T> = [get:T, set:React.StateUpdater<T>];
const CTXState = React.createContext(null) as React.Context<StateBinding<number>|null>; const CTXState = React.createContext(null) as React.Context<StateBinding<number>|null>;
const Outer =(props:{children:VNode})=> const Outer =(props:{children:Preact.VNode})=>
{ {
const binding = React.useState(11); const binding = React.useState(11);
return <CTXState.Provider value={binding}> return <CTXState.Provider value={binding}>
@ -19,12 +18,23 @@ const Inner =()=>
}; };
type Store = {name:string, age:number}
const reducer =(inState:Store, inAction:number)=>
{
return {...inState, age:inState.age+inAction};
}
export default ()=> export default ()=>
{ {
const [Store, Dispatch] = React.useReducer(reducer, {name:"seth", age:24} as Store)
return <CTXString.Provider value="intradestink"> return <CTXString.Provider value="intradestink">
<div> <div>
<h1>Title!</h1> <h1>Title!</h1>
<h2>subtitle</h2> <h2>subtitle!</h2>
<p>
<button onClick={e=>Dispatch(1)}>{Store.name}|{Store.age}?</button>
</p>
</div> </div>
<Outer> <Outer>
<Inner/> <Inner/>