docs: add rpc/dlob/candles notes

doc/visualizer-layers-ui.md

@@ -0,0 +1,89 @@
+# Visualizer UI: kafelki → warstwy (stack)
+
+Ten dokument opisuje MVP dla przełączania układu UI w `apps/visualizer`:
+
+- **Grid (kafelki / standard)**: obecny layout aplikacji.
+- **Stack (warstwy / fullscreen)**: jedna aktywna warstwa jest na wierzchu (fullscreen), a kolejność warstw można ustawiać przez **DnD**.
+
+## Zachowanie (MVP)
+
+### Wejście / wyjście ze stack
+- **Chart**: przycisk `Fullscreen` w pasku narzędzi wykresu przełącza tryb `grid` ↔ `stack` (dla warstwy `chart`).
+- **DLOB**: przycisk `Fullscreen` w nagłówku DLOB przełącza tryb `grid` ↔ `stack` (dla warstwy `dlob`).
+- Wyjście ze stack:
+  - przycisk `Back` w panelu warstw
+  - klawisz `Esc` **dwa razy** (w ciągu ~0.8s)
+
+### Warstwy i DnD
+- W stack pojawia się panel `Layers` jako **wysuwany drawer z boku**.
+- Lista w panelu jest **od góry (top) do dołu (bottom)**:
+  - element na górze listy jest `active` (czyli jest “na wierzchu”).
+- **DnD** na liście:
+  - przeciągnij element i upuść na inny — zmienisz kolejność (top/bottom).
+- Kliknięcie elementu na liście przenosi go na wierzch (`active`).
+
+### Warstwy kosztów (Costs)
+- Są dwie osobne warstwy kosztów:
+  - `Costs (New)` — estymata nowego kontraktu (domyślnie **na samej górze**),
+  - `Costs (Active)` — monitoring puszczonego kontraktu (pojawia się i jest ustawiana **jeden poziom niżej** po wpisaniu `contract_id`).
+- Możesz zmienić kolejność DnD (to nadpisuje domyślne ustawienie).
+- Po pierwszym DnD aplikacja oznacza układ jako “manualny” i nie przestawia już automatycznie warstw przy pojawieniu się `contract_id`.
+
+### Auto-hide + lock
+- Domyślnie drawer ma **auto-hide** (chowa się po ~1s po zjechaniu kursorem z panelu).
+- Przycisk `Auto/Locked`:
+  - `Auto` = auto-hide włączony,
+  - `Locked` = auto-hide wyłączony (drawer zostaje otwarty).
+- Drawer otwiera się po najechaniu kursorem na wąski “hotspot” przy lewym brzegu ekranu.
+
+### Opacity (UI)
+- W drawerze są suwaki:
+  - `Backdrop` (przyciemnienie tła w stack)
+  - `Panel` (tło drawera)
+- Wartości są zapisywane w localStorage (`trade.stackBackdropOpacity`, `trade.stackDrawerOpacity`).
+
+### Opacity (warstwy)
+- Każda warstwa ma swój suwak opacity (0–100%):
+  - `0%` = warstwa niewidoczna,
+  - `100%` = pełna widoczność.
+- DnD nadal ustawia kolejność (z-index), a interakcje trafiają do warstwy `active` (top).
+- Wartości są zapisywane w localStorage (`trade.layerOpacity`).
+
+### Jasność (warstwy)
+- Każda warstwa ma suwak `brightness` (60–180%).
+- To jest filtr UI (nie wpływa na dane), przydatny gdy chcesz rozjaśnić wykres/DLOB w stack.
+- Wartości są zapisywane w localStorage (`trade.layerBrightness`).
+
+### Widoczność + lock (warstwy)
+- Ikona “oka” przełącza widoczność warstwy (nie resetuje suwaka opacity).
+- Ikona “kłódki” blokuje warstwę:
+  - nie da się jej przeciągać (DnD),
+  - suwak opacity jest wyłączony,
+  - klik w wiersz nie zmienia kolejności (nie “wypycha” na top).
+- Ustawienia są zapisywane w localStorage (`trade.layerVisible`, `trade.layerLocked`).
+
+## Implementacja (gdzie w kodzie)
+- Sterowanie układem i panel `Layers`: `apps/visualizer/src/App.tsx`
+  - `trade.layoutMode` w localStorage: `'grid' | 'stack'`
+  - `trade.stackOrder` w localStorage: kolejność warstw (z-index; ostatni = top)
+  - `trade.stackOrderManual` w localStorage: czy użytkownik zmienił kolejność przez DnD (blokuje auto-przestawianie)
+  - `trade.stackPanelLocked` w localStorage: blokada auto-hide panelu warstw
+  - `trade.contractId` w localStorage: aktywny kontrakt do monitoringu
+- Fullscreen chart przez warstwy: `apps/visualizer/src/features/chart/ChartPanel.tsx`
+  - `fullscreenOverride` + `onToggleFullscreenOverride` (fullscreen kontrolowany z zewnątrz, bez backdropu)
+- Fullscreen DLOB: `apps/visualizer/src/features/market/DlobDashboard.tsx`
+  - `isFullscreen` + `onToggleFullscreen` (przycisk w nagłówku)
+- Panel kosztów: `apps/visualizer/src/features/contracts/ContractCostsPanel.tsx`
+
+## Co dalej (kolejne iteracje)
+
+MVP nie robi jeszcze “prawdziwego” układu kafelków z:
+- drag/resize okien w trybie stack,
+- wyświetlaniem kilku warstw jednocześnie (np. jako nakładające się okna),
+- przełączaniem grid→stack przez zoom kafelka (z animacją).
+
+Proponowane następne kroki:
+1) wydzielić `Pane` abstraction (id, title, render, hotkeys),
+2) zrobić `grid` jako faktyczne kafelki (Chart, DLOB, Orderbook, TradeForm),
+3) dodać “zoom” kafelka → wejście do stack,
+4) dodać opcjonalnie drag/resize w stack (na start tylko z-index + focus).