fix: preserve tui styles while fixing freeze

This commit is contained in:
Kartvya69
2026-04-01 11:33:08 +00:00
parent 6cf95f5b1d
commit 9ee20cfd4a
2 changed files with 33 additions and 12 deletions

View File

@@ -265,13 +265,14 @@ export const setAttribute = (
markDirty(node)
}
export const setStyle = (node: DOMNode, style: Styles): void => {
export const setStyle = (node: DOMNode, style: Styles | undefined): void => {
const nextStyle = style ?? {}
// Compare style properties to avoid marking dirty unnecessarily.
// React creates new style objects on every render even when unchanged.
if (stylesEqual(node.style, style)) {
if (stylesEqual(node.style, nextStyle)) {
return
}
node.style = style
node.style = nextStyle
markDirty(node)
}

View File

@@ -59,6 +59,12 @@ $ npm install --save-dev react-devtools-core
type AnyObject = Record<string, unknown>
type UpdatePayload = {
props?: AnyObject
style?: AnyObject
nextStyle?: Styles | undefined
}
const diff = (before: AnyObject, after: AnyObject): AnyObject | undefined => {
if (before === after) {
return
@@ -232,7 +238,7 @@ const reconciler = createReconciler<
unknown,
DOMElement,
HostContext,
boolean,
UpdatePayload | null,
NodeJS.Timeout,
-1,
null
@@ -403,8 +409,19 @@ const reconciler = createReconciler<
_type: ElementNames,
oldProps: Props,
newProps: Props,
): boolean {
return oldProps !== newProps
): UpdatePayload | null {
const props = diff(oldProps, newProps)
const style = diff(oldProps['style'] as Styles, newProps['style'] as Styles)
if (!props && !style) {
return null
}
return {
props,
style,
nextStyle: newProps['style'] as Styles | undefined,
}
},
commitMount(node: DOMElement): void {
getFocusManager(node).handleAutoFocus(node)
@@ -432,13 +449,16 @@ const reconciler = createReconciler<
},
commitUpdate(
node: DOMElement,
_updatePayload: boolean,
updatePayload: UpdatePayload | null,
_type: ElementNames,
oldProps: Props,
newProps: Props,
_oldProps: Props,
_newProps: Props,
): void {
const props = diff(oldProps, newProps)
const style = diff(oldProps['style'] as Styles, newProps['style'] as Styles)
if (!updatePayload) {
return
}
const { props, style, nextStyle } = updatePayload
if (props) {
for (const [key, value] of Object.entries(props)) {
@@ -462,7 +482,7 @@ const reconciler = createReconciler<
}
if (style && node.yogaNode) {
applyStyles(node.yogaNode, style, newProps['style'] as Styles)
applyStyles(node.yogaNode, style, nextStyle)
}
},
commitTextUpdate(node: TextNode, _oldText: string, newText: string): void {