Sheet
ui.widgets.Sheetウィンドウの端からスライドインする補助パネル。
BEHAVIOR CONTRACT
left / right の配置、barrier、パネルのヒットテスト、アニメーション、閉じ方の方針が一貫しています。
RECORDED INTERACTION
harness が右側の Sheet を開き、スライドインの全過程を記録します。
pub fn buildSheet(scope: *ui.Scope, cx: *ui.Cx) anyerror!*ui.Node {
const a = cx.allocator;
const c = try col(cx, 12);
const vis = try scope.createSignal(bool, false);
const st = try cx.bindState(SheetStory, .{ .visible = vis });
const sbtn = try W.Button(.{ .label = "Open Sheet", .on_click = cx.on(SheetStory, st, SheetStory.open) }).mount(scope, cx);
sbtn.meta.ownership.meta.test_id = "story.sheet.open";
try c.appendChild(a, sbtn);
const sh = try W.Sheet(.{ .side = .right, .width = 320 }).visible(vis).mount(scope, cx);
sh.panel.meta.ownership.meta.test_id = "story.sheet.panel";
try sh.content.appendChild(a, try ui.text(cx, "Sheet panel content.", .{ .font_size = 14, .color = light.color.fg_primary }));
if (!sh.portaled) try c.appendChild(a, sh.overlay);
return c;
}Storybook にあるこの story のコードそのままです(zenit 5f9add5+wip 2026-09-30)。W は ui.widgets のことで、col / row / label は Storybook 内の小さなレイアウトヘルパーです。
SheetProps
ui.widgets.Sheetfn Sheet(props: SheetProps) SheetBuilderフィールド
型
デフォルト値
説明
sideSheetSide.left.right.top.bottom.right—
widthf32320—
heightf32320—
overlay_color?Colornull—
background?Colornull—
close_on_overlaybooltrue—
close_on_escapebooltrue—
visible?*Signal(bool)null—
animation_msf32250—
SheetResult
ui.widgets.Sheetフィールド
型
デフォルト値
説明
overlay*Node—
—
panel*Node—
—
content*Node—
—
portaledboolfalse见 Modal.mount:true = overlay 已挂到 portal root,caller 不要再 append。