Разделитель делит место между панелями, а между каждыми двумя соседними стоит ручка. Перетащите ручку или переведите на неё фокус и нажимайте клавиши-стрелки. Размеры задаются в процентах и в сумме дают 100, а привязать их можно через [(sizes)].

Начальный, минимальный и максимальный размеры каждой панели задаются в пикселях, rem или процентах. Панель с collapsible сворачивается, если уменьшить её перетаскиванием меньше половины минимума или нажать Enter на её ручке, и возвращается с тем размером, который у неё был.

С storageKey размеры хранятся в localStorage, так что при следующем визите пользователи увидят панели такими, какими их оставили.

Редактор

Файлы, код и превью. Файлы и превью сворачиваются, код всегда занимает не меньше 30% ширины, а размеры сохраняются.

export class App {}

// app.ts

Панели друг над другом

orientation="vertical" располагает панели друг над другом, а [(sizes)] получает их размеры по мере изменения.

SELECT name, total FROM orders

3 rows

Sizes: 65% and 35%