mirror of
https://github.com/simstudioai/sim.git
synced 2026-01-08 22:48:14 -05:00
improvement(ui): hide divider when following subblock value is null (#2608)
* improvement(ui): hide divider when following subblock value is null * closed gap in mcp dynamic args subblock
This commit is contained in:
@@ -391,6 +391,17 @@
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
/**
|
||||
* Subblock divider visibility
|
||||
* Hides dividers when adjacent subblocks render empty content (e.g., schedule-info without data).
|
||||
* Uses CSS :has() to detect empty .subblock-content elements and hide associated dividers.
|
||||
* Selectors ordered by ascending specificity: (0,4,0) then (0,5,0)
|
||||
*/
|
||||
.subblock-row:has(> .subblock-content:empty) > .subblock-divider,
|
||||
.subblock-row:has(+ .subblock-row > .subblock-content:empty) > .subblock-divider {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Dark mode specific overrides
|
||||
*/
|
||||
|
||||
@@ -537,7 +537,7 @@ export function McpDynamicArgs({
|
||||
}
|
||||
|
||||
return (
|
||||
<div className='relative space-y-4'>
|
||||
<div className='relative'>
|
||||
{/* Hidden dummy inputs to prevent browser password manager autofill */}
|
||||
<input
|
||||
type='text'
|
||||
@@ -563,28 +563,30 @@ export function McpDynamicArgs({
|
||||
tabIndex={-1}
|
||||
readOnly
|
||||
/>
|
||||
{toolSchema.properties &&
|
||||
Object.entries(toolSchema.properties).map(([paramName, paramSchema]) => {
|
||||
const inputType = getInputType(paramSchema as any)
|
||||
const showLabel = inputType !== 'switch'
|
||||
<div className='space-y-4'>
|
||||
{toolSchema.properties &&
|
||||
Object.entries(toolSchema.properties).map(([paramName, paramSchema]) => {
|
||||
const inputType = getInputType(paramSchema as any)
|
||||
const showLabel = inputType !== 'switch'
|
||||
|
||||
return (
|
||||
<div key={paramName} className='space-y-2'>
|
||||
{showLabel && (
|
||||
<Label
|
||||
className={cn(
|
||||
'font-medium text-sm',
|
||||
toolSchema.required?.includes(paramName) &&
|
||||
'after:ml-1 after:text-red-500 after:content-["*"]'
|
||||
)}
|
||||
>
|
||||
{formatParameterLabel(paramName)}
|
||||
</Label>
|
||||
)}
|
||||
{renderParameterInput(paramName, paramSchema as any)}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
return (
|
||||
<div key={paramName} className='space-y-2'>
|
||||
{showLabel && (
|
||||
<Label
|
||||
className={cn(
|
||||
'font-medium text-sm',
|
||||
toolSchema.required?.includes(paramName) &&
|
||||
'after:ml-1 after:text-red-500 after:content-["*"]'
|
||||
)}
|
||||
>
|
||||
{formatParameterLabel(paramName)}
|
||||
</Label>
|
||||
)}
|
||||
{renderParameterInput(paramName, paramSchema as any)}
|
||||
</div>
|
||||
)
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -866,7 +866,7 @@ function SubBlockComponent({
|
||||
}
|
||||
|
||||
return (
|
||||
<div onMouseDown={handleMouseDown} className='flex flex-col gap-[10px]'>
|
||||
<div onMouseDown={handleMouseDown} className='subblock-content flex flex-col gap-[10px]'>
|
||||
{renderLabel(
|
||||
config,
|
||||
isValidJson,
|
||||
|
||||
@@ -341,7 +341,7 @@ export function Editor() {
|
||||
)
|
||||
|
||||
return (
|
||||
<div key={stableKey}>
|
||||
<div key={stableKey} className='subblock-row'>
|
||||
<SubBlock
|
||||
blockId={currentBlockId}
|
||||
config={subBlock}
|
||||
@@ -352,7 +352,7 @@ export function Editor() {
|
||||
allowExpandInPreview={false}
|
||||
/>
|
||||
{index < subBlocks.length - 1 && (
|
||||
<div className='px-[2px] pt-[16px] pb-[13px]'>
|
||||
<div className='subblock-divider px-[2px] pt-[16px] pb-[13px]'>
|
||||
<div
|
||||
className='h-[1.25px]'
|
||||
style={{
|
||||
|
||||
Reference in New Issue
Block a user