anim-3d-obj 1.1.30 → 1.1.33

package/README.md

@@ -3,75 +3,37 @@
 This project allows a user to create Cuboids of any size simply by entering a set of parameters.  
 The program does the leg work with regard to calculating translationZ depth and config on the fly.
 
--   [GIT HOME](https://github.com/mdnelles/anim-3d-objs)
--   [NPM HOME](https://www.npmjs.com/package/anim-3d-obj) npm i anim-3d-obj
-
 ## Examples
 
--   [6 sided Cuboid - animate X360 Y360](https://codesandbox.io/s/anim-3d-obj-all-sides-simple-bf67yg-tzr2v6?file=/src/index.js)
+-   [6 sided Cuboid - animate X360 Y360](https://codesandbox.io/s/anim-3d-obj-all-sides-simple-bf67yg-tzr2v6)
 -   [3 sided Object - animate y-axis](https://codesandbox.io/s/anim-3d-obj-3-sides-wobble-y-axis-wglkms)
 -   [Double box spin](https://codesandbox.io/s/react-anim-3d-double-box-spin-vbdhg2)
 -   [2 sided object with animation wobble](https://codesandbox.io/s/anim-3d-obj-2-sided-anim-wobble-e14v3b)
 -   [Parallel divs animated x and y axis in tandem](https://codesandbox.io/s/anim-3d-obj-2-sides-simple-4057y7)
 -   [Spinning Slab](https://codesandbox.io/s/react-anim-3d-pulse-kc8g0f)
+-   [Double animation] (https://codesandbox.io/s/react-anim-3d-double-animation-kexyzk)
 
 ## Config
 
-Animations are optional. Either or both of `anim1Specs` or `anim2Specs` can be applied to the object.
+Animations are optional. Either or both of `anim1Specs` or `anim2Specs` can be applied to the object. Both could be used if you want to apply animations on the X and Y axis.
 
 ```typescript
 const anim1Specs: object = {
-
-  border: '', // while testing reveal the animation wrapper
-  degreesHi: -45, // degrees if spin
-  degreesLow: 45, // degrees if spin
-  delay: 0, // start delay in seconds
-  direction: 'normal', //normal alternating reverse
-  duration: 8, // seconds
-  fillMode: 'forward', // node forward backward both
-  iterationCount: 'infinite', // number or infinte
-  name: 'Y360', // ** ANIMATIONS
-  timing: 'ease-in-out', // linear ease ease-in-out
-}
-=======
-   border: "", // while testing reveal the animation wrapper
-   degreesHi: -45, // degrees if spin
-   degreesLow: 45, // degrees if spin
-   delay: 0, // start delay in seconds
-   direction: "normal", //normal alternating reverse
-   duration: 8, // seconds
-   fillMode: "forward", // node forward backward both
-   iterationCount: "infinite", // number or infinte
-   name: "Y360", // ** ANIMATIONS
-   timing: "ease-in-out", // linear ease ease-in-out
+    border: '', // while testing reveal the animation wrapper
+    degreesHi: -45, // degrees if spin
+    degreesLow: 45, // degrees if spin
+    delay: 0, // start delay in seconds
+    direction: 'normal', //normal alternating reverse
+    duration: 8, // seconds
+    fillMode: 'forward', // node forward backward both
+    iterationCount: 'infinite', // number or infinte
+    name: 'Y360', // ** ANIMATIONS
+    timing: 'ease-in-out' // linear ease ease-in-out
 };
 ```
 
 `** ANIMATIONS`
 
--   X360: rotate 360 degrees on the x-axis
--   Y360: rotate 360 degrees on the y-axis
--   fadeInkf: fade object in from 0 to 1 Opacity
--   wobY: wobble on y-axis (degreesHi <-> degreesLow)
--   wobX: wobble on x-axis (degreesHi <-> degreesLow)
--   fwdx018: spin object on x-axis from 0 degrees to 180 degrees
--   fwdx1836: spin object on x-axis from 180 degrees to 360 degrees
--   fwdx09: spin object on x-axis from 0 degrees to 90 degrees
--   fwdx918: spin object on x-axis from 90 degrees to 180 degrees
--   fwdx1827: spin object on x-axis from 180 degrees to 270 degrees
--   fwdx2736: spin object on x-axis from 270 degrees to 360 degrees
--   fwdy018: spin object on y-axis from 0 degrees to 180 degrees
--   fwdy1836: spin object on y-axis from 180 degrees to 360 degrees
--   fwdy09: spin object on y-axis from 0 degrees to 90 degrees
--   fwdy918: spin object on y-axis from 90 degrees to 180 degrees
--   fwdy1827: spin object on y-axis from 180 degrees to 270 degrees
--   fwdy2736: spin object on y-axis from 270 degrees to 360 degrees
--   floatX: float object so is not stationary
--   floatShadow: float object + add shadow
--   pulseSM: pulse object Small
--   pulseMD: pulse object Medium
--   pulseLG: pulse object Large
--   # noAnim: no animation place holder
 -   X360: rotate 360 degrees on the x-axis
 -   Y360: rotate 360 degrees on the y-axis
 -   fadeInkf: fade object in from 0 to 1 Opacity
@@ -95,118 +57,3 @@ const anim1Specs: object = {
 -   pulseMD: pulse object Medium
 -   pulseLG: pulse object Large
 -   noAnim: no animation place holder
-
-<>
-
-GLOBAL CONFIG
-
-```typescript
-// EXAMPLE GLOBAL FACE CONFIG
-// This will be applied to all Faces that do not have their own custom config
-const global: object = {
-
-  // // face individual styles (over rides global)
-  css: `
-=======
-   // // face individual styles (over rides global)
-   css: `
-
-         border: 1px solid #fff;
-         background: rgb(2,0,36);
-         background: linear-gradient(180deg, rgba(255,255,255,.1) 0%, rgba(141,191,249,.7) 100%);
-         color:white;
-         text-align:center;
-         line-height:10;
-         backface-visibility: visible;
-         font-family: Arial, Helvetica, sans-serif;
-         border-radius:5px;
-         `,
-
-  body: ' ',
-}
-=======
-   body: " ",
-};
-```
-
-<>
-
-CUSTOM CONFIG FOR INDIVIDUAL FACES
-
-```typescript
-const custom: object = {
-      // // face individual styles (over rides global)
-      front: {
-         css: ``,
-         body: <Login />,
-      },
-      left: {
-         css: `
-         border: 1px solid #fff;
-         background: rgb(2,0,36);
-         color:white;
-         text-align: center;
-         line-height:8;`
-         body: " ",
-      },
-      right: {
-         css: ``,
-         body: " ",
-      },
-      back: {
-         css: ``,
-         body: <Logout />,
-      },
-      bottom: {
-         css: `
-         background-color:rgba(141,191,249,1);
-         -webkit-box-shadow: 0px 0px 23px 18px #858585;
-         box-shadow: 0px 0px 23px 18px #858585;
-         `,
-      },
-```
-
-## Render
-
-and
-
-```typescript
-<Cuboid
-  width={250}
-  height={300}
-  depth={250}
-  perspective={800}
-  perspectiveOrigin='50% 50%'
-  zIndex={10}
-  anim1Specs={anim1Specs}
-  anim2Specs={anim2Specs}
-  custom={custom}
-  faces={faceprops}
-  global={global}
-=======
-   width={250}
-   height={300}
-   depth={250}
-   perspective={800}
-   perspectiveOrigin='50% 50%'
-   zIndex={10}
-   anim1Specs={anim1Specs}
-   anim2Specs={anim2Specs}
-   custom={custom}
-   faces={faceprops}
-   global={global}
-/>
-```
-
-will produce the following
-
-![Logo](https://raw.githubusercontent.com/mdnelles/objs-local/main/img.png?token=GHSAT0AAAAAABQVNJ4VATWQM4SI3LXSTDZWYVDOL7Q)
-
-## Authors
-
--   # [@mdnelles](https://github.com/mdnelles)
--   [@mdnelles](https://github.com/mdnelles)
-
-## License
-
-[MIT](https://choosealicense.com/licenses/mit/)

package/dist/cjs/components/Card.js

@@ -5,21 +5,20 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Card = void 0;
 const react_1 = __importDefault(require("react"));
-const AnimWrap_1 = require("./styles/AnimWrap");
 const Scene_1 = require("./styles/Scene");
 const Face_1 = __importDefault(require("./Faces/Face"));
 const Global_1 = require("./styles/Global");
+const AnimFilter_1 = __importDefault(require("./styles/AnimFilter"));
 const Card = (props) => {
     let { anim1Specs, anim2Specs, width = 5, height = 5, faces, global = {}, custom = {}, tranz = (+height / 2) | 0, perspective, perspectiveOrigin, zIndex } = props;
     const buildFace = (faceType) => {
         return react_1.default.createElement(Face_1.default, { width: width, height: height, depth: 0.1, faceType: faceType, id: faceType, tranz: tranz, global: global, custom: custom });
     };
     return (react_1.default.createElement(Scene_1.SceneStyle, { width: width, height: height, perspective: perspective, perspectiveOrigin: perspectiveOrigin, zIndex: zIndex },
-        react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim1Specs },
-            react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim2Specs },
-                react_1.default.createElement(Global_1.ObjWrapper, null,
-                    !!faces && !!faces.front ? buildFace('front') : null,
-                    !!faces && !!faces.back ? buildFace('back') : null)))));
+        react_1.default.createElement(AnimFilter_1.default, { anim1Specs: anim1Specs, anim2Specs: anim2Specs },
+            react_1.default.createElement(Global_1.ObjWrapper, null,
+                !!faces && !!faces.front ? buildFace('front') : null,
+                !!faces && !!faces.back ? buildFace('back') : null))));
 };
 exports.Card = Card;
 //# sourceMappingURL=Card.js.map

package/dist/cjs/components/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/Card.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,gDAA6C;AAC7C,0CAA4C;AAE5C,wDAAgC;AAChC,4CAA6C;AAEtC,MAAM,IAAI,GAAG,CAAC,KAAe,EAAO,EAAE;IACzC,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAElK,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,8BAAC,cAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAC9I,CAAC,CAAC;IAEF,OAAO,CACH,8BAAC,kBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU;YAC3B,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU;gBAC3B,8BAAC,mBAAU;oBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;oBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAC1C,CACN,CACJ,CACF,CAChB,CAAC;AACN,CAAC,CAAC;AAnBW,QAAA,IAAI,QAmBf"}
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/Card.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,0CAA4C;AAE5C,wDAAgC;AAChC,4CAA6C;AAC7C,qEAA6C;AAEtC,MAAM,IAAI,GAAG,CAAC,KAAe,EAAO,EAAE;IACzC,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAElK,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,8BAAC,cAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAC9I,CAAC,CAAC;IAEF,OAAO,CACH,8BAAC,kBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,8BAAC,oBAAU,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU;YACtD,8BAAC,mBAAU;gBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;gBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAC1C,CACJ,CACJ,CAChB,CAAC;AACN,CAAC,CAAC;AAjBW,QAAA,IAAI,QAiBf"}

package/dist/cjs/components/Cuboid.js

@@ -5,25 +5,24 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Cuboid = void 0;
 const react_1 = __importDefault(require("react"));
-const AnimWrap_1 = require("./styles/AnimWrap");
 const Scene_1 = require("./styles/Scene");
 const Face_1 = __importDefault(require("./Faces/Face"));
 const Global_1 = require("./styles/Global");
+const AnimFilter_1 = __importDefault(require("./styles/AnimFilter"));
 const Cuboid = (props) => {
     let { anim1Specs, anim2Specs, width = 5, height = 5, depth = 5, faces, global = {}, custom = {}, tranz = (+height / 2) | 0, perspective, perspectiveOrigin, zIndex } = props;
     const buildFace = (faceType) => {
         return react_1.default.createElement(Face_1.default, { width: width, height: height, depth: depth, faceType: faceType, id: faceType, tranz: tranz, global: global, custom: custom });
     };
     return (react_1.default.createElement(Scene_1.SceneStyle, { width: width, height: height, perspective: perspective, perspectiveOrigin: perspectiveOrigin, zIndex: zIndex },
-        react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim1Specs },
-            react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim2Specs },
-                react_1.default.createElement(Global_1.ObjWrapper, null,
-                    !!faces && !!faces.front ? buildFace('front') : null,
-                    !!faces && !!faces.right ? buildFace('right') : null,
-                    !!faces && !!faces.back ? buildFace('back') : null,
-                    !!faces && !!faces.left ? buildFace('left') : null,
-                    !!faces && !!faces.top ? buildFace('top') : null,
-                    !!faces && !!faces.bottom ? buildFace('bottom') : null)))));
+        react_1.default.createElement(AnimFilter_1.default, { anim1Specs: anim1Specs, anim2Specs: anim2Specs },
+            react_1.default.createElement(Global_1.ObjWrapper, null,
+                !!faces && !!faces.front ? buildFace('front') : null,
+                !!faces && !!faces.right ? buildFace('right') : null,
+                !!faces && !!faces.back ? buildFace('back') : null,
+                !!faces && !!faces.left ? buildFace('left') : null,
+                !!faces && !!faces.top ? buildFace('top') : null,
+                !!faces && !!faces.bottom ? buildFace('bottom') : null))));
 };
 exports.Cuboid = Cuboid;
 //# sourceMappingURL=Cuboid.js.map

package/dist/cjs/components/Cuboid.js.map

@@ -1 +1 @@
-{"version":3,"file":"Cuboid.js","sourceRoot":"","sources":["../../../src/components/Cuboid.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,gDAA6C;AAC7C,0CAA4C;AAE5C,wDAAgC;AAChC,4CAA6C;AAEtC,MAAM,MAAM,GAAG,CAAC,KAAe,EAAO,EAAE;IAC3C,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE7K,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,8BAAC,cAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAChJ,CAAC,CAAC;IAEF,OAAO,CACH,8BAAC,kBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU;YAC3B,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU;gBAC3B,8BAAC,mBAAU;oBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;oBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;oBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;oBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;oBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;oBAChD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAC9C,CACN,CACJ,CACF,CAChB,CAAC;AACN,CAAC,CAAC;AAvBW,QAAA,MAAM,UAuBjB"}
+{"version":3,"file":"Cuboid.js","sourceRoot":"","sources":["../../../src/components/Cuboid.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,0CAA4C;AAE5C,wDAAgC;AAChC,4CAA6C;AAC7C,qEAA6C;AAEtC,MAAM,MAAM,GAAG,CAAC,KAAe,EAAO,EAAE;IAC3C,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE7K,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,8BAAC,cAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAChJ,CAAC,CAAC;IAEF,OAAO,CACH,8BAAC,kBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,8BAAC,oBAAU,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU;YACtD,8BAAC,mBAAU;gBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;gBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;gBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;gBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;gBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBAChD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAC9C,CACJ,CACJ,CAChB,CAAC;AACN,CAAC,CAAC;AArBW,QAAA,MAAM,UAqBjB"}

package/dist/cjs/components/Ribbon.js

@@ -5,22 +5,21 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Ribbon = void 0;
 const react_1 = __importDefault(require("react"));
-const AnimWrap_1 = require("./styles/AnimWrap");
 const Scene_1 = require("./styles/Scene");
 const Face_1 = __importDefault(require("./Faces/Face"));
 const Global_1 = require("./styles/Global");
+const AnimFilter_1 = __importDefault(require("./styles/AnimFilter"));
 const Ribbon = (props) => {
     let { anim1Specs, anim2Specs, width = 5, height = 5, depth = 5, faces, global = {}, custom = {}, tranz = (+height / 2) | 0, perspective, perspectiveOrigin, zIndex } = props;
     const buildFace = (faceType) => {
         return react_1.default.createElement(Face_1.default, { width: width, height: height, depth: depth, faceType: faceType, id: faceType, tranz: tranz, global: global, custom: custom });
     };
     return (react_1.default.createElement(Scene_1.SceneStyle, { width: width, height: height, perspective: perspective, perspectiveOrigin: perspectiveOrigin, zIndex: zIndex },
-        react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim1Specs },
-            react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim2Specs },
-                react_1.default.createElement(Global_1.ObjWrapper, null,
-                    !!faces && !!faces.bottom ? buildFace('bottom') : null,
-                    !!faces && !!faces.back ? buildFace('back') : null,
-                    !!faces && !!faces.top ? buildFace('topr') : null)))));
+        react_1.default.createElement(AnimFilter_1.default, { anim1Specs: anim1Specs, anim2Specs: anim2Specs },
+            react_1.default.createElement(Global_1.ObjWrapper, null,
+                !!faces && !!faces.bottom ? buildFace('bottom') : null,
+                !!faces && !!faces.back ? buildFace('back') : null,
+                !!faces && !!faces.top ? buildFace('topr') : null))));
 };
 exports.Ribbon = Ribbon;
 //# sourceMappingURL=Ribbon.js.map

package/dist/cjs/components/Ribbon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Ribbon.js","sourceRoot":"","sources":["../../../src/components/Ribbon.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,gDAA6C;AAC7C,0CAA4C;AAE5C,wDAAgC;AAChC,4CAA6C;AAEtC,MAAM,MAAM,GAAG,CAAC,KAAe,EAAO,EAAE;IAC3C,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE7K,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,8BAAC,cAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAChJ,CAAC,CAAC;IAEF,OAAO,CACH,8BAAC,kBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU;YAC3B,8BAAC,mBAAQ,IAAC,SAAS,EAAE,UAAU;gBAC3B,8BAAC,mBAAU;oBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI;oBACtD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;oBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CACzC,CACN,CACJ,CACF,CAChB,CAAC;AACN,CAAC,CAAC;AApBW,QAAA,MAAM,UAoBjB"}
+{"version":3,"file":"Ribbon.js","sourceRoot":"","sources":["../../../src/components/Ribbon.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,0CAA4C;AAE5C,wDAAgC;AAChC,4CAA6C;AAC7C,qEAA6C;AAEtC,MAAM,MAAM,GAAG,CAAC,KAAe,EAAO,EAAE;IAC3C,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE7K,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,8BAAC,cAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAChJ,CAAC,CAAC;IAEF,OAAO,CACH,8BAAC,kBAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,8BAAC,oBAAU,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU;YACtD,8BAAC,mBAAU;gBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI;gBACtD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;gBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CACzC,CACJ,CACJ,CAChB,CAAC;AACN,CAAC,CAAC;AAlBW,QAAA,MAAM,UAkBjB"}

package/dist/cjs/components/styles/AnimFilter.d.ts

@@ -0,0 +1,7 @@
+interface AnimFilterProps {
+    anim1Specs?: any;
+    anim2Specs?: any;
+    children: any;
+}
+export default function AnimFilter(props: AnimFilterProps): JSX.Element;
+export {};

package/dist/cjs/components/styles/AnimFilter.js

@@ -0,0 +1,14 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const AnimWrap_1 = require("./AnimWrap");
+function AnimFilter(props) {
+    const { anim1Specs = false, anim2Specs = false, children = '' } = props;
+    return anim1Specs && anim2Specs ? (react_1.default.createElement(AnimWrap_1.AnimWrap, { animSpecs: anim1Specs },
+        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));
+}
+exports.default = AnimFilter;
+//# sourceMappingURL=AnimFilter.js.map

package/dist/cjs/components/styles/AnimFilter.js.map

@@ -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"}

package/dist/esm/components/Card.js

@@ -1,18 +1,17 @@
 import React from 'react';
-import { AnimWrap } from './styles/AnimWrap';
 import { SceneStyle } from './styles/Scene';
 import Face from './Faces/Face';
 import { ObjWrapper } from './styles/Global';
+import AnimFilter from './styles/AnimFilter';
 export const Card = (props) => {
     let { anim1Specs, anim2Specs, width = 5, height = 5, faces, global = {}, custom = {}, tranz = (+height / 2) | 0, perspective, perspectiveOrigin, zIndex } = props;
     const buildFace = (faceType) => {
         return React.createElement(Face, { width: width, height: height, depth: 0.1, faceType: faceType, id: faceType, tranz: tranz, global: global, custom: custom });
     };
     return (React.createElement(SceneStyle, { width: width, height: height, perspective: perspective, perspectiveOrigin: perspectiveOrigin, zIndex: zIndex },
-        React.createElement(AnimWrap, { animSpecs: anim1Specs },
-            React.createElement(AnimWrap, { animSpecs: anim2Specs },
-                React.createElement(ObjWrapper, null,
-                    !!faces && !!faces.front ? buildFace('front') : null,
-                    !!faces && !!faces.back ? buildFace('back') : null)))));
+        React.createElement(AnimFilter, { anim1Specs: anim1Specs, anim2Specs: anim2Specs },
+            React.createElement(ObjWrapper, null,
+                !!faces && !!faces.front ? buildFace('front') : null,
+                !!faces && !!faces.back ? buildFace('back') : null))));
 };
 //# sourceMappingURL=Card.js.map

package/dist/esm/components/Card.js.map

@@ -1 +1 @@
-{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,OAAO,IAAI,MAAM,cAAc,CAAC;AAChC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,KAAe,EAAO,EAAE;IACzC,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAElK,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAC9I,CAAC,CAAC;IAEF,OAAO,CACH,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU;YAC3B,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU;gBAC3B,oBAAC,UAAU;oBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;oBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAC1C,CACN,CACJ,CACF,CAChB,CAAC;AACN,CAAC,CAAC"}
+{"version":3,"file":"Card.js","sourceRoot":"","sources":["../../../src/components/Card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,OAAO,IAAI,MAAM,cAAc,CAAC;AAChC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,UAAU,MAAM,qBAAqB,CAAC;AAE7C,MAAM,CAAC,MAAM,IAAI,GAAG,CAAC,KAAe,EAAO,EAAE;IACzC,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAElK,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAC9I,CAAC,CAAC;IAEF,OAAO,CACH,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,oBAAC,UAAU,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU;YACtD,oBAAC,UAAU;gBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;gBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CAC1C,CACJ,CACJ,CAChB,CAAC;AACN,CAAC,CAAC"}

package/dist/esm/components/Cuboid.js

@@ -1,22 +1,21 @@
 import React from 'react';
-import { AnimWrap } from './styles/AnimWrap';
 import { SceneStyle } from './styles/Scene';
 import Face from './Faces/Face';
 import { ObjWrapper } from './styles/Global';
+import AnimFilter from './styles/AnimFilter';
 export const Cuboid = (props) => {
     let { anim1Specs, anim2Specs, width = 5, height = 5, depth = 5, faces, global = {}, custom = {}, tranz = (+height / 2) | 0, perspective, perspectiveOrigin, zIndex } = props;
     const buildFace = (faceType) => {
         return React.createElement(Face, { width: width, height: height, depth: depth, faceType: faceType, id: faceType, tranz: tranz, global: global, custom: custom });
     };
     return (React.createElement(SceneStyle, { width: width, height: height, perspective: perspective, perspectiveOrigin: perspectiveOrigin, zIndex: zIndex },
-        React.createElement(AnimWrap, { animSpecs: anim1Specs },
-            React.createElement(AnimWrap, { animSpecs: anim2Specs },
-                React.createElement(ObjWrapper, null,
-                    !!faces && !!faces.front ? buildFace('front') : null,
-                    !!faces && !!faces.right ? buildFace('right') : null,
-                    !!faces && !!faces.back ? buildFace('back') : null,
-                    !!faces && !!faces.left ? buildFace('left') : null,
-                    !!faces && !!faces.top ? buildFace('top') : null,
-                    !!faces && !!faces.bottom ? buildFace('bottom') : null)))));
+        React.createElement(AnimFilter, { anim1Specs: anim1Specs, anim2Specs: anim2Specs },
+            React.createElement(ObjWrapper, null,
+                !!faces && !!faces.front ? buildFace('front') : null,
+                !!faces && !!faces.right ? buildFace('right') : null,
+                !!faces && !!faces.back ? buildFace('back') : null,
+                !!faces && !!faces.left ? buildFace('left') : null,
+                !!faces && !!faces.top ? buildFace('top') : null,
+                !!faces && !!faces.bottom ? buildFace('bottom') : null))));
 };
 //# sourceMappingURL=Cuboid.js.map

package/dist/esm/components/Cuboid.js.map

@@ -1 +1 @@
-{"version":3,"file":"Cuboid.js","sourceRoot":"","sources":["../../../src/components/Cuboid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,OAAO,IAAI,MAAM,cAAc,CAAC;AAChC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAe,EAAO,EAAE;IAC3C,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE7K,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAChJ,CAAC,CAAC;IAEF,OAAO,CACH,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU;YAC3B,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU;gBAC3B,oBAAC,UAAU;oBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;oBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;oBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;oBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;oBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;oBAChD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAC9C,CACN,CACJ,CACF,CAChB,CAAC;AACN,CAAC,CAAC"}
+{"version":3,"file":"Cuboid.js","sourceRoot":"","sources":["../../../src/components/Cuboid.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,OAAO,IAAI,MAAM,cAAc,CAAC;AAChC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,UAAU,MAAM,qBAAqB,CAAC;AAE7C,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAe,EAAO,EAAE;IAC3C,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE7K,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAChJ,CAAC,CAAC;IAEF,OAAO,CACH,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,oBAAC,UAAU,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU;YACtD,oBAAC,UAAU;gBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;gBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,IAAI;gBACpD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;gBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;gBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI;gBAChD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAC9C,CACJ,CACJ,CAChB,CAAC;AACN,CAAC,CAAC"}

package/dist/esm/components/Ribbon.js

@@ -1,19 +1,18 @@
 import React from 'react';
-import { AnimWrap } from './styles/AnimWrap';
 import { SceneStyle } from './styles/Scene';
 import Face from './Faces/Face';
 import { ObjWrapper } from './styles/Global';
+import AnimFilter from './styles/AnimFilter';
 export const Ribbon = (props) => {
     let { anim1Specs, anim2Specs, width = 5, height = 5, depth = 5, faces, global = {}, custom = {}, tranz = (+height / 2) | 0, perspective, perspectiveOrigin, zIndex } = props;
     const buildFace = (faceType) => {
         return React.createElement(Face, { width: width, height: height, depth: depth, faceType: faceType, id: faceType, tranz: tranz, global: global, custom: custom });
     };
     return (React.createElement(SceneStyle, { width: width, height: height, perspective: perspective, perspectiveOrigin: perspectiveOrigin, zIndex: zIndex },
-        React.createElement(AnimWrap, { animSpecs: anim1Specs },
-            React.createElement(AnimWrap, { animSpecs: anim2Specs },
-                React.createElement(ObjWrapper, null,
-                    !!faces && !!faces.bottom ? buildFace('bottom') : null,
-                    !!faces && !!faces.back ? buildFace('back') : null,
-                    !!faces && !!faces.top ? buildFace('topr') : null)))));
+        React.createElement(AnimFilter, { anim1Specs: anim1Specs, anim2Specs: anim2Specs },
+            React.createElement(ObjWrapper, null,
+                !!faces && !!faces.bottom ? buildFace('bottom') : null,
+                !!faces && !!faces.back ? buildFace('back') : null,
+                !!faces && !!faces.top ? buildFace('topr') : null))));
 };
 //# sourceMappingURL=Ribbon.js.map

package/dist/esm/components/Ribbon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Ribbon.js","sourceRoot":"","sources":["../../../src/components/Ribbon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,OAAO,IAAI,MAAM,cAAc,CAAC;AAChC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAE7C,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAe,EAAO,EAAE;IAC3C,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE7K,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAChJ,CAAC,CAAC;IAEF,OAAO,CACH,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU;YAC3B,oBAAC,QAAQ,IAAC,SAAS,EAAE,UAAU;gBAC3B,oBAAC,UAAU;oBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI;oBACtD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;oBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CACzC,CACN,CACJ,CACF,CAChB,CAAC;AACN,CAAC,CAAC"}
+{"version":3,"file":"Ribbon.js","sourceRoot":"","sources":["../../../src/components/Ribbon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,OAAO,IAAI,MAAM,cAAc,CAAC;AAChC,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,UAAU,MAAM,qBAAqB,CAAC;AAE7C,MAAM,CAAC,MAAM,MAAM,GAAG,CAAC,KAAe,EAAO,EAAE;IAC3C,IAAI,EAAE,UAAU,EAAE,UAAU,EAAE,KAAK,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,KAAK,EAAE,MAAM,GAAG,EAAE,EAAE,MAAM,GAAG,EAAE,EAAE,KAAK,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAE7K,MAAM,SAAS,GAAG,CAAC,QAAa,EAAO,EAAE;QACrC,OAAO,oBAAC,IAAI,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAI,CAAC;IAChJ,CAAC,CAAC;IAEF,OAAO,CACH,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,WAAW,EAAE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,EAAE,MAAM;QACpH,oBAAC,UAAU,IAAC,UAAU,EAAE,UAAU,EAAE,UAAU,EAAE,UAAU;YACtD,oBAAC,UAAU;gBACN,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI;gBACtD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI;gBAClD,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,IAAI,CACzC,CACJ,CACJ,CAChB,CAAC;AACN,CAAC,CAAC"}

package/dist/esm/components/styles/AnimFilter.d.ts

@@ -0,0 +1,7 @@
+interface AnimFilterProps {
+    anim1Specs?: any;
+    anim2Specs?: any;
+    children: any;
+}
+export default function AnimFilter(props: AnimFilterProps): JSX.Element;
+export {};

package/dist/esm/components/styles/AnimFilter.js

@@ -0,0 +1,8 @@
+import React from 'react';
+import { AnimWrap } from './AnimWrap';
+export default function AnimFilter(props) {
+    const { anim1Specs = false, anim2Specs = false, children = '' } = props;
+    return anim1Specs && anim2Specs ? (React.createElement(AnimWrap, { animSpecs: anim1Specs },
+        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));
+}
+//# sourceMappingURL=AnimFilter.js.map

package/dist/esm/components/styles/AnimFilter.js.map

@@ -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"}

package/package.json

@@ -5,7 +5,7 @@
         "url": "https://github.com/mdnelles/anim-3d-objs",
         "homepage": "https://github.com/mdnelles/anim-3d-objs/blob/main/README.md"
     },
-    "version": "1.1.30",
+    "version": "1.1.33",
     "description": "A component library for getting people started with easy to re-use components for everyday projects.",
     "main": "dist/cjs/index.js",
     "module": "dist/esm/index.js",