dssl / native /spec /appendix-b-messages.md
EHS-Studio's picture
Claude Sonnet 5.5
v0.16.3: native DSSL spec, and the seven bugs writing it found
9da4a9b
|
Raw History Blame Contribute Delete
8.57 kB
# Appendix B: message templates
Generated by `scripts/gen-native-vocab.mjs`. Every error and warning template found in the engine
source, by file and line. `${...}` marks a value filled in at run time. The extraction is by pattern,
so it can include a string that is not a message and can miss one built in an unusual way. It is a
checklist for the corpus, not the definition: the definition is in the chapters.
## parser.js
| line | template |
|---|---|
| 177 | `unknown at-rule "${h.split(' ')[0]}"` |
| 183 | `unknown pseudo-element "::${name}"` |
| 205 | `unexpected "}"` |
| 224 | `block is missing a header before "{"` |
| 261 | `${meta.kind} { } must be top-level` |
| 282 | `the "${(meta.sel \|\| '').slice(0, 30) \|\| 'block'}" block was never closed with "}"` |
| 350 | `expected ":" in "${part.slice(0, 40)}"` |
| 356 | `declaration is missing a property name` |
| 367 | `"${prop}" is not a valid property name` |
## resolver.js
| line | template |
|---|---|
| 415 | `${what} takes a bare number of degrees` |
| 500 | `mesh needs a base colour and at least one blob` |
| 504 | `mesh item "${it}" needs a position` |
| 509 | `mesh needs a base colour first (an item without "at")` |
| 521 | `gradient needs a kind: "linear", "radial", "conic" or "mesh" (any of them can be "repeating")` |
| 558 | `gradient needs at least two stops` |
| 576 | `"${head}" is not a linear gradient direction` |
| 587 | `"${a}" is not part of a radial gradient shape` |
| 602 | `"${head}" is not a conic gradient prefix` |
| 617 | `"${s}" is a midpoint, so it has to sit between two colours` |
| 626 | `a gradient stop is missing its color (got "${s}")` |
| 633 | `gradient stop "${s}" is not a color` |
| 666 | `gap needs a value` |
| 680 | `"${a}" is written twice in ${dir} - the second copy wins` |
| 681 | `two words in ${dir} write ${prop}: "${a}" overrides "${prev}"` |
| 706 | `unknown word "${a}" in ${dir}` |
| 728 | `${a} needs a number` |
| 745 | `unknown animate part "${a}"` |
| 773 | `grid needs columns` |
| 791 | `unknown place "${word}" in stack` |
| 799 | `unknown place "${v}"` |
| 819 | `unknown center axis "${v}"` |
| 840 | `font: "${v.trim()}" looks like the CSS font shorthand, but DSSL's font: means size, line height and colour` |
| 870 | `radius "${a}" is not defined, so it will not apply` |
| 891 | `unknown align "${v}"` |
| 947 | `transition: the CSS form (property first) is not DSSL` |
| 952 | `transition duration "${dur}" is not a time` |
| 968 | `unknown transition property "${raw}"` |
| 997 | `stagger needs a duration like "60" or "120ms", or "none"` |
| 1016 | `unknown overlap policy "${(v \|\| '').trim()}"` |
| 1040 | `bend-around caps at ±170° - past that the arc folds back on itself` |
| 1053 | `stretch needs a positive factor, like "stretch: 1.2" or "stretch: 1.4 vertical"` |
| 1062 | `stretch: ${m[1]} would flatten the element to nothing` |
| 1095 | `text-stroke needs a width first` |
| 1112 | `yield needs the properties to hand back` |
| 1115 | `yield: "${n}" is not a CSS property` |
| 1128 | `outline-shape needs a width first` |
| 1166 | `gradient-flow takes a duration like "6s" or "6000ms", or "none"` |
| 1179 | `unknown gradient-flow part "${a}"` |
| 1202 | `fluid: "${s}" ${why}` |
| 1216 | `${parts[0]} ${parts[1]}` |
| 1217 | `${parts[2]} ${parts[3]}` |
| 1306 | `!important does not exist in DSSL - "${prop}: ${String(value).replace(/\s*!\s*important\s*/i, '')}" was NOT applied` |
| 1346 | `unknown property "${prop}"` |
| 1374 | `@media needs a condition` |
| 1402 | `@signal ${list[1]} ${list[2]} ( ) has no values` |
| 1412 | `bad @signal expression "${expr}"` |
| 1451 | `unexpected "${child.kind}" inside tokens` |
| 1460 | `behavior "${node.name}" is defined twice` |
| 1503 | `"${child.prop}" is not allowed inside motion` |
| 1509 | `bad keyframe selector "${child.sel}"` |
| 1601 | `unknown behavior "${name}"` |
| 1604 | `behavior cycle involving "${name}"` |
| 1623 | `"${node.sel}" compiled as a descendant selector ("${combine(ctx.sel, node.sel)}")` |
| 1635 | `"${node.name}" needs a selector around it` |
| 1647 | `"${d.prop}: ${d.value}" - the -> arrow is motion syntax and does nothing inside seen { }` |
| 1688 | `unknown layer "${node.name}", treated as "components"` |
| 1710 | `"seen" is engine-native and has no meaning on a pseudo-element` |
| 1716 | `only declarations and states (hover { }) may appear inside a pseudo-element block` |
| 1725 | `"${d.prop}" is engine-native and has no meaning on ::${node.name} - a pseudo-element has no DOM handle` |
| 1750 | `tokens must be top-level or inside @media / @signal` |
| 1789 | `raw { } is verbatim CSS, so this line needs a ";" at the end ("${t.slice(0, 40)}")` |
| 1797 | `${node.kind} "${node.name}" must be top-level` |
| 1808 | `declarations must live inside a selector` |
| 1824 | `"${d.prop}" is engine-native and has no meaning on ::${ps.parts[0].pseudo.split(/[\s:(]/)[0]} - a pseudo-element has no DOM handle` |
| 1834 | `unknown pseudo-element "::${pseudo}"` |
| 1842 | `::slotted() only exists inside a shadow tree, and DSSL styles the light DOM` |
| 1850 | `the engine-native "seen" state can't combine with "::${name}" in shadow CSS` |
| 1868 | `selector list mixes pseudo-element and plain selectors: "${ctx.sel}"` |
| 1913 | `"${d.via}:" expands to display: ${d.value}, which overrides the earlier "display: ${explicit.value}" (line ${explicit.line}) in the same rule - later wins, so the earlier one is dead` |
| 1937 | `"${r.sel}" sets the background image twice (gradient: and ${other.prop}): the later one replaces the earlier, so one of them never shows` |
| 1953 | `${x.prop} does nothing here: this rule has no CSS animation to tune${usesAnimate ? ', it runs its motion through animate:' : ''}` |
| 1965 | `unknown motion "${d.value.motion}"` |
| 1984 | `animation "${d.value}" references no motion defined in this sheet - it will not run` |
## texture.js
| line | template |
|---|---|
| 380 | `texture needs a name` |
| 390 | `unknown texture "${first}"` |
| 398 | `unknown texture setting "${key}"` |
| 406 | `texture setting "${key}" needs ${def.words === 1 ? 'a value' : def.words + ' values'}` |
| 412 | `texture setting "${key}" needs a number, got "${vals.join(' ')}"` |
| 413 | `texture "${key}" must be between ${def.min} and ${def.max}` |
| 417 | `unknown ${key} "${vals[0]}"` |
## aura.js
| line | template |
|---|---|
| 84 | `unknown around "${w}"` |
| 89 | `polygon needs "x y" pairs in percent, got "${part.trim()}"` |
| 92 | `a polygon needs at least 3 points` |
| 325 | `${prop} needs a value` |
| 342 | `an aura layer starts with glow or particles, not "${head}"` |
| 377 | `unknown aura property "${prop}"` |
## slider.js
| line | template |
|---|---|
| 69 | `slider needs a description` |
| 78 | `unknown slider setting "${head}"` |
| 92 | `track radius needs a number or "full"` |
| 102 | `thumb needs a size in px` |
| 107 | `unknown thumb shape "${rest[0] ?? ''}"` |
| 111 | `ring needs a width and a colour` |
| 116 | `glow needs a colour and a radius` |
| 121 | `ticks needs a count of at least 2` |
| 127 | `graph needs at least two numbers` |
| 128 | `graph values are 0 to 100` |
| 129 | `graph is limited to 120 bars` |
| 132 | `graph-height needs a number of px, at least 8` |
| 136 | `graph-gap needs a number of px` |
| 141 | `unexpected "${rest.slice(used).join(' ')}" in the ${head} setting` |
## effects.js
| line | template |
|---|---|
| 43 | `${x} needs a number` |
| 49 | `tint needs a color or "none"` |
| 58 | `unknown glass setting "${x}"` |
| 60 | `glass blur cannot be negative` |
| 72 | `tilt needs a number of degrees` |
| 87 | `unknown tilt setting "${x}"` |
| 89 | `tilt degrees should be between 0 and 45` |
| 90 | `lift must be above 0` |
| 91 | `perspective must be at least 100px` |
| 92 | `speed must be between 0.02 and 1` |
## fonts.js
| line | template |
|---|---|
## lint.js
| line | template |
|---|---|
| 119 | `text contrast is ${ratio.toFixed(1)}:1 (${toHex(fgSolid)} on ${toHex(bg)}), below the ${need}:1 that readers need${large ? ' for large text' : ''}` |
| 147 | `${dim}: ${px}px on "${r.sel}" is below 24px, the smallest target WCAG 2.2 allows` |
| 160 | `the focus outline is removed from "${k.sel}" and nothing replaces it, so keyboard users lose their place` |
| 269 | `${p.a.props.join(', ')} in "${p.a.sel}" can never apply: "${p.b.sel}" (${p.b.file \|\| ''}${p.b.file ? ':' : ''}${p.b.line}) comes later, matches every element this rule matches, and sets ${p.a.props.length > 1 ? 'the same properties' : 'the same property'}` |