diff --git a/main.ts b/main.ts index bb8bb76..a7c52c5 100644 --- a/main.ts +++ b/main.ts @@ -1,47 +1,85 @@ -type EnumDefinition = Record; -type EnumBlock = Record; -type RecursiveObject = +type ValueSignature = (...args:number[])=>void +type EnumDefinition = [property:string, options:Record, values?:Signature]; +type EnumBlock = Record>; +type RecursiveObject> = { - [F in keyof Obj]: + [F in keyof Obj]: Obj[F][2] extends Sig ? ((...args:Parameters)=>RecursiveObject)&{ + [E in keyof Obj[F][1]]:RecursiveObject + } : { - [E in keyof Omit]:RecursiveObject + [E in keyof Obj[F][1]]:RecursiveObject } } -function Block(options:Fields):()=>RecursiveObject +function Block>(options:Fields):()=>RecursiveObject { return ()=>{ const list = []; let fieldLookup = {}; - const proxyOuter = new Proxy(function(){ - return list; - }, {get(_target, propName){ - fieldLookup = options[propName]; - if(fieldLookup) + const proxyOuter = new Proxy( + function(...args) { - list.push(fieldLookup._); + console.log("outer: core call", ...args) + return list; + }, + { + get(_target, propName) + { + console.log("outer: reading property", propName); + fieldLookup = options[propName]; + if(fieldLookup) + { + list.push(fieldLookup[0]); + } + return proxyInner + } } - return proxyInner - }}); + ); - const proxyInner = new Proxy({}, {get(_target, valName){ - list.push(`:${fieldLookup[valName]};`); - return proxyOuter; - }}); + const proxyInner = new Proxy( + function(...args) + { + console.log("inner: core call", ...args) + list.push(`:${args.join(" ")};`); + return proxyOuter; + }, + { + get(_target, valName) + { + console.log("inner: reading property", valName); + try + { + list.push(`:${fieldLookup[1][valName]};`); + return proxyOuter; + } + catch(e) + { + console.warn("someone is trying to stringify a style proxy"); + return ()=>"[StyleProxy]"; + } + } + } + ); return proxyOuter; } } const styles = Block({ - Pos:{_:"position", Abs:"absolute", Rel:"relative"}, - Display:{_:"display", Flex:"flex", Grid:"grid", None:"none", Block:"block", InlineBlock:"inline-block"} + Pos:["position", {Abs:"absolute", Rel:"relative"}], + Display:["display", {Flex:"flex", Grid:"grid", None:"none", Block:"block", InlineBlock:"inline-block"}], + Left:["left", {Auto:"auto"}, (left)=>{}] }); +const userDeclaredStyleBlock = styles() +.Pos.Abs +.Left(10) +.Display.Block + +console.log(userDeclaredStyleBlock().join("")); + function Sheet>>(userClasses:UserClasses):{[Class in keyof UserClasses]:string} { return new Proxy({}, {get(_target, className){}}); } - -console.log(styles().Display.Block.Pos.Abs())