SpinBox < TextEdit
  __class: UISpinBox
  text-align: left
  size: 86 20
  padding: 0
  padding-left: 2

  Button
    id: up
    size: 10 10
    image-source: /images/ui/spinbox_up
    image-border: 1
    image-clip: 0 0 10 10
    anchors.top: parent.top
    anchors.right: parent.right

    $hover:
      image-clip: 0 10 10 10
    $pressed:
      image-clip: 0 20 10 10

  Button
    id: down
    size: 10 10
    image-source: /images/ui/spinbox_down
    image-border: 1
    image-clip: 0 0 10 10
    anchors.bottom: parent.bottom
    anchors.right: parent.right

    $hover:
      image-clip: 0 10 10 10
    $pressed:
      image-clip: 0 20 10 10