Canvas Reading Order

FigmaPhone screenEasy

You design a CanvasReader class that orders canvas elements the way a screen reader would read them. An element is [id, x, y]: id is its unique identifier, x grows to the right and y grows downward. Each test creates one CanvasReader() and calls its methods several times; every call's return value is recorded in order.

Part 1: Top to bottom, left to right

Implement reading_order(elements), which takes a list of elements [id, x, y] and returns the ids sorted top to bottom (smaller y first). Elements with equal y go left to right (smaller x first), and elements equal on both go by smaller id. An empty elements list returns an empty list.

Example 1
init
[]
operations
[["reading_order",[[[1,50,10],[2,10,10],[3,30,0],[4,0,20]]]],["reading_order",[[]]],["reading_order",[[[7,5,5]]]]]
Output
[[3,2,1,4],[],[7]]
Why: Element 3 has the smallest y (0) and comes first. Elements 1 and 2 share y = 10, so 2 (smaller x) precedes 1, and 4 has the largest y. The empty call returns [], and the single element returns [7].

Constraints

0 <= len(elements) <= 10^4
elements[i] = [id, x, y] with distinct id
-10^9 <= id <= 10^9
-10^9 <= x <= 10^9
-10^9 <= y <= 10^9