GameStatusSelector: custom element + typed contract (retire Alpine)
The Game status dropdown is now a <game-status-selector> light-DOM custom
element: the Python builder emits the tag + kebab attrs htpy-style, behavior
lives in ts/elements/{dropdown,game-status-selector}.ts wired by the native
connectedCallback, and GameStatusSelectorProps is the codegen'd contract. The
~70-line inline-Alpine f-string is gone.
Also fix SimpleTable to collect and re-attach the media of its row/header
nodes: it stringifies cells into the table markup, which silently dropped each
cell component's declared Media — so a <game-status-selector> in a cell never
got its <script> emitted. Now Page() emits it.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -0,0 +1,16 @@
|
||||
import { readGameStatusSelectorProps } from "../generated/props.js";
|
||||
import { initDropdown } from "./dropdown.js";
|
||||
|
||||
class GameStatusSelectorElement extends HTMLElement {
|
||||
connectedCallback(): void {
|
||||
const props = readGameStatusSelectorProps(this);
|
||||
initDropdown(this, {
|
||||
patchUrl: `/api/games/${props.gameId}/status`,
|
||||
bodyKey: "status",
|
||||
event: "status-changed",
|
||||
csrf: props.csrf,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
customElements.define("game-status-selector", GameStatusSelectorElement);
|
||||
Reference in New Issue
Block a user