Skip to content
This repository was archived by the owner on Apr 8, 2020. It is now read-only.

Commit 48eeb2c

Browse files
committed
Rename states
1 parent d52eab0 commit 48eeb2c

File tree

3 files changed

+79
-79
lines changed

3 files changed

+79
-79
lines changed

src/csstransition.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -29,11 +29,11 @@ export interface CSSTransitionProps
2929
children?: ReactNode;
3030
defaultStyle?: CSSProperties;
3131
activeStyle?: CSSProperties;
32+
appearStyle?: CSSProperties;
3233
enterStyle?: CSSProperties;
3334
leaveStyle?: CSSProperties;
3435
style?: CSSProperties;
3536
// TODO:
36-
// appearStyle?: CSSProperties;
3737
// appearInitStyle?: CSSProperty;
3838
// enterInitStyle?: CSSProperties;
3939
// leaveInitStyle?: CSSProperties;

src/csstransitionstate.spec.ts

Lines changed: 38 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -15,9 +15,9 @@ import {
1515
reduce, StateID, StateIDList, ActionID, CSSTransitionState,
1616
initDefaultState, initActiveState,
1717
defaultState, activeState,
18-
transitToActivePendingState, transitToDefaultPendingState,
19-
transitToActiveTriggeredState, transitToDefaultTriggeredState,
20-
transitToActiveStartedState, transitToDefaultStartedState,
18+
enterPendingState, leavePendingState,
19+
enterTriggeredState, leaveTriggeredState,
20+
enterStartedState, leaveStartedState,
2121
} from "./csstransitionstate";
2222

2323
describe("csstransitionstate.ts", () => {
@@ -39,28 +39,28 @@ describe("csstransitionstate.ts", () => {
3939
testState(StateID.Active, "activeStyle", (props) => activeState(props)),
4040
);
4141
describe(
42-
"transitToActivePendingState",
43-
testState(StateID.TransitToActivePending, "defaultStyle", (props) => transitToActivePendingState(props)),
42+
"enterPendingState",
43+
testState(StateID.EnterPending, "defaultStyle", (props) => enterPendingState(props)),
4444
);
4545
describe(
46-
"transitToDefaultPendingState",
47-
testState(StateID.TransitToDefaultPending, "activeStyle", (props) => transitToDefaultPendingState(props)),
46+
"leavePendingState",
47+
testState(StateID.LeavePending, "activeStyle", (props) => leavePendingState(props)),
4848
);
4949
describe(
50-
"transitToActiveTriggeredState",
51-
testState(StateID.TransitToActiveTriggered, "enterStyle", (props) => transitToActiveTriggeredState(props)),
50+
"enterTriggeredState",
51+
testState(StateID.EnterTriggered, "enterStyle", (props) => enterTriggeredState(props)),
5252
);
5353
describe(
54-
"transitToDefaultTriggeredState",
55-
testState(StateID.TransitToDefaultTriggered, "leaveStyle", (props) => transitToDefaultTriggeredState(props)),
54+
"leaveTriggeredState",
55+
testState(StateID.LeaveTriggered, "leaveStyle", (props) => leaveTriggeredState(props)),
5656
);
5757
describe(
58-
"transitToActiveStartedState",
59-
testState(StateID.TransitToActiveStarted, "enterStyle", (props) => transitToActiveStartedState(props)),
58+
"enterStartedState",
59+
testState(StateID.EnterStarted, "enterStyle", (props) => enterStartedState(props)),
6060
);
6161
describe(
62-
"transitToDefaultStartedState",
63-
testState(StateID.TransitToDefaultStarted, "leaveStyle", (props) => transitToDefaultStartedState(props)),
62+
"leaveStartedState",
63+
testState(StateID.LeaveStarted, "leaveStyle", (props) => leaveStartedState(props)),
6464
);
6565
});
6666
describe("actions", () => {
@@ -93,14 +93,14 @@ describe("csstransitionstate.ts", () => {
9393
[StateID.Default, StateID.DefaultInit].forEach((id) => {
9494
const {state, pending} = reduce({ id }, actionID, {});
9595
assert.strictEqual(pending, ActionID.TransitionTrigger);
96-
assert.strictEqual(state.id, StateID.TransitToActivePending);
96+
assert.strictEqual(state.id, StateID.EnterPending);
9797
});
9898
});
9999
it("should transit to default pending transition state", () => {
100100
[StateID.Active, StateID.ActiveInit].forEach((id) => {
101101
const {state, pending} = reduce({ id }, actionID, {});
102102
assert.strictEqual(pending, ActionID.TransitionTrigger);
103-
assert.strictEqual(state.id, StateID.TransitToDefaultPending);
103+
assert.strictEqual(state.id, StateID.LeavePending);
104104
});
105105
});
106106
});
@@ -109,25 +109,25 @@ describe("csstransitionstate.ts", () => {
109109

110110
it("should not fail on invalid state transitions", () => {
111111
StateIDList
112-
.filter((id) => [StateID.TransitToActiveTriggered, StateID.TransitToDefaultTriggered].indexOf(id) < 0)
112+
.filter((id) => [StateID.EnterTriggered, StateID.LeaveTriggered].indexOf(id) < 0)
113113
.forEach((id) => assert.isNull(reduce({ id }, actionID, {})));
114114
});
115115
it("should transit to active started transition state", () => {
116-
const {state, pending} = reduce({ id: StateID.TransitToActiveTriggered }, actionID, {});
116+
const {state, pending} = reduce({ id: StateID.EnterTriggered }, actionID, {});
117117
assert.isUndefined(pending);
118-
assert.strictEqual(state.id, StateID.TransitToActiveStarted);
118+
assert.strictEqual(state.id, StateID.EnterStarted);
119119
});
120120
it("should transit to active started transition state", () => {
121-
const {state, pending} = reduce({ id: StateID.TransitToDefaultTriggered }, actionID, {});
121+
const {state, pending} = reduce({ id: StateID.LeaveTriggered }, actionID, {});
122122
assert.isUndefined(pending);
123-
assert.strictEqual(state.id, StateID.TransitToDefaultStarted);
123+
assert.strictEqual(state.id, StateID.LeaveStarted);
124124
});
125125
});
126126
describe("TransitionComplete", () => {
127127
const actionID = ActionID.TransitionComplete;
128128
const validOrigin = [
129-
StateID.TransitToActiveTriggered, StateID.TransitToActiveStarted,
130-
StateID.TransitToDefaultTriggered, StateID.TransitToDefaultStarted,
129+
StateID.EnterTriggered, StateID.EnterStarted,
130+
StateID.LeaveTriggered, StateID.LeaveStarted,
131131
];
132132

133133
it("should fail on invalid state transitions", () => {
@@ -136,14 +136,14 @@ describe("csstransitionstate.ts", () => {
136136
.forEach((id) => assert.throw(() => reduce({ id }, actionID, {})));
137137
});
138138
it("should transit to active state", () => {
139-
[StateID.TransitToActiveTriggered, StateID.TransitToActiveStarted].forEach((id) => {
139+
[StateID.EnterTriggered, StateID.EnterStarted].forEach((id) => {
140140
const {state, pending} = reduce({ id }, actionID, {});
141141
assert.isUndefined(pending);
142142
assert.strictEqual(state.id, StateID.Active);
143143
});
144144
});
145145
it("should transit to default state", () => {
146-
[StateID.TransitToDefaultTriggered, StateID.TransitToDefaultStarted].forEach((id) => {
146+
[StateID.LeaveTriggered, StateID.LeaveStarted].forEach((id) => {
147147
const {state, pending} = reduce({ id }, actionID, {});
148148
assert.isUndefined(pending);
149149
assert.strictEqual(state.id, StateID.Default);
@@ -164,30 +164,30 @@ describe("csstransitionstate.ts", () => {
164164
[StateID.Default, StateID.DefaultInit].forEach((id) => {
165165
const {state, pending} = reduce({ id }, actionID, {});
166166
assert.strictEqual(pending, ActionID.TransitionTrigger);
167-
assert.strictEqual(state.id, StateID.TransitToActivePending);
167+
assert.strictEqual(state.id, StateID.EnterPending);
168168
});
169169
});
170170
it("should transit to default pending transition state", () => {
171171
[StateID.Active, StateID.ActiveInit].forEach((id) => {
172172
const {state, pending} = reduce({ id }, actionID, {});
173173
assert.strictEqual(pending, ActionID.TransitionTrigger);
174-
assert.strictEqual(state.id, StateID.TransitToDefaultPending);
174+
assert.strictEqual(state.id, StateID.LeavePending);
175175
});
176176
});
177177
it("should transit to active triggered state", () => {
178-
const id = StateID.TransitToActivePending;
178+
const id = StateID.EnterPending;
179179
const {state, pending} = reduce({ id }, actionID, { active: true });
180180
assert.isUndefined(pending);
181-
assert.strictEqual(state.id, StateID.TransitToActiveTriggered);
181+
assert.strictEqual(state.id, StateID.EnterTriggered);
182182
});
183183
it("should transit to default triggered transition state", () => {
184-
const id = StateID.TransitToDefaultPending;
184+
const id = StateID.LeavePending;
185185
const {state, pending} = reduce({ id }, actionID, { active: false });
186186
assert.isUndefined(pending);
187-
assert.strictEqual(state.id, StateID.TransitToDefaultTriggered);
187+
assert.strictEqual(state.id, StateID.LeaveTriggered);
188188
});
189189
it("should interrupt pending and triggered active transition", () => {
190-
[StateID.TransitToActivePending, StateID.TransitToActiveTriggered].forEach((id) => {
190+
[StateID.EnterPending, StateID.EnterTriggered].forEach((id) => {
191191
const props = { active: false, onTransitionComplete: spy() };
192192
const {state, pending} = reduce({ id }, actionID, props);
193193
assert.isUndefined(pending);
@@ -196,7 +196,7 @@ describe("csstransitionstate.ts", () => {
196196
});
197197
});
198198
it("should interrupt pending and triggered default transition", () => {
199-
[StateID.TransitToDefaultPending, StateID.TransitToDefaultTriggered].forEach((id) => {
199+
[StateID.LeavePending, StateID.LeaveTriggered].forEach((id) => {
200200
const props = { active: true, onTransitionComplete: spy() };
201201
const {state, pending} = reduce({ id }, actionID, props);
202202
assert.isUndefined(pending);
@@ -205,16 +205,16 @@ describe("csstransitionstate.ts", () => {
205205
});
206206
});
207207
it("should interrupt started active transition", () => {
208-
const id = StateID.TransitToActiveStarted;
208+
const id = StateID.EnterStarted;
209209
const {state, pending} = reduce({ id }, actionID, { active: false });
210210
assert.isUndefined(pending);
211-
assert.strictEqual(state.id, StateID.TransitToDefaultTriggered);
211+
assert.strictEqual(state.id, StateID.LeaveTriggered);
212212
});
213213
it("should interrupt started default transition", () => {
214-
const id = StateID.TransitToDefaultStarted;
214+
const id = StateID.LeaveStarted;
215215
const {state, pending} = reduce({ id }, actionID, { active: true });
216216
assert.isUndefined(pending);
217-
assert.strictEqual(state.id, StateID.TransitToActiveTriggered);
217+
assert.strictEqual(state.id, StateID.EnterTriggered);
218218
});
219219
});
220220
});

src/csstransitionstate.ts

Lines changed: 40 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -23,21 +23,21 @@ export enum StateID {
2323
ActiveInit,
2424
Active,
2525
PreparedActive,
26-
TransitToDefaultPending,
27-
TransitToDefaultTriggered,
28-
TransitToDefaultStarted,
29-
TransitToActivePending,
30-
TransitToActiveTriggered,
31-
TransitToActiveStarted,
26+
LeavePending,
27+
LeaveTriggered,
28+
LeaveStarted,
29+
EnterPending,
30+
EnterTriggered,
31+
EnterStarted,
3232
Default,
3333
DefaultInit,
3434
}
3535

3636
export const StateIDList = [
3737
StateID.ActiveInit, StateID.Active, StateID.PreparedActive,
3838
StateID.DefaultInit, StateID.Default,
39-
StateID.TransitToDefaultPending, StateID.TransitToDefaultTriggered, StateID.TransitToDefaultStarted,
40-
StateID.TransitToActivePending, StateID.TransitToActiveTriggered, StateID.TransitToActiveStarted,
39+
StateID.LeavePending, StateID.LeaveTriggered, StateID.LeaveStarted,
40+
StateID.EnterPending, StateID.EnterTriggered, StateID.EnterStarted,
4141
];
4242

4343
export enum ActionID {
@@ -69,33 +69,33 @@ export const defaultState = (props: CSSTransitionProps) => ({
6969
style: { ...props.style, ...props.defaultStyle },
7070
});
7171

72-
export const transitToActivePendingState = (props: CSSTransitionProps) => ({
73-
id: StateID.TransitToActivePending,
72+
export const enterPendingState = (props: CSSTransitionProps) => ({
73+
id: StateID.EnterPending,
7474
style: { ...props.style, ...props.defaultStyle },
7575
});
7676

77-
export const transitToDefaultPendingState = (props: CSSTransitionProps) => ({
78-
id: StateID.TransitToDefaultPending,
77+
export const leavePendingState = (props: CSSTransitionProps) => ({
78+
id: StateID.LeavePending,
7979
style: { ...props.style, ...props.activeStyle },
8080
});
8181

82-
export const transitToActiveTriggeredState = (props: CSSTransitionProps) => ({
83-
id: StateID.TransitToActiveTriggered,
82+
export const enterTriggeredState = (props: CSSTransitionProps) => ({
83+
id: StateID.EnterTriggered,
8484
style: { ...props.style, ...resolveTransit(props.enterStyle, getEnterDelay(props.transitionDelay)) },
8585
});
8686

87-
export const transitToDefaultTriggeredState = (props: CSSTransitionProps) => ({
88-
id: StateID.TransitToDefaultTriggered,
87+
export const leaveTriggeredState = (props: CSSTransitionProps) => ({
88+
id: StateID.LeaveTriggered,
8989
style: { ...props.style, ...resolveTransit(props.leaveStyle, getLeaveDelay(props.transitionDelay)) },
9090
});
9191

92-
export const transitToActiveStartedState = (props: CSSTransitionProps) => ({
93-
id: StateID.TransitToActiveStarted,
92+
export const enterStartedState = (props: CSSTransitionProps) => ({
93+
id: StateID.EnterStarted,
9494
style: { ...props.style, ...resolveTransit(props.enterStyle, getEnterDelay(props.transitionDelay)) },
9595
});
9696

97-
export const transitToDefaultStartedState = (props: CSSTransitionProps) => ({
98-
id: StateID.TransitToDefaultStarted,
97+
export const leaveStartedState = (props: CSSTransitionProps) => ({
98+
id: StateID.LeaveStarted,
9999
style: { ...props.style, ...resolveTransit(props.leaveStyle, getLeaveDelay(props.transitionDelay)) },
100100
});
101101

@@ -114,35 +114,35 @@ export function reduce(
114114
switch (state.id) {
115115
case StateID.DefaultInit:
116116
case StateID.Default:
117-
nextState = transitToActivePendingState(props);
117+
nextState = enterPendingState(props);
118118
break;
119119
case StateID.ActiveInit:
120120
case StateID.Active:
121-
nextState = transitToDefaultPendingState(props);
121+
nextState = leavePendingState(props);
122122
break;
123123
default:
124124
throw new Error("invalid state transition");
125125
};
126126
return { state: nextState, pending: ActionID.TransitionTrigger };
127127
case ActionID.TransitionStart:
128128
switch (state.id) {
129-
case StateID.TransitToActiveTriggered:
130-
return { state: transitToActiveStartedState(props) };
131-
case StateID.TransitToDefaultTriggered:
132-
return { state: transitToDefaultStartedState(props) };
129+
case StateID.EnterTriggered:
130+
return { state: enterStartedState(props) };
131+
case StateID.LeaveTriggered:
132+
return { state: leaveStartedState(props) };
133133
default:
134134
// We don't error out, because the workaround for transitionstart
135135
// could happen after transitionend.
136136
return null;
137137
}
138138
case ActionID.TransitionComplete:
139139
switch (state.id) {
140-
case StateID.TransitToActiveTriggered:
141-
case StateID.TransitToActiveStarted:
140+
case StateID.EnterTriggered:
141+
case StateID.EnterStarted:
142142
if (props.onTransitionComplete) { props.onTransitionComplete(); }
143143
return { state: activeState(props) };
144-
case StateID.TransitToDefaultTriggered:
145-
case StateID.TransitToDefaultStarted:
144+
case StateID.LeaveTriggered:
145+
case StateID.LeaveStarted:
146146
if (props.onTransitionComplete) { props.onTransitionComplete(); }
147147
return { state: defaultState(props) };
148148
default:
@@ -155,24 +155,24 @@ export function reduce(
155155
case StateID.DefaultInit:
156156
case StateID.Default:
157157
return reduce(state, ActionID.TransitionInit, props);
158-
case StateID.TransitToActivePending:
159-
if (props.active) { return { state: transitToActiveTriggeredState(props) }; }
158+
case StateID.EnterPending:
159+
if (props.active) { return { state: enterTriggeredState(props) }; }
160160
if (props.onTransitionComplete) { props.onTransitionComplete(); }
161161
return { state: defaultState(props) };
162-
case StateID.TransitToDefaultPending:
163-
if (!props.active) { return { state: transitToDefaultTriggeredState(props) }; }
162+
case StateID.LeavePending:
163+
if (!props.active) { return { state: leaveTriggeredState(props) }; }
164164
if (props.onTransitionComplete) { props.onTransitionComplete(); }
165165
return { state: activeState(props) };
166-
case StateID.TransitToActiveTriggered:
166+
case StateID.EnterTriggered:
167167
if (props.onTransitionComplete) { props.onTransitionComplete(); }
168168
return { state: defaultState(props) };
169-
case StateID.TransitToDefaultTriggered:
169+
case StateID.LeaveTriggered:
170170
if (props.onTransitionComplete) { props.onTransitionComplete(); }
171171
return { state: activeState(props) };
172-
case StateID.TransitToActiveStarted:
173-
return { state: transitToDefaultTriggeredState(props) };
174-
case StateID.TransitToDefaultStarted:
175-
return { state: transitToActiveTriggeredState(props) };
172+
case StateID.EnterStarted:
173+
return { state: leaveTriggeredState(props) };
174+
case StateID.LeaveStarted:
175+
return { state: enterTriggeredState(props) };
176176
default:
177177
throw new Error("invalid state transition");
178178
}

0 commit comments

Comments
 (0)