Skip to content
This repository was archived by the owner on Nov 4, 2025. It is now read-only.

Commit da15b20

Browse files
authored
Revert "feat: Add keepAlign support (#36)" (#37)
This reverts commit 4f6ac65.
1 parent 1a0e1d0 commit da15b20

File tree

3 files changed

+7
-153
lines changed

3 files changed

+7
-153
lines changed

examples/position.js

Lines changed: 0 additions & 79 deletions
This file was deleted.

src/Align.tsx

Lines changed: 5 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -22,8 +22,6 @@ export interface AlignProps {
2222
monitorWindowResize?: boolean;
2323
disabled?: boolean;
2424
children: React.ReactElement;
25-
/** Always trigger align with each render */
26-
keepAlign?: boolean;
2725
}
2826

2927
interface MonitorRef {
@@ -45,27 +43,11 @@ function getPoint(point: TargetType) {
4543
return point;
4644
}
4745

48-
interface InternalTestProps {
49-
INTERNAL_TRIGGER_ALIGN?: Function;
50-
}
51-
5246
const Align: React.RefForwardingComponent<RefAlign, AlignProps> = (
53-
{
54-
children,
55-
disabled,
56-
target,
57-
align,
58-
onAlign,
59-
monitorWindowResize,
60-
monitorBufferTime = 0,
61-
keepAlign,
62-
...restProps
63-
},
47+
{ children, disabled, target, align, onAlign, monitorWindowResize, monitorBufferTime = 0 },
6448
ref,
6549
) => {
66-
const cacheRef = React.useRef<{ element?: HTMLElement; point?: TargetPoint }>(
67-
{},
68-
);
50+
const cacheRef = React.useRef<{ element?: HTMLElement; point?: TargetPoint }>({});
6951
const nodeRef = React.useRef();
7052
let childNode = React.Children.only(children);
7153

@@ -81,17 +63,7 @@ const Align: React.RefForwardingComponent<RefAlign, AlignProps> = (
8163
forceAlignPropsRef.current.onAlign = onAlign;
8264

8365
const [forceAlign, cancelForceAlign] = useBuffer(() => {
84-
if (
85-
process.env.NODE_ENV !== 'production' &&
86-
(restProps as InternalTestProps).INTERNAL_TRIGGER_ALIGN
87-
) {
88-
(restProps as InternalTestProps).INTERNAL_TRIGGER_ALIGN();
89-
}
90-
91-
const {
92-
disabled: latestDisabled,
93-
target: latestTarget,
94-
} = forceAlignPropsRef.current;
66+
const { disabled: latestDisabled, target: latestTarget } = forceAlignPropsRef.current;
9567
if (!latestDisabled && latestTarget) {
9668
const source = nodeRef.current;
9769

@@ -140,16 +112,10 @@ const Align: React.RefForwardingComponent<RefAlign, AlignProps> = (
140112
if (nodeRef.current !== sourceResizeMonitor.current.element) {
141113
sourceResizeMonitor.current.cancel();
142114
sourceResizeMonitor.current.element = nodeRef.current;
143-
sourceResizeMonitor.current.cancel = monitorResize(
144-
nodeRef.current,
145-
forceAlign,
146-
);
115+
sourceResizeMonitor.current.cancel = monitorResize(nodeRef.current, forceAlign);
147116
}
148117

149-
if (
150-
cacheRef.current.element !== element ||
151-
!isSamePoint(cacheRef.current.point, point)
152-
) {
118+
if (cacheRef.current.element !== element || !isSamePoint(cacheRef.current.point, point)) {
153119
forceAlign();
154120

155121
// Add resize observer
@@ -170,15 +136,6 @@ const Align: React.RefForwardingComponent<RefAlign, AlignProps> = (
170136
}
171137
}, [disabled]);
172138

173-
/**
174-
* [Legacy] Should keep re-algin since we don't know if target position changed.
175-
*/
176-
React.useEffect(() => {
177-
if (keepAlign && !disabled) {
178-
forceAlign(true);
179-
}
180-
});
181-
182139
// Listen for window resize
183140
const winResizeRef = React.useRef<{ remove: Function }>(null);
184141
React.useEffect(() => {

tests/element.test.js

Lines changed: 2 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -26,10 +26,7 @@ describe('element align', () => {
2626
render() {
2727
return (
2828
<div style={{ paddingTop: 100 }}>
29-
<div
30-
ref={this.targetRef}
31-
style={{ display: 'inline-block', width: 50, height: 50 }}
32-
>
29+
<div ref={this.targetRef} style={{ display: 'inline-block', width: 50, height: 50 }}>
3330
target
3431
</div>
3532
<Align target={this.getTarget} align={align} {...this.props}>
@@ -76,33 +73,12 @@ describe('element align', () => {
7673
it('disabled should trigger align', () => {
7774
const onAlign = jest.fn();
7875

79-
const wrapper = mount(
80-
<Test monitorWindowResize onAlign={onAlign} disabled />,
81-
);
76+
const wrapper = mount(<Test monitorWindowResize onAlign={onAlign} disabled />);
8277
expect(onAlign).not.toHaveBeenCalled();
8378

8479
wrapper.setProps({ disabled: false });
8580
jest.runAllTimers();
8681
expect(onAlign).toHaveBeenCalled();
8782
});
88-
89-
it('keepAlign', () => {
90-
const triggerAlign = jest.fn();
91-
92-
class TestAlign extends React.Component {
93-
state = {};
94-
95-
render = () => <Test INTERNAL_TRIGGER_ALIGN={triggerAlign} keepAlign />;
96-
}
97-
98-
const wrapper = mount(<TestAlign />);
99-
const times = triggerAlign.mock.calls.length;
100-
101-
for (let i = 0; i < 10; i += 1) {
102-
wrapper.instance().forceUpdate();
103-
}
104-
105-
expect(triggerAlign.mock.calls.length > times).toBeTruthy();
106-
});
10783
});
10884
/* eslint-enable */

0 commit comments

Comments
 (0)