refactor(affix): refactor affix component

[HaixingOoO]

🤔 这个 PR 的性质是？

• 日常 bug 修复
• 新特性提交
• 文档改进
• 演示代码改进
• 组件样式/交互改进
• CI/CD 改进
• 重构
• 代码风格优化
• 测试用例
• 分支合并
• 其他

🔗 相关 Issue

💡 需求背景和解决方案

重构Affix组件的实现

📝 更新日志

• refactor(Affix): 重构 Affix 组件

• 本条 PR 不需要纳入 Changelog

☑️ 请求合并前的自查清单

⚠️ 请自检并全部勾选全部选项。⚠️

• 文档已补充或无须补充
• 代码演示已提供或无须提供
• TypeScript 定义已补充或无须补充
• Changelog 已提供或无须提供

[Copilot]

Pull Request Overview

This PR refactors the Affix component with a cleaner implementation that improves maintainability and fixes positioning logic. The refactoring replaces a complex imperative approach with a more declarative React-based state management.

• Introduces new utility functions for calculating fixed positioning
• Refactors the component to use React hooks and state management patterns
• Updates test cases to properly verify the new implementation

Reviewed Changes

Copilot reviewed 7 out of 7 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
packages/components/affix/Affix.tsx	Complete refactor of Affix component with new state management and positioning logic
packages/components/affix/utils.ts	New utility functions for calculating fixed top and bottom positions
packages/components/affix/_example/container.tsx	Updates example to use proper event handling pattern
packages/components/_util/dom.ts	Adds utility function for getting target element DOMRect
packages/components/affix/tests/affix.test.tsx	Updates tests to work with refactored implementation
test/snap/snapshots/ssr.test.jsx.snap	Updated snapshots to include empty class attributes
test/snap/snapshots/csr.test.jsx.snap	Updated snapshots to include empty class attributes

---

_{Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.}

[Copilot]

The width and height properties are duplicated in both the fixedTop and fixedBottom branches. Consider extracting these common properties into a shared object to reduce duplication.

Suggested change

	let top = 0;
	if (fixedTop !== undefined) {
	newState.affixStyle = {
	position: 'fixed',
	top: fixedTop,
	width: placeholderRect.width,
	height: placeholderRect.height,
	zIndex,
	};
	newState.placeholderStyle = {
	width: placeholderRect.width,
	height: placeholderRect.height,
	};
	top = fixedTop;
	} else if (fixedBottom !== undefined) {
	newState.affixStyle = {
	position: 'fixed',
	bottom: fixedBottom,
	width: placeholderRect.width,
	height: placeholderRect.height,
	zIndex,
	};
	newState.placeholderStyle = {
	width: placeholderRect.width,
	height: placeholderRect.height,
	const sharedRectStyle = {
	width: placeholderRect.width,
	height: placeholderRect.height,
	};
	let top = 0;
	if (fixedTop !== undefined) {
	newState.affixStyle = {
	position: 'fixed',
	top: fixedTop,
	...sharedRectStyle,
	zIndex,
	};
	newState.placeholderStyle = {
	...sharedRectStyle,
	};
	top = fixedTop;
	} else if (fixedBottom !== undefined) {
	newState.affixStyle = {
	position: 'fixed',
	bottom: fixedBottom,
	...sharedRectStyle,
	zIndex,
	};
	newState.placeholderStyle = {
	...sharedRectStyle,

[github-actions]

[pkg-pr-new]

tdesign-react-demo

npm i https://pkg.pr.new/tdesign-react@3797

commit: c75c6f7