SEM-003: element in the wrong place

Error: the page doesn't build until this is fixed.

Some things can only be in one place: components and layouts are defined at the top of a file, props and head go directly inside the page, field inside a form.

Fails

page(title: "Shoes", description: "All our running shoes, from light racers to trail shoes.") {
  h1 "Shoes"
  component Badge(text: Text) { span(class: "badge") "{text}" }
}

error[SEM-003]: a component must be at the top of the file
 --> page.hypra:3:3
  |
3 |   component Badge(text: Text) { span(class: "badge") "{text}" }
  |   ^^^^^^^^^
  = docs: https://hypralang.dev/rules/sem-003/

1 error, 0 warnings

Fixed

component Badge(text: Text) { span(class: "badge") "{text}" }

page(title: "Shoes", description: "All our running shoes, from light racers to trail shoes.") {
  h1 "Shoes"
  Badge(text: "New")
}