add dynamic value calls

main.ts

@@ -1,47 +1,85 @@
-type EnumDefinition = Record<string, string>;
-type EnumBlock = Record<string, EnumDefinition&{_:string}>;
-type RecursiveObject<Obj extends EnumBlock> =
+type ValueSignature = (...args:number[])=>void
+type EnumDefinition<Signature> = [property:string, options:Record<string, string>, values?:Signature];
+type EnumBlock<Signature> = Record<string, EnumDefinition<Signature>>;
+type RecursiveObject<Sig extends ValueSignature, Obj extends EnumBlock<Sig>> =
 {
-  [F in keyof Obj]:
+  [F in keyof Obj]: Obj[F][2] extends Sig ? ((...args:Parameters<Obj[F][2]>)=>RecursiveObject<Sig, Obj>)&{
+    [E in keyof Obj[F][1]]:RecursiveObject<Sig, Obj>
+  } :
   {
-    [E in keyof Omit<Obj[F], "_">]:RecursiveObject<Obj>
+    [E in keyof Obj[F][1]]:RecursiveObject<Sig, Obj>
   }
 }
 
-function Block<Fields extends EnumBlock>(options:Fields):()=>RecursiveObject<Fields>
+function Block<Signature extends ValueSignature, Fields extends EnumBlock<Signature>>(options:Fields):()=>RecursiveObject<Signature, Fields>
 {
   return ()=>{
     const list = [];
     let fieldLookup = {};
 
-    const proxyOuter = new Proxy(function(){
+    const proxyOuter = new Proxy(
+      function(...args)
+      {
+        console.log("outer: core call", ...args)
         return list;
-    }, {get(_target, propName){
+      },
+      {
+        get(_target, propName)
+        {
+          console.log("outer: reading property", propName);
           fieldLookup = options[propName];
           if(fieldLookup)
           {
-        list.push(fieldLookup._);
+            list.push(fieldLookup[0]);
           }
           return proxyInner
-    }});
+        }
+      }
+    );
 
-    const proxyInner = new Proxy({}, {get(_target, valName){
-      list.push(`:${fieldLookup[valName]};`);
+    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 extends Record<string, ReturnType<typeof styles>>>(userClasses:UserClasses):{[Class in keyof UserClasses]:string}
 {
   return new Proxy({}, {get(_target, className){}});
 }
 
-
-console.log(styles().Display.Block.Pos.Abs())