Skip to content

Commit cc87780

Browse files
basetenbaseten
committed
make custom proptypes optional
1 parent 6f0244d commit cc87780

File tree

8 files changed

+407
-277
lines changed

8 files changed

+407
-277
lines changed

‎src/Transform2d.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import PropTypes from 'prop-types';
22
import { mat2d, vec2 } from 'gl-matrix';
33

4-
import { vec2Obj, vec2GlMatrix, mat2dGlMatrix } from './constants';
4+
import { vec2Obj, vec2GlMatrix, mat2dGlMatrix } from './propTypes';
55
import { setVec2FromProp } from './utils';
66
import { useFactoryRef } from './useFactoryRef';
77
import { useRender } from './useRender';
@@ -13,15 +13,15 @@ import type {
1313

1414
const propTypes = {
1515
parentMatrixWorld: mat2dGlMatrix,
16-
multiplicationOrder: PropTypes.oneOf(['PRE', 'POST']).isRequired,
16+
multiplicationOrder: PropTypes.oneOf(['PRE', 'POST']),
1717
translate: PropTypes.oneOfType([vec2GlMatrix, vec2Obj]),
1818
scale: PropTypes.oneOfType([vec2GlMatrix, vec2Obj, PropTypes.number]),
1919
rotate: PropTypes.number,
2020
children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]).isRequired,
2121
};
2222

2323
export type Transform2dProps = {
24-
children: TransformChildren<mat2d>;
24+
children?: TransformChildren<mat2d>;
2525
parentMatrixWorld?: mat2d;
2626
multiplicationOrder?: MultiplicationOrder;
2727
translate?: vec2 | Vec2Object;

‎src/Transform3d.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import PropTypes from 'prop-types';
22
import { mat4, vec3 } from 'gl-matrix';
33

4-
import { vec3Obj, vec3GlMatrix, mat4GlMatrix } from './constants';
4+
import { vec3Obj, vec3GlMatrix, mat4GlMatrix } from './propTypes';
55
import { setVec3FromProp } from './utils';
66
import { useFactoryRef } from './useFactoryRef';
77
import { useRender } from './useRender';
@@ -13,7 +13,7 @@ import type {
1313

1414
const propTypes = {
1515
parentMatrixWorld: mat4GlMatrix,
16-
multiplicationOrder: PropTypes.oneOf(['PRE', 'POST']).isRequired,
16+
multiplicationOrder: PropTypes.oneOf(['PRE', 'POST']),
1717
translate: PropTypes.oneOfType([vec3GlMatrix, vec3Obj]),
1818
scale: PropTypes.oneOfType([vec3GlMatrix, vec3Obj, PropTypes.number]),
1919
rotate: PropTypes.number,
@@ -22,7 +22,7 @@ const propTypes = {
2222
};
2323

2424
export type Transform3dProps = {
25-
children: TransformChildren<mat4>;
25+
children?: TransformChildren<mat4>;
2626
parentMatrixWorld?: mat4;
2727
multiplicationOrder?: MultiplicationOrder;
2828
translate?: vec3 | Vec3Object;

‎src/constants.ts

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

‎src/index.ts

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,4 @@
1-
export {
2-
vec2Obj,
3-
vec3Obj,
4-
vec2GlMatrix,
5-
vec3GlMatrix,
6-
mat2dGlMatrix,
7-
mat4GlMatrix,
8-
} from './constants';
1+
export * from './propTypes';
92
export { useFactoryRef } from './useFactoryRef';
103
export { default as Transform2d } from './Transform2d';
114
export { default as Transform3d } from './Transform3d';

‎src/propTypes.ts

Lines changed: 142 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
import {
2+
isNil,
3+
isVec2,
4+
isVec3,
5+
isMat2d,
6+
isMat4,
7+
isVec2Object,
8+
isVec3Object,
9+
} from './utils';
10+
11+
type PropTypes = { [key: string]: any };
12+
interface PropTypeValidator {
13+
<P extends PropTypes>(
14+
props: P,
15+
propName: string & keyof P,
16+
componentName: string,
17+
): null | Error;
18+
}
19+
interface PropTypeWithRequired extends PropTypeValidator {
20+
isRequired: PropTypeValidator;
21+
}
22+
23+
function createPropType<P extends PropTypes>(
24+
validator: PropTypeValidator,
25+
isRequired: boolean,
26+
) {
27+
return (props: P, propName: string & keyof P, componentName: string) => {
28+
const prop = props[propName];
29+
30+
if (isNil(prop)) {
31+
if (isRequired) {
32+
return new Error(
33+
`${propName} is required in ${componentName} but received ${prop}`,
34+
);
35+
}
36+
return null;
37+
}
38+
39+
return validator(props, propName, componentName);
40+
};
41+
}
42+
43+
const vec2ObjValidator = <P extends PropTypes>(
44+
props: P,
45+
propName: string & keyof P,
46+
componentName: string,
47+
) => {
48+
const passes = isVec2Object(props[propName]);
49+
return passes
50+
? null
51+
: new Error(`${propName} in ${componentName} is not a vec2 shape`);
52+
};
53+
54+
export const vec2Obj: PropTypeWithRequired = createPropType(
55+
vec2ObjValidator,
56+
false,
57+
) as PropTypeWithRequired;
58+
vec2Obj.isRequired = createPropType(vec2ObjValidator, true);
59+
60+
const vec3ObjValidator = <P extends PropTypes>(
61+
props: P,
62+
propName: string & keyof P,
63+
componentName: string,
64+
) => {
65+
const passes = isVec3Object(props[propName]);
66+
return passes
67+
? null
68+
: new Error(`${propName} in ${componentName} is not a vec3 shape`);
69+
};
70+
71+
export const vec3Obj: PropTypeWithRequired = createPropType(
72+
vec3ObjValidator,
73+
false,
74+
) as PropTypeWithRequired;
75+
vec3Obj.isRequired = createPropType(vec3ObjValidator, true);
76+
77+
const vec2GlMatrixValidator = <P extends PropTypes>(
78+
props: P,
79+
propName: string & keyof P,
80+
componentName: string,
81+
) => {
82+
const passes = isVec2(props[propName]);
83+
return passes
84+
? null
85+
: new Error(`${propName} in ${componentName} is not a gl-matrix vec2`);
86+
};
87+
88+
export const vec2GlMatrix: PropTypeWithRequired = createPropType(
89+
vec2GlMatrixValidator,
90+
false,
91+
) as PropTypeWithRequired;
92+
vec2GlMatrix.isRequired = createPropType(vec2GlMatrixValidator, true);
93+
94+
const vec3GlMatrixValidator = <P extends PropTypes>(
95+
props: P,
96+
propName: string & keyof P,
97+
componentName: string,
98+
) => {
99+
const passes = isVec3(props[propName]);
100+
return passes
101+
? null
102+
: new Error(`${propName} in ${componentName} is not a gl-matrix vec3`);
103+
};
104+
export const vec3GlMatrix: PropTypeWithRequired = createPropType(
105+
vec3GlMatrixValidator,
106+
false,
107+
) as PropTypeWithRequired;
108+
vec3GlMatrix.isRequired = createPropType(vec3GlMatrixValidator, true);
109+
110+
const mat2dGlMatrixValidator = <P extends PropTypes>(
111+
props: P,
112+
propName: string & keyof P,
113+
componentName: string,
114+
) => {
115+
const passes = isMat2d(props[propName]);
116+
return passes
117+
? null
118+
: new Error(`${propName} in ${componentName} is not a gl-matrix mat2d`);
119+
};
120+
121+
export const mat2dGlMatrix: PropTypeWithRequired = createPropType(
122+
mat2dGlMatrixValidator,
123+
false,
124+
) as PropTypeWithRequired;
125+
mat2dGlMatrix.isRequired = createPropType(mat2dGlMatrixValidator, true);
126+
127+
export const mat4GlMatrixValidator = <P extends PropTypes>(
128+
props: P,
129+
propName: string & keyof P,
130+
componentName: string,
131+
) => {
132+
const passes = isMat4(props[propName]);
133+
return passes
134+
? null
135+
: new Error(`${propName} in ${componentName} is not a gl-matrix mat4`);
136+
};
137+
138+
export const mat4GlMatrix: PropTypeWithRequired = createPropType(
139+
mat4GlMatrixValidator,
140+
false,
141+
) as PropTypeWithRequired;
142+
mat4GlMatrix.isRequired = createPropType(mat4GlMatrixValidator, true);

‎test/__snapshots__/index.test.ts.snap

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ exports[`index export modules for react-css-transform 1`] = `
66
"Transform3d": [Function],
77
"mat2dGlMatrix": [Function],
88
"mat4GlMatrix": [Function],
9+
"mat4GlMatrixValidator": [Function],
910
"useFactoryRef": [Function],
1011
"vec2GlMatrix": [Function],
1112
"vec2Obj": [Function],

0 commit comments

Comments
 (0)