fix(ui): оверлей inline-редактора растягивается по content

- FieldOverlay: при fitOverlay=false добавлен w-max, чтобы оверлей растягивался по ширине редактора, а не обрезался по read-view

- TaskDetail: date/datetime с автопролонгацией используют fitOverlay=false и overlayMinWidth=280
This commit is contained in:
2026-07-15 16:58:37 +03:00
parent 9e388fb644
commit 0ea3d8c49e
2 changed files with 14 additions and 4 deletions

View File

@@ -43,7 +43,7 @@ export function FieldOverlay({
<div <div
className={cn( className={cn(
'absolute z-50 rounded-md border border-input bg-background shadow-sm', 'absolute z-50 rounded-md border border-input bg-background shadow-sm',
fitContainer ? 'inset-0' : 'left-0 top-0 min-w-full', fitContainer ? 'inset-0' : 'left-0 top-0 min-w-full w-max',
className className
)} )}
style={style} style={style}

View File

@@ -1297,6 +1297,8 @@ function FieldValueRow({
const editorNode = renderEditor(); const editorNode = renderEditor();
const canShowInlineEditor = isGlobalEditMode && isEditable && !fieldState.immutable && !readOnly && editorNode != null; const canShowInlineEditor = isGlobalEditMode && isEditable && !fieldState.immutable && !readOnly && editorNode != null;
const isContractNumberField = field.type === 'contract-number'; const isContractNumberField = field.type === 'contract-number';
const isDateWithProlongation = (field.type === 'date' || field.type === 'datetime') && field.autoProlongation;
const needsWideOverlay = isContractNumberField || isDateWithProlongation;
return canShowInlineEditor ? ( return canShowInlineEditor ? (
<InlineField <InlineField
readView={readViewNode} readView={readViewNode}
@@ -1304,16 +1306,24 @@ function FieldValueRow({
isEditing={true} isEditing={true}
editable={isEditable && !readOnly && !fieldState.immutable} editable={isEditable && !readOnly && !fieldState.immutable}
onEnterEdit={handleEnterEdit} onEnterEdit={handleEnterEdit}
fitOverlay={!isContractNumberField && field.type !== 'textarea' && field.type !== 'rich-text'} fitOverlay={!needsWideOverlay && field.type !== 'textarea' && field.type !== 'rich-text'}
overlayClassName={ overlayClassName={
isContractNumberField needsWideOverlay
? 'overflow-visible' ? 'overflow-visible'
: field.type === 'textarea' || field.type === 'rich-text' : field.type === 'textarea' || field.type === 'rich-text'
? 'flex flex-col overflow-hidden' ? 'flex flex-col overflow-hidden'
: '' : ''
} }
overlayMaxHeight={field.type === 'textarea' || field.type === 'rich-text' ? 'min(85vh, 700px)' : undefined} overlayMaxHeight={field.type === 'textarea' || field.type === 'rich-text' ? 'min(85vh, 700px)' : undefined}
overlayMinWidth={isContractNumberField ? 320 : field.type === 'textarea' || field.type === 'rich-text' ? '100%' : 180} overlayMinWidth={
isContractNumberField
? 320
: isDateWithProlongation
? 280
: field.type === 'textarea' || field.type === 'rich-text'
? '100%'
: 180
}
overlayWidth={field.type === 'textarea' || field.type === 'rich-text' ? '100%' : undefined} overlayWidth={field.type === 'textarea' || field.type === 'rich-text' ? '100%' : undefined}
className={field.type === 'textarea' || field.type === 'rich-text' ? 'items-start min-h-[24px] w-full' : 'items-center min-h-[28px]'} className={field.type === 'textarea' || field.type === 'rich-text' ? 'items-start min-h-[24px] w-full' : 'items-center min-h-[28px]'}
/> />