adobe/react-spectrum

ResizableTableContainer: Column resize to infinite width when wrapped with display: flex

Open

#5.412 aberto em 13 de nov. de 2023

Ver no GitHub
 (6 comments) (1 reaction) (0 assignees)TypeScript (1.500 forks)auto 404
bughas workaroundhelp wanted

Métricas do repositório

Stars
 (15.634 stars)
Métricas de merge de PR
 (Métricas PR pendentes)

Description

Provide a general summary of the issue here

When rendering a ResizableTableContainer which for parent has an element with style display: flex, the columns are expanding in size infinitely if they're not bounded (not using maxWidth).

🤔 Expected Behavior?

Columns most likely should not have this behavior

😯 Current Behavior

Columns are expanding in width infinitely

💁 Possible Solution

workaround: use div with display: block

🔦 Context

Obviously I don't think this is a blocker, but it's something I got surprised by when trying to use ResizableTableContainer.

🖥️ Steps to Reproduce

https://codesandbox.io/s/interesting-curran-lsx537?file=/src/App.js

Version

1.0.0-rc.0

What browsers are you seeing the problem on?

Firefox, Chrome, Safari, Microsoft Edge

If other, please specify.

No response

What operating system are you using?

MacOS Sonoma

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

Guia do colaborador

Direção de pesquisa
Investigue como o ResizableTableContainer interage com contêineres flex. Veja o CSS e a lógica do componente para garantir que as colunas não se expandam infinitamente quando o pai tiver display: flex. Considere adicionar propriedades min width ou overflow.
Pilha de tecnologia
typescriptreact
Domain
frontend
Tipo Issue
Bug
DifficultyDificuldade de implementação estimada para um novo contribuidor, de 1 para alterações muito pequenas a 5 para trabalho de nível especializado.
3
Tempo estimadoUm intervalo de tempo aproximado para um colaborador experiente investigar, implementar, testar e preparar um pull request.
1-3 horas
Status da atividadeQuão disponível o issue aparece agora: novo, ativo, obsoleto, bloqueado ou aguardando entrada do mantenedor.
Ativo
ClarityCom que clareza o issue explica a mudança esperada, os critérios de aceitação e a próxima etapa.
Claro
Prerequisites
ReactCSS flexbox
Simpatia para novatosUma pontuação de 1 a 100 que estima o quão acessível este issue é para colaboradores iniciantes.
60