sandvich
/
opencode
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(ui): support top-positioned dialogs 

Add a dialog position option and allow customizing the top offset via --dialog-top, plus pass-through style support.
pull/17327/head
David Hill 2026-03-12 23:00:29 +00:00
parent ef08f6df0a
commit 8ba2a78aad
2 changed files with 9 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/ui/src/components/dialog.css
View File

@ -16,6 +16,11 @@
justify-content: center;
pointer-events: none;
&[data-position="top"] {
align-items: flex-start;
padding-top: var(--dialog-top, 16px);
}
[data-slot="dialog-container"] {
position: relative;
z-index: 50;

4
packages/ui/src/components/dialog.tsx
View File

@ -8,6 +8,8 @@ export interface DialogProps extends ParentProps {
description?: JSXElement
action?: JSXElement
size?: "normal" | "large" | "x-large"
position?: "center" | "top"
style?: ComponentProps<"div">["style"]
class?: ComponentProps<"div">["class"]
classList?: ComponentProps<"div">["classList"]
fit?: boolean
@ -21,7 +23,9 @@ export function Dialog(props: DialogProps) {
data-component="dialog"
data-fit={props.fit ? true : undefined}
data-size={props.size || "normal"}
data-position={props.position && props.position !== "center" ? props.position : undefined}
data-transition={props.transition ? true : undefined}
style={props.style}
>
<div data-slot="dialog-container">
<Kobalte.Content