anim-3d-obj 1.1.33 → 1.1.34
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +154 -59
- package/dist/cjs/components/Button.d.ts +1 -1
- package/dist/cjs/components/Button.js.map +1 -1
- package/dist/cjs/components/Card.d.ts +1 -1
- package/dist/cjs/components/Card.js +8 -7
- package/dist/cjs/components/Card.js.map +1 -1
- package/dist/cjs/components/Cuboid.d.ts +1 -1
- package/dist/cjs/components/Cuboid.js +12 -11
- package/dist/cjs/components/Cuboid.js.map +1 -1
- package/dist/cjs/components/Faces/Face.d.ts +1 -1
- package/dist/cjs/components/Faces/Face.js +19 -15
- package/dist/cjs/components/Faces/Face.js.map +1 -1
- package/dist/cjs/components/Ribbon.d.ts +1 -1
- package/dist/cjs/components/Ribbon.js +9 -8
- package/dist/cjs/components/Ribbon.js.map +1 -1
- package/dist/cjs/components/index.d.ts +5 -5
- package/dist/cjs/components/styles/AnimWrap.d.ts +1 -1
- package/dist/cjs/components/styles/AnimWrap.js +44 -44
- package/dist/cjs/components/styles/AnimWrap.js.map +1 -1
- package/dist/cjs/components/styles/Anims.d.ts +0 -4
- package/dist/cjs/components/styles/Anims.js +18 -79
- package/dist/cjs/components/styles/Anims.js.map +1 -1
- package/dist/cjs/components/styles/Global.js +4 -4
- package/dist/cjs/components/styles/Scene.js +8 -8
- package/dist/cjs/components/styles/Scene.js.map +1 -1
- package/dist/cjs/index.d.ts +1 -1
- package/dist/esm/components/Button.d.ts +1 -1
- package/dist/esm/components/Button.js +1 -1
- package/dist/esm/components/Button.js.map +1 -1
- package/dist/esm/components/Card.d.ts +1 -1
- package/dist/esm/components/Card.js +12 -11
- package/dist/esm/components/Card.js.map +1 -1
- package/dist/esm/components/Cuboid.d.ts +1 -1
- package/dist/esm/components/Cuboid.js +16 -15
- package/dist/esm/components/Cuboid.js.map +1 -1
- package/dist/esm/components/Faces/Face.d.ts +1 -1
- package/dist/esm/components/Faces/Face.js +21 -17
- package/dist/esm/components/Faces/Face.js.map +1 -1
- package/dist/esm/components/Ribbon.d.ts +1 -1
- package/dist/esm/components/Ribbon.js +13 -12
- package/dist/esm/components/Ribbon.js.map +1 -1
- package/dist/esm/components/index.d.ts +5 -5
- package/dist/esm/components/index.js +5 -5
- package/dist/esm/components/styles/AnimWrap.d.ts +1 -1
- package/dist/esm/components/styles/AnimWrap.js +47 -47
- package/dist/esm/components/styles/AnimWrap.js.map +1 -1
- package/dist/esm/components/styles/Anims.d.ts +0 -4
- package/dist/esm/components/styles/Anims.js +19 -80
- package/dist/esm/components/styles/Anims.js.map +1 -1
- package/dist/esm/components/styles/Global.js +5 -5
- package/dist/esm/components/styles/Scene.js +10 -10
- package/dist/esm/components/styles/Scene.js.map +1 -1
- package/dist/esm/index.d.ts +1 -1
- package/dist/esm/index.js +1 -1
- package/package.json +46 -39
- package/LICENSE +0 -21
- package/dist/cjs/components/styles/AnimFilter.d.ts +0 -7
- package/dist/cjs/components/styles/AnimFilter.js +0 -14
- package/dist/cjs/components/styles/AnimFilter.js.map +0 -1
- package/dist/esm/components/styles/AnimFilter.d.ts +0 -7
- package/dist/esm/components/styles/AnimFilter.js +0 -8
- package/dist/esm/components/styles/AnimFilter.js.map +0 -1
|
@@ -1,79 +1,79 @@
|
|
|
1
|
-
import styled from
|
|
2
|
-
import React from
|
|
3
|
-
import { allAnims } from
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import { allAnims } from "./Anims";
|
|
4
4
|
export const AnimWrap = (props) => {
|
|
5
5
|
const { children, animSpecs } = props;
|
|
6
6
|
const AS = animSpecs;
|
|
7
|
-
const { X360, Y360, fadeInkf, wobY, wobX, fwdx018, fwdx1836, fwdx09, fwdx918, fwdx1827, fwdx2736, fwdy018, fwdy1836, fwdy09, fwdy918, fwdy1827, fwdy2736, floatX, floatShadow, pulseSM, pulseMD, pulseLG, noAnim } = allAnims({ degreesHi: AS.degreesHi, degreesLow: AS.degreesLow });
|
|
8
|
-
let theAnim =
|
|
7
|
+
const { X360, Y360, fadeInkf, wobY, wobX, fwdx018, fwdx1836, fwdx09, fwdx918, fwdx1827, fwdx2736, fwdy018, fwdy1836, fwdy09, fwdy918, fwdy1827, fwdy2736, floatX, floatShadow, pulseSM, pulseMD, pulseLG, noAnim, } = allAnims({ degreesHi: AS.degreesHi, degreesLow: AS.degreesLow });
|
|
8
|
+
let theAnim = "noAnim";
|
|
9
9
|
// need to iterate through all animation posibilities and not use eval() to satisfy TS
|
|
10
|
-
if (AS.name ===
|
|
10
|
+
if (AS.name === "X360")
|
|
11
11
|
theAnim = X360;
|
|
12
|
-
else if (AS.name ===
|
|
12
|
+
else if (AS.name === "Y360")
|
|
13
13
|
theAnim = Y360;
|
|
14
|
-
else if (AS.name ===
|
|
14
|
+
else if (AS.name === "fadeInkf")
|
|
15
15
|
theAnim = fadeInkf;
|
|
16
|
-
else if (AS.name ===
|
|
16
|
+
else if (AS.name === "wobX")
|
|
17
17
|
theAnim = wobX;
|
|
18
|
-
else if (AS.name ===
|
|
18
|
+
else if (AS.name === "wobY")
|
|
19
19
|
theAnim = wobY;
|
|
20
|
-
else if (AS.name ===
|
|
20
|
+
else if (AS.name === "fwdx018")
|
|
21
21
|
theAnim = fwdx018;
|
|
22
|
-
else if (AS.name ===
|
|
22
|
+
else if (AS.name === "fwdx1836")
|
|
23
23
|
theAnim = fwdx1836;
|
|
24
|
-
else if (AS.name ===
|
|
24
|
+
else if (AS.name === "fwdx09")
|
|
25
25
|
theAnim = fwdx09;
|
|
26
|
-
else if (AS.name ===
|
|
26
|
+
else if (AS.name === "fwdx918")
|
|
27
27
|
theAnim = fwdx918;
|
|
28
|
-
else if (AS.name ===
|
|
28
|
+
else if (AS.name === "fwdx1827")
|
|
29
29
|
theAnim = fwdx1827;
|
|
30
|
-
else if (AS.name ===
|
|
30
|
+
else if (AS.name === "fwdx2736")
|
|
31
31
|
theAnim = fwdx2736;
|
|
32
|
-
else if (AS.name ===
|
|
32
|
+
else if (AS.name === "fwdy018")
|
|
33
33
|
theAnim = fwdy018;
|
|
34
|
-
else if (AS.name ===
|
|
34
|
+
else if (AS.name === "fwdy1836")
|
|
35
35
|
theAnim = fwdy1836;
|
|
36
|
-
else if (AS.name ===
|
|
36
|
+
else if (AS.name === "fwdy09")
|
|
37
37
|
theAnim = fwdy09;
|
|
38
|
-
else if (AS.name ===
|
|
38
|
+
else if (AS.name === "fwdy918")
|
|
39
39
|
theAnim = fwdy918;
|
|
40
|
-
else if (AS.name ===
|
|
40
|
+
else if (AS.name === "fwdy1827")
|
|
41
41
|
theAnim = fwdy1827;
|
|
42
|
-
else if (AS.name ===
|
|
42
|
+
else if (AS.name === "fwdy2736")
|
|
43
43
|
theAnim = fwdy2736;
|
|
44
|
-
else if (AS.name ===
|
|
44
|
+
else if (AS.name === "floatX")
|
|
45
45
|
theAnim = floatX;
|
|
46
|
-
else if (AS.name ===
|
|
46
|
+
else if (AS.name === "floatShadow")
|
|
47
47
|
theAnim = floatShadow;
|
|
48
|
-
else if (AS.name ===
|
|
48
|
+
else if (AS.name === "pulseSM")
|
|
49
49
|
theAnim = pulseSM;
|
|
50
|
-
else if (AS.name ===
|
|
50
|
+
else if (AS.name === "pulseMD")
|
|
51
51
|
theAnim = pulseMD;
|
|
52
|
-
else if (AS.name ===
|
|
52
|
+
else if (AS.name === "pulseLG")
|
|
53
53
|
theAnim = pulseLG;
|
|
54
54
|
else
|
|
55
55
|
theAnim = noAnim;
|
|
56
56
|
const AnimWrapDiv = styled.div `
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
57
|
+
width: 100%;
|
|
58
|
+
height: 100%;
|
|
59
|
+
position: relative;
|
|
60
|
+
transform-style: preserve-3d;
|
|
61
|
+
border: ${AS.border};
|
|
62
|
+
-webkit-animation-duration: ${AS.duration}s;
|
|
63
|
+
animation-duration: ${AS.duration}s;
|
|
64
|
+
-webkit-animation-iteration-count: ${AS.iterationCount};
|
|
65
|
+
animation-iteration-count: ${AS.iterationCount};
|
|
66
|
+
-webkit-animation-name: ${theAnim};
|
|
67
|
+
animation-name: ${theAnim};
|
|
68
|
+
-webkit-animation-fill-mode: ${AS.fillMode};
|
|
69
|
+
animation-fill-mode: ${AS.fillMode};
|
|
70
|
+
animation-direction: ${AS.direction};
|
|
71
|
+
-webkit-animation-direction: ${AS.direction};
|
|
72
|
+
-webkit-animation-timing-function: ${AS.timing};
|
|
73
|
+
animation-timing-function: ${AS.timing};
|
|
74
|
+
-webkit-animation-delay: ${AS.delay}s;
|
|
75
|
+
animation-delay: ${AS.delay}s;
|
|
76
|
+
`;
|
|
77
77
|
return React.createElement(AnimWrapDiv, null, children);
|
|
78
78
|
};
|
|
79
79
|
//# sourceMappingURL=AnimWrap.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnimWrap.js","sourceRoot":"","sources":["../../../../src/components/styles/AnimWrap.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAEnC,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAsB,EAAE,EAAE;
|
|
1
|
+
{"version":3,"file":"AnimWrap.js","sourceRoot":"","sources":["../../../../src/components/styles/AnimWrap.tsx"],"names":[],"mappings":"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"}
|
|
@@ -10,20 +10,16 @@ export declare const allAnims: (props: AllAnimsProps) => {
|
|
|
10
10
|
wobX: import("styled-components").Keyframes;
|
|
11
11
|
fwdx018: import("styled-components").Keyframes;
|
|
12
12
|
fwdx1836: import("styled-components").Keyframes;
|
|
13
|
-
fwdx1836true: import("styled-components").Keyframes;
|
|
14
13
|
fwdx09: import("styled-components").Keyframes;
|
|
15
14
|
fwdx918: import("styled-components").Keyframes;
|
|
16
15
|
fwdx1827: import("styled-components").Keyframes;
|
|
17
16
|
fwdx2736: import("styled-components").Keyframes;
|
|
18
|
-
fwdx2736true: import("styled-components").Keyframes;
|
|
19
17
|
fwdy018: import("styled-components").Keyframes;
|
|
20
18
|
fwdy1836: import("styled-components").Keyframes;
|
|
21
|
-
fwdy1836true: import("styled-components").Keyframes;
|
|
22
19
|
fwdy09: import("styled-components").Keyframes;
|
|
23
20
|
fwdy918: import("styled-components").Keyframes;
|
|
24
21
|
fwdy1827: import("styled-components").Keyframes;
|
|
25
22
|
fwdy2736: import("styled-components").Keyframes;
|
|
26
|
-
fwdy2736true: import("styled-components").Keyframes;
|
|
27
23
|
floatX: import("styled-components").Keyframes;
|
|
28
24
|
floatShadow: import("styled-components").Keyframes;
|
|
29
25
|
pulseSM: import("styled-components").Keyframes;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { keyframes } from
|
|
1
|
+
import { keyframes } from "styled-components";
|
|
2
2
|
export const allAnims = (props) => {
|
|
3
3
|
const { degreesLow = 0, degreesHi = 0 } = props;
|
|
4
4
|
const X360 = keyframes `
|
|
@@ -57,46 +57,31 @@ export const allAnims = (props) => {
|
|
|
57
57
|
/* ============================== x-axis 0-180 >180 - 360 */
|
|
58
58
|
const fwdx018 = keyframes `
|
|
59
59
|
from {
|
|
60
|
-
-webkit-transform: rotateX(
|
|
61
|
-
transform: rotateX(
|
|
60
|
+
-webkit-transform: rotateX(360deg);
|
|
61
|
+
transform: rotateX(360deg);
|
|
62
62
|
}
|
|
63
63
|
to {
|
|
64
64
|
-webkit-transform: rotateX(180deg);
|
|
65
65
|
transform: rotateX(180deg);
|
|
66
66
|
}`;
|
|
67
67
|
const fwdx1836 = keyframes `
|
|
68
|
-
|
|
68
|
+
from {
|
|
69
69
|
-webkit-transform: rotateX(180deg);
|
|
70
70
|
transform: rotateX(180deg);
|
|
71
71
|
}
|
|
72
|
-
|
|
73
|
-
-webkit-transform: rotateX(360deg);
|
|
74
|
-
transform: rotateX(360deg);
|
|
75
|
-
}
|
|
76
|
-
100% {
|
|
72
|
+
to {
|
|
77
73
|
-webkit-transform: rotateX(0deg);
|
|
78
74
|
transform: rotateX(0deg);
|
|
79
|
-
}
|
|
80
|
-
`;
|
|
81
|
-
const fwdx1836true = keyframes `
|
|
82
|
-
0% {
|
|
83
|
-
-webkit-transform: rotateX(180deg);
|
|
84
|
-
transform: rotateX(180deg);
|
|
85
|
-
}
|
|
86
|
-
100% {
|
|
87
|
-
-webkit-transform: rotateX(360deg);
|
|
88
|
-
transform: rotateX(360deg);
|
|
89
|
-
}
|
|
90
|
-
`;
|
|
75
|
+
}`;
|
|
91
76
|
/* ============================= x-axis 0-90, 90-180, 180-270, 270-360 */
|
|
92
77
|
const fwdx09 = keyframes `
|
|
93
78
|
from {
|
|
94
|
-
-webkit-transform: rotateX(
|
|
95
|
-
transform: rotateX(
|
|
79
|
+
-webkit-transform: rotateX(360deg);
|
|
80
|
+
transform: rotateX(360deg);
|
|
96
81
|
}
|
|
97
82
|
to {
|
|
98
|
-
-webkit-transform: rotateX(
|
|
99
|
-
transform: rotateX(
|
|
83
|
+
-webkit-transform: rotateX(90deg);
|
|
84
|
+
transform: rotateX(90deg);
|
|
100
85
|
}`;
|
|
101
86
|
const fwdx918 = keyframes `
|
|
102
87
|
from {
|
|
@@ -117,20 +102,6 @@ export const allAnims = (props) => {
|
|
|
117
102
|
transform: rotateX(-270deg);
|
|
118
103
|
}`;
|
|
119
104
|
const fwdx2736 = keyframes `
|
|
120
|
-
0% {
|
|
121
|
-
-webkit-transform: rotateX(-270deg);
|
|
122
|
-
transform: rotateX(-270deg);
|
|
123
|
-
}
|
|
124
|
-
99% {
|
|
125
|
-
-webkit-transform: rotateX(-360deg);
|
|
126
|
-
transform: rotateX(-360deg);
|
|
127
|
-
}
|
|
128
|
-
100% {
|
|
129
|
-
-webkit-transform: rotateX(0);
|
|
130
|
-
transform: rotateX(0);
|
|
131
|
-
}
|
|
132
|
-
`;
|
|
133
|
-
const fwdx2736true = keyframes `
|
|
134
105
|
from {
|
|
135
106
|
-webkit-transform: rotateX(-270deg);
|
|
136
107
|
transform: rotateX(-270deg);
|
|
@@ -142,45 +113,31 @@ export const allAnims = (props) => {
|
|
|
142
113
|
/* ============================== y-axis 0-180 >180 - 360 */
|
|
143
114
|
const fwdy018 = keyframes `
|
|
144
115
|
from {
|
|
145
|
-
-webkit-transform: rotateY(
|
|
146
|
-
transform: rotateY(
|
|
116
|
+
-webkit-transform: rotateY(360deg);
|
|
117
|
+
transform: rotateY(360deg);
|
|
147
118
|
}
|
|
148
119
|
to {
|
|
149
120
|
-webkit-transform: rotateY(180deg);
|
|
150
121
|
transform: rotateY(180deg);
|
|
151
122
|
}`;
|
|
152
123
|
const fwdy1836 = keyframes `
|
|
153
|
-
0% {
|
|
154
|
-
-webkit-transform: rotateY(180deg);
|
|
155
|
-
transform: rotateY(180deg);
|
|
156
|
-
}
|
|
157
|
-
99% {
|
|
158
|
-
-webkit-transform: rotateY(360deg);
|
|
159
|
-
transform: rotateY(360deg);
|
|
160
|
-
}
|
|
161
|
-
100% {
|
|
162
|
-
-webkit-transform: rotateY(0deg);
|
|
163
|
-
transform: rotateY(0deg);
|
|
164
|
-
}
|
|
165
|
-
`;
|
|
166
|
-
const fwdy1836true = keyframes `
|
|
167
124
|
from {
|
|
168
125
|
-webkit-transform: rotateY(180deg);
|
|
169
126
|
transform: rotateY(180deg);
|
|
170
127
|
}
|
|
171
128
|
to {
|
|
172
|
-
-webkit-transform: rotateY(
|
|
173
|
-
transform: rotateY(
|
|
129
|
+
-webkit-transform: rotateY(0deg);
|
|
130
|
+
transform: rotateY(0deg);
|
|
174
131
|
}`;
|
|
175
132
|
/* ============================= y-axis 0-90, 90-180, 180-270, 270-360 */
|
|
176
133
|
const fwdy09 = keyframes `
|
|
177
134
|
from {
|
|
178
|
-
-webkit-transform: rotateY(
|
|
179
|
-
transform: rotateY(
|
|
135
|
+
-webkit-transform: rotateY(360deg);
|
|
136
|
+
transform: rotateY(360deg);
|
|
180
137
|
}
|
|
181
138
|
to {
|
|
182
|
-
-webkit-transform: rotateY(
|
|
183
|
-
transform: rotateY(
|
|
139
|
+
-webkit-transform: rotateY(90deg);
|
|
140
|
+
transform: rotateY(90deg);
|
|
184
141
|
}`;
|
|
185
142
|
const fwdy918 = keyframes `
|
|
186
143
|
from {
|
|
@@ -201,20 +158,6 @@ export const allAnims = (props) => {
|
|
|
201
158
|
transform: rotateY(-270deg);
|
|
202
159
|
}`;
|
|
203
160
|
const fwdy2736 = keyframes `
|
|
204
|
-
0% {
|
|
205
|
-
-webkit-transform: rotateY(-270deg);
|
|
206
|
-
transform: rotateY(-270deg);
|
|
207
|
-
}
|
|
208
|
-
99% {
|
|
209
|
-
-webkit-transform: rotateY(-360deg);
|
|
210
|
-
transform: rotateY(-360deg);
|
|
211
|
-
}
|
|
212
|
-
100%{
|
|
213
|
-
-webkit-transform: rotateY(0);
|
|
214
|
-
transform: rotateY(0g);
|
|
215
|
-
}
|
|
216
|
-
`;
|
|
217
|
-
const fwdy2736true = keyframes `
|
|
218
161
|
from {
|
|
219
162
|
-webkit-transform: rotateY(-270deg);
|
|
220
163
|
transform: rotateY(-270deg);
|
|
@@ -307,26 +250,22 @@ export const allAnims = (props) => {
|
|
|
307
250
|
wobX,
|
|
308
251
|
fwdx018,
|
|
309
252
|
fwdx1836,
|
|
310
|
-
fwdx1836true,
|
|
311
253
|
fwdx09,
|
|
312
254
|
fwdx918,
|
|
313
255
|
fwdx1827,
|
|
314
256
|
fwdx2736,
|
|
315
|
-
fwdx2736true,
|
|
316
257
|
fwdy018,
|
|
317
258
|
fwdy1836,
|
|
318
|
-
fwdy1836true,
|
|
319
259
|
fwdy09,
|
|
320
260
|
fwdy918,
|
|
321
261
|
fwdy1827,
|
|
322
262
|
fwdy2736,
|
|
323
|
-
fwdy2736true,
|
|
324
263
|
floatX,
|
|
325
264
|
floatShadow,
|
|
326
265
|
pulseSM,
|
|
327
266
|
pulseMD,
|
|
328
267
|
pulseLG,
|
|
329
|
-
noAnim
|
|
268
|
+
noAnim,
|
|
330
269
|
};
|
|
331
270
|
};
|
|
332
271
|
//# sourceMappingURL=Anims.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Anims.js","sourceRoot":"","sources":["../../../../src/components/styles/Anims.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAO9C,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE;
|
|
1
|
+
{"version":3,"file":"Anims.js","sourceRoot":"","sources":["../../../../src/components/styles/Anims.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAO9C,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE;IAC/C,MAAM,EAAE,UAAU,GAAG,CAAC,EAAE,SAAS,GAAG,CAAC,EAAE,GAAG,KAAK,CAAC;IAEhD,MAAM,IAAI,GAAG,SAAS,CAAA;;;;;;;;;EAStB,CAAC;IAED,aAAa;IACb,MAAM,IAAI,GAAG,SAAS,CAAA;;;;;;;;MAQlB,CAAC;IAEL,MAAM,QAAQ,GAAG,SAAS,CAAA;;;;;;MAMtB,CAAC;IAEL,MAAM,IAAI,GAAG,SAAS,CAAA;;qCAEa,UAAU;6BAClB,UAAU;;;qCAGF,SAAS;6BACjB,SAAS;;;qCAGD,UAAU;6BAClB,UAAU;MACjC,CAAC;IAEL,MAAM,IAAI,GAAG,SAAS,CAAA;;qCAEa,UAAU;6BAClB,UAAU;;;qCAGF,SAAS;6BACjB,SAAS;;;qCAGD,UAAU;6BAClB,UAAU;MACjC,CAAC;IACL,4DAA4D;IAC5D,MAAM,OAAO,GAAG,SAAS,CAAA;;;;;;;;MAQrB,CAAC;IACL,MAAM,QAAQ,GAAG,SAAS,CAAA;;;;;;;;MAQtB,CAAC;IACL,yEAAyE;IACzE,MAAM,MAAM,GAAG,SAAS,CAAA;;;;;;;;MAQpB,CAAC;IACL,MAAM,OAAO,GAAG,SAAS,CAAA;;;;;;;;MAQrB,CAAC;IACL,MAAM,QAAQ,GAAG,SAAS,CAAA;;;;;;;;MAQtB,CAAC;IACL,MAAM,QAAQ,GAAG,SAAS,CAAA;;;;;;;;MAQtB,CAAC;IAEL,4DAA4D;IAC5D,MAAM,OAAO,GAAG,SAAS,CAAA;;;;;;;;KAQtB,CAAC;IACJ,MAAM,QAAQ,GAAG,SAAS,CAAA;;;;;;;;KAQvB,CAAC;IAEJ,yEAAyE;IACzE,MAAM,MAAM,GAAG,SAAS,CAAA;;;;;;;;KAQrB,CAAC;IACJ,MAAM,OAAO,GAAG,SAAS,CAAA;;;;;;;;KAQtB,CAAC;IACJ,MAAM,QAAQ,GAAG,SAAS,CAAA;;;;;;;;KAQvB,CAAC;IACJ,MAAM,QAAQ,GAAG,SAAS,CAAA;;;;;;;;KAQvB,CAAC;IAEJ,4CAA4C;IAC5C,MAAM,MAAM,GAAG,SAAS,CAAA;;;uHAG6F,CAAC;IAEtH,MAAM,WAAW,GAAG,SAAS,CAAA;;;;;;;;;;;;;;;;;;;;;UAqBrB,CAAC;IAET,MAAM,OAAO,GAAG,SAAS,CAAA;;;;;;;;;;;;;;;MAerB,CAAC;IAEL,MAAM,OAAO,GAAG,SAAS,CAAA;;;;;;;;;;;;;;;OAepB,CAAC;IAEN,MAAM,OAAO,GAAG,SAAS,CAAA;;;;;;;;;;;;;;;OAepB,CAAC;IAEN,MAAM,MAAM,GAAG,SAAS,CAAA,EAAE,CAAC;IAE3B,OAAO;QACL,IAAI;QACJ,IAAI;QACJ,QAAQ;QACR,IAAI;QACJ,IAAI;QACJ,OAAO;QACP,QAAQ;QACR,MAAM;QACN,OAAO;QACP,QAAQ;QACR,QAAQ;QACR,OAAO;QACP,QAAQ;QACR,MAAM;QACN,OAAO;QACP,QAAQ;QACR,QAAQ;QACR,MAAM;QACN,WAAW;QACX,OAAO;QACP,OAAO;QACP,OAAO;QACP,MAAM;KACP,CAAC;AACJ,CAAC,CAAC"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import styled from
|
|
1
|
+
import styled from "styled-components";
|
|
2
2
|
export const ObjWrapper = styled.div `
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
width: 100%;
|
|
4
|
+
height: 100%;
|
|
5
|
+
position: relative;
|
|
6
|
+
transform-style: preserve-3d;
|
|
7
7
|
`;
|
|
8
8
|
//# sourceMappingURL=Global.js.map
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
import styled from
|
|
2
|
-
import React from
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
import React from "react";
|
|
3
3
|
export const SceneStyle = (props) => {
|
|
4
|
-
const { width = 0, height = 0, perspective = 600, perspectiveOrigin =
|
|
4
|
+
const { width = 0, height = 0, perspective = 600, perspectiveOrigin = "50% 50%", zIndex = 10, children = {}, } = props;
|
|
5
5
|
const SceneStyleDiv = styled.div `
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
6
|
+
width: ${width}px;
|
|
7
|
+
height: ${height}px;
|
|
8
|
+
-webkit-perspective: ${perspective}px;
|
|
9
|
+
perspective: ${perspective}px;
|
|
10
|
+
-webkit-perspective-origin: ${perspectiveOrigin};
|
|
11
|
+
perspective-origin: ${perspectiveOrigin};
|
|
12
|
+
`;
|
|
13
13
|
return (React.createElement("div", { style: { zIndex } },
|
|
14
14
|
React.createElement(SceneStyleDiv, null, children)));
|
|
15
15
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Scene.js","sourceRoot":"","sources":["../../../../src/components/styles/Scene.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAAsB,EAAE,EAAE;
|
|
1
|
+
{"version":3,"file":"Scene.js","sourceRoot":"","sources":["../../../../src/components/styles/Scene.tsx"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AACvC,OAAO,KAAK,MAAM,OAAO,CAAC;AAW1B,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,KAAsB,EAAE,EAAE;IACnD,MAAM,EACJ,KAAK,GAAG,CAAC,EACT,MAAM,GAAG,CAAC,EACV,WAAW,GAAG,GAAG,EACjB,iBAAiB,GAAG,SAAS,EAC7B,MAAM,GAAG,EAAE,EACX,QAAQ,GAAG,EAAE,GACd,GAAG,KAAK,CAAC;IAEV,MAAM,aAAa,GAAQ,MAAM,CAAC,GAAG,CAAA;aAC1B,KAAK;cACJ,MAAM;2BACO,WAAW;mBACnB,WAAW;kCACI,iBAAiB;0BACzB,iBAAiB;GACxC,CAAC;IAEF,OAAO,CACL,6BAAK,KAAK,EAAE,EAAE,MAAM,EAAE;QACpB,oBAAC,aAAa,QAAE,QAAQ,CAAiB,CACrC,CACP,CAAC;AACJ,CAAC,CAAC"}
|
package/dist/esm/index.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export * from
|
|
1
|
+
export * from "./components";
|
package/dist/esm/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,41 +1,48 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
2
|
+
"name": "anim-3d-obj",
|
|
3
|
+
"repository": {
|
|
4
|
+
"type": "git",
|
|
5
|
+
"url": "https://github.com/mdnelles/Component-Library"
|
|
6
|
+
},
|
|
7
|
+
"homepage": "https://github.com/mdnelles/anim-3d-objs",
|
|
8
|
+
"version": "1.1.34",
|
|
9
|
+
"description": "React library for creating 3D objects quickly. Also these objects can be animated",
|
|
10
|
+
"main": "dist/cjs/index.js",
|
|
11
|
+
"module": "dist/esm/index.js",
|
|
12
|
+
"files": [
|
|
13
|
+
"dist"
|
|
14
|
+
],
|
|
15
|
+
"scripts": {
|
|
16
|
+
"build": "rm -rf dist/ && prettier --write src/ && npm run build:esm && npm run build:cjs",
|
|
17
|
+
"build:esm": "tsc",
|
|
18
|
+
"build:cjs": "tsc --module CommonJS --outDir dist/cjs"
|
|
19
|
+
},
|
|
20
|
+
"author": "mdnelles",
|
|
21
|
+
"license": "MIT",
|
|
22
|
+
"devDependencies": {
|
|
23
|
+
"@types/node": "^18.11.9",
|
|
24
|
+
"@types/react": "^18.0.25",
|
|
25
|
+
"@types/react-dom": "^18.0.8",
|
|
26
|
+
"@types/styled-components": "^5.1.26",
|
|
27
|
+
"react": "^18.2.0",
|
|
28
|
+
"react-dom": "^18.2.0",
|
|
29
|
+
"typescript": "^4.8.4"
|
|
30
|
+
},
|
|
31
|
+
"peerDependencies": {
|
|
32
|
+
"react": "^18.2.0",
|
|
33
|
+
"react-dom": "^18.2.0"
|
|
34
|
+
},
|
|
35
|
+
"dependencies": {
|
|
36
|
+
"styled-components": "^5.3.6"
|
|
37
|
+
},
|
|
38
|
+
"keywords": [
|
|
39
|
+
"React",
|
|
40
|
+
"CSS",
|
|
41
|
+
"style",
|
|
42
|
+
"animation",
|
|
43
|
+
"cube",
|
|
44
|
+
"cuboid",
|
|
45
|
+
"3d",
|
|
46
|
+
"webGL"
|
|
47
|
+
]
|
|
41
48
|
}
|
package/LICENSE
DELETED
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2022 JTL (Saman)
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
const react_1 = __importDefault(require("react"));
|
|
7
|
-
const AnimWrap_1 = require("./AnimWrap");
|
|
8
|
-
function AnimFilter(props) {
|
|
9
|
-
const { anim1Specs = false, anim2Specs = false, children = '' } = props;
|
|
10
|
-
return anim1Specs && anim2Specs ? (react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim1Specs },
|
|
11
|
-
react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim2Specs }, children))) : anim1Specs && !anim2Specs ? (react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim1Specs }, children)) : !anim1Specs && anim2Specs ? (react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim2Specs }, children)) : (react_1.default.createElement(react_1.default.Fragment, null, children));
|
|
12
|
-
}
|
|
13
|
-
exports.default = AnimFilter;
|
|
14
|
-
//# sourceMappingURL=AnimFilter.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AnimFilter.js","sourceRoot":"","sources":["../../../../src/components/styles/AnimFilter.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,yCAAsC;AAQtC,SAAwB,UAAU,CAAC,KAAsB;IACrD,MAAM,EAAE,UAAU,GAAG,KAAK,EAAE,UAAU,GAAG,KAAK,EAAE,QAAQ,GAAG,EAAE,EAAE,GAAG,KAAK,CAAC;IAExE,OAAO,UAAU,IAAI,UAAU,CAAC,CAAC,CAAC,CAC9B,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU;QAC3B,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU,IAAG,QAAQ,CAAY,CAC/C,CACd,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAC5B,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU,IAAG,QAAQ,CAAY,CACzD,CAAC,CAAC,CAAC,CAAC,UAAU,IAAI,UAAU,CAAC,CAAC,CAAC,CAC5B,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU,IAAG,QAAQ,CAAY,CACzD,CAAC,CAAC,CAAC,CACA,8DAAG,QAAQ,CAAI,CAClB,CAAC;AACN,CAAC;AAdD,6BAcC"}
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { AnimWrap } from './AnimWrap';
|
|
3
|
-
export default function AnimFilter(props) {
|
|
4
|
-
const { anim1Specs = false, anim2Specs = false, children = '' } = props;
|
|
5
|
-
return anim1Specs && anim2Specs ? (React.createElement(AnimWrap, { animSpecs: anim1Specs },
|
|
6
|
-
React.createElement(AnimWrap, { animSpecs: anim2Specs }, children))) : anim1Specs && !anim2Specs ? (React.createElement(AnimWrap, { animSpecs: anim1Specs }, children)) : !anim1Specs && anim2Specs ? (React.createElement(AnimWrap, { animSpecs: anim2Specs }, children)) : (React.createElement(React.Fragment, null, children));
|
|
7
|
-
}
|
|
8
|
-
//# sourceMappingURL=AnimFilter.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"AnimFilter.js","sourceRoot":"","sources":["../../../../src/components/styles/AnimFilter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAQtC,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,KAAsB;IACrD,MAAM,EAAE,UAAU,GAAG,KAAK,EAAE,UAAU,GAAG,KAAK,EAAE,QAAQ,GAAG,EAAE,EAAE,GAAG,KAAK,CAAC;IAExE,OAAO,UAAU,IAAI,UAAU,CAAC,CAAC,CAAC,CAC9B,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU;QAC3B,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU,IAAG,QAAQ,CAAY,CAC/C,CACd,CAAC,CAAC,CAAC,UAAU,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,CAC5B,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU,IAAG,QAAQ,CAAY,CACzD,CAAC,CAAC,CAAC,CAAC,UAAU,IAAI,UAAU,CAAC,CAAC,CAAC,CAC5B,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU,IAAG,QAAQ,CAAY,CACzD,CAAC,CAAC,CAAC,CACA,0CAAG,QAAQ,CAAI,CAClB,CAAC;AACN,CAAC"}
|