fix(blocking): удержать горизонтальный скролл матрицы внутри страницы

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Denozordec
2026-08-25 12:32:38 +07:00
co-authored by Cursor
parent a5f83c6ecb
commit 9254b8dc22
4 changed files with 16 additions and 13 deletions
+2 -2
View File
@@ -257,7 +257,7 @@ export function AppShell({ children }: { children: ReactNode }) {
<SystemMonitorPopover />
</div>
</header>
<div className="flex flex-1 flex-col gap-4 px-4 py-4 md:gap-6 md:px-6 md:py-5">
<div className="flex min-w-0 flex-1 flex-col gap-4 px-4 py-4 md:gap-6 md:px-6 md:py-5">
<SpaceScopedMain>{children}</SpaceScopedMain>
</div>
</SidebarInset>
@@ -272,7 +272,7 @@ export function AppShell({ children }: { children: ReactNode }) {
function SpaceScopedMain({ children }: { children: ReactNode }) {
const { spaceId } = useSpaceId()
return (
<div key={spaceId ?? 'default'} className="flex flex-1 flex-col gap-4 md:gap-6">
<div key={spaceId ?? 'default'} className="flex min-w-0 flex-1 flex-col gap-4 md:gap-6">
{children}
</div>
)
+1 -1
View File
@@ -2,5 +2,5 @@ import type { ReactNode } from 'react'
import { cn } from '@cfdm/ui/lib/utils'
export function PageShell({ children, className }: { children: ReactNode; className?: string }) {
return <div className={cn('flex flex-col gap-4 md:gap-6', className)}>{children}</div>
return <div className={cn('flex w-full min-w-0 flex-col gap-4 md:gap-6', className)}>{children}</div>
}
@@ -291,14 +291,17 @@ function FrameDataGridBody<TData extends object>({
header: 'text-xs font-medium text-muted-foreground',
}}
>
<DataGridContainer border={false}>
<DataGridContainer border={false} className={horizontalScroll ? 'min-w-0' : undefined}>
{virtualization || horizontalScroll ? (
<DataGridScrollArea
orientation={scrollOrientation}
style={virtualization ? { height } : undefined}
>
{tableNode}
</DataGridScrollArea>
<div className="min-w-0 w-full">
<DataGridScrollArea
className="min-w-0 w-full"
orientation={scrollOrientation}
style={virtualization ? { height } : undefined}
>
{tableNode}
</DataGridScrollArea>
</div>
) : (
tableNode
)}
@@ -481,7 +484,7 @@ export function FrameDataGrid<TData extends object>({
if (data.length === 0) {
return (
<Frame dense variant="default" spacing="sm" className={cn('w-full', className)}>
<Frame dense variant="default" spacing="sm" className={cn('w-full min-w-0', className)}>
{hasHeader ? (
<DataGridSectionHeader title={title} description={description} actions={headerActions} />
) : null}
@@ -511,7 +514,7 @@ export function FrameDataGrid<TData extends object>({
)
return (
<Frame dense variant="default" spacing="sm" className={cn('w-full', className)}>
<Frame dense variant="default" spacing="sm" className={cn('w-full min-w-0', className)}>
{hasHeader ? (
<DataGridSectionHeader title={title} description={description} actions={headerActions} />
) : null}
+1 -1
View File
@@ -310,7 +310,7 @@ function SidebarInset({ className, ...props }: React.ComponentProps<"main">) {
<main
data-slot="sidebar-inset"
className={cn(
"relative flex w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2",
"relative flex min-w-0 w-full flex-1 flex-col bg-background md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-2",
className
)}
{...props}