tek-wallet 0.0.165 → 0.0.168

package/dist/components/ui/ConfirmByPasscode/index.d.ts

@@ -1,12 +1,12 @@
 import { GeneralProps } from "../../../types/ui";
 import { ActionConfirm } from "../ConfirmLayout/type";
-interface ConfirmByPasscodeProps extends GeneralProps {
+import { DrawerComponentProps, DrawerComponentRef } from "../DrawerComponent";
+interface ConfirmByPasscodeProps extends Omit<GeneralProps, "onclick" | "sx" | "onClick">, DrawerComponentProps {
     onConfirmSuccess?: (value: string) => any;
     action: ActionConfirm;
-    onClose?: () => void;
 }
-export interface ConfirmByPasscodeRef {
+export interface ConfirmByPasscodeRef extends Omit<DrawerComponentRef, "trigger"> {
     clearData: () => void;
 }
-declare const ConfirmByPasscode: import("react").ForwardRefExoticComponent<ConfirmByPasscodeProps & import("react").RefAttributes<ConfirmByPasscodeRef>>;
+declare const ConfirmByPasscode: import("react").ForwardRefExoticComponent<Omit<ConfirmByPasscodeProps, "ref"> & import("react").RefAttributes<ConfirmByPasscodeRef>>;
 export default ConfirmByPasscode;

package/dist/components/ui/ConfirmByPasscode/index.js

@@ -91,44 +91,64 @@ var Text_1 = __importDefault(require("../../../components/ui/Text"));
 var ModalLayout_1 = __importDefault(require("../ModalLayout"));
 var material_1 = require("@mui/material");
 var LoadingLayout_1 = __importDefault(require("../LoadingLayout"));
+var DrawerComponent_1 = __importDefault(require("../DrawerComponent"));
 var passcodeLength = 6;
 var ConfirmByPasscode = (0, react_1.forwardRef)(function (props, ref) {
     var action = props.action, onConfirmSuccess = props.onConfirmSuccess;
     var theme = (0, material_1.useTheme)();
     var _a = (0, react_1.useState)(""), otp = _a[0], setOtp = _a[1];
     var loadingRef = (0, react_1.useRef)(null);
+    var drawerRef = (0, react_1.useRef)(null);
     (0, react_1.useImperativeHandle)(ref, function () { return ({
         clearData: function () {
             setOtp("");
         },
+        open: function () {
+            var _a;
+            (_a = drawerRef.current) === null || _a === void 0 ? void 0 : _a.open();
+        },
+        close: function () {
+            var _a;
+            (_a = drawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
+        },
+        lockStatus: function () {
+            var _a;
+            (_a = drawerRef.current) === null || _a === void 0 ? void 0 : _a.lockStatus();
+        },
+        unlockStatus: function () {
+            var _a;
+            (_a = drawerRef.current) === null || _a === void 0 ? void 0 : _a.unlockStatus();
+        },
     }); });
     var handleOtpChange = function (value) { return __awaiter(void 0, void 0, void 0, function () {
         var err_1;
-        var _a, _b;
-        return __generator(this, function (_c) {
-            switch (_c.label) {
+        var _a, _b, _c, _d, _e;
+        return __generator(this, function (_f) {
+            switch (_f.label) {
                 case 0:
-                    _c.trys.push([0, 3, , 4]);
+                    _f.trys.push([0, 3, , 4]);
                     setOtp(value);
                     if (!(value.length === passcodeLength)) return [3 /*break*/, 2];
                     (_a = loadingRef.current) === null || _a === void 0 ? void 0 : _a.startLoading();
+                    (_b = drawerRef.current) === null || _b === void 0 ? void 0 : _b.lockStatus();
                     return [4 /*yield*/, new Promise(function (resolve) { return setTimeout(resolve, 1000); })];
                 case 1:
-                    _c.sent();
+                    _f.sent();
+                    (_c = drawerRef.current) === null || _c === void 0 ? void 0 : _c.unlockStatus();
+                    (_d = loadingRef.current) === null || _d === void 0 ? void 0 : _d.endLoading();
+                    (_e = drawerRef.current) === null || _e === void 0 ? void 0 : _e.close();
                     onConfirmSuccess === null || onConfirmSuccess === void 0 ? void 0 : onConfirmSuccess(value);
-                    (_b = loadingRef.current) === null || _b === void 0 ? void 0 : _b.endLoading();
-                    ref;
-                    _c.label = 2;
+                    _f.label = 2;
                 case 2: return [3 /*break*/, 4];
                 case 3:
-                    err_1 = _c.sent();
+                    err_1 = _f.sent();
                     console.error(err_1);
                     return [3 /*break*/, 4];
                 case 4: return [2 /*return*/];
             }
         });
     }); };
-    return ((0, jsx_runtime_1.jsx)(ModalLayout_1.default, { title: "Authentication", onClose: props.onClose, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { justifyContent: "center", alignItems: "center", gap: "1rem", width: "100%" }), children: [(0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.sessionTitle), children: ["Enter your passcode to confirm", " ", (0, jsx_runtime_1.jsx)(Text_1.default, { sx: { fontWeight: theme.typography.fontWeight600 }, children: action })] }), (0, jsx_runtime_1.jsx)(LoadingLayout_1.default, { initLoading: false, ref: loadingRef, children: (0, jsx_runtime_1.jsx)(OTP_1.default, { value: otp, onChange: handleOtpChange, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.PASSWORD }) })] }) }));
+    return ((0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: drawerRef, trigger: props.children, onOpen: props.onOpen, onClose: props.onClose, children: (0, jsx_runtime_1.jsx)(LoadingLayout_1.default, { initLoading: false, ref: loadingRef, sx: { width: "100%" }, children: (0, jsx_runtime_1.jsx)(ModalLayout_1.default, { title: "Authentication", onClose: props.onClose, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { justifyContent: "center", alignItems: "center", gap: "1rem", width: "100%" }), children: [(0, jsx_runtime_1.jsxs)(Text_1.default, { sx: __assign({}, theme.mixins.sessionTitle), children: ["Enter your passcode to confirm", " ", (0, jsx_runtime_1.jsx)(Text_1.default, { sx: { fontWeight: theme.typography.fontWeight600 }, children: action })] }), (0, jsx_runtime_1.jsx)("form", { autoComplete: "off", children: (0, jsx_runtime_1.jsx)(OTP_1.default, { value: otp, onChange: handleOtpChange, numInputs: passcodeLength, otpInputType: OTP_1.OtpInputType.PASSWORD }) })] }) }) }) }));
 });
 ConfirmByPasscode.displayName = "ConfirmByPasscode";
 exports.default = ConfirmByPasscode;

package/dist/components/ui/ConfirmLayout/index.d.ts

@@ -1,8 +1,7 @@
-import { GeneralProps } from "../../../types/ui";
 import { DrawerComponentProps, DrawerComponentRef } from "../DrawerComponent";
 import { ActionConfirm } from "./type";
-export interface ConfirmLayoutProps extends GeneralProps, DrawerComponentProps {
+export interface ConfirmLayoutProps extends DrawerComponentProps {
     action: ActionConfirm;
 }
-declare const ConfirmLayout: import("react").ForwardRefExoticComponent<ConfirmLayoutProps & import("react").RefAttributes<DrawerComponentRef>>;
+declare const ConfirmLayout: import("react").ForwardRefExoticComponent<Omit<ConfirmLayoutProps, "ref"> & import("react").RefAttributes<DrawerComponentRef>>;
 export default ConfirmLayout;

package/dist/components/ui/DrawerComponent/index.d.ts

@@ -1,9 +1,10 @@
 import { GeneralProps, UnknownFunction } from "../../../types/ui";
+import { SwipeableDrawerProps } from "@mui/material";
 export declare enum DRAWER_DIRECTION {
     LEFT = "left",
     RIGHT = "right"
 }
-export interface DrawerComponentProps extends GeneralProps {
+export interface DrawerComponentProps extends Omit<GeneralProps, "onClick" | "sx">, Omit<SwipeableDrawerProps, "onClose" | "onToggle" | "onOpen"> {
     onOpen?: UnknownFunction;
     onClose?: UnknownFunction;
     trigger?: React.ReactNode;
@@ -13,6 +14,8 @@ export interface DrawerComponentProps extends GeneralProps {
 export interface DrawerComponentRef {
     open: () => void;
     close: () => void;
+    lockStatus: () => void;
+    unlockStatus: () => void;
 }
-declare const DrawerComponent: import("react").ForwardRefExoticComponent<DrawerComponentProps & import("react").RefAttributes<DrawerComponentRef>>;
+declare const DrawerComponent: import("react").ForwardRefExoticComponent<Omit<DrawerComponentProps, "ref"> & import("react").RefAttributes<DrawerComponentRef>>;
 export default DrawerComponent;

package/dist/components/ui/DrawerComponent/index.js

@@ -1,4 +1,26 @@
 "use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DRAWER_DIRECTION = void 0;
 var jsx_runtime_1 = require("react/jsx-runtime");
@@ -10,7 +32,10 @@ var DRAWER_DIRECTION;
     DRAWER_DIRECTION["RIGHT"] = "right";
 })(DRAWER_DIRECTION || (exports.DRAWER_DIRECTION = DRAWER_DIRECTION = {}));
 var DrawerComponent = (0, react_1.forwardRef)(function (props, ref) {
-    var _a = (0, react_1.useState)(false), isShowDrawerComponent = _a[0], setIsShowDrawerComponent = _a[1];
+    var _a;
+    var onOpen = props.onOpen, onClose = props.onClose, onToggle = props.onToggle, sx = props.sx, trigger = props.trigger, direction = props.direction, children = props.children, rest = __rest(props, ["onOpen", "onClose", "onToggle", "sx", "trigger", "direction", "children"]);
+    var _b = (0, react_1.useState)(false), isShowDrawerComponent = _b[0], setIsShowDrawerComponent = _b[1];
+    var isOpen = (0, react_1.useRef)(undefined);
     var handleOpen = function () {
         setIsShowDrawerComponent(true);
     };
@@ -18,31 +43,34 @@ var DrawerComponent = (0, react_1.forwardRef)(function (props, ref) {
         setIsShowDrawerComponent(false);
     };
     var toggle = function () {
-        var _a;
         setIsShowDrawerComponent(!isShowDrawerComponent);
-        (_a = props.onToggle) === null || _a === void 0 ? void 0 : _a.call(props, !isShowDrawerComponent);
+        onToggle === null || onToggle === void 0 ? void 0 : onToggle(!isShowDrawerComponent);
     };
     (0, react_1.useImperativeHandle)(ref, function () { return ({
         open: handleOpen,
         close: handleClose,
+        lockStatus: function () {
+            isOpen.current = isShowDrawerComponent;
+        },
+        unlockStatus: function () {
+            isOpen.current = undefined;
+        },
     }); });
-    var onClose = function (e) {
-        var _a;
+    var onDrawerClose = function (e) {
         setIsShowDrawerComponent(false);
-        (_a = props.onClose) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        onClose === null || onClose === void 0 ? void 0 : onClose(e);
     };
-    var onOpen = function (e) {
-        var _a;
+    var onDrawerOpen = function (e) {
         setIsShowDrawerComponent(true);
-        (_a = props.onOpen) === null || _a === void 0 ? void 0 : _a.call(props, e);
+        onOpen === null || onOpen === void 0 ? void 0 : onOpen(e);
     };
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: props.sx, onClick: toggle, children: props.trigger }), (0, jsx_runtime_1.jsx)(material_1.SwipeableDrawer, { sx: {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.Box, { sx: sx, onClick: toggle, children: trigger }), (0, jsx_runtime_1.jsx)(material_1.SwipeableDrawer, __assign({}, rest, { sx: {
                     "& .MuiDrawer-paper": {
                         backgroundColor: "transparent",
                         overflow: "hidden",
                         boxShadow: "none",
                     },
-                }, onOpen: onOpen, anchor: props.direction || "bottom", open: isShowDrawerComponent, onClose: onClose, children: props.children })] }));
+                }, onOpen: onDrawerOpen, anchor: direction || "bottom", open: (_a = isOpen.current) !== null && _a !== void 0 ? _a : isShowDrawerComponent, onClose: onDrawerClose, children: children }))] }));
 });
 DrawerComponent.displayName = "DrawerComponent";
 exports.default = DrawerComponent;

package/dist/components/ui/LockToken/index.d.ts

@@ -1,7 +1,6 @@
-import { GeneralProps } from "../../../types/ui";
 import { ConfirmLayoutProps } from "../ConfirmLayout";
 import { LockData } from "./type";
-interface LockTokenProps extends GeneralProps, Omit<ConfirmLayoutProps, "action"> {
+interface LockTokenProps extends Omit<ConfirmLayoutProps, "action"> {
     lockData: LockData;
 }
 declare const LockToken: (props: LockTokenProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/ui/LockToken/index.js

@@ -18,7 +18,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 var jsx_runtime_1 = require("react/jsx-runtime");
 var material_1 = require("@mui/material");
 var Button_1 = __importDefault(require("../../ui/Button"));
-var DrawerComponent_1 = __importDefault(require("../DrawerComponent"));
 var ConfirmLayout_1 = __importDefault(require("../ConfirmLayout"));
 var type_1 = require("../ConfirmLayout/type");
 var LineValue_1 = __importDefault(require("../LineValue"));
@@ -28,21 +27,11 @@ var react_1 = require("react");
 var LockToken = function (props) {
     var theme = (0, material_1.useTheme)();
     var confirmByPasscodeDrawerRef = (0, react_1.useRef)(null);
-    var confirmByPasscodeRef = (0, react_1.useRef)(null);
-    var handleClearConfirmData = function () {
-        var _a;
-        (_a = confirmByPasscodeRef.current) === null || _a === void 0 ? void 0 : _a.clearData();
-    };
-    var closeAuthModal = function () {
-        var _a, _b;
-        (_a = confirmByPasscodeDrawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
-        (_b = confirmByPasscodeRef.current) === null || _b === void 0 ? void 0 : _b.clearData();
-    };
-    var handleLockToken = function () {
+    var handleLockToken = function (passcode) {
         var _a;
         (_a = confirmByPasscodeDrawerRef.current) === null || _a === void 0 ? void 0 : _a.close();
-        console.warn("🚀 ~ handleLockToken ~ lockData:", props.lockData);
+        console.warn("🚀 ~ handleLockToken ~ lockData:", props.lockData, passcode);
     };
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(ConfirmLayout_1.default, { action: type_1.ActionConfirm.LOCK, trigger: props.trigger, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g16 }), children: [(0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "Amount", value: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: props.lockData.amount, unit: props.lockData.tokenSlug }) }), (0, jsx_runtime_1.jsx)(DrawerComponent_1.default, { ref: confirmByPasscodeDrawerRef, trigger: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { sx: { width: "100%" }, children: "Confirm" }), onOpen: handleClearConfirmData, onClose: handleClearConfirmData, children: (0, jsx_runtime_1.jsx)(ConfirmByPasscode_1.default, { ref: confirmByPasscodeRef, action: type_1.ActionConfirm.LOCK, onConfirmSuccess: handleLockToken, onClose: closeAuthModal }) })] }) }) }));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(ConfirmLayout_1.default, { action: type_1.ActionConfirm.LOCK, trigger: props.trigger, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: __assign(__assign({}, theme.mixins.column), { gap: theme.mixins.gaps.g16 }), children: [(0, jsx_runtime_1.jsx)(LineValue_1.default, { field: "Amount", value: (0, jsx_runtime_1.jsx)(Formatter_1.default, { value: props.lockData.amount, unit: props.lockData.tokenSlug }) }), (0, jsx_runtime_1.jsx)(ConfirmByPasscode_1.default, { action: type_1.ActionConfirm.LOCK, onConfirmSuccess: handleLockToken, children: (0, jsx_runtime_1.jsx)(Button_1.default.Primary, { sx: { width: "100%" }, children: "Confirm" }) })] }) }) }));
 };
 exports.default = LockToken;

package/dist/components/ui/OTP/index.js

@@ -46,9 +46,9 @@ var CustomOtpInput = function (props) {
                     outline: "none",
                     color: "#ffffff",
                     backgroundColor: "#ffffff29",
-                }, renderInput: function (props) { return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", __assign({}, props, { inputMode: "decimal", autoComplete: "off", type: "text" })), (0, jsx_runtime_1.jsx)("style", { children: "input::selection {\n            background-color: transparent; \n            color: white; \n          }" })] })); } })));
+                }, renderInput: function (props) { return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("input", __assign({}, props, { inputMode: "decimal" })), (0, jsx_runtime_1.jsx)("style", { children: "input::selection {\n            background-color: transparent; \n            color: white; \n          }" })] })); } })));
         default:
-            return ((0, jsx_runtime_1.jsx)(react_otp_input_1.default, __assign({}, rest, { renderInput: function (props) { return ((0, jsx_runtime_1.jsx)("input", __assign({}, props, { inputMode: "text", autoComplete: "off", type: "text" }))); } })));
+            return ((0, jsx_runtime_1.jsx)(react_otp_input_1.default, __assign({}, rest, { renderInput: function (props) { return ((0, jsx_runtime_1.jsx)("input", __assign({}, props, { inputMode: "text", type: "text" }))); } })));
     }
 };
 exports.default = CustomOtpInput;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tek-wallet",
-  "version": "0.0.165",
+  "version": "0.0.168",
   "description": "A custom React provider with TypeScript support",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",