@ludo.ninja/components 2.3.5 → 2.3.7

package/build/components/myWallets/index.d.ts

@@ -0,0 +1,9 @@
+import { IWallet } from "@ludo.ninja/api/build/graphql_tools/__generated__/galleriesHost/schema";
+import React from "react";
+declare const MyWallets: ({ caption, userWallets, isLoading, children, }: {
+    caption?: string;
+    userWallets: IWallet[];
+    isLoading: boolean;
+    children: React.ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export default MyWallets;

package/build/components/myWallets/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ui_1 = require("@ludo.ninja/ui");
+const styled_components_1 = __importDefault(require("styled-components"));
+const StyledMyWalletsCaption = (0, styled_components_1.default)(ui_1.H2) `
+  margin-bottom: 20px;
+`;
+const StyledMyWalletsWrapper = styled_components_1.default.div `
+  margin-bottom: 24px;
+`;
+const StyledMyWallets = styled_components_1.default.div `
+  margin: 0 auto;
+  width: 300px;
+  //height: 348px;
+  //overflow-y: scroll;
+`;
+const MyWallets = ({ caption, userWallets, isLoading, children, }) => {
+    return ((0, jsx_runtime_1.jsxs)(StyledMyWalletsWrapper, { children: [!userWallets.length && !isLoading && (0, jsx_runtime_1.jsx)(ui_1.H5, { children: "No connected wallets." }), caption && (0, jsx_runtime_1.jsx)(StyledMyWalletsCaption, { children: caption }), (0, jsx_runtime_1.jsx)(StyledMyWallets, { children: children })] }));
+};
+exports.default = MyWallets;

package/build/components/myWallets/myWalletItem/index.d.ts

@@ -0,0 +1,10 @@
+import { ReactElement } from "react";
+import { BlockChainEntity } from "@ludo.ninja/core";
+type MyWalletItemProps = {
+    blockchain: BlockChainEntity;
+    address: string | null;
+    isMainWallet: boolean;
+    children?: ReactElement;
+};
+declare const MyWalletItem: ({ blockchain, address, isMainWallet, children, }: MyWalletItemProps) => import("react/jsx-runtime").JSX.Element;
+export default MyWalletItem;

package/build/components/myWallets/myWalletItem/index.js

@@ -0,0 +1,56 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("@ludo.ninja/utils");
+const styled_components_1 = __importDefault(require("styled-components"));
+const colors_1 = require("@ludo.ninja/ui/build/styles/colors");
+const env_1 = require("../../../store/env");
+const StyledMyWalletItem = styled_components_1.default.div `
+  position: relative;
+  border-radius: 8px;
+  border: 1px solid ${(props) => (props.isMainWallet ? colors_1.AccentColor : "#cfd5ea")};
+  padding: 10px 12px;
+  width: 100%;
+  min-height: 36px;
+  display: flex;
+  align-items: center;
+  user-select: none;
+  background-color: ${(props) => (props.isMainWallet ? colors_1.WhiteColor : "#f6f7fd")};
+  margin-bottom: 12px;
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+`;
+const StyledImg = styled_components_1.default.img `
+  border-radius: 50%;
+`;
+const StyledContent = styled_components_1.default.div `
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  margin-left: 12px;
+  height: 100%;
+  text-align: left;
+
+  span {
+    font-size: 12px;
+    color: ${colors_1.BlackColor};
+  }
+
+  p {
+    margin: 0;
+    font-size: 13px;
+    color: ${colors_1.TextGrayColor};
+  }
+`;
+const MyWalletItem = ({ blockchain, address, isMainWallet, children, }) => {
+    const getStaticENVDomain = (0, env_1.useEnvStore)((state) => state.getStaticDomain);
+    return ((0, jsx_runtime_1.jsxs)(StyledMyWalletItem, { isMainWallet: isMainWallet, children: [children, (0, jsx_runtime_1.jsx)(StyledImg, { width: 36, height: 36, src: blockchain.getBlockChainIconRegular({
+                    domain: getStaticENVDomain(),
+                }), alt: blockchain.getBlockChainPublicLabel() }), (0, jsx_runtime_1.jsxs)(StyledContent, { children: [(0, jsx_runtime_1.jsx)("span", { children: (0, utils_1.shortenedText)(address) }), (0, jsx_runtime_1.jsx)("p", { children: blockchain.getBlockChainPublicLabel() })] })] }));
+};
+exports.default = MyWalletItem;

package/build/components/myWallets/myWalletItem/myWalletItemCheckBox/index.d.ts

@@ -0,0 +1,7 @@
+import { UseFormRegister } from "react-hook-form";
+declare const MyWalletItemCheckBox: ({ onChange, name, register, }: {
+    onChange: () => Promise<void>;
+    name: string;
+    register: UseFormRegister<any>;
+}) => import("react/jsx-runtime").JSX.Element;
+export default MyWalletItemCheckBox;

package/build/components/myWallets/myWalletItem/myWalletItemCheckBox/index.js

@@ -0,0 +1,16 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const styled_components_1 = __importDefault(require("styled-components"));
+const Forms_1 = require("../../../../system/Forms");
+const StyledCheckbox = styled_components_1.default.div `
+  position: absolute;
+  right: 12px;
+`;
+const MyWalletItemCheckBox = ({ onChange, name, register, }) => {
+    return ((0, jsx_runtime_1.jsx)(StyledCheckbox, { children: (0, jsx_runtime_1.jsx)(Forms_1.CheckboxInput, { label: "", data: { name }, register: register(name, { onChange }) }) }));
+};
+exports.default = MyWalletItemCheckBox;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ludo.ninja/components",
-  "version": "2.3.5",
+  "version": "2.3.7",
   "private": false,
   "main": "build/index.js",
   "types": "build/index.d.ts",