Help: Loading sprites from Sprite Atlas

[vercte]

It gives me an error, saying that

Failed to load image from "arrowLeft"

Here's my JS file:

import kaboom from "kaboom"

// initialize context
kaboom()

loadSpriteAtlas("sprites/arrows.png", "sprites/arrows.json");
drawSprite({"sprite": "arrowLeft", "pos": vec2(10, 10)})

And here's the ./sprites/arrows.json file:

{
  "arrowLeft": {
    "x": 0,
    "y": 0,
    "width": 32,
    "height": 32
  },
  "arrowDown": {
    "x": 32,
    "y": 0,
    "width": 32,
    "height": 32
  },
  "arrowLeft": {
    "x": 0,
    "y": 32,
    "width": 32,
    "height": 32
  },
  "arrowTop": {
    "x": 32,
    "y": 32,
    "width": 32,
    "height": 32
  },
  "arrowAll": {
    "x": 0,
    "y": 64,
    "width": 32,
    "height": 32
  },
  "arrowSpace": {
    "x": 32,
    "y": 64,
    "width": 32,
    "height": 32
  }
}

But it still can't find it. What's going on here?

EDIT: Never mind. Turns out I was doing it incorrectly.

[vercte]

I had to load the sprite using sprite():

import kaboom from "kaboom"

// initialize context
kaboom()

loadSpriteAtlas("sprites/arrows.png", "sprites/arrows.json")
let arrows = {
  "left": add([
    sprite("arrowLeft")
  ])
}