@onepercentio/one-ui 0.6.4 → 0.6.7
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/dist/components/AdaptiveSidebar/AdaptiveSidebar.module.scss +1 -0
- package/dist/components/AnimatedEntrance/AnimatedEntrance.js +7 -5
- package/dist/components/AnimatedEntrance/AnimatedEntrance.js.map +1 -1
- package/dist/components/Avatar/Avatar.js +1 -1
- package/dist/components/Avatar/Avatar.js.map +1 -1
- package/dist/components/Avatar/Avatar.module.scss +17 -14
- package/dist/components/Background/Background.d.ts +7 -0
- package/dist/components/Background/Background.js +58 -0
- package/dist/components/Background/Background.js.map +1 -0
- package/dist/components/Background/Background.module.scss +106 -0
- package/dist/components/Background/Background.stories.d.ts +7 -0
- package/dist/components/Background/Background.stories.js +30 -0
- package/dist/components/Background/Background.stories.js.map +1 -0
- package/dist/components/Background/ground-tile.svg +9 -0
- package/dist/components/Background/index.d.ts +1 -0
- package/dist/components/Background/index.js +9 -0
- package/dist/components/Background/index.js.map +1 -0
- package/dist/components/MutableHamburgerButton/MutableHamburgerButton.module.scss +13 -10
- package/dist/components/MutableHamburgerButton/MutableHamburgerButton.stories.js +1 -1
- package/dist/components/MutableHamburgerButton/MutableHamburgerButton.stories.js.map +1 -1
- package/dist/components/Transition/Transition.js +86 -58
- package/dist/components/Transition/Transition.js.map +1 -1
- package/dist/components/UncontrolledTransition/UncontrolledTransition.js +8 -3
- package/dist/components/UncontrolledTransition/UncontrolledTransition.js.map +1 -1
- package/package.json +3 -4
- package/scripts/start-emulator.js +0 -0
|
@@ -61,15 +61,17 @@ const CONFIGS_BY_ENTRANCE_TYPE = {
|
|
|
61
61
|
function AnimatedEntranceItem({ children, noEntranceAnimation, onRemoveChildren, entranceType, }) {
|
|
62
62
|
const uncontRef = (0, react_1.useRef)(null);
|
|
63
63
|
const [screen, setScreen] = (0, react_1.useState)(noEntranceAnimation ? children : react_1.default.createElement(react_1.Fragment, { key: "null" }));
|
|
64
|
-
(0, react_1.
|
|
64
|
+
(0, react_1.useLayoutEffect)(() => {
|
|
65
65
|
if (String(children.key).includes("-nullated")) {
|
|
66
66
|
uncontRef.current.setOrientation("backward");
|
|
67
67
|
}
|
|
68
|
-
|
|
68
|
+
}, [children.key]);
|
|
69
|
+
(0, react_1.useEffect)(() => {
|
|
70
|
+
setScreen(String(children.key));
|
|
69
71
|
}, [children.key]);
|
|
70
72
|
(0, react_1.useEffect)(() => {
|
|
71
73
|
const x = setTimeout(() => {
|
|
72
|
-
const key = String(screen.key);
|
|
74
|
+
const key = String(typeof screen === "string" ? screen : screen.key);
|
|
73
75
|
if (key === "null" || key.includes("-nullated"))
|
|
74
76
|
uncontRef.current.sectionRef.current.style.maxHeight = `0px`;
|
|
75
77
|
else {
|
|
@@ -87,7 +89,7 @@ function AnimatedEntranceItem({ children, noEntranceAnimation, onRemoveChildren,
|
|
|
87
89
|
return (react_1.default.createElement(UncontrolledTransition_1.default, { ref: uncontRef, transitionType: Transition_1.TransitionAnimationTypes.CUSTOM, className: `${AnimatedEntrance_module_scss_1.default.resetHeight} ${className}`, lockTransitionWidth: true, key: String(children.key).replace("-nullated", ""), onDiscardStep: (k) => {
|
|
88
90
|
if (k !== "null")
|
|
89
91
|
onRemoveChildren(k);
|
|
90
|
-
}, config: CONFIGS_BY_ENTRANCE_TYPE[entranceType] }, screen));
|
|
92
|
+
}, config: CONFIGS_BY_ENTRANCE_TYPE[entranceType] }, typeof screen === "string" ? children : screen));
|
|
91
93
|
}
|
|
92
94
|
exports.AnimatedEntranceItem = AnimatedEntranceItem;
|
|
93
95
|
/**
|
|
@@ -120,7 +122,7 @@ function AnimatedEntrance({ children, entranceType = EntranceType.SLIDE_AND_EXPA
|
|
|
120
122
|
return filteredOutChildren;
|
|
121
123
|
}, [children]);
|
|
122
124
|
prevChildren.current = childrenDelayed;
|
|
123
|
-
return (react_1.default.createElement(react_1.default.Fragment, null, childrenDelayed.map((child) => (react_1.default.createElement(AnimatedEntranceItem, { key: String(child.key).replace("-nullated", ""), noEntranceAnimation: firstRef.current, entranceType: entranceType, onRemoveChildren: (k) => (prevChildren.current = prevChildren.current.filter((a) => a.key !== String(k) + "-nullated")) }, child)))));
|
|
125
|
+
return (react_1.default.createElement(react_1.default.Fragment, null, childrenDelayed.map((child) => (react_1.default.createElement(AnimatedEntranceItem, { key: String(child.key).replace("-nullated", ""), noEntranceAnimation: firstRef.current, entranceType: entranceType, onRemoveChildren: (k) => (prevChildren.current = prevChildren.current.filter((a) => a.key !== String(k) + "-nullated")) }, children.find((c) => c.key === child.key) || child)))));
|
|
124
126
|
}
|
|
125
127
|
exports.default = AnimatedEntrance;
|
|
126
128
|
//# sourceMappingURL=AnimatedEntrance.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnimatedEntrance.js","sourceRoot":"","sources":["../../../src/components/AnimatedEntrance/AnimatedEntrance.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+
|
|
1
|
+
{"version":3,"file":"AnimatedEntrance.js","sourceRoot":"","sources":["../../../src/components/AnimatedEntrance/AnimatedEntrance.tsx"],"names":[],"mappings":"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"}
|
|
@@ -39,7 +39,7 @@ function Avatar({ name, imgSrc, size = 48, }) {
|
|
|
39
39
|
const [firstName, lastName] = [nameParts[0], nameParts.slice(-1)[0]];
|
|
40
40
|
return `${firstName.charAt(0)}${lastName.charAt(0)}`.toUpperCase();
|
|
41
41
|
}, [name]);
|
|
42
|
-
return (react_1.default.createElement("div", { className: Avatar_module_scss_1.default.container
|
|
42
|
+
return (react_1.default.createElement("div", { className: `${Avatar_module_scss_1.default.container} ${imgSrc ? "" : Avatar_module_scss_1.default.noImg}`, style: { fontSize: size }, title: name }, imgSrc ? react_1.default.createElement("img", { src: imgSrc, alt: name }) : react_1.default.createElement("span", null, initials)));
|
|
43
43
|
}
|
|
44
44
|
exports.default = Avatar;
|
|
45
45
|
//# sourceMappingURL=Avatar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAuC;AACvC,8EAA0C;AAE1C;;IAEI;AACJ,SAAwB,MAAM,CAAC,EAC7B,IAAI,EACJ,MAAM,EACN,IAAI,GAAG,EAAE,GAKV;IACC,MAAM,QAAQ,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC5B,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACzC,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO,SAAS,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QACxE,MAAM,CAAC,SAAS,EAAE,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACrE,OAAO,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,WAAW,EAAE,CAAC;IACrE,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IACX,OAAO,CACL,
|
|
1
|
+
{"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/components/Avatar/Avatar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAuC;AACvC,8EAA0C;AAE1C;;IAEI;AACJ,SAAwB,MAAM,CAAC,EAC7B,IAAI,EACJ,MAAM,EACN,IAAI,GAAG,EAAE,GAKV;IACC,MAAM,QAAQ,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC5B,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACzC,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO,SAAS,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC;QACxE,MAAM,CAAC,SAAS,EAAE,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACrE,OAAO,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,WAAW,EAAE,CAAC;IACrE,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IACX,OAAO,CACL,uCACE,SAAS,EAAE,GAAG,4BAAM,CAAC,SAAS,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,4BAAM,CAAC,KAAK,EAAE,EAC9D,KAAK,EAAE,EAAE,QAAQ,EAAE,IAAI,EAAE,EACzB,KAAK,EAAE,IAAI,IAEV,MAAM,CAAC,CAAC,CAAC,uCAAK,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,IAAI,GAAI,CAAC,CAAC,CAAC,4CAAO,QAAQ,CAAQ,CAC/D,CACP,CAAC;AACJ,CAAC;AAxBD,yBAwBC"}
|
|
@@ -1,19 +1,22 @@
|
|
|
1
1
|
@import "../../assets/styles/index.scss";
|
|
2
2
|
|
|
3
3
|
.container {
|
|
4
|
+
&.noImg {
|
|
4
5
|
background-color: $avatarBackgroundColor;
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
}
|
|
7
|
+
display: inline-block;
|
|
8
|
+
width: 1em;
|
|
9
|
+
height: 1em;
|
|
10
|
+
border-radius: 0.5em;
|
|
9
11
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
}
|
|
12
|
+
> span,
|
|
13
|
+
> img {
|
|
14
|
+
font-size: 0.4em;
|
|
15
|
+
width: inherit;
|
|
16
|
+
height: inherit;
|
|
17
|
+
text-align: center;
|
|
18
|
+
line-height: 2.5em;
|
|
19
|
+
display: block;
|
|
20
|
+
color: $digitalBlue;
|
|
21
|
+
}
|
|
22
|
+
}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
|
3
|
+
if (k2 === undefined) k2 = k;
|
|
4
|
+
var desc = Object.getOwnPropertyDescriptor(m, k);
|
|
5
|
+
if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
|
|
6
|
+
desc = { enumerable: true, get: function() { return m[k]; } };
|
|
7
|
+
}
|
|
8
|
+
Object.defineProperty(o, k2, desc);
|
|
9
|
+
}) : (function(o, m, k, k2) {
|
|
10
|
+
if (k2 === undefined) k2 = k;
|
|
11
|
+
o[k2] = m[k];
|
|
12
|
+
}));
|
|
13
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
|
14
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
|
15
|
+
}) : function(o, v) {
|
|
16
|
+
o["default"] = v;
|
|
17
|
+
});
|
|
18
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
|
19
|
+
if (mod && mod.__esModule) return mod;
|
|
20
|
+
var result = {};
|
|
21
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
|
22
|
+
__setModuleDefault(result, mod);
|
|
23
|
+
return result;
|
|
24
|
+
};
|
|
25
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
26
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
27
|
+
};
|
|
28
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
29
|
+
const react_1 = __importStar(require("react"));
|
|
30
|
+
const Background_module_scss_1 = __importDefault(require("./Background.module.scss"));
|
|
31
|
+
const throttle_1 = __importDefault(require("lodash/throttle"));
|
|
32
|
+
/**
|
|
33
|
+
* An animated background that represents a 3d environment and places the user into a cenario
|
|
34
|
+
**/
|
|
35
|
+
function Background({ pointTo = "north", color, }) {
|
|
36
|
+
const base = (0, react_1.useRef)(null);
|
|
37
|
+
(0, react_1.useEffect)(() => {
|
|
38
|
+
const func = (0, throttle_1.default)((e) => {
|
|
39
|
+
const razao = document.body.clientWidth / document.body.clientHeight;
|
|
40
|
+
const baseX = 1;
|
|
41
|
+
const baseY = baseX * razao;
|
|
42
|
+
const percentX = (e.x * 100) / document.body.clientWidth / 100;
|
|
43
|
+
const percentY = (e.y * 100) / document.body.clientHeight / 100;
|
|
44
|
+
const perspectiveOffsetX = baseX * percentX - baseX / 2;
|
|
45
|
+
const perspectiveOffsetY = baseY * percentY - baseY / 2;
|
|
46
|
+
base.current.style.perspectiveOrigin = `${50 - perspectiveOffsetX}% ${40 - perspectiveOffsetY}%`;
|
|
47
|
+
}, 1000 / 15);
|
|
48
|
+
window.addEventListener("mousemove", func);
|
|
49
|
+
return () => {
|
|
50
|
+
window.removeEventListener("mousemove", func);
|
|
51
|
+
};
|
|
52
|
+
}, []);
|
|
53
|
+
return (react_1.default.createElement("div", { ref: base, style: { "--halo": color }, className: `${Background_module_scss_1.default.background} ${Background_module_scss_1.default[pointTo]}` },
|
|
54
|
+
react_1.default.createElement("div", { className: Background_module_scss_1.default.ground }),
|
|
55
|
+
react_1.default.createElement("div", { className: Background_module_scss_1.default.overlay })));
|
|
56
|
+
}
|
|
57
|
+
exports.default = Background;
|
|
58
|
+
//# sourceMappingURL=Background.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Background.js","sourceRoot":"","sources":["../../../src/components/Background/Background.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAiD;AACjD,sFAA8C;AAC9C,+DAAuC;AAEvC;;IAEI;AACJ,SAAwB,UAAU,CAAC,EACjC,OAAO,GAAG,OAAO,EACjB,KAAK,GAIN;IACC,MAAM,IAAI,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAC1C,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,IAAI,GAAG,IAAA,kBAAQ,EAAC,CAAC,CAAa,EAAE,EAAE;YACtC,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,GAAG,QAAQ,CAAC,IAAI,CAAC,YAAY,CAAC;YACrE,MAAM,KAAK,GAAG,CAAC,CAAC;YAChB,MAAM,KAAK,GAAG,KAAK,GAAG,KAAK,CAAC;YAC5B,MAAM,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,WAAW,GAAG,GAAG,CAAC;YAC/D,MAAM,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,YAAY,GAAG,GAAG,CAAC;YAChE,MAAM,kBAAkB,GAAG,KAAK,GAAG,QAAQ,GAAG,KAAK,GAAG,CAAC,CAAC;YACxD,MAAM,kBAAkB,GAAG,KAAK,GAAG,QAAQ,GAAG,KAAK,GAAG,CAAC,CAAC;YACxD,IAAI,CAAC,OAAQ,CAAC,KAAK,CAAC,iBAAiB,GAAG,GAAG,EAAE,GAAG,kBAAkB,KAChE,EAAE,GAAG,kBACP,GAAG,CAAC;QACN,CAAC,EAAE,IAAI,GAAG,EAAE,CAAC,CAAC;QACd,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;QAC3C,OAAO,GAAG,EAAE;YACV,MAAM,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,CAAC;QAChD,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IACP,OAAO,CACL,uCACE,GAAG,EAAE,IAAI,EACT,KAAK,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAS,EACjC,SAAS,EAAE,GAAG,gCAAM,CAAC,UAAU,IAAI,gCAAM,CAAC,OAAO,CAAC,EAAE;QAEpD,uCAAK,SAAS,EAAE,gCAAM,CAAC,MAAM,GAAI;QACjC,uCAAK,SAAS,EAAE,gCAAM,CAAC,OAAO,GAAI,CAC9B,CACP,CAAC;AACJ,CAAC;AApCD,6BAoCC"}
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
$renderResolutionWidth: 50vw;
|
|
2
|
+
$renderResolutionHeight: 50vh;
|
|
3
|
+
$blockSize: $renderResolutionWidth * 0.1;
|
|
4
|
+
|
|
5
|
+
* {
|
|
6
|
+
-webkit-font-smoothing: subpixel-antialiased;
|
|
7
|
+
outline: 1px solid transparent;
|
|
8
|
+
--primary-color: blue;
|
|
9
|
+
}
|
|
10
|
+
|
|
11
|
+
.overlay {
|
|
12
|
+
position: absolute;
|
|
13
|
+
height: $renderResolutionHeight / 10;
|
|
14
|
+
width: $renderResolutionWidth / 10;
|
|
15
|
+
transform: scale(10);
|
|
16
|
+
background: radial-gradient(
|
|
17
|
+
circle at 50% -100%,
|
|
18
|
+
rgba(33, 0, 59, 0.5),
|
|
19
|
+
rgba(33, 0, 59, 0.5) 40%,
|
|
20
|
+
rgba(66, 35, 91, 0.5) 65%,
|
|
21
|
+
#0000 80%
|
|
22
|
+
);
|
|
23
|
+
background-repeat: no-repeat;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.background {
|
|
27
|
+
overflow: hidden;
|
|
28
|
+
image-rendering: 10px 10px;
|
|
29
|
+
background-color: black;
|
|
30
|
+
image-rendering: optimizeSpeed;
|
|
31
|
+
background-repeat: no-repeat;
|
|
32
|
+
background-size: $renderResolutionWidth $renderResolutionHeight * 0.5;
|
|
33
|
+
width: $renderResolutionWidth;
|
|
34
|
+
height: $renderResolutionHeight;
|
|
35
|
+
perspective: $renderResolutionWidth * 0.9;
|
|
36
|
+
perspective-origin: 50% 40%;
|
|
37
|
+
position: absolute;
|
|
38
|
+
display: flex;
|
|
39
|
+
justify-content: center;
|
|
40
|
+
align-items: center;
|
|
41
|
+
z-index: -1;
|
|
42
|
+
transition: perspective-origin;
|
|
43
|
+
transition-duration: var(--animation-speed-transition);
|
|
44
|
+
top: 50vh - $renderResolutionHeight / 2;
|
|
45
|
+
left: 50vw - $renderResolutionWidth / 2;
|
|
46
|
+
transform: scale(100vw / $renderResolutionWidth);
|
|
47
|
+
|
|
48
|
+
& .ground {
|
|
49
|
+
transform: rotateX(90deg) translateY(50%) translateZ(-75px) rotateZ(0deg);
|
|
50
|
+
}
|
|
51
|
+
&.north .ground {
|
|
52
|
+
transform: rotateX(90deg) translateY(50%) translateZ(-75px) rotateZ(0deg)
|
|
53
|
+
rotateZ(0deg);
|
|
54
|
+
}
|
|
55
|
+
&.south .ground {
|
|
56
|
+
transform: rotateX(90deg) translateY(50%) translateZ(-75px) rotateZ(0deg)
|
|
57
|
+
rotateZ(180deg);
|
|
58
|
+
}
|
|
59
|
+
&.east .ground {
|
|
60
|
+
transform: rotateX(90deg) translateY(50%) translateZ(-75px) rotateZ(0deg)
|
|
61
|
+
rotateZ(90deg);
|
|
62
|
+
}
|
|
63
|
+
&.west .ground {
|
|
64
|
+
transform: rotateX(90deg) translateY(50%) translateZ(-75px) rotateZ(0deg)
|
|
65
|
+
rotateZ(270deg);
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
$tileSize: $renderResolutionHeight * 0.075 * 1.5;
|
|
70
|
+
.ground {
|
|
71
|
+
width: $renderResolutionWidth * 3 * (100vw / $renderResolutionWidth);
|
|
72
|
+
height: $renderResolutionWidth * 3 * (100vw / $renderResolutionWidth);
|
|
73
|
+
transition: transform var(--animation-speed-transition) var(--animation-timing-transition);
|
|
74
|
+
&::before {
|
|
75
|
+
backface-visibility: hidden;
|
|
76
|
+
content: "";
|
|
77
|
+
position: absolute;
|
|
78
|
+
width: $renderResolutionWidth * 3 * (100vw / $renderResolutionWidth);
|
|
79
|
+
height: $renderResolutionWidth * 3 * (100vw / $renderResolutionWidth);
|
|
80
|
+
border-radius: 50%;
|
|
81
|
+
background: url(./ground-tile.svg);
|
|
82
|
+
background-size: $tileSize $tileSize;
|
|
83
|
+
background-position: -18px 30px;
|
|
84
|
+
}
|
|
85
|
+
|
|
86
|
+
position: absolute;
|
|
87
|
+
display: flex;
|
|
88
|
+
align-items: center;
|
|
89
|
+
justify-content: center;
|
|
90
|
+
|
|
91
|
+
&::after {
|
|
92
|
+
content: "";
|
|
93
|
+
width: $renderResolutionWidth * 3;
|
|
94
|
+
height: $renderResolutionWidth * 3;
|
|
95
|
+
transform: scale(4);
|
|
96
|
+
background: radial-gradient(
|
|
97
|
+
transparent 20%,
|
|
98
|
+
rgba(33, 0, 59, 1) 40%,
|
|
99
|
+
rgba(33, 0, 59, 0.6) 59%,
|
|
100
|
+
#0009 70%
|
|
101
|
+
);
|
|
102
|
+
// background-color: red;
|
|
103
|
+
border-radius: 50%;
|
|
104
|
+
position: absolute;
|
|
105
|
+
}
|
|
106
|
+
}
|
|
@@ -0,0 +1,30 @@
|
|
|
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
|
+
exports.InitialImplementation = void 0;
|
|
7
|
+
const react_1 = __importDefault(require("react"));
|
|
8
|
+
const OneUIProvider_1 = __importDefault(require("../../context/OneUIProvider"));
|
|
9
|
+
const Loader_1 = __importDefault(require("../Loader"));
|
|
10
|
+
const Background_1 = __importDefault(require("./Background"));
|
|
11
|
+
exports.default = {
|
|
12
|
+
component: Background_1.default,
|
|
13
|
+
title: "Sky",
|
|
14
|
+
};
|
|
15
|
+
const InitialImplementation = (args) => (react_1.default.createElement(OneUIProvider_1.default, { config: {
|
|
16
|
+
component: {
|
|
17
|
+
asyncWrapper: {
|
|
18
|
+
LoadingComponent: () => react_1.default.createElement(Loader_1.default, null),
|
|
19
|
+
messages: {
|
|
20
|
+
error: {
|
|
21
|
+
title: "Exemplo de error",
|
|
22
|
+
retryBtn: "Tentar novamente",
|
|
23
|
+
},
|
|
24
|
+
},
|
|
25
|
+
},
|
|
26
|
+
},
|
|
27
|
+
} },
|
|
28
|
+
react_1.default.createElement(Background_1.default, Object.assign({}, args))));
|
|
29
|
+
exports.InitialImplementation = InitialImplementation;
|
|
30
|
+
//# sourceMappingURL=Background.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Background.stories.js","sourceRoot":"","sources":["../../../src/components/Background/Background.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,gFAAwD;AACxD,uDAA+B;AAC/B,8DAAwC;AAExC,kBAAe;IACb,SAAS,EAAE,oBAAY;IACvB,KAAK,EAAE,KAAK;CACb,CAAC;AAEK,MAAM,qBAAqB,GAAG,CAAC,IAAS,EAAE,EAAE,CAAC,CAClD,8BAAC,uBAAa,IACZ,MAAM,EAAE;QACN,SAAS,EAAE;YACT,YAAY,EAAE;gBACZ,gBAAgB,EAAE,GAAG,EAAE,CAAC,8BAAC,gBAAM,OAAG;gBAClC,QAAQ,EAAE;oBACR,KAAK,EAAE;wBACL,KAAK,EAAE,kBAAkB;wBACzB,QAAQ,EAAE,kBAAkB;qBAC7B;iBACF;aACF;SACF;KACF;IAED,8BAAC,oBAAY,oBAAK,IAAI,EAAI,CACZ,CACjB,CAAC;AAlBW,QAAA,qBAAqB,yBAkBhC"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
<svg viewBox="0 0 400 400" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="none">
|
|
2
|
+
|
|
3
|
+
<defs>
|
|
4
|
+
<filter id="blur">
|
|
5
|
+
<feGaussianBlur stdDeviation="1" />
|
|
6
|
+
</filter>
|
|
7
|
+
</defs>
|
|
8
|
+
<rect width="400" height="400" stroke-width="6" stroke="#d0b9fc" fill="#0000" />
|
|
9
|
+
</svg>
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './Background';
|
|
@@ -0,0 +1,9 @@
|
|
|
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
|
+
exports.default = void 0;
|
|
7
|
+
var Background_1 = require("./Background");
|
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Background_1).default; } });
|
|
9
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Background/index.tsx"],"names":[],"mappings":";;;;;;AAAA,2CAAuC;AAA9B,sHAAA,OAAO,OAAA"}
|
|
@@ -20,18 +20,20 @@ $slice: math.div(1, 7);
|
|
|
20
20
|
transform: scale(0.9);
|
|
21
21
|
}
|
|
22
22
|
> * {
|
|
23
|
+
position: relative;
|
|
23
24
|
flex-shrink: 0;
|
|
24
|
-
box-sizing:
|
|
25
|
+
box-sizing: border-box;
|
|
25
26
|
width: 0.8em;
|
|
26
27
|
height: #{$slice}em;
|
|
27
28
|
border-radius: #{math.div($slice, 2)}em;
|
|
28
29
|
transition: transform $veryFast, width $veryFast, height $veryFast,
|
|
29
30
|
border-width $veryFast, background-color $veryFast,
|
|
30
|
-
border-radius $veryFast;
|
|
31
|
+
border-radius $veryFast, top $veryFast;
|
|
31
32
|
background: var(--mutable-hamburger-background, $digitalBlue);
|
|
32
33
|
background-size: 1em 1em;
|
|
33
34
|
background-repeat: no-repeat;
|
|
34
35
|
border: 0em solid #0000;
|
|
36
|
+
top: 0px;
|
|
35
37
|
&:nth-child(1) {
|
|
36
38
|
border-top-color: var(--mutable-hamburger-background, $digitalBlue);
|
|
37
39
|
}
|
|
@@ -101,8 +103,8 @@ $slice: math.div(1, 7);
|
|
|
101
103
|
&.search {
|
|
102
104
|
> :nth-child(1) {
|
|
103
105
|
$rate: 1.8;
|
|
104
|
-
width: #{$slice * $rate}em;
|
|
105
|
-
height: #{$slice * $rate}em;
|
|
106
|
+
width: #{$slice * $rate + math.div($slice, 1.35)}em;
|
|
107
|
+
height: #{$slice * $rate + math.div($slice, 1.35)}em;
|
|
106
108
|
border-radius: #{$slice * $rate * 2}em;
|
|
107
109
|
background-color: transparent;
|
|
108
110
|
border: #{math.div($slice, 1.35)}em solid
|
|
@@ -115,7 +117,7 @@ $slice: math.div(1, 7);
|
|
|
115
117
|
width: 0.55em;
|
|
116
118
|
}
|
|
117
119
|
> :nth-child(3) {
|
|
118
|
-
transform: translateX(0.12em) translateY(-#{($slice * 1.3) + 0.
|
|
120
|
+
transform: translateX(0.12em) translateY(-#{($slice * 1.3) + 0.085}em)
|
|
119
121
|
rotateZ(45deg);
|
|
120
122
|
height: #{math.div($slice, 1.35)}em;
|
|
121
123
|
width: 0.55em;
|
|
@@ -158,19 +160,20 @@ $slice: math.div(1, 7);
|
|
|
158
160
|
animation-timing-function: linear;
|
|
159
161
|
> * {
|
|
160
162
|
background-color: #0000;
|
|
161
|
-
width: #{$slice *
|
|
162
|
-
height: #{$slice *
|
|
163
|
-
border-radius: #{$slice *
|
|
163
|
+
width: #{$slice * 4.5}em;
|
|
164
|
+
height: #{$slice * 4.5}em;
|
|
165
|
+
border-radius: #{$slice * 4.5}em;
|
|
164
166
|
border-width: #{$slice}em;
|
|
165
167
|
}
|
|
166
168
|
> :nth-child(1) {
|
|
167
|
-
|
|
169
|
+
top: (#{$slice * 4.5}em);
|
|
168
170
|
}
|
|
169
171
|
> :nth-child(2) {
|
|
170
172
|
transform: rotateZ(-5deg);
|
|
171
173
|
}
|
|
172
174
|
> :nth-child(3) {
|
|
173
|
-
transform:
|
|
175
|
+
transform: rotateZ(-95deg);
|
|
176
|
+
top: (-#{$slice * 4.5}em);
|
|
174
177
|
}
|
|
175
178
|
}
|
|
176
179
|
}
|
|
@@ -33,7 +33,7 @@ exports.default = {
|
|
|
33
33
|
component: MutableHamburgerButton_1.default,
|
|
34
34
|
title: "Mutable Hamburger Button",
|
|
35
35
|
};
|
|
36
|
-
const InitialImplementation = (args) => (react_1.default.createElement("div", { style: { backgroundColor: "#00f5", display: "inline-block" } },
|
|
36
|
+
const InitialImplementation = (args) => (react_1.default.createElement("div", { style: { transformOrigin: '0px 0px', transform: "scale(10)", backgroundColor: "#00f5", display: "inline-block" } },
|
|
37
37
|
react_1.default.createElement(MutableHamburgerButton_1.default, Object.assign({}, args))));
|
|
38
38
|
exports.InitialImplementation = InitialImplementation;
|
|
39
39
|
exports.InitialImplementation.args = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MutableHamburgerButton.stories.js","sourceRoot":"","sources":["../../../src/components/MutableHamburgerButton/MutableHamburgerButton.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAmE;AACnE,sFAA8D;AAE9D,kBAAe;IACb,SAAS,EAAE,gCAAsB;IACjC,KAAK,EAAE,0BAA0B;CAClC,CAAC;AAEK,MAAM,qBAAqB,GAAG,CAAC,IAAS,EAAE,EAAE,CAAC,CAClD,uCAAK,KAAK,EAAE,EAAC,eAAe,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAC;
|
|
1
|
+
{"version":3,"file":"MutableHamburgerButton.stories.js","sourceRoot":"","sources":["../../../src/components/MutableHamburgerButton/MutableHamburgerButton.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAmE;AACnE,sFAA8D;AAE9D,kBAAe;IACb,SAAS,EAAE,gCAAsB;IACjC,KAAK,EAAE,0BAA0B;CAClC,CAAC;AAEK,MAAM,qBAAqB,GAAG,CAAC,IAAS,EAAE,EAAE,CAAC,CAClD,uCAAK,KAAK,EAAE,EAAC,eAAe,EAAE,SAAS,EAAC,SAAS,EAAE,WAAW,EAAE,eAAe,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,EAAC;IAChH,8BAAC,gCAAsB,oBAAK,IAAI,EAAI,CAChC,CACP,CAAC;AAJW,QAAA,qBAAqB,yBAIhC;AACF,6BAAqB,CAAC,IAAI,GAAG;IAC3B,IAAI,EAAE,MAAM,CAAC,MAAM,CAAC,WAAW,GAAG,GAAG;CAC0B,CAAC;AAE3D,MAAM,kBAAkB,GAAG,CAAC,IAAS,EAAE,EAAE;IAC9C,MAAM,CAAC,CAAC,EAAE,EAAE,CAAC,GACX,IAAA,gBAAQ,EAAyD,QAAQ,CAAC,CAAC;IAE3E,SAAS,WAAW;QAChB,MAAM,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC;QACxB,IAAI,CAAC,GAAG,GAAG,EAAE;YACT,OAAO,SAAS,CAAA;SACnB;aAAM,IAAI,CAAC,GAAG,GAAG,EAAE;YAChB,OAAO,YAAY,CAAA;SACtB;aAAM,IAAI,CAAC,GAAG,GAAG,EAAE;YAChB,OAAO,UAAU,CAAA;SACpB;aAAM,IAAI,CAAC,GAAG,GAAG,EAAE;YAChB,OAAO,QAAQ,CAAC;SACnB;aAAM;YACH,OAAO,QAAQ,CAAA;SAClB;IACL,CAAC;IAEH,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,CAAC,GAAG,WAAW,CAAC,GAAG,EAAE;YACzB,EAAE,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC;QAC3D,CAAC,EAAE,GAAG,CAAC,CAAC;QAER,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC;IAChC,CAAC,CAAC,CAAC;IACH,OAAO,8BAAC,gCAAsB,oBAAK,IAAI,IAAE,KAAK,EAAE,CAAC,IAAI,CAAC;AACxD,CAAC,CAAC;AA3BW,QAAA,kBAAkB,sBA2B7B;AACF,0BAAkB,CAAC,IAAI,GAAG;IACxB,IAAI,EAAE,MAAM,CAAC,MAAM,CAAC,WAAW,GAAG,GAAG;CAC0B,CAAC"}
|
|
@@ -89,111 +89,135 @@ function TransitionClasses(type) {
|
|
|
89
89
|
};
|
|
90
90
|
}
|
|
91
91
|
}
|
|
92
|
+
function ChildrenWrapperFactory(func, key, toRemoveKeys) {
|
|
93
|
+
func.associatedKey = key;
|
|
94
|
+
func.toRemoveKeys = toRemoveKeys;
|
|
95
|
+
return func;
|
|
96
|
+
}
|
|
92
97
|
/**
|
|
93
98
|
* Handles the transition between multiple children and recycling of elements
|
|
94
99
|
**/
|
|
95
100
|
function Transition(_a, _containerRef) {
|
|
96
|
-
var _b, _c;
|
|
97
101
|
var { step, contentStyle, contentClassName = "", children, className, onDiscardStep, lockTransitionWidth = false } = _a, props = __rest(_a, ["step", "contentStyle", "contentClassName", "children", "className", "onDiscardStep", "lockTransitionWidth"]);
|
|
98
102
|
const containerRef = (0, react_1.useMemo)(() => _containerRef || (0, react_1.createRef)(), [_containerRef]);
|
|
99
103
|
const preTransitionDetails = (0, react_1.useRef)({
|
|
100
104
|
transformOrigin: "initial",
|
|
101
105
|
});
|
|
102
|
-
const [
|
|
103
|
-
|
|
104
|
-
|
|
106
|
+
const [childrenWrappers, setChildrenWrappers] = (0, react_1.useState)(() => {
|
|
107
|
+
const func = ChildrenWrapperFactory(({ children }) => {
|
|
108
|
+
var _a;
|
|
109
|
+
return (react_1.default.createElement("div", { "data-testid": "transition-container", key: String(((_a = children[step]) === null || _a === void 0 ? void 0 : _a.key) || step), style: contentStyle, className: contentClassName }, children));
|
|
110
|
+
}, children[step].key || step);
|
|
111
|
+
return [func];
|
|
112
|
+
});
|
|
105
113
|
const prevStep = (0, react_1.useRef)(step);
|
|
106
|
-
const
|
|
114
|
+
const prevChild = (0, react_1.useRef)(children[step]);
|
|
115
|
+
(0, react_1.useEffect)(() => () => {
|
|
116
|
+
prevChild.current = children[step];
|
|
117
|
+
});
|
|
107
118
|
(0, react_1.useEffect)(() => {
|
|
108
|
-
var _a, _b;
|
|
119
|
+
var _a, _b, _c, _d, _e;
|
|
109
120
|
containerRef.current.style.overflow = "hidden";
|
|
110
121
|
const transitionClasses = props.transitionType === TransitionAnimationTypes.CUSTOM
|
|
111
122
|
? props.config
|
|
112
123
|
: TransitionClasses(props.transitionType || TransitionAnimationTypes.SLIDE);
|
|
113
|
-
if (
|
|
114
|
-
((_a = children[step]) === null || _a === void 0 ? void 0 : _a.key) ===
|
|
124
|
+
if (prevChild.current !== null &&
|
|
125
|
+
((_a = children[step]) === null || _a === void 0 ? void 0 : _a.key) === ((_b = prevChild.current) === null || _b === void 0 ? void 0 : _b.key) // I'm rendering the same screen
|
|
115
126
|
) {
|
|
116
127
|
return () => {
|
|
117
128
|
prevStep.current = step;
|
|
118
129
|
};
|
|
119
130
|
}
|
|
120
|
-
const key = ((
|
|
131
|
+
const key = ((_c = children[step]) === null || _c === void 0 ? void 0 : _c.key) || step;
|
|
121
132
|
if (prevStep.current !== step && lockTransitionWidth)
|
|
122
133
|
containerRef.current.style.width = `${containerRef.current.clientWidth}px`;
|
|
134
|
+
/** This runs on backwards */
|
|
123
135
|
if (prevStep.current > step) {
|
|
124
136
|
const stepToRemove = prevStep.current;
|
|
125
|
-
const prevKeyToRemove =
|
|
126
|
-
|
|
127
|
-
var _a;
|
|
137
|
+
const prevKeyToRemove = ((_d = prevChild.current) === null || _d === void 0 ? void 0 : _d.key) || stepToRemove;
|
|
138
|
+
setChildrenWrappers((screensBeforeChangingStep) => {
|
|
128
139
|
const enteringScreenRef = (0, react_1.createRef)();
|
|
129
|
-
const [
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
140
|
+
const [FirstNextScreen, ...restOfScreens] = screensBeforeChangingStep.filter((a) => (a === null || a === void 0 ? void 0 : a.associatedKey) !== String(key));
|
|
141
|
+
/** Cloned so I can change the animation to exiting */
|
|
142
|
+
const clonedFirst = FirstNextScreen
|
|
143
|
+
? ChildrenWrapperFactory(({ children }) => {
|
|
144
|
+
return (react_1.default.createElement("div", { "data-testid": "transition-container", style: contentStyle, className: `${transitionClasses.backward.elementExiting}` }, children));
|
|
145
|
+
}, FirstNextScreen.associatedKey)
|
|
146
|
+
: ChildrenWrapperFactory(() => react_1.default.createElement(react_1.default.Fragment, null), "");
|
|
135
147
|
function animationEndListener(element) {
|
|
136
148
|
var _a, _b;
|
|
137
149
|
const isAnimationFromExpectedState = (_a = enteringScreenRef.current) === null || _a === void 0 ? void 0 : _a.classList.contains(transitionClasses.backward.elementEntering);
|
|
138
150
|
(_b = enteringScreenRef.current) === null || _b === void 0 ? void 0 : _b.classList.remove(transitionClasses.backward.elementEntering);
|
|
139
|
-
|
|
140
|
-
if (onDiscardStep
|
|
141
|
-
|
|
142
|
-
|
|
151
|
+
setChildrenWrappers((screensAfterTheCurrentStepEntered) => {
|
|
152
|
+
if (onDiscardStep) {
|
|
153
|
+
if (isAnimationFromExpectedState)
|
|
154
|
+
onDiscardStep(prevKeyToRemove);
|
|
155
|
+
if (FirstNextScreen && FirstNextScreen.toRemoveKeys)
|
|
156
|
+
FirstNextScreen.toRemoveKeys.forEach(onDiscardStep);
|
|
157
|
+
}
|
|
158
|
+
return screensAfterTheCurrentStepEntered.filter((s) => {
|
|
159
|
+
var _a;
|
|
160
|
+
const shouldKeep = (s === null || s === void 0 ? void 0 : s.associatedKey) !== String(prevKeyToRemove) &&
|
|
161
|
+
!((_a = FirstNextScreen === null || FirstNextScreen === void 0 ? void 0 : FirstNextScreen.toRemoveKeys) === null || _a === void 0 ? void 0 : _a.some((k) => String(k) === String(s === null || s === void 0 ? void 0 : s.associatedKey)));
|
|
162
|
+
return shouldKeep;
|
|
163
|
+
});
|
|
143
164
|
});
|
|
144
165
|
element.currentTarget.removeEventListener("animationend", animationEndListener);
|
|
145
166
|
}
|
|
146
|
-
|
|
147
|
-
react_1.default.createElement("div", { ref: enteringScreenRef, "data-testid": "transition-container", key: key, className: `${transitionClasses.backward.elementEntering} ${contentClassName}`, style: Object.assign({}, contentStyle), onAnimationEnd: animationEndListener }, children
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
167
|
+
const newWrapper = ChildrenWrapperFactory(({ children }) => {
|
|
168
|
+
return (react_1.default.createElement("div", { ref: enteringScreenRef, "data-testid": "transition-container", key: key, className: `${transitionClasses.backward.elementEntering} ${contentClassName}`, style: Object.assign({}, contentStyle), onAnimationEnd: animationEndListener }, children));
|
|
169
|
+
}, key, [prevKeyToRemove, ...((FirstNextScreen === null || FirstNextScreen === void 0 ? void 0 : FirstNextScreen.toRemoveKeys) || [])]);
|
|
170
|
+
if (FirstNextScreen)
|
|
171
|
+
return [newWrapper, clonedFirst, ...restOfScreens];
|
|
172
|
+
else
|
|
173
|
+
return [newWrapper];
|
|
151
174
|
});
|
|
152
175
|
}
|
|
153
176
|
else if (prevStep.current < step) {
|
|
154
177
|
const stepToDelete = prevStep.current;
|
|
155
|
-
const prevKeyToRemove =
|
|
156
|
-
|
|
178
|
+
const prevKeyToRemove = String(((_e = prevChild.current) === null || _e === void 0 ? void 0 : _e.key) || stepToDelete);
|
|
179
|
+
setChildrenWrappers((screensBeforeChangingStep) => {
|
|
157
180
|
const lastIndex = screensBeforeChangingStep.length - 1;
|
|
158
|
-
const
|
|
181
|
+
const lastWrapper = screensBeforeChangingStep[lastIndex];
|
|
159
182
|
const nextScreenRef = (0, react_1.createRef)();
|
|
160
|
-
const clonedLast =
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
},
|
|
179
|
-
|
|
183
|
+
const clonedLast = lastWrapper
|
|
184
|
+
? ChildrenWrapperFactory(({ children }) => {
|
|
185
|
+
return (react_1.default.createElement("div", { "data-testid": "transition-container", style: contentStyle, className: `${contentClassName} ${transitionClasses.forward.elementExiting}`, onAnimationEnd: (e) => {
|
|
186
|
+
var _a;
|
|
187
|
+
if (e.target !== e.currentTarget)
|
|
188
|
+
return;
|
|
189
|
+
if (transitionClasses.forward.elementEntering)
|
|
190
|
+
(_a = nextScreenRef.current) === null || _a === void 0 ? void 0 : _a.classList.remove(transitionClasses.forward.elementEntering);
|
|
191
|
+
if (onDiscardStep)
|
|
192
|
+
onDiscardStep(prevKeyToRemove);
|
|
193
|
+
setChildrenWrappers((screensAfterTheCurrentStepEntered) => {
|
|
194
|
+
const nextState = screensAfterTheCurrentStepEntered.filter((s) => {
|
|
195
|
+
const shouldMantain = (s === null || s === void 0 ? void 0 : s.associatedKey) !== String(prevKeyToRemove);
|
|
196
|
+
return shouldMantain;
|
|
197
|
+
});
|
|
198
|
+
return nextState;
|
|
199
|
+
});
|
|
200
|
+
} }, children));
|
|
201
|
+
}, lastWrapper.associatedKey)
|
|
202
|
+
: ChildrenWrapperFactory(() => react_1.default.createElement(react_1.default.Fragment, null), "fallback");
|
|
203
|
+
const newWrapper = ChildrenWrapperFactory(({ children }) => {
|
|
204
|
+
return (react_1.default.createElement("div", { ref: nextScreenRef, "data-testid": "transition-container", key: key, style: Object.assign({}, contentStyle), className: `${contentClassName} ${transitionClasses.forward.elementEntering}` }, children));
|
|
205
|
+
}, key);
|
|
180
206
|
return [
|
|
181
207
|
...screensBeforeChangingStep.slice(0, lastIndex),
|
|
182
208
|
clonedLast,
|
|
183
|
-
|
|
209
|
+
newWrapper,
|
|
184
210
|
];
|
|
185
211
|
});
|
|
186
212
|
}
|
|
187
213
|
return () => {
|
|
188
|
-
var _a;
|
|
189
214
|
prevStep.current = step;
|
|
190
|
-
prevKey.current = (_a = children[step]) === null || _a === void 0 ? void 0 : _a.key;
|
|
191
215
|
};
|
|
192
216
|
}, [step]);
|
|
193
217
|
(0, react_1.useEffect)(() => {
|
|
194
|
-
if (
|
|
218
|
+
if (childrenWrappers.length === 1 && lockTransitionWidth)
|
|
195
219
|
containerRef.current.style.width = "";
|
|
196
|
-
}, [
|
|
220
|
+
}, [childrenWrappers.length !== 1]);
|
|
197
221
|
(0, react_1.useEffect)(() => {
|
|
198
222
|
if (props.transitionType === TransitionAnimationTypes.POP_FROM_ELEMENT_ID &&
|
|
199
223
|
"elementId" in props) {
|
|
@@ -213,10 +237,10 @@ function Transition(_a, _containerRef) {
|
|
|
213
237
|
else {
|
|
214
238
|
Object.assign(containerRef.current.style, preTransitionDetails.current);
|
|
215
239
|
}
|
|
216
|
-
if (
|
|
240
|
+
if (childrenWrappers.length === 1) {
|
|
217
241
|
containerRef.current.style.overflow = "";
|
|
218
242
|
}
|
|
219
|
-
}, [
|
|
243
|
+
}, [childrenWrappers.length]);
|
|
220
244
|
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
221
245
|
react_1.default.createElement("section", { onClick: ({ currentTarget: { offsetTop, offsetLeft, clientWidth, clientHeight }, clientX, clientY, }) => {
|
|
222
246
|
const offsetX = clientX - offsetLeft;
|
|
@@ -228,7 +252,11 @@ function Transition(_a, _containerRef) {
|
|
|
228
252
|
props.transitionType ===
|
|
229
253
|
TransitionAnimationTypes.POP_FROM_CLICK_ORIGIN)
|
|
230
254
|
preTransitionDetails.current.transformOrigin = `${percentX}% ${percentY}%`;
|
|
231
|
-
}, "data-testid": "transition-controller", ref: containerRef, className: `${Transition_module_scss_1.default.section} ${className}` },
|
|
255
|
+
}, "data-testid": "transition-controller", ref: containerRef, className: `${Transition_module_scss_1.default.section} ${className}` }, childrenWrappers.map((Wrapper) => {
|
|
256
|
+
const childToRender = children.find((a, i) => ((a === null || a === void 0 ? void 0 : a.key) || i) === (Wrapper === null || Wrapper === void 0 ? void 0 : Wrapper.associatedKey));
|
|
257
|
+
return (react_1.default.createElement(Wrapper, { key: Wrapper === null || Wrapper === void 0 ? void 0 : Wrapper.associatedKey },
|
|
258
|
+
react_1.default.createElement(react_1.default.Fragment, null, childToRender)));
|
|
259
|
+
}))));
|
|
232
260
|
}
|
|
233
261
|
var TransitionAnimationTypes;
|
|
234
262
|
(function (TransitionAnimationTypes) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Transition.js","sourceRoot":"","sources":["../../../src/components/Transition/Transition.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+
|
|
1
|
+
{"version":3,"file":"Transition.js","sourceRoot":"","sources":["../../../src/components/Transition/Transition.tsx"],"names":[],"mappings":"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"}
|
|
@@ -49,7 +49,6 @@ function UncontrolledTransition(_a, ref) {
|
|
|
49
49
|
childStack: [children],
|
|
50
50
|
offset: 1,
|
|
51
51
|
});
|
|
52
|
-
// const [offset, setOffset] = useState(1);
|
|
53
52
|
const orientation = (0, react_1.useRef)("forward");
|
|
54
53
|
function setOrientation(a) {
|
|
55
54
|
orientation.current = a;
|
|
@@ -70,9 +69,15 @@ function UncontrolledTransition(_a, ref) {
|
|
|
70
69
|
}, [children.key]);
|
|
71
70
|
(0, react_1.useEffect)(() => {
|
|
72
71
|
if (orientation.current === "backward") {
|
|
73
|
-
setChildStack((prev) =>
|
|
72
|
+
setChildStack((prev) => {
|
|
73
|
+
return Object.assign(Object.assign({}, prev), { offset: prev.childStack.length });
|
|
74
|
+
});
|
|
74
75
|
}
|
|
75
76
|
}, [childStack.length]);
|
|
77
|
+
childStack.forEach((a, i, arr) => {
|
|
78
|
+
if (a.key === children.key)
|
|
79
|
+
arr[i] = children;
|
|
80
|
+
});
|
|
76
81
|
return (react_1.default.createElement(react_1.default.Fragment, null, childStack.length ? (react_1.default.createElement(Transition_1.default, Object.assign({ ref: sectionRef, contentStyle: contentStyle, className: className, step: childStack.length - offset, onDiscardStep: (discardedKey) => {
|
|
77
82
|
if (onDiscardStep)
|
|
78
83
|
onDiscardStep(discardedKey);
|
|
@@ -80,7 +85,7 @@ function UncontrolledTransition(_a, ref) {
|
|
|
80
85
|
setChildStack((prev) => {
|
|
81
86
|
return {
|
|
82
87
|
childStack: prev.childStack.filter((a) => a.key !== discardedKey),
|
|
83
|
-
offset: 1,
|
|
88
|
+
offset: prev.offset === 1 ? 1 : prev.offset - 1,
|
|
84
89
|
};
|
|
85
90
|
});
|
|
86
91
|
}, lockTransitionWidth: lockTransitionWidth, contentClassName: contentClassName }, props), childStack)) : null));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UncontrolledTransition.js","sourceRoot":"","sources":["../../../src/components/UncontrolledTransition/UncontrolledTransition.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+
|
|
1
|
+
{"version":3,"file":"UncontrolledTransition.js","sourceRoot":"","sources":["../../../src/components/UncontrolledTransition/UncontrolledTransition.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@onepercentio/one-ui",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.7",
|
|
4
4
|
"description": "A set of reusable components created through the development of Onepercent projects",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"@cypress/react": "^5.12.5",
|
|
21
21
|
"@firebase/rules-unit-testing": "^2.0.2",
|
|
22
22
|
"@muritavo/cypress-toolkit": "^0.1.0",
|
|
23
|
-
"@muritavo/webpack-microfrontend-scripts": "^0.0.
|
|
23
|
+
"@muritavo/webpack-microfrontend-scripts": "^0.0.22",
|
|
24
24
|
"@storybook/addon-actions": "^6.4.18",
|
|
25
25
|
"@storybook/addon-essentials": "^6.4.18",
|
|
26
26
|
"@storybook/addon-links": "^6.4.18",
|
|
@@ -49,7 +49,6 @@
|
|
|
49
49
|
"inquirer": "^8.2.4",
|
|
50
50
|
"jest": "^27.3.1",
|
|
51
51
|
"node-fetch": "^2",
|
|
52
|
-
"node-sass": "^6.0.1",
|
|
53
52
|
"os-browserify": "^0.3.0",
|
|
54
53
|
"react": "^18.0.0",
|
|
55
54
|
"react-docgen-typescript": "^2.2.2",
|
|
@@ -58,7 +57,7 @@
|
|
|
58
57
|
"react-intl": "^5.24.4",
|
|
59
58
|
"react-router-dom": "^5",
|
|
60
59
|
"react-scripts": "^5.0.0",
|
|
61
|
-
"sass": "^1.
|
|
60
|
+
"sass": "^1.54.0",
|
|
62
61
|
"sass-loader": "^10",
|
|
63
62
|
"stream-browserify": "^3.0.0",
|
|
64
63
|
"stream-http": "^3.2.0",
|
|
File without changes
|