vynte-infra/forms
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix builder type menu clipping

Browse Source
This commit is contained in:
Zachariah K. Sharma
2026-06-13 16:47:00 -06:00
parent f696293e91
commit 0a02fbfd28
1 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/builder/Builder.tsx
+4 -2
View File
@@ -263,6 +263,7 @@ export default function Builder({ form: initial, members, currentUserId, publicF
onHeight={(height) => updateField(f.id, { height })} onHeight={(height) => updateField(f.id, { height })}
onRemove={() => removeField(f.id)} onRemove={() => removeField(f.id)}
onDuplicate={() => duplicateField(f.id)} onDuplicate={() => duplicateField(f.id)}
menuOpen={slashFor === f.id}
onOpenSlash={() => setSlashFor(f.id)} onOpenSlash={() => setSlashFor(f.id)}
onKey={(e) => { onKey={(e) => {
if (e.key === "/" && (e.target as HTMLInputElement).selectionStart === 0 && f.label === "") { if (e.key === "/" && (e.target as HTMLInputElement).selectionStart === 0 && f.label === "") {
@@ -584,7 +585,7 @@ function FormHeaderEditor({ form, onChange }: { form: FormData; onChange: (p: Pa
// ── WYSIWYG field row ────────────────────────────────────────────────────── // ── WYSIWYG field row ──────────────────────────────────────────────────────
function FieldRow({ field, selected, registerInput, onSelect, onLabel, onHeight, onRemove, onDuplicate, onOpenSlash, onKey, children }: { function FieldRow({ field, selected, registerInput, onSelect, onLabel, onHeight, onRemove, onDuplicate, menuOpen, onOpenSlash, onKey, children }: {
field: Field; field: Field;
selected: boolean; selected: boolean;
registerInput: (el: HTMLInputElement | null) => void; registerInput: (el: HTMLInputElement | null) => void;
@@ -593,6 +594,7 @@ function FieldRow({ field, selected, registerInput, onSelect, onLabel, onHeight,
onHeight: (height: number) => void; onHeight: (height: number) => void;
onRemove: () => void; onRemove: () => void;
onDuplicate: () => void; onDuplicate: () => void;
menuOpen: boolean;
onOpenSlash: () => void; onOpenSlash: () => void;
onKey: (e: React.KeyboardEvent<HTMLInputElement>) => void; onKey: (e: React.KeyboardEvent<HTMLInputElement>) => void;
children?: React.ReactNode; children?: React.ReactNode;
@@ -711,7 +713,7 @@ function FieldRow({ field, selected, registerInput, onSelect, onLabel, onHeight,
return ( return (
<li ref={setNodeRef} style={style} onClick={onSelect} <li ref={setNodeRef} style={style} onClick={onSelect}
className={`builder-field-card group relative bg-[rgb(var(--surface))] rounded-xl border cursor-pointer className={`builder-field-card group relative bg-[rgb(var(--surface))] rounded-xl border cursor-pointer
transition-all duration-150 overflow-hidden transition-all duration-150 ${menuOpen ? "z-30 overflow-visible" : "overflow-hidden"}
${selected ${selected
? "border-[rgb(var(--accent)/0.5)] shadow-[var(--shadow-md)] ring-2 ring-[rgb(var(--accent)/0.12)]" ? "border-[rgb(var(--accent)/0.5)] shadow-[var(--shadow-md)] ring-2 ring-[rgb(var(--accent)/0.12)]"
: "border-[rgb(var(--line)/0.6)] shadow-[var(--shadow-xs)] hover:shadow-[var(--shadow-sm)] hover:border-[rgb(var(--line))]" : "border-[rgb(var(--line)/0.6)] shadow-[var(--shadow-xs)] hover:shadow-[var(--shadow-sm)] hover:border-[rgb(var(--line))]"