defunkt/forge
1
0
Fork 0
Code Issues Pull Requests Activity

fix :pseudos

Browse Source
This commit is contained in:
Chris Wanstrath 2025-12-26 21:59:34 -08:00
parent 54f666d25f
commit 6b68c401f7
1 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
src/index.tsx
View File

@ -92,19 +92,24 @@ function makeComponent(baseName: string, rootDef: TagDef, rootProps: Record<stri
} }
} }
// ensures 'hover' is ':hover'
function stateName(state: string): string {
return state.startsWith(':') ? state : `:${state}`
}
// adds CSS styles for tag definition // adds CSS styles for tag definition
function registerStyles(name: string, def: TagDef) { function registerStyles(name: string, def: TagDef) {
const rootClassName = makeClassName(name) const rootClassName = makeClassName(name)
styles[rootClassName] ??= makeStyle(def) styles[rootClassName] ??= makeStyle(def)
for (const [state, style] of Object.entries(def.states ?? {})) for (const [state, style] of Object.entries(def.states ?? {}))
styles[`${rootClassName}${state}`] = makeStyle(style) styles[`${rootClassName}${stateName(state)}`] = makeStyle(style)
for (const [partName, partDef] of Object.entries(def.parts ?? {})) { for (const [partName, partDef] of Object.entries(def.parts ?? {})) {
const partClassName = makeClassName(name, partName) const partClassName = makeClassName(name, partName)
styles[partClassName] ??= makeStyle(partDef) styles[partClassName] ??= makeStyle(partDef)
for (const [state, style] of Object.entries(partDef.states ?? {})) for (const [state, style] of Object.entries(partDef.states ?? {}))
styles[`${partClassName}${state}`] = makeStyle(style) styles[`${partClassName}${stateName(state)}`] = makeStyle(style)
} }
@ -121,14 +126,14 @@ function registerStyles(name: string, def: TagDef) {
const className = `${baseClassName}.${variantName}` const className = `${baseClassName}.${variantName}`
styles[className] ??= makeStyle(variantDef) styles[className] ??= makeStyle(variantDef)
for (const [state, style] of Object.entries(variantDef.states ?? {})) for (const [state, style] of Object.entries(variantDef.states ?? {}))
styles[`${className}${state}`] = makeStyle(style) styles[`${className}${stateName(state)}`] = makeStyle(style)
for (const [partName, partDef] of Object.entries(variantDef.parts ?? {})) { for (const [partName, partDef] of Object.entries(variantDef.parts ?? {})) {
const basePartClassName = makeClassName(name, partName) const basePartClassName = makeClassName(name, partName)
const partClassName = `${basePartClassName}.${variantName}` const partClassName = `${basePartClassName}.${variantName}`
styles[partClassName] ??= makeStyle(partDef) styles[partClassName] ??= makeStyle(partDef)
for (const [state, style] of Object.entries(partDef.states ?? {})) for (const [state, style] of Object.entries(partDef.states ?? {}))
styles[`${partClassName}${state}`] = makeStyle(style) styles[`${partClassName}${stateName(state)}`] = makeStyle(style)
} }
} else { } else {
// Keyed variant - iterate over the keys // Keyed variant - iterate over the keys
@ -136,13 +141,13 @@ function registerStyles(name: string, def: TagDef) {
const className = makeClassName(name, undefined, variantName, variantKey) const className = makeClassName(name, undefined, variantName, variantKey)
styles[className] ??= makeStyle(variantDef) styles[className] ??= makeStyle(variantDef)
for (const [state, style] of Object.entries(variantDef.states ?? {})) for (const [state, style] of Object.entries(variantDef.states ?? {}))
styles[`${className}${state}`] = makeStyle(style) styles[`${className}${stateName(state)}`] = makeStyle(style)
for (const [partName, partDef] of Object.entries(variantDef.parts ?? {})) { for (const [partName, partDef] of Object.entries(variantDef.parts ?? {})) {
const partClassName = makeClassName(name, partName, variantName, variantKey) const partClassName = makeClassName(name, partName, variantName, variantKey)
styles[partClassName] ??= makeStyle(partDef) styles[partClassName] ??= makeStyle(partDef)
for (const [state, style] of Object.entries(partDef.states ?? {})) for (const [state, style] of Object.entries(partDef.states ?? {}))
styles[`${partClassName}${state}`] = makeStyle(style) styles[`${partClassName}${stateName(state)}`] = makeStyle(style)
} }
} }
} }