feat(panels): render collapse, dock and pin buttons from the store

PanelChrome no longer writes the panels' collapse buttons, the command
dock tray toggles' names or the dock pins' pressed state. It presents each
panel's open and pinned state to the new gev-panel-chrome store, and the
buttons, now views, call it there: PanelCollapseButton for the panel
headers, bound toggles and pins in the command dock. Clicks take effect
once the chrome is initialized; a new owner starts from its own states.

bindPanelDisclosure binds only a panel's Escape and refuses the retired
buttons and onChange arguments. UiButton joins the component kit.

docs/VUE-MIGRATION.md

@@ -36,11 +36,14 @@ one-panel rule too. Share links continue to record which panels are open.
 
 ## Component kit
 
-`src/ui/kit/` holds the generic components (`UiRail`, `UiPanel`, `UiButton`,
-`UiChip`, `UiTooltip` and so on). Names, props and events follow Halfpixel's
-`ui-vue` kit so the two can converge later, but the components are written for
-this repository and styled by its existing stylesheet and custom properties.
-They contain no application state.
+`src/ui/kit/` holds the generic components: `UiRail`, `UiTooltip`, `UiIcon`
+and `UiButton` so far, with more (`UiPanel`, `UiSegmented`, `UiSelect` and
+so on) joining as the controls they serve are converted. Names, props,
+events and class names follow Halfpixel's `ui-vue` kit so the two can merge
+later, but the components are written for this repository and styled by its
+existing stylesheet and custom properties; a kit class such as
+`ui-button--icon` carries no Core style yet, and a converted control keeps
+its own classes beside it. They contain no application state.
 
 Controls share one skin, so every panel reads the same. Every scrolling
 surface carries the kit's `.ui-scroll` (ui-vue's name), which draws the thin
@@ -61,7 +64,10 @@ a feature supplying only its accent.
    when a view needs one, mirroring state an owner already publishes, so
    there is never a second owner of the same state.
 2. **Rail.** `PanelChrome` enforces one panel per side; the panel store
-   mirrors each side's panels and the rail renders from it. Done.
+   mirrors each side's panels and the rail renders from it. Each panel's
+   collapse button (`PanelCollapseButton`), the dock tray toggles and the
+   dock pins render the open and pinned state PanelChrome presents to the
+   `gev-panel-chrome` store, and their clicks call it there. Done.
 3. **Panels.** Each template and its wiring become a component, keeping ids,
    classes, `data-i18n` text and CSS. The page places each view with a
    `.gev-view` host (`display: contents`), and `mountApplicationViews()`

docs/panel-surfaces.md

@@ -12,7 +12,7 @@ A rail panel uses an outer owner with its existing stable `id`, matching
 `data-panel-id`, and `panel-collapsible` class. Its first non-glow child is the
 surface. Keep the header and any outward popup outside the scrolling body:
 
-```html
+```vue
 <section
   id="example-panel"
   data-panel-id="example-panel"
@@ -21,14 +21,12 @@ surface. Keep the header and any outward popup outside the scrolling body:
   <div data-panel-surface>
     <header data-panel-header>
       <h2 class="panel-title panel-surface-title">Example</h2>
-      <button
-        class="panel-collapse-btn panel-surface-control"
-        data-collapse-target="example-panel"
-        aria-expanded="true"
-        aria-label="Collapse Example"
-      >
-        −
-      </button>
+      <PanelCollapseButton
+        class="panel-surface-control"
+        target="example-panel"
+        :name="t('Example')"
+        initial="−"
+      />
     </header>
     <div data-panel-body data-rail-scroller>
       <label>Filter <input class="panel-surface-control" type="text" /></label>
@@ -92,12 +90,15 @@ Do not copy the rail example's `.panel-collapse-btn` class into the dock:
 existing dock rules intentionally hide that class. The generic surface skin
 does not replace the dock's disclosure policy.
 
-The existing `PanelChrome` binds `.panel-collapse-btn[data-collapse-target]`
-at initialization and routes state through `setPanelCollapsed`. For additions
+`PanelCollapseButton` (`src/ui/rail/`) renders a panel's collapse button
+(`.panel-collapse-btn`) from the open state `PanelChrome` presents to the
+`gev-panel-chrome` store, and its click asks `PanelChrome` to toggle the
+panel through `setPanelCollapsed`. `PanelChrome` collects the buttons'
+targets at initialization and binds each panel's Escape. For additions
 present at startup, keep those hooks and the existing chrome lifecycle. A
-dynamically mounted panel must bind and dispose its own disclosure using
-`bindPanelDisclosure` / `collapsePanelOnEscape` from `panelDisclosure.js`, with
-the application owning state changes. Do not rerun the whole application chrome
+dynamically mounted panel must own its disclosure: its own state, button and
+Escape, bound and disposed with `bindPanelDisclosure` /
+`collapsePanelOnEscape` from `panelDisclosure.js` (which bind Escape only). Do not rerun the whole application chrome
 initializer just to add one panel. `layoutLeftPanelRail` and
 `layoutRightPanelRail` accept arbitrary direct `data-panel-id` children; their
 host owns layout scheduling, observations and collapse callbacks. Dynamic