File size: 8,571 Bytes
9da4a9b | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 | # 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'}` |
|