pseudo selectors working
This commit is contained in:
parent
1fb4a44b6b
commit
de5ae48d56
38
main.ts
38
main.ts
@ -1,26 +1,41 @@
|
|||||||
|
type PseudoKeys = ["hover"|"before"|"after"] | ["hover", "after"|"before"];
|
||||||
type ValueSignature = (...args:number[])=>void
|
type ValueSignature = (...args:number[])=>void
|
||||||
type EnumDefinition<Signature> = [property:string, options:Record<string, string>, values?:Signature];
|
type EnumDefinition<Signature> = [property:string, options:Record<string, string>, values?:Signature];
|
||||||
type EnumBlock<Signature> = Record<string, EnumDefinition<Signature>>;
|
type EnumBlock<Signature> = Record<string, EnumDefinition<Signature>>;
|
||||||
type RecursiveObject<Sig extends ValueSignature, Obj extends EnumBlock<Sig>> =
|
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>>)&{
|
[F in keyof Obj]: Obj[F][2] extends Sig ? ((...args:Parameters<Obj[F][2]>)=> RecursiveObject<Sig, Obj>&((...args:PseudoKeys)=>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>&((...args:PseudoKeys)=>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>&((...args:PseudoKeys)=>RecursiveObject<Sig, Obj>)&Array<RecursiveObject<Sig, Obj>>
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function Block<Signature extends ValueSignature, Fields extends EnumBlock<Signature>>(options:Fields):()=>RecursiveObject<Signature, Fields>
|
function Block<Signature extends ValueSignature, Fields extends EnumBlock<Signature>>(options:Fields):()=>RecursiveObject<Signature, Fields>
|
||||||
{
|
{
|
||||||
return ()=>{
|
return ()=>{
|
||||||
const list = ["@media(min-width:0px){"];
|
|
||||||
|
let pseudo = false;
|
||||||
|
let query = false;
|
||||||
|
const list = [];
|
||||||
let fieldLookup = {};
|
let fieldLookup = {};
|
||||||
|
|
||||||
const proxyOuter = new Proxy(
|
const proxyOuter = new Proxy(
|
||||||
function(...args)
|
function(...args)
|
||||||
{
|
{
|
||||||
console.log("outer: core call", ...args)
|
console.log("outer: core call", ...args)
|
||||||
|
if(args.length)
|
||||||
|
{
|
||||||
|
list.push(`${(pseudo||query) ? "}" : ""} &:${args.join("::")}{`);
|
||||||
|
pseudo = true;
|
||||||
|
query = false;
|
||||||
|
return proxyOuter;
|
||||||
|
}
|
||||||
|
pseudo && list.push("}");
|
||||||
|
query && list.push("}");
|
||||||
|
pseudo = false;
|
||||||
|
query = false;
|
||||||
return list;
|
return list;
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -30,7 +45,8 @@ function Block<Signature extends ValueSignature, Fields extends EnumBlock<Signat
|
|||||||
const sizeCheck = parseInt(propName)
|
const sizeCheck = parseInt(propName)
|
||||||
if(sizeCheck)
|
if(sizeCheck)
|
||||||
{
|
{
|
||||||
list.push(`}@media(min-width:${sizeCheck}px){`);
|
list.push(`${(query) ? "}" : ""} @media(min-width:${sizeCheck}px){`);
|
||||||
|
query = true;
|
||||||
return proxyOuter;
|
return proxyOuter;
|
||||||
}
|
}
|
||||||
fieldLookup = options[propName];
|
fieldLookup = options[propName];
|
||||||
@ -80,15 +96,17 @@ const styles = Block(
|
|||||||
);
|
);
|
||||||
|
|
||||||
const userDeclaredStyleBlock =
|
const userDeclaredStyleBlock =
|
||||||
styles()
|
(styles()
|
||||||
.Pos.Abs
|
.Pos.Abs
|
||||||
.Left(10)
|
("hover", "after")
|
||||||
[512]
|
|
||||||
.Pos.Rel
|
.Pos.Rel
|
||||||
.Left.Auto
|
.Left(20)
|
||||||
|
[512]
|
||||||
|
.Left(100))
|
||||||
|
|
||||||
|
|
||||||
// internal stringification
|
// internal stringification
|
||||||
console.log(userDeclaredStyleBlock().join("")+"}");
|
console.log(userDeclaredStyleBlock().join(""));
|
||||||
|
|
||||||
function Sheet<UserClasses extends Record<string, ReturnType<typeof styles>>>(userClasses:UserClasses):{[Class in keyof UserClasses]:string}
|
function Sheet<UserClasses extends Record<string, ReturnType<typeof styles>>>(userClasses:UserClasses):{[Class in keyof UserClasses]:string}
|
||||||
{
|
{
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user