feat(vanilla): add scroll-view

.changeset/large-lilies-serve.md

@@ -0,0 +1,5 @@
+---
+"@lynx-js/skill-vanilla-lynx": patch
+---
+
+Add separate Element PAPI tree examples for non-scrollable and scrollable containers, including fixed-height `__CreateScrollView` usage.

packages/skills/vanilla-lynx/references/main-thread.md

@@ -23,6 +23,7 @@ Recommended APIs:
 - `__CreatePage`: create the page root.
 - `__GetElementUniqueID`: get the root element id for child creation.
 - `__CreateView`: create a container node.
+- `__CreateScrollView`: create a scrollable container node.
 - `__CreateText`: create a text node.
 - `__CreateRawText`: create text content for a text node.
 - `__CreateImage`: create an image node.
@@ -54,7 +55,10 @@ Do not use `__AddEvent` to bind UI events. Use `__AddEventListener` and remove t
 
 ## Build the Tree
 
-Create the page root once, then create and append child nodes. Keep node references that need later updates in module scope.
+Create the page root once, then create and append child nodes. Keep node
+references that need later updates in module scope.
+
+### Non-Scrollable Container
 
 ```javascript
 const page = __CreatePage("0", 0);
@@ -84,6 +88,24 @@ __SetAttribute(image, "src", "https://example.com/image.png");
 __AppendElement(container, image);
 ```
 
+### Scrollable Container
+
+Use `__CreateScrollView` for a scrollable container and give it a fixed height.
+
+```javascript
+const page = __CreatePage("0", 0);
+const pageId = __GetElementUniqueID(page);
+__SetClasses(page, "page");
+
+const scrollView = __CreateScrollView(pageId);
+__SetAttribute(scrollView, "scroll-orientation", "vertical");
+__SetInlineStyles(scrollView, "height: 500px;");
+__AppendElement(page, scrollView);
+
+const scrollContent = __CreateView(pageId);
+__AppendElement(scrollView, scrollContent);
+```
+
 ## Bind Element Events
 
 Bind Element PAPI node events directly on the main thread. Keep the handler lightweight when the event only mutates UI state. If the event needs heavier business logic, async work, timers, or native calls, bind the UI event on the main thread and dispatch a serializable task to the background thread.