Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings
This repository was archived by the owner on Apr 8, 2020. It is now read-only.

Commit 82c0d69

Browse files
committed
Make transit work with prefixers
1 parent f87730e commit 82c0d69

File tree

2 files changed

+20
-20
lines changed

2 files changed

+20
-20
lines changed

‎src/transit.spec.ts

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,15 +6,19 @@ import { transit, resolveTransit } from "./transit";
66
describe("transit.ts", () => {
77
describe("transit", () => {
88
it("should parse shorthand order", () => {
9-
const config = transit("100px", 50, "linear", 30);
10-
assert.strictEqual(config.value, "100px");
11-
assert.deepEqual(config.params, { duration: 50, timing: "linear", delay: 30 });
9+
const obj = transit("100px", 50, "linear", 30);
10+
assert.isArray(obj);
11+
assert.lengthOf(obj, 1);
12+
assert.strictEqual(obj[0], "100px");
13+
assert.deepEqual(obj.transitParams, { duration: 50, timing: "linear", delay: 30 });
1214
});
1315

1416
it("should use defaults", () => {
15-
const config = transit("100px", 30);
16-
assert.strictEqual(config.value, "100px");
17-
assert.deepEqual(config.params, { duration: 30, timing: "ease", delay: 0 });
17+
const obj = transit("100px", 30);
18+
assert.isArray(obj);
19+
assert.lengthOf(obj, 1);
20+
assert.strictEqual(obj[0], "100px");
21+
assert.deepEqual(obj.transitParams, { duration: 30, timing: "ease", delay: 0 });
1822
});
1923
});
2024
describe("resolveTransit()", () => {

‎src/transit.ts

Lines changed: 10 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -8,34 +8,30 @@ interface TransitionParams {
88
delay?: number;
99
}
1010

11-
class TransitionConfig {
12-
public value: any;
13-
public params: TransitionParams;
14-
15-
constructor(value: any, params: TransitionParams) {
16-
this.value = value;
17-
this.params = params;
18-
}
19-
}
11+
interface AugmentedArray extends Array<any> {
12+
transitParams: TransitionParams;
13+
};
2014

2115
export function transit(value: any, duration: number, timing?: string, delay?: number): any {
22-
return new TransitionConfig(value, {
16+
const ret = [value];
17+
(ret as AugmentedArray).transitParams = {
2318
duration,
2419
timing: timing || "ease",
2520
delay: delay !== undefined ? delay : 0,
26-
});
21+
};
22+
return ret;
2723
}
2824

2925
export function resolveTransit(style: CSSProperties, extraDelay = 0): CSSProperties {
3026
let transition = "";
3127
let processedStyle = { ...style };
3228
for (const property in style) {
3329
const val = style[property];
34-
if (typeofval ==="object") {
35-
const {value,params: {duration, timing, delay}} = val as TransitionConfig;
30+
if (Array.isArray(val)&&(val asAugmentedArray).transitParams) {
31+
const {duration, timing, delay} = (val as AugmentedArray).transitParams;
3632
if (transition !== "") { transition += ", "; }
3733
transition += `${convertToCSSPrefix(property)} ${duration}ms ${timing} ${delay + extraDelay}ms`;
38-
processedStyle[property] = value;
34+
processedStyle[property] = val[0];
3935
}
4036
}
4137
if (transition) {

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /