@onepercentio/one-ui 0.5.1 → 0.6.1
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/AnimatedEntrance/AnimatedEntrance.js +5 -1
- package/dist/components/AnimatedEntrance/AnimatedEntrance.js.map +1 -1
- package/dist/components/AnimatedEntrance/AnimatedEntrance.module.scss +2 -1
- package/dist/components/AsyncProcessQueue/AsyncProcessQueue.d.ts +4 -0
- package/dist/components/AsyncProcessQueue/AsyncProcessQueue.js +14 -0
- package/dist/components/AsyncProcessQueue/AsyncProcessQueue.js.map +1 -0
- package/dist/components/AsyncProcessQueue/AsyncProcessQueue.module.scss +0 -0
- package/dist/components/AsyncProcessQueue/AsyncProcessQueue.stories.d.ts +10 -0
- package/dist/components/AsyncProcessQueue/AsyncProcessQueue.stories.js +16 -0
- package/dist/components/AsyncProcessQueue/AsyncProcessQueue.stories.js.map +1 -0
- package/dist/components/AsyncProcessQueue/index.d.ts +1 -0
- package/dist/components/AsyncProcessQueue/index.js +9 -0
- package/dist/components/AsyncProcessQueue/index.js.map +1 -0
- package/dist/components/BucketFill/BucketFill.d.ts +12 -0
- package/dist/components/BucketFill/BucketFill.js +66 -0
- package/dist/components/BucketFill/BucketFill.js.map +1 -0
- package/dist/components/BucketFill/BucketFill.module.scss +36 -0
- package/dist/components/BucketFill/BucketFill.stories.d.ts +17 -0
- package/dist/components/BucketFill/BucketFill.stories.js +141 -0
- package/dist/components/BucketFill/BucketFill.stories.js.map +1 -0
- package/dist/components/BucketFill/BucketFill.stories.module.scss +3 -0
- package/dist/components/BucketFill/index.d.ts +1 -0
- package/dist/components/BucketFill/index.js +9 -0
- package/dist/components/BucketFill/index.js.map +1 -0
- package/dist/components/EmailInput/EmailInput.d.ts +1 -1
- package/dist/components/EmailInput/EmailInput.stories.d.ts +1 -1
- package/dist/components/MutableHamburgerButton/MutableHamburgerButton.d.ts +1 -1
- package/dist/components/MutableHamburgerButton/MutableHamburgerButton.module.scss +74 -6
- package/dist/components/MutableHamburgerButton/MutableHamburgerButton.stories.d.ts +9 -2
- package/dist/components/MutableHamburgerButton/MutableHamburgerButton.stories.js +63 -5
- package/dist/components/MutableHamburgerButton/MutableHamburgerButton.stories.js.map +1 -1
- package/dist/components/Text/Text.d.ts +3 -1
- package/dist/components/WalletConnectionWrapper/WalletConnectionWrapper.d.ts +3 -1
- package/dist/components/WalletConnectionWrapper/WalletConnectionWrapper.stories.d.ts +5 -0
- package/dist/context/AsyncProcessQueue.d.ts +10 -0
- package/dist/context/AsyncProcessQueue.js +16 -0
- package/dist/context/AsyncProcessQueue.js.map +1 -0
- package/dist/context/CustomBrowserRouter.d.ts +5 -0
- package/dist/context/CustomBrowserRouter.js +54 -0
- package/dist/context/CustomBrowserRouter.js.map +1 -0
- package/dist/hooks/useAsyncControl.d.ts +1 -0
- package/dist/hooks/useCustomHistory.d.ts +14 -0
- package/dist/hooks/useCustomHistory.js +15 -0
- package/dist/hooks/useCustomHistory.js.map +1 -0
- package/dist/hooks/useImprovedHistory.d.ts +0 -0
- package/dist/hooks/useImprovedHistory.js +2 -0
- package/dist/hooks/useImprovedHistory.js.map +1 -0
- package/dist/hooks/usePooling.d.ts +1 -0
- package/dist/hooks/useRebound.d.ts +1 -0
- package/package.json +5 -2
- package/src/types.d.ts +36 -0
|
@@ -72,8 +72,12 @@ function AnimatedEntranceItem({ children, noEntranceAnimation, onRemoveChildren,
|
|
|
72
72
|
const key = String(screen.key);
|
|
73
73
|
if (key === "null" || key.includes("-nullated"))
|
|
74
74
|
uncontRef.current.sectionRef.current.style.maxHeight = `0px`;
|
|
75
|
-
else
|
|
75
|
+
else {
|
|
76
76
|
uncontRef.current.sectionRef.current.style.maxHeight = `${uncontRef.current.sectionRef.current.scrollHeight}px`;
|
|
77
|
+
uncontRef.current.sectionRef.current.addEventListener("transitionend", () => {
|
|
78
|
+
uncontRef.current.sectionRef.current.style.maxHeight = "";
|
|
79
|
+
});
|
|
80
|
+
}
|
|
77
81
|
}, 100);
|
|
78
82
|
return () => {
|
|
79
83
|
clearTimeout(x);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AnimatedEntrance.js","sourceRoot":"","sources":["../../../src/components/AnimatedEntrance/AnimatedEntrance.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CASe;AACf,8CAAyD;AACzD,uFAA+D;AAC/D,kGAAoD;AAEpD,IAAY,YAGX;AAHD,WAAY,YAAY;IACtB,uEAAgB,CAAA;IAChB,mDAAM,CAAA;AACR,CAAC,EAHW,YAAY,GAAZ,oBAAY,KAAZ,oBAAY,QAGvB;AAED,MAAM,wBAAwB,GAAG;IAC/B,CAAC,YAAY,CAAC,gBAAgB,CAAC,EAAE;QAC/B,OAAO,EAAE;YACP,eAAe,EAAE,sCAAM,CAAC,eAAe;YACvC,cAAc,EAAE,sCAAM,CAAC,cAAc;SACtC;QACD,QAAQ,EAAE;YACR,eAAe,EAAE,sCAAM,CAAC,sBAAsB;YAC9C,cAAc,EAAE,sCAAM,CAAC,qBAAqB;SAC7C;KACF;IACD,CAAC,YAAY,CAAC,MAAM,CAAC,EAAE;QACrB,OAAO,EAAE;YACP,eAAe,EAAE,sCAAM,CAAC,gBAAgB;YACxC,cAAc,EAAE,sCAAM,CAAC,gBAAgB;SACxC;QACD,QAAQ,EAAE;YACR,eAAe,EAAE,sCAAM,CAAC,uBAAuB;YAC/C,cAAc,EAAE,sCAAM,CAAC,uBAAuB;SAC/C;KACF;CACF,CAAC;AAEF,SAAgB,oBAAoB,CAAC,EACnC,QAAQ,EACR,mBAAmB,EACnB,gBAAgB,EAChB,YAAY,GAMb;IACC,MAAM,SAAS,GAAG,IAAA,cAAM,EAA4C,IAAI,CAAC,CAAC;IAC1E,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAClC,mBAAmB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,8BAAC,gBAAQ,IAAC,GAAG,EAAE,MAAM,GAAI,CAC3D,CAAC;IACF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE;YAC9C,SAAS,CAAC,OAAQ,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;SAC/C;QACD,SAAS,CAAC,QAAQ,CAAC,CAAC;IACtB,CAAC,EAAE,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;IAEnB,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,CAAC,GAAG,UAAU,CAAC,GAAG,EAAE;YACxB,MAAM,GAAG,GAAG,MAAM,CAAC,MAAM,CAAC,GAAI,CAAC,CAAC;YAChC,IAAI,GAAG,KAAK,MAAM,IAAI,GAAG,CAAC,QAAQ,CAAC,WAAW,CAAC;gBAC7C,SAAS,CAAC,OAAQ,CAAC,UAAU,CAAC,OAAQ,CAAC,KAAK,CAAC,SAAS,GAAG,KAAK,CAAC
|
|
1
|
+
{"version":3,"file":"AnimatedEntrance.js","sourceRoot":"","sources":["../../../src/components/AnimatedEntrance/AnimatedEntrance.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
@use 'sass:math';
|
|
1
2
|
@keyframes expand {
|
|
2
3
|
0% {
|
|
3
4
|
transform: translateX(100%);
|
|
@@ -62,7 +63,7 @@ $duration: 1s;
|
|
|
62
63
|
}
|
|
63
64
|
|
|
64
65
|
.resetHeight {
|
|
65
|
-
transition: max-height $duration
|
|
66
|
+
transition: max-height math.div($duration, 2) $duration * 0.2;
|
|
66
67
|
min-height: initial;
|
|
67
68
|
align-items: flex-start !important;
|
|
68
69
|
> * {
|
|
@@ -0,0 +1,14 @@
|
|
|
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
|
+
/**
|
|
8
|
+
* Translates an UI from the window to the process queue container
|
|
9
|
+
**/
|
|
10
|
+
function AsyncProcessTransition() {
|
|
11
|
+
return react_1.default.createElement(react_1.default.Fragment, null, "AsyncProcessTransition");
|
|
12
|
+
}
|
|
13
|
+
exports.default = AsyncProcessTransition;
|
|
14
|
+
//# sourceMappingURL=AsyncProcessQueue.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AsyncProcessQueue.js","sourceRoot":"","sources":["../../../src/components/AsyncProcessQueue/AsyncProcessQueue.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAI1B;;IAEI;AACJ,SAAwB,sBAAsB;IAE1C,OAAO,uFAA2B,CAAC;AACvC,CAAC;AAHD,yCAGC"}
|
|
File without changes
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import AsyncProcessTransition from "./AsyncProcessQueue";
|
|
2
|
+
declare const _default: {
|
|
3
|
+
component: typeof AsyncProcessTransition;
|
|
4
|
+
title: string;
|
|
5
|
+
};
|
|
6
|
+
export default _default;
|
|
7
|
+
export declare const InitialImplementation: {
|
|
8
|
+
(args: any): JSX.Element;
|
|
9
|
+
args: Partial<unknown>;
|
|
10
|
+
};
|
|
@@ -0,0 +1,16 @@
|
|
|
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 AsyncProcessQueue_1 = __importDefault(require("./AsyncProcessQueue"));
|
|
9
|
+
exports.default = {
|
|
10
|
+
component: AsyncProcessQueue_1.default,
|
|
11
|
+
title: "Async Process Transition"
|
|
12
|
+
};
|
|
13
|
+
const InitialImplementation = (args) => react_1.default.createElement(AsyncProcessQueue_1.default, Object.assign({}, args));
|
|
14
|
+
exports.InitialImplementation = InitialImplementation;
|
|
15
|
+
exports.InitialImplementation.args = {};
|
|
16
|
+
//# sourceMappingURL=AsyncProcessQueue.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AsyncProcessQueue.stories.js","sourceRoot":"","sources":["../../../src/components/AsyncProcessQueue/AsyncProcessQueue.stories.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,4EAAyD;AAEzD,kBAAe;IACX,SAAS,EAAE,2BAAsB;IACjC,KAAK,EAAE,0BAA0B;CACpC,CAAA;AAEM,MAAM,qBAAqB,GAAG,CAAC,IAAS,EAAE,EAAE,CAAC,8BAAC,2BAAsB,oBAAK,IAAI,EAAG,CAAC;AAA3E,QAAA,qBAAqB,yBAAsD;AACxF,6BAAqB,CAAC,IAAI,GAAG,EAAkE,CAAA"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './AsyncProcessQueue';
|
|
@@ -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 AsyncProcessQueue_1 = require("./AsyncProcessQueue");
|
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(AsyncProcessQueue_1).default; } });
|
|
9
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/AsyncProcessQueue/index.tsx"],"names":[],"mappings":";;;;;;AAAA,yDAA8C;AAArC,6HAAA,OAAO,OAAA"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { PropsWithChildren, ReactNode } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* A weird name for a component, but it's objective is to change element colors as the user progresses through a series of steps
|
|
4
|
+
*
|
|
5
|
+
* IT IS NOT READY (AND PROBABLY NEVER WILL) FOR FRAGMENT NODES
|
|
6
|
+
**/
|
|
7
|
+
export default function BucketFill({ children, background, fillTo, }: {
|
|
8
|
+
children: ReactNode[];
|
|
9
|
+
fillTo: number;
|
|
10
|
+
background: string;
|
|
11
|
+
}): JSX.Element;
|
|
12
|
+
export declare function IgnoreFill({ children }: PropsWithChildren<{}>): JSX.Element;
|
|
@@ -0,0 +1,66 @@
|
|
|
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
|
+
exports.IgnoreFill = void 0;
|
|
30
|
+
const react_1 = __importStar(require("react"));
|
|
31
|
+
const BucketFill_module_scss_1 = __importDefault(require("./BucketFill.module.scss"));
|
|
32
|
+
/**
|
|
33
|
+
* A weird name for a component, but it's objective is to change element colors as the user progresses through a series of steps
|
|
34
|
+
*
|
|
35
|
+
* IT IS NOT READY (AND PROBABLY NEVER WILL) FOR FRAGMENT NODES
|
|
36
|
+
**/
|
|
37
|
+
function BucketFill({ children, background, fillTo, }) {
|
|
38
|
+
const rootRef = (0, react_1.useRef)(null);
|
|
39
|
+
function resize() {
|
|
40
|
+
const childs = rootRef.current.children;
|
|
41
|
+
const s = rootRef.current.style;
|
|
42
|
+
const elementAtPosition = fillTo === 0 ? null : childs.item(fillTo - 1);
|
|
43
|
+
const elementOffsetAndHeight = elementAtPosition === null
|
|
44
|
+
? 0
|
|
45
|
+
: elementAtPosition.offsetTop + elementAtPosition.clientHeight;
|
|
46
|
+
const elementRootHeight = rootRef.current.clientHeight;
|
|
47
|
+
const percentToFill = Math.min((elementOffsetAndHeight * 100) / elementRootHeight, 100);
|
|
48
|
+
s.setProperty("--fill-height", `${percentToFill}%`);
|
|
49
|
+
s.setProperty("--empty-height", `${100 - percentToFill}%`);
|
|
50
|
+
s.setProperty("--bg-offset", `${percentToFill === 100 ? -1000 : 100 / ((100 - percentToFill) / 100)}%`);
|
|
51
|
+
}
|
|
52
|
+
(0, react_1.useEffect)(() => {
|
|
53
|
+
resize();
|
|
54
|
+
window.addEventListener("resize", resize);
|
|
55
|
+
return () => window.removeEventListener("resize", resize);
|
|
56
|
+
}, [fillTo]);
|
|
57
|
+
return (react_1.default.createElement("div", { ref: rootRef, style: {
|
|
58
|
+
"--bg": background,
|
|
59
|
+
}, className: BucketFill_module_scss_1.default.root }, children));
|
|
60
|
+
}
|
|
61
|
+
exports.default = BucketFill;
|
|
62
|
+
function IgnoreFill({ children }) {
|
|
63
|
+
return react_1.default.createElement("div", { className: BucketFill_module_scss_1.default.ignoreFill }, children);
|
|
64
|
+
}
|
|
65
|
+
exports.IgnoreFill = IgnoreFill;
|
|
66
|
+
//# sourceMappingURL=BucketFill.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BucketFill.js","sourceRoot":"","sources":["../../../src/components/BucketFill/BucketFill.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA+E;AAC/E,sFAA8C;AAE9C;;;;IAII;AACJ,SAAwB,UAAU,CAAC,EACjC,QAAQ,EACR,UAAU,EACV,MAAM,GAKP;IACC,MAAM,OAAO,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAC7C,SAAS,MAAM;QACb,MAAM,MAAM,GAAG,OAAO,CAAC,OAAQ,CAAC,QAAQ,CAAC;QACzC,MAAM,CAAC,GAAG,OAAO,CAAC,OAAQ,CAAC,KAAK,CAAC;QACjC,MAAM,iBAAiB,GACrB,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAE,MAAM,CAAC,IAAI,CAAC,MAAM,GAAG,CAAC,CAAiB,CAAC;QACjE,MAAM,sBAAsB,GAC1B,iBAAiB,KAAK,IAAI;YACxB,CAAC,CAAC,CAAC;YACH,CAAC,CAAC,iBAAiB,CAAC,SAAS,GAAG,iBAAiB,CAAC,YAAY,CAAC;QACnE,MAAM,iBAAiB,GAAG,OAAO,CAAC,OAAQ,CAAC,YAAY,CAAC;QACxD,MAAM,aAAa,GAAG,IAAI,CAAC,GAAG,CAC5B,CAAC,sBAAsB,GAAG,GAAG,CAAC,GAAG,iBAAiB,EAClD,GAAG,CACJ,CAAC;QAEF,CAAC,CAAC,WAAW,CAAC,eAAe,EAAE,GAAG,aAAa,GAAG,CAAC,CAAC;QACpD,CAAC,CAAC,WAAW,CAAC,gBAAgB,EAAE,GAAG,GAAG,GAAG,aAAa,GAAG,CAAC,CAAC;QAC3D,CAAC,CAAC,WAAW,CACX,aAAa,EACb,GAAG,aAAa,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,GAAG,GAAG,aAAa,CAAC,GAAG,GAAG,CAAC,GAAG,CAC1E,CAAC;IACJ,CAAC;IACD,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,EAAE,CAAC;QACT,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;QAE1C,OAAO,GAAG,EAAE,CAAC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;IAC5D,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,OAAO,CACL,uCACE,GAAG,EAAE,OAAO,EACZ,KAAK,EACH;YACE,MAAM,EAAE,UAAU;SACZ,EAEV,SAAS,EAAE,gCAAM,CAAC,IAAI,IAErB,QAAQ,CACL,CACP,CAAC;AACJ,CAAC;AApDD,6BAoDC;AAED,SAAgB,UAAU,CAAC,EAAE,QAAQ,EAAyB;IAC5D,OAAO,uCAAK,SAAS,EAAE,gCAAM,CAAC,UAAU,IAAG,QAAQ,CAAO,CAAC;AAC7D,CAAC;AAFD,gCAEC"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
@import "../../assets/styles/variables.scss";
|
|
2
|
+
|
|
3
|
+
.root {
|
|
4
|
+
position: relative;
|
|
5
|
+
z-index: 1;
|
|
6
|
+
> :not(div) {
|
|
7
|
+
mix-blend-mode: color;
|
|
8
|
+
}
|
|
9
|
+
> div > * {
|
|
10
|
+
mix-blend-mode: color;
|
|
11
|
+
}
|
|
12
|
+
&::before,
|
|
13
|
+
&::after {
|
|
14
|
+
background: var(--bg);
|
|
15
|
+
width: 100%;
|
|
16
|
+
position: absolute;
|
|
17
|
+
content: " ";
|
|
18
|
+
z-index: -1;
|
|
19
|
+
transition: height $fast, background-size $fast;
|
|
20
|
+
}
|
|
21
|
+
&::before {
|
|
22
|
+
opacity: 0;
|
|
23
|
+
top: 0;
|
|
24
|
+
height: var(--fill-height);
|
|
25
|
+
}
|
|
26
|
+
&::after {
|
|
27
|
+
opacity: 0.6;
|
|
28
|
+
bottom: 0;
|
|
29
|
+
height: var(--empty-height);
|
|
30
|
+
background-size: 100% var(--bg-offset);
|
|
31
|
+
background-position: bottom;
|
|
32
|
+
}
|
|
33
|
+
.ignoreFill {
|
|
34
|
+
mix-blend-mode: multiply;
|
|
35
|
+
}
|
|
36
|
+
}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import BucketFill from "./BucketFill";
|
|
3
|
+
import "./BucketFill.stories.module.scss";
|
|
4
|
+
declare const _default: {
|
|
5
|
+
component: typeof BucketFill;
|
|
6
|
+
title: string;
|
|
7
|
+
};
|
|
8
|
+
export default _default;
|
|
9
|
+
export declare const AutoFill: {
|
|
10
|
+
(args: any): JSX.Element;
|
|
11
|
+
args: Partial<{
|
|
12
|
+
children: React.ReactNode[];
|
|
13
|
+
fillTo: number;
|
|
14
|
+
background: string;
|
|
15
|
+
}>;
|
|
16
|
+
};
|
|
17
|
+
export declare const Sandbox: (args: any) => JSX.Element;
|
|
@@ -0,0 +1,141 @@
|
|
|
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
|
+
exports.Sandbox = exports.AutoFill = void 0;
|
|
30
|
+
const react_1 = __importStar(require("react"));
|
|
31
|
+
const Button_1 = __importDefault(require("../Button"));
|
|
32
|
+
const MutableHamburgerButton_1 = __importDefault(require("../MutableHamburgerButton"));
|
|
33
|
+
const BucketFill_1 = __importStar(require("./BucketFill"));
|
|
34
|
+
require("./BucketFill.stories.module.scss");
|
|
35
|
+
exports.default = {
|
|
36
|
+
component: BucketFill_1.default,
|
|
37
|
+
title: "Bucket Fill",
|
|
38
|
+
};
|
|
39
|
+
const AutoFill = (args) => {
|
|
40
|
+
const [fillTo, ss] = (0, react_1.useState)(0);
|
|
41
|
+
(0, react_1.useEffect)(() => {
|
|
42
|
+
const i = setInterval(() => {
|
|
43
|
+
ss((a) => (a === 4 ? 0 : a + 1));
|
|
44
|
+
}, 1000);
|
|
45
|
+
return () => clearInterval(i);
|
|
46
|
+
}, []);
|
|
47
|
+
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
48
|
+
react_1.default.createElement("h1", null,
|
|
49
|
+
"Filling to ",
|
|
50
|
+
fillTo),
|
|
51
|
+
react_1.default.createElement("div", { style: { display: "flex" } },
|
|
52
|
+
react_1.default.createElement("div", null,
|
|
53
|
+
react_1.default.createElement(BucketFill_1.default, Object.assign({}, args, { fillTo: fillTo, background: "white" }),
|
|
54
|
+
react_1.default.createElement("h1", null, "First step"),
|
|
55
|
+
react_1.default.createElement("div", null,
|
|
56
|
+
react_1.default.createElement("p", null, "Second"),
|
|
57
|
+
react_1.default.createElement("p", null, "step")),
|
|
58
|
+
react_1.default.createElement(BucketFill_1.IgnoreFill, null,
|
|
59
|
+
react_1.default.createElement(Button_1.default, { variant: "filled" }, "Third step")),
|
|
60
|
+
react_1.default.createElement("div", null,
|
|
61
|
+
react_1.default.createElement(MutableHamburgerButton_1.default, { state: "loading", size: 180 }),
|
|
62
|
+
react_1.default.createElement(BucketFill_1.IgnoreFill, null,
|
|
63
|
+
react_1.default.createElement(Button_1.default, null, "BADADADADAD")),
|
|
64
|
+
react_1.default.createElement("p", null, "Fourth step")))),
|
|
65
|
+
react_1.default.createElement("div", { style: {
|
|
66
|
+
background: "#000",
|
|
67
|
+
color: "white",
|
|
68
|
+
"--digital-blue": "white",
|
|
69
|
+
} },
|
|
70
|
+
react_1.default.createElement("div", null,
|
|
71
|
+
react_1.default.createElement(BucketFill_1.default, Object.assign({}, args, { fillTo: fillTo, background: "#000" }),
|
|
72
|
+
react_1.default.createElement("h1", null, "First step"),
|
|
73
|
+
react_1.default.createElement("div", null,
|
|
74
|
+
react_1.default.createElement("p", null, "Second"),
|
|
75
|
+
react_1.default.createElement("p", null, "step")),
|
|
76
|
+
react_1.default.createElement("p", null, "Third step"),
|
|
77
|
+
react_1.default.createElement("div", { style: {} },
|
|
78
|
+
react_1.default.createElement(MutableHamburgerButton_1.default, { state: "loading", size: 180 }),
|
|
79
|
+
"Fourth step")))),
|
|
80
|
+
react_1.default.createElement("div", { style: {
|
|
81
|
+
background: "yellow",
|
|
82
|
+
color: "black",
|
|
83
|
+
"--digital-blue": "black",
|
|
84
|
+
} },
|
|
85
|
+
react_1.default.createElement("div", null,
|
|
86
|
+
react_1.default.createElement(BucketFill_1.default, Object.assign({}, args, { fillTo: fillTo, background: "yellow" }),
|
|
87
|
+
react_1.default.createElement("h1", null, "First step"),
|
|
88
|
+
react_1.default.createElement("div", null,
|
|
89
|
+
react_1.default.createElement("p", null, "Second"),
|
|
90
|
+
react_1.default.createElement("p", null, "step")),
|
|
91
|
+
react_1.default.createElement("p", null, "Third step"),
|
|
92
|
+
react_1.default.createElement("div", { style: {} },
|
|
93
|
+
react_1.default.createElement(MutableHamburgerButton_1.default, { state: "loading", size: 180 }),
|
|
94
|
+
"Fourth step")))),
|
|
95
|
+
react_1.default.createElement("div", { style: {
|
|
96
|
+
background: "linear-gradient(to bottom, red, green, blue)",
|
|
97
|
+
color: "black",
|
|
98
|
+
"--digital-blue": "black",
|
|
99
|
+
} },
|
|
100
|
+
react_1.default.createElement(BucketFill_1.default, Object.assign({}, args, { fillTo: fillTo, background: "linear-gradient(to bottom, red, green, blue)" }),
|
|
101
|
+
react_1.default.createElement("h1", null, "First step"),
|
|
102
|
+
react_1.default.createElement("div", null,
|
|
103
|
+
react_1.default.createElement("p", null, "Second"),
|
|
104
|
+
react_1.default.createElement("p", null, "step")),
|
|
105
|
+
react_1.default.createElement("p", null, "Third step"),
|
|
106
|
+
react_1.default.createElement("div", { style: {} },
|
|
107
|
+
react_1.default.createElement(MutableHamburgerButton_1.default, { state: "loading", size: 180 }),
|
|
108
|
+
"Fourth step"))),
|
|
109
|
+
react_1.default.createElement("div", { style: {
|
|
110
|
+
background: "linear-gradient(to right, red, green, blue)",
|
|
111
|
+
color: "black",
|
|
112
|
+
"--digital-blue": "black",
|
|
113
|
+
} },
|
|
114
|
+
react_1.default.createElement(BucketFill_1.default, Object.assign({}, args, { fillTo: fillTo, background: "linear-gradient(to right, red, green, blue)" }),
|
|
115
|
+
react_1.default.createElement("h1", null, "First step"),
|
|
116
|
+
react_1.default.createElement("div", null,
|
|
117
|
+
react_1.default.createElement("p", null, "Second"),
|
|
118
|
+
react_1.default.createElement("p", null, "step")),
|
|
119
|
+
react_1.default.createElement("p", null, "Third step"),
|
|
120
|
+
react_1.default.createElement("div", { style: {} },
|
|
121
|
+
react_1.default.createElement(MutableHamburgerButton_1.default, { state: "loading", size: 180 }),
|
|
122
|
+
"Fourth step"))))));
|
|
123
|
+
};
|
|
124
|
+
exports.AutoFill = AutoFill;
|
|
125
|
+
exports.AutoFill.args = {};
|
|
126
|
+
const Sandbox = (args) => {
|
|
127
|
+
return (react_1.default.createElement(react_1.default.Fragment, null,
|
|
128
|
+
react_1.default.createElement("div", null,
|
|
129
|
+
react_1.default.createElement(BucketFill_1.default, Object.assign({}, args),
|
|
130
|
+
react_1.default.createElement("h1", null, "First step"),
|
|
131
|
+
react_1.default.createElement("div", null,
|
|
132
|
+
react_1.default.createElement("p", null, "Second"),
|
|
133
|
+
react_1.default.createElement("p", null, "step")),
|
|
134
|
+
react_1.default.createElement("p", null, "Third step"),
|
|
135
|
+
react_1.default.createElement("div", { style: {} },
|
|
136
|
+
react_1.default.createElement(Button_1.default, null, "sajdnasnd"),
|
|
137
|
+
react_1.default.createElement(MutableHamburgerButton_1.default, { state: "loading", size: 180 }),
|
|
138
|
+
react_1.default.createElement("p", null, "Fourth step"))))));
|
|
139
|
+
};
|
|
140
|
+
exports.Sandbox = Sandbox;
|
|
141
|
+
//# sourceMappingURL=BucketFill.stories.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"BucketFill.stories.js","sourceRoot":"","sources":["../../../src/components/BucketFill/BucketFill.stories.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { default } from './BucketFill';
|
|
@@ -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 BucketFill_1 = require("./BucketFill");
|
|
8
|
+
Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(BucketFill_1).default; } });
|
|
9
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/BucketFill/index.tsx"],"names":[],"mappings":";;;;;;AAAA,2CAAuC;AAA9B,sHAAA,OAAO,OAAA"}
|
|
@@ -19,7 +19,7 @@ declare const _default: React.ForwardRefExoticComponent<Pick<Omit<{
|
|
|
19
19
|
messages: {
|
|
20
20
|
invalidEmail: string;
|
|
21
21
|
};
|
|
22
|
-
}, "
|
|
22
|
+
}, "className" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "children" | "default" | "size" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "disabled" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "name" | "nonce" | "noValidate" | "open" | "optimum" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "target" | "type" | "useMap" | "value" | "width" | "wmode" | "wrap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "error" | "border" | "Icon" | "messages" | "icon" | "hideError" | "disclaimer" | "multiline" | "decoration"> & React.RefAttributes<{
|
|
23
23
|
validateEmail: (email: string) => boolean;
|
|
24
24
|
}>>;
|
|
25
25
|
export default _default;
|
|
@@ -19,7 +19,7 @@ declare const _default: {
|
|
|
19
19
|
messages: {
|
|
20
20
|
invalidEmail: string;
|
|
21
21
|
};
|
|
22
|
-
}, "
|
|
22
|
+
}, "className" | "cite" | "data" | "form" | "label" | "slot" | "span" | "style" | "summary" | "title" | "pattern" | "children" | "default" | "size" | "accept" | "acceptCharset" | "action" | "allowFullScreen" | "allowTransparency" | "alt" | "as" | "async" | "autoComplete" | "autoFocus" | "autoPlay" | "capture" | "cellPadding" | "cellSpacing" | "charSet" | "challenge" | "checked" | "classID" | "cols" | "colSpan" | "content" | "controls" | "coords" | "crossOrigin" | "dateTime" | "defer" | "disabled" | "download" | "encType" | "formAction" | "formEncType" | "formMethod" | "formNoValidate" | "formTarget" | "frameBorder" | "headers" | "height" | "high" | "href" | "hrefLang" | "htmlFor" | "httpEquiv" | "integrity" | "keyParams" | "keyType" | "kind" | "list" | "loop" | "low" | "manifest" | "marginHeight" | "marginWidth" | "max" | "maxLength" | "media" | "mediaGroup" | "method" | "min" | "minLength" | "multiple" | "muted" | "name" | "nonce" | "noValidate" | "open" | "optimum" | "placeholder" | "playsInline" | "poster" | "preload" | "readOnly" | "rel" | "required" | "reversed" | "rows" | "rowSpan" | "sandbox" | "scope" | "scoped" | "scrolling" | "seamless" | "selected" | "shape" | "sizes" | "src" | "srcDoc" | "srcLang" | "srcSet" | "start" | "step" | "target" | "type" | "useMap" | "value" | "width" | "wmode" | "wrap" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "key" | "error" | "border" | "Icon" | "messages" | "icon" | "hideError" | "disclaimer" | "multiline" | "decoration"> & React.RefAttributes<{
|
|
23
23
|
validateEmail: (email: string) => boolean;
|
|
24
24
|
}>>;
|
|
25
25
|
title: string;
|
|
@@ -3,6 +3,6 @@ import React from "react";
|
|
|
3
3
|
* A hamburger button that mutates according to it's state
|
|
4
4
|
**/
|
|
5
5
|
export default function MutableHamburgerButton({ state, size, className, ...props }: {
|
|
6
|
-
state?: "default" | "closed" | "arrow-up" | "arrow-down" | "search";
|
|
6
|
+
state?: "default" | "closed" | "arrow-up" | "arrow-down" | "search" | "loading" | "checkmark";
|
|
7
7
|
size: number;
|
|
8
8
|
} & React.HTMLProps<HTMLDivElement>): JSX.Element;
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
@use 'sass:math';
|
|
1
2
|
@import "../../assets/styles/index.scss";
|
|
2
3
|
|
|
3
|
-
$slice: 1
|
|
4
|
+
$slice: math.div(1, 7);
|
|
4
5
|
|
|
5
6
|
.container {
|
|
6
7
|
box-sizing: content-box;
|
|
@@ -14,18 +15,33 @@ $slice: 1/7;
|
|
|
14
15
|
background-size: 0 0;
|
|
15
16
|
background-repeat: no-repeat;
|
|
16
17
|
transition: transform 250ms;
|
|
18
|
+
transition-timing-function: ease-in-out;
|
|
17
19
|
&:active {
|
|
18
20
|
transform: scale(0.9);
|
|
19
21
|
}
|
|
20
22
|
> * {
|
|
23
|
+
flex-shrink: 0;
|
|
21
24
|
box-sizing: content-box;
|
|
22
25
|
width: 0.8em;
|
|
23
26
|
height: #{$slice}em;
|
|
24
|
-
border-radius: #{$slice
|
|
25
|
-
transition: transform $veryFast, width $veryFast
|
|
27
|
+
border-radius: #{math.div($slice, 2)}em;
|
|
28
|
+
transition: transform $veryFast, width $veryFast, height $veryFast,
|
|
29
|
+
border-width $veryFast, background-color $veryFast,
|
|
30
|
+
border-radius $veryFast;
|
|
26
31
|
background: var(--mutable-hamburger-background, $digitalBlue);
|
|
27
32
|
background-size: 1em 1em;
|
|
28
33
|
background-repeat: no-repeat;
|
|
34
|
+
border: 0em solid #0000;
|
|
35
|
+
&:nth-child(1) {
|
|
36
|
+
border-top-color: var(--mutable-hamburger-background, $digitalBlue);
|
|
37
|
+
}
|
|
38
|
+
&:nth-child(2) {
|
|
39
|
+
border-right-color: var(--mutable-hamburger-background, $digitalBlue);
|
|
40
|
+
}
|
|
41
|
+
&:nth-child(3) {
|
|
42
|
+
border-bottom-color: var(--mutable-hamburger-background, $digitalBlue);
|
|
43
|
+
border-left-color: var(--mutable-hamburger-background, $digitalBlue);
|
|
44
|
+
}
|
|
29
45
|
}
|
|
30
46
|
& > * {
|
|
31
47
|
background-position-x: -0.1em;
|
|
@@ -89,20 +105,72 @@ $slice: 1/7;
|
|
|
89
105
|
height: #{$slice * $rate}em;
|
|
90
106
|
border-radius: #{$slice * $rate * 2}em;
|
|
91
107
|
background-color: transparent;
|
|
92
|
-
border: #{$slice
|
|
108
|
+
border: #{math.div($slice, 1.35)}em solid
|
|
93
109
|
var(--mutable-hamburger-background, $digitalBlue);
|
|
94
110
|
transform: translateX(-0.15em);
|
|
95
111
|
}
|
|
96
112
|
> :nth-child(2) {
|
|
97
113
|
transform: translateX(0.12em) translateY(-0.05em) rotateZ(45deg);
|
|
98
|
-
height: #{$slice
|
|
114
|
+
height: #{math.div($slice, 1.35)}em;
|
|
99
115
|
width: 0.55em;
|
|
100
116
|
}
|
|
101
117
|
> :nth-child(3) {
|
|
102
118
|
transform: translateX(0.12em) translateY(-#{($slice * 1.3) + 0.05}em)
|
|
103
119
|
rotateZ(45deg);
|
|
104
|
-
height: #{$slice
|
|
120
|
+
height: #{math.div($slice, 1.35)}em;
|
|
105
121
|
width: 0.55em;
|
|
106
122
|
}
|
|
107
123
|
}
|
|
124
|
+
|
|
125
|
+
&.checkmark {
|
|
126
|
+
> :nth-child(1) {
|
|
127
|
+
transform: translateY(#{$slice * 2}em) translateX(-0.178em)
|
|
128
|
+
translateY(0.13em) rotate(45deg);
|
|
129
|
+
height: #{$slice}em;
|
|
130
|
+
width: 0.45em;
|
|
131
|
+
}
|
|
132
|
+
> :nth-child(2) {
|
|
133
|
+
height: #{$slice}em;
|
|
134
|
+
width: 0.7em;
|
|
135
|
+
transform: translateX(0.1em) rotate(-55deg);
|
|
136
|
+
}
|
|
137
|
+
> :nth-child(3) {
|
|
138
|
+
transform: translateY(-#{$slice * 2}em) translateX(0.1em) rotate(-55deg);
|
|
139
|
+
height: #{$slice}em;
|
|
140
|
+
width: 0.7em;
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
&.loading {
|
|
145
|
+
$slice: math.div(1, 6);
|
|
146
|
+
@keyframes rotate {
|
|
147
|
+
0% {
|
|
148
|
+
transform: rotate(0deg);
|
|
149
|
+
}
|
|
150
|
+
100% {
|
|
151
|
+
transform: rotate(360deg);
|
|
152
|
+
}
|
|
153
|
+
}
|
|
154
|
+
animation-name: rotate;
|
|
155
|
+
animation-duration: 1s;
|
|
156
|
+
animation-delay: $veryFast;
|
|
157
|
+
animation-iteration-count: infinite;
|
|
158
|
+
animation-timing-function: linear;
|
|
159
|
+
> * {
|
|
160
|
+
background-color: #0000;
|
|
161
|
+
width: #{$slice * 2.5}em;
|
|
162
|
+
height: #{$slice * 2.5}em;
|
|
163
|
+
border-radius: #{$slice * 2.5}em;
|
|
164
|
+
border-width: #{$slice}em;
|
|
165
|
+
}
|
|
166
|
+
> :nth-child(1) {
|
|
167
|
+
transform: translateY(#{$slice * 4.5}em);
|
|
168
|
+
}
|
|
169
|
+
> :nth-child(2) {
|
|
170
|
+
transform: rotateZ(-5deg);
|
|
171
|
+
}
|
|
172
|
+
> :nth-child(3) {
|
|
173
|
+
transform: translateY(-#{$slice * 4.5}em) rotateZ(-95deg);
|
|
174
|
+
}
|
|
175
|
+
}
|
|
108
176
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from
|
|
1
|
+
import React from "react";
|
|
2
2
|
import MutableHamburgerButton from "./MutableHamburgerButton";
|
|
3
3
|
declare const _default: {
|
|
4
4
|
component: typeof MutableHamburgerButton;
|
|
@@ -8,7 +8,14 @@ export default _default;
|
|
|
8
8
|
export declare const InitialImplementation: {
|
|
9
9
|
(args: any): JSX.Element;
|
|
10
10
|
args: Partial<{
|
|
11
|
-
state?: "
|
|
11
|
+
state?: "search" | "default" | "closed" | "arrow-up" | "arrow-down" | "loading" | "checkmark" | undefined;
|
|
12
|
+
size: number;
|
|
13
|
+
} & React.HTMLProps<HTMLDivElement>>;
|
|
14
|
+
};
|
|
15
|
+
export declare const TransitionToLoader: {
|
|
16
|
+
(args: any): JSX.Element;
|
|
17
|
+
args: Partial<{
|
|
18
|
+
state?: "search" | "default" | "closed" | "arrow-up" | "arrow-down" | "loading" | "checkmark" | undefined;
|
|
12
19
|
size: number;
|
|
13
20
|
} & React.HTMLProps<HTMLDivElement>>;
|
|
14
21
|
};
|
|
@@ -1,16 +1,74 @@
|
|
|
1
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
|
+
};
|
|
2
25
|
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
26
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
27
|
};
|
|
5
28
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.InitialImplementation = void 0;
|
|
7
|
-
const react_1 =
|
|
29
|
+
exports.TransitionToLoader = exports.InitialImplementation = void 0;
|
|
30
|
+
const react_1 = __importStar(require("react"));
|
|
8
31
|
const MutableHamburgerButton_1 = __importDefault(require("./MutableHamburgerButton"));
|
|
9
32
|
exports.default = {
|
|
10
33
|
component: MutableHamburgerButton_1.default,
|
|
11
|
-
title: "Mutable Hamburger Button"
|
|
34
|
+
title: "Mutable Hamburger Button",
|
|
12
35
|
};
|
|
13
|
-
const InitialImplementation = (args) => react_1.default.createElement(
|
|
36
|
+
const InitialImplementation = (args) => (react_1.default.createElement("div", { style: { backgroundColor: "#00f5", display: "inline-block" } },
|
|
37
|
+
react_1.default.createElement(MutableHamburgerButton_1.default, Object.assign({}, args))));
|
|
14
38
|
exports.InitialImplementation = InitialImplementation;
|
|
15
|
-
exports.InitialImplementation.args = {
|
|
39
|
+
exports.InitialImplementation.args = {
|
|
40
|
+
size: window.screen.availHeight * 0.4,
|
|
41
|
+
};
|
|
42
|
+
const TransitionToLoader = (args) => {
|
|
43
|
+
const [s, ss] = (0, react_1.useState)("closed");
|
|
44
|
+
function randomState() {
|
|
45
|
+
const r = Math.random();
|
|
46
|
+
if (r < 0.2) {
|
|
47
|
+
return "default";
|
|
48
|
+
}
|
|
49
|
+
else if (r < 0.4) {
|
|
50
|
+
return "arrow-down";
|
|
51
|
+
}
|
|
52
|
+
else if (r < 0.6) {
|
|
53
|
+
return "arrow-up";
|
|
54
|
+
}
|
|
55
|
+
else if (r < 0.8) {
|
|
56
|
+
return "closed";
|
|
57
|
+
}
|
|
58
|
+
else {
|
|
59
|
+
return "search";
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
(0, react_1.useEffect)(() => {
|
|
63
|
+
const o = setInterval(() => {
|
|
64
|
+
ss((p) => (p !== "loading" ? "loading" : randomState()));
|
|
65
|
+
}, 500);
|
|
66
|
+
return () => clearInterval(o);
|
|
67
|
+
});
|
|
68
|
+
return react_1.default.createElement(MutableHamburgerButton_1.default, Object.assign({}, args, { state: s }));
|
|
69
|
+
};
|
|
70
|
+
exports.TransitionToLoader = TransitionToLoader;
|
|
71
|
+
exports.TransitionToLoader.args = {
|
|
72
|
+
size: window.screen.availHeight * 0.4,
|
|
73
|
+
};
|
|
16
74
|
//# sourceMappingURL=MutableHamburgerButton.stories.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MutableHamburgerButton.stories.js","sourceRoot":"","sources":["../../../src/components/MutableHamburgerButton/MutableHamburgerButton.stories.tsx"],"names":[],"mappings":"
|
|
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;IAC7D,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"}
|
|
@@ -9,5 +9,7 @@ export declare function _Text({ type, children, className, ...otherProps }: Reac
|
|
|
9
9
|
declare const _default: React.ForwardRefExoticComponent<{
|
|
10
10
|
className?: string | undefined;
|
|
11
11
|
type: "link" | "caption" | "title" | "content" | "description" | "error" | "highlightTitle" | "highlight" | "subtitle" | "boldTitle" | "boldTitleBig";
|
|
12
|
-
} & React.HTMLAttributes<HTMLParagraphElement> &
|
|
12
|
+
} & React.HTMLAttributes<HTMLParagraphElement> & {
|
|
13
|
+
children?: React.ReactNode;
|
|
14
|
+
} & React.RefAttributes<unknown>>;
|
|
13
15
|
export default _default;
|
|
@@ -37,7 +37,9 @@ declare type Props = {
|
|
|
37
37
|
*/
|
|
38
38
|
Content: (props: WalletConnectionProps) => ReactElement;
|
|
39
39
|
};
|
|
40
|
-
declare const _default: React.ForwardRefExoticComponent<Props &
|
|
40
|
+
declare const _default: React.ForwardRefExoticComponent<Props & {
|
|
41
|
+
children?: React.ReactNode;
|
|
42
|
+
} & React.RefAttributes<{
|
|
41
43
|
connect: () => Promise<void>;
|
|
42
44
|
disconnect: () => void;
|
|
43
45
|
}>>;
|
|
@@ -15,6 +15,8 @@ declare const _default: {
|
|
|
15
15
|
changeChainId: () => void;
|
|
16
16
|
}> | undefined;
|
|
17
17
|
Content: (props: import("./WalletConnectionWrapper").WalletConnectionProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
18
|
+
} & {
|
|
19
|
+
children?: React.ReactNode;
|
|
18
20
|
} & React.RefAttributes<{
|
|
19
21
|
connect: () => Promise<void>;
|
|
20
22
|
disconnect: () => void;
|
|
@@ -36,6 +38,8 @@ export declare const BasicUsage: {
|
|
|
36
38
|
changeChainId: () => void;
|
|
37
39
|
}> | undefined;
|
|
38
40
|
Content: (props: import("./WalletConnectionWrapper").WalletConnectionProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
41
|
+
} & {
|
|
42
|
+
children?: React.ReactNode;
|
|
39
43
|
} & React.RefAttributes<{
|
|
40
44
|
connect: () => Promise<void>;
|
|
41
45
|
disconnect: () => void;
|
|
@@ -56,6 +60,7 @@ export declare const UsageWithActionProps: {
|
|
|
56
60
|
changeChainId: () => void;
|
|
57
61
|
}> | undefined;
|
|
58
62
|
Content: (props: import("./WalletConnectionWrapper").WalletConnectionProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
|
|
63
|
+
children?: React.ReactNode;
|
|
59
64
|
ref?: React.Ref<{
|
|
60
65
|
connect: () => Promise<void>;
|
|
61
66
|
disconnect: () => void;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* This propagates the utilitary functions
|
|
3
|
+
*/
|
|
4
|
+
export declare function AsyncProcessQueueProvider(): void;
|
|
5
|
+
/**
|
|
6
|
+
* This function wraps other async functions and decides when the ongoing promise should be put on the queue or not
|
|
7
|
+
*/
|
|
8
|
+
export declare function useAsyncProcessQueue<T extends {
|
|
9
|
+
[k: string]: (...args: any[]) => Promise<any>;
|
|
10
|
+
}>(functionsToQueue: T): T;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.useAsyncProcessQueue = exports.AsyncProcessQueueProvider = void 0;
|
|
4
|
+
/**
|
|
5
|
+
* This propagates the utilitary functions
|
|
6
|
+
*/
|
|
7
|
+
function AsyncProcessQueueProvider() { }
|
|
8
|
+
exports.AsyncProcessQueueProvider = AsyncProcessQueueProvider;
|
|
9
|
+
/**
|
|
10
|
+
* This function wraps other async functions and decides when the ongoing promise should be put on the queue or not
|
|
11
|
+
*/
|
|
12
|
+
function useAsyncProcessQueue(functionsToQueue) {
|
|
13
|
+
return functionsToQueue;
|
|
14
|
+
}
|
|
15
|
+
exports.useAsyncProcessQueue = useAsyncProcessQueue;
|
|
16
|
+
//# sourceMappingURL=AsyncProcessQueue.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AsyncProcessQueue.js","sourceRoot":"","sources":["../../src/context/AsyncProcessQueue.tsx"],"names":[],"mappings":";;;AAAA;;GAEG;AACH,SAAgB,yBAAyB,KAAI,CAAC;AAA9C,8DAA8C;AAE9C;;GAEG;AACH,SAAgB,oBAAoB,CAIlC,gBAAmB;IACnB,OAAO,gBAAgB,CAAC;AAC1B,CAAC;AAND,oDAMC"}
|
|
@@ -0,0 +1,54 @@
|
|
|
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
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
+
const react_router_dom_1 = require("react-router-dom");
|
|
27
|
+
const history_1 = require("history");
|
|
28
|
+
const react_1 = __importStar(require("react"));
|
|
29
|
+
function CustomBrowserRouter({ children, }) {
|
|
30
|
+
const { current: historyCustom } = (0, react_1.useRef)((0, history_1.createBrowserHistory)());
|
|
31
|
+
(0, react_1.useLayoutEffect)(() => {
|
|
32
|
+
function overrideFunction(name) {
|
|
33
|
+
const orig = historyCustom[name];
|
|
34
|
+
historyCustom[name] = (route, state, ...args) => {
|
|
35
|
+
var _a, _b, _c, _d;
|
|
36
|
+
const isReplacingAnInternalNavigation = name === "replace" && ((_b = (_a = history.state) === null || _a === void 0 ? void 0 : _a.state) === null || _b === void 0 ? void 0 : _b.internalNavigation);
|
|
37
|
+
const isARouteChange = name !== "replace";
|
|
38
|
+
if ((isARouteChange || isReplacingAnInternalNavigation) && !state)
|
|
39
|
+
state = {};
|
|
40
|
+
if (state)
|
|
41
|
+
state.internalNavigation =
|
|
42
|
+
name === "replace"
|
|
43
|
+
? (_d = (_c = history.state) === null || _c === void 0 ? void 0 : _c.state) === null || _d === void 0 ? void 0 : _d.internalNavigation
|
|
44
|
+
: true;
|
|
45
|
+
return orig(route, state, ...args);
|
|
46
|
+
};
|
|
47
|
+
}
|
|
48
|
+
overrideFunction("push");
|
|
49
|
+
overrideFunction("replace");
|
|
50
|
+
}, [historyCustom]);
|
|
51
|
+
return react_1.default.createElement(react_router_dom_1.Router, { history: historyCustom }, children);
|
|
52
|
+
}
|
|
53
|
+
exports.default = CustomBrowserRouter;
|
|
54
|
+
//# sourceMappingURL=CustomBrowserRouter.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CustomBrowserRouter.js","sourceRoot":"","sources":["../../src/context/CustomBrowserRouter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,uDAAsD;AACtD,qCAA+C;AAC/C,+CAKe;AAMf,SAAwB,mBAAmB,CAAC,EAC1C,QAAQ,GACc;IACtB,MAAM,EAAE,OAAO,EAAE,aAAa,EAAE,GAAG,IAAA,cAAM,EAAC,IAAA,8BAAoB,GAAO,CAAC,CAAC;IACvE,IAAA,uBAAe,EAAC,GAAG,EAAE;QACnB,SAAS,gBAAgB,CAAC,IAAgC;YACxD,MAAM,IAAI,GAAG,aAAa,CAAC,IAAI,CAAQ,CAAC;YACvC,aAAqB,CAAC,IAAI,CAAC,GAAG,CAC7B,KAAa,EACb,KAAyB,EACzB,GAAG,IAAW,EACd,EAAE;;gBACF,MAAM,+BAA+B,GACnC,IAAI,KAAK,SAAS,KAAI,MAAA,MAAA,OAAO,CAAC,KAAK,0CAAE,KAAK,0CAAE,kBAAkB,CAAA,CAAC;gBACjE,MAAM,cAAc,GAAG,IAAI,KAAK,SAAS,CAAC;gBAC1C,IAAI,CAAC,cAAc,IAAI,+BAA+B,CAAC,IAAI,CAAC,KAAK;oBAC/D,KAAK,GAAG,EAAE,CAAC;gBACb,IAAI,KAAK;oBACP,KAAK,CAAC,kBAAkB;wBACtB,IAAI,KAAK,SAAS;4BAChB,CAAC,CAAC,MAAA,MAAA,OAAO,CAAC,KAAK,0CAAE,KAAK,0CAAE,kBAAkB;4BAC1C,CAAC,CAAC,IAAI,CAAC;gBACb,OAAO,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC,CAAC;YACrC,CAAC,CAAC;QACJ,CAAC;QACD,gBAAgB,CAAC,MAAM,CAAC,CAAC;QACzB,gBAAgB,CAAC,SAAS,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IACpB,OAAO,8BAAC,yBAAM,IAAC,OAAO,EAAE,aAAa,IAAG,QAAQ,CAAU,CAAC;AAC7D,CAAC;AA7BD,sCA6BC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
export default function useCustomHistory(): {
|
|
2
|
+
goBackWithFallback(fallbackRoute: string): void;
|
|
3
|
+
length: number;
|
|
4
|
+
action: import("history").Action;
|
|
5
|
+
location: import("history").Location<unknown>;
|
|
6
|
+
push(location: import("history").LocationDescriptor<unknown>, state?: unknown): void;
|
|
7
|
+
replace(location: import("history").LocationDescriptor<unknown>, state?: unknown): void;
|
|
8
|
+
go(n: number): void;
|
|
9
|
+
goBack(): void;
|
|
10
|
+
goForward(): void;
|
|
11
|
+
block(prompt?: string | boolean | import("history").TransitionPromptHook<unknown> | undefined): import("history").UnregisterCallback;
|
|
12
|
+
listen(listener: import("history").LocationListener<unknown>): import("history").UnregisterCallback;
|
|
13
|
+
createHref(location: import("history").LocationDescriptorObject<unknown>): string;
|
|
14
|
+
};
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
const react_router_dom_1 = require("react-router-dom");
|
|
4
|
+
function useCustomHistory() {
|
|
5
|
+
const customHistory = (0, react_router_dom_1.useHistory)();
|
|
6
|
+
const { state } = (0, react_router_dom_1.useLocation)();
|
|
7
|
+
return Object.assign(Object.assign({}, customHistory), { goBackWithFallback(fallbackRoute) {
|
|
8
|
+
if (state === null || state === void 0 ? void 0 : state.internalNavigation)
|
|
9
|
+
customHistory.goBack();
|
|
10
|
+
else
|
|
11
|
+
customHistory.replace(fallbackRoute);
|
|
12
|
+
} });
|
|
13
|
+
}
|
|
14
|
+
exports.default = useCustomHistory;
|
|
15
|
+
//# sourceMappingURL=useCustomHistory.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useCustomHistory.js","sourceRoot":"","sources":["../../src/hooks/useCustomHistory.ts"],"names":[],"mappings":";;AAAA,uDAA0D;AAG1D,SAAwB,gBAAgB;IACpC,MAAM,aAAa,GAAG,IAAA,6BAAU,GAAE,CAAC;IACnC,MAAM,EAAE,KAAK,EAAE,GAAG,IAAA,8BAAW,GAA2B,CAAC;IACzD,uCACO,aAAa,KAChB,kBAAkB,CAAC,aAAqB;YACpC,IAAI,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,kBAAkB;gBAAE,aAAa,CAAC,MAAM,EAAE,CAAC;;gBACjD,aAAa,CAAC,OAAO,CAAC,aAAa,CAAC,CAAC;QAC9C,CAAC,IACJ;AACL,CAAC;AAVD,mCAUC"}
|
|
File without changes
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useImprovedHistory.js","sourceRoot":"","sources":["../../src/hooks/useImprovedHistory.ts"],"names":[],"mappings":""}
|
package/package.json
CHANGED
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@onepercentio/one-ui",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.1",
|
|
4
4
|
"description": "A set of reusable components created through the development of Onepercent projects",
|
|
5
5
|
"files": [
|
|
6
6
|
"dist",
|
|
7
7
|
"WebpackConfigs",
|
|
8
|
-
"cypress/support"
|
|
8
|
+
"cypress/support",
|
|
9
|
+
"src/types.d.ts"
|
|
9
10
|
],
|
|
10
11
|
"bin": {
|
|
11
12
|
"start-emulator": "scripts/start-emulator.js"
|
|
@@ -33,6 +34,7 @@
|
|
|
33
34
|
"@types/jest": "^27.4.0",
|
|
34
35
|
"@types/node": "^17.0.13",
|
|
35
36
|
"@types/react": "^18.0.5",
|
|
37
|
+
"@types/react-router-dom": "^5.3.3",
|
|
36
38
|
"assert": "^2.0.0",
|
|
37
39
|
"babel-loader": "^8.2.3",
|
|
38
40
|
"buffer": "^6.0.3",
|
|
@@ -54,6 +56,7 @@
|
|
|
54
56
|
"react-docgen-typescript-plugin": "^1.0.1",
|
|
55
57
|
"react-dom": "^18.0.0",
|
|
56
58
|
"react-intl": "^5.24.4",
|
|
59
|
+
"react-router-dom": "^5",
|
|
57
60
|
"react-scripts": "^5.0.0",
|
|
58
61
|
"sass": "^1.43.4",
|
|
59
62
|
"sass-loader": "^10",
|
package/src/types.d.ts
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
type PrependNextNum<A extends Array<unknown>> = A['length'] extends infer T ? ((t: T, ...a: A) => void) extends ((...x: infer X) => void) ? X : never : never;
|
|
2
|
+
|
|
3
|
+
type EnumerateInternal<A extends Array<unknown>, N extends number> = { 0: A, 1: EnumerateInternal<PrependNextNum<A>, N> }[N extends A['length'] ? 0 : 1];
|
|
4
|
+
|
|
5
|
+
export type Enumerate<N extends number> = EnumerateInternal<[], N> extends (infer E)[] ? E : never;
|
|
6
|
+
|
|
7
|
+
export type Range<FROM extends number, TO extends number> = Exclude<Enumerate<TO>, Enumerate<FROM>>;
|
|
8
|
+
|
|
9
|
+
export type CommonErrorCodes = "UNEXPECTED_ERROR";
|
|
10
|
+
|
|
11
|
+
type Decompose<O extends object> = O;
|
|
12
|
+
|
|
13
|
+
export type BasicContext<T extends object> = {
|
|
14
|
+
set: <P extends keyof T>(p: P, value: T[typeof p]) => void;
|
|
15
|
+
} & T;
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* This is usefull for omitting props from union
|
|
19
|
+
* Check whz contestation model to see an example
|
|
20
|
+
*
|
|
21
|
+
* If different models with different properties use the native Omit<O>
|
|
22
|
+
* Their differences are also omitted generating a single model
|
|
23
|
+
*
|
|
24
|
+
* This typing solves that
|
|
25
|
+
*/
|
|
26
|
+
export type DistributiveOmit<T, K extends keyof any> = T extends any
|
|
27
|
+
? Omit<T, K>
|
|
28
|
+
: never;
|
|
29
|
+
|
|
30
|
+
declare global {
|
|
31
|
+
interface Window {
|
|
32
|
+
ethereum: any;
|
|
33
|
+
PRERENDER: boolean;
|
|
34
|
+
Cypress: any;
|
|
35
|
+
}
|
|
36
|
+
}
|