98 lines
2.7 KiB
TypeScript
98 lines
2.7 KiB
TypeScript
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]: Obj[F][2] extends Sig ? ((...args:Parameters<Obj[F][2]>)=>RecursiveObject<Sig, Obj>&Array<RecursiveObject<Sig, Obj>>)&{
|
|
[E in keyof Obj[F][1]]:RecursiveObject<Sig, Obj>&Array<RecursiveObject<Sig, Obj>>
|
|
} :
|
|
{
|
|
[E in keyof Obj[F][1]]:RecursiveObject<Sig, Obj>&Array<RecursiveObject<Sig, Obj>>
|
|
}
|
|
}
|
|
|
|
function Block<Signature extends ValueSignature, Fields extends EnumBlock<Signature>>(options:Fields):()=>RecursiveObject<Signature, Fields>
|
|
{
|
|
return ()=>{
|
|
const list = ["@media(min-width:0px){"];
|
|
let fieldLookup = {};
|
|
|
|
const proxyOuter = new Proxy(
|
|
function(...args)
|
|
{
|
|
console.log("outer: core call", ...args)
|
|
return list;
|
|
},
|
|
{
|
|
get(_target, propName)
|
|
{
|
|
console.log("outer: reading property", propName);
|
|
const sizeCheck = parseInt(propName)
|
|
if(sizeCheck)
|
|
{
|
|
list.push(`}@media(min-width:${sizeCheck}px){`);
|
|
return proxyOuter;
|
|
}
|
|
fieldLookup = options[propName];
|
|
if(fieldLookup)
|
|
{
|
|
list.push(fieldLookup[0]);
|
|
}
|
|
return proxyInner;
|
|
}
|
|
}
|
|
);
|
|
|
|
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"}],
|
|
Left:[ "left", {Auto:"auto"}, (left)=>{}]
|
|
}
|
|
);
|
|
|
|
const userDeclaredStyleBlock =
|
|
styles()
|
|
.Pos.Abs
|
|
.Left(10)
|
|
[512]
|
|
.Pos.Rel
|
|
.Left.Auto
|
|
|
|
// internal stringification
|
|
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){}});
|
|
}
|
|
|