From 150df382f8e0b84aa6028622480c28186c99b8a7 Mon Sep 17 00:00:00 2001 From: Sandy Tao Date: Fri, 27 Jun 2025 16:39:54 -0700 Subject: Upgrade to Ink 6 and React 19 (#2096) Co-authored-by: jacob314 --- .../cli/src/ui/components/shared/MaxSizedBox.tsx | 24 ++++++++++++++++------ 1 file changed, 18 insertions(+), 6 deletions(-) (limited to 'packages/cli/src/ui/components/shared/MaxSizedBox.tsx') diff --git a/packages/cli/src/ui/components/shared/MaxSizedBox.tsx b/packages/cli/src/ui/components/shared/MaxSizedBox.tsx index cd31ff04..8880e894 100644 --- a/packages/cli/src/ui/components/shared/MaxSizedBox.tsx +++ b/packages/cli/src/ui/components/shared/MaxSizedBox.tsx @@ -116,13 +116,15 @@ export const MaxSizedBox: React.FC = ({ throw new Error('maxWidth must be defined when maxHeight is set.'); } function visitRows(element: React.ReactNode) { - if (!React.isValidElement(element)) { + if (!React.isValidElement<{ children?: React.ReactNode }>(element)) { return; } + if (element.type === Fragment) { React.Children.forEach(element.props.children, visitRows); return; } + if (element.type === Box) { layoutInkElementAsStyledText(element, maxWidth!, laidOutStyledText); return; @@ -246,7 +248,10 @@ interface Row { * @returns An array of `Row` objects. */ function visitBoxRow(element: React.ReactNode): Row { - if (!React.isValidElement(element) || element.type !== Box) { + if ( + !React.isValidElement<{ children?: React.ReactNode }>(element) || + element.type !== Box + ) { debugReportError( `All children of MaxSizedBox must be elements`, element, @@ -258,7 +263,15 @@ function visitBoxRow(element: React.ReactNode): Row { } if (enableDebugLog) { - const boxProps = element.props; + const boxProps = element.props as { + children?: React.ReactNode | undefined; + readonly flexDirection?: + | 'row' + | 'column' + | 'row-reverse' + | 'column-reverse' + | undefined; + }; // Ensure the Box has no props other than the default ones and key. let maxExpectedProps = 4; if (boxProps.children !== undefined) { @@ -323,14 +336,13 @@ function visitBoxRow(element: React.ReactNode): Row { return; } - if (!React.isValidElement(element)) { + if (!React.isValidElement<{ children?: React.ReactNode }>(element)) { debugReportError('Invalid element.', element); return; } if (element.type === Fragment) { - const fragmentChildren = element.props.children; - React.Children.forEach(fragmentChildren, (child) => + React.Children.forEach(element.props.children, (child) => visitRowChild(child, parentProps), ); return; -- cgit v1.2.3