@ledgerhq/native-ui 0.41.0 → 0.42.0-nightly.0

package/lib/components/Layout/Modals/BaseModal/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Layout/Modals/BaseModal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AACtD,OAAyB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAElE,OAAO,EAAE,SAAS,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAC;AAItE,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AASvD,MAAM,MAAM,cAAc,GAAG;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAClC,kBAAkB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE,CAAC,CAAC;CAC9D,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;AA0DxB,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,GACT,EAAE,IAAI,CACL,cAAc,EACd,MAAM,GAAG,WAAW,GAAG,OAAO,GAAG,aAAa,GAAG,UAAU,CAC5D,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CAsB5B;AAED,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,GACR,EAAE,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,YAAY,CAUtD;AAED,wBAAgB,qBAAqB,CAAC,EACpC,MAAM,GACP,EAAE,IAAI,CAAC,cAAc,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,YAAY,CAUrD;AAED,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,MAAM,EACN,OAAkB,EAClB,MAAiB,EACjB,aAAa,EACb,aAAa,EACb,kBAAuB,EACvB,cAAmB,EACnB,UAAe,EACf,oBAAoB,EACpB,IAAI,EACJ,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,GAAG,IAAI,EACR,EAAE,cAAc,GAAG,KAAK,CAAC,YAAY,CAkErC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Layout/Modals/BaseModal/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAe,MAAM,OAAO,CAAC;AACtD,OAAyB,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAElE,OAAO,EAAE,SAAS,EAAoB,SAAS,EAAE,MAAM,cAAc,CAAC;AAItE,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AASvD,MAAM,MAAM,cAAc,GAAG;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAClC,kBAAkB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC1C,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,IAAI,CAAC,EAAE,iBAAiB,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC9B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,YAAY,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,QAAQ,CAAC,EAAE,SAAS,CAAA;KAAE,CAAC,CAAC;CAC9D,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;AA0DxB,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,GACT,EAAE,IAAI,CACL,cAAc,EACd,MAAM,GAAG,WAAW,GAAG,OAAO,GAAG,aAAa,GAAG,UAAU,CAC5D,GAAG,KAAK,CAAC,YAAY,GAAG,IAAI,CAsB5B;AAED,wBAAgB,sBAAsB,CAAC,EACrC,OAAO,GACR,EAAE,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,YAAY,CAUtD;AAED,wBAAgB,qBAAqB,CAAC,EACpC,MAAM,GACP,EAAE,IAAI,CAAC,cAAc,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,YAAY,CAUrD;AAED,MAAM,CAAC,OAAO,UAAU,SAAS,CAAC,EAChC,MAAM,EACN,OAAkB,EAClB,MAAiB,EACjB,aAAa,EACb,aAAa,EACb,kBAAuB,EACvB,cAAmB,EACnB,UAAe,EACf,oBAAoB,EACpB,IAAI,EACJ,SAAS,EACT,KAAK,EACL,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,WAAW,EACX,YAAY,EACZ,GAAG,IAAI,EACR,EAAE,cAAc,GAAG,KAAK,CAAC,YAAY,CAiErC"}

package/lib/components/Layout/Modals/BaseModal/index.js

@@ -90,9 +90,8 @@ export default function BaseModal({ isOpen, onClose = () => { }, onBack = () =>
     // The real fix would be to have onModalHide={onModalHide} and make sure every usage on onClose in the consumers of this component
     // expect the correct behavior
     const onModalHideWithClose = useCallback(() => {
-        onClose();
-        onModalHide && onModalHide();
-    }, [onClose, onModalHide]);
+        onModalHide?.();
+    }, [onModalHide]);
     return (React.createElement(ReactNativeModal, { ...backDropProps, ...rest, isVisible: !!isOpen, deviceWidth: width, deviceHeight: height, useNativeDriver: true, useNativeDriverForBackdrop: true, hideModalContentWhileAnimating: true, onModalHide: onModalHideWithClose, style: [defaultModalStyle, modalStyle] },
         React.createElement(SafeContainer, { style: safeContainerStyle },
             CustomHeader && (React.createElement(CustomHeader, null, !noCloseButton && React.createElement(ModalHeaderCloseButton, { onClose: onClose }))),

package/lib/pre-ldls/components/AccountItem/AccountItem.d.ts

@@ -0,0 +1,37 @@
+import React from "react";
+export type AccountUI = {
+    address: string;
+    balance?: string;
+    cryptoId?: string;
+    fiatValue?: string;
+    id: string;
+    name: string;
+    parentId?: string;
+    protocol?: string;
+    ticker?: string;
+};
+export type RightElementArrow = {
+    type: "arrow";
+};
+export type RightElementCheckbox = {
+    type: "checkbox";
+    checkbox: {
+        checked: boolean;
+        onChange?: () => void;
+        disabled?: boolean;
+    };
+};
+export type RightElementEdit = {
+    type: "edit";
+    onClick: () => void;
+};
+export type RightElement = RightElementArrow | RightElementCheckbox | RightElementEdit;
+export type AccountItemProps = {
+    onClick?: () => void;
+    account: AccountUI;
+    rightElement?: RightElement;
+    showIcon?: boolean;
+    backgroundColor?: string;
+};
+export declare const AccountItem: ({ onClick, account, rightElement, showIcon, backgroundColor, }: AccountItemProps) => React.JSX.Element;
+//# sourceMappingURL=AccountItem.d.ts.map

package/lib/pre-ldls/components/AccountItem/AccountItem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccountItem.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AccountItem/AccountItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAU1B,MAAM,MAAM,SAAS,GAAG;IACtB,OAAO,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,IAAI,EAAE,OAAO,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG;IACjC,IAAI,EAAE,UAAU,CAAC;IACjB,QAAQ,EAAE;QACR,OAAO,EAAE,OAAO,CAAC;QACjB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;QACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;KACpB,CAAC;CACH,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,iBAAiB,GAAG,oBAAoB,GAAG,gBAAgB,CAAC;AAEvF,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,EAAE,SAAS,CAAC;IACnB,YAAY,CAAC,EAAE,YAAY,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAkGF,eAAO,MAAM,WAAW,mEAMrB,gBAAgB,sBA6FlB,CAAC"}

package/lib/pre-ldls/components/AccountItem/AccountItem.js

@@ -0,0 +1,114 @@
+import React from "react";
+import { Pressable, View } from "react-native";
+import styled, { useTheme } from "styled-components/native";
+import { ChevronRightMedium, PenMedium } from "@ledgerhq/icons-ui/nativeLegacy";
+import Text from "../../../components/Text";
+import { Address } from "../Address/Address";
+import { Tag } from "../Tag/Tag";
+import Checkbox from "../../../components/Form/Checkbox";
+import { useTokens } from "../../libs";
+const ICON_BUTTONS_SIZE = 32;
+const IconButton = styled(Pressable) `
+  align-items: center;
+  justify-content: center;
+  height: ${ICON_BUTTONS_SIZE}px;
+  width: ${ICON_BUTTONS_SIZE}px;
+`;
+const Wrapper = styled(Pressable) `
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  width: 100%;
+  overflow: hidden;
+  ${(props) => props.backgroundColor && `background-color: ${props.backgroundColor};`}
+`;
+const ContentContainer = styled(View) `
+  align-items: center;
+  flex-direction: row;
+  flex: 1;
+  justify-content: space-between;
+  min-width: 0;
+  overflow: hidden;
+  width: 100%;
+`;
+const AccountInfoContainer = styled(View) `
+  flex-direction: column;
+  justify-content: center;
+  min-width: 0;
+  flex: 1;
+  overflow: hidden;
+`;
+const NameRow = styled(View) `
+  flex-direction: row;
+  align-items: center;
+  min-width: 0;
+  width: 100%;
+`;
+const NameWrapper = styled(View) `
+  min-width: 0;
+  flex-shrink: 1;
+`;
+const TagWrapper = styled(View) `
+  flex-shrink: 0;
+  align-items: flex-start;
+`;
+const BalanceContainer = styled(View) `
+  flex-direction: column;
+  flex-shrink: 0;
+  align-items: flex-end;
+`;
+const RightElementContainer = styled(View) `
+  align-items: center;
+  justify-content: center;
+`;
+const RightElementRenderer = ({ rightElement, tokens, onEditPress }) => {
+    return (React.createElement(RightElementContainer, { style: { marginLeft: Number(tokens["spacing-xs"]) } },
+        rightElement.type === "checkbox" && (React.createElement(View, { testID: "right-element-checkbox" },
+            React.createElement(Checkbox, { checked: rightElement.checkbox.checked, onChange: rightElement.checkbox.onChange, disabled: rightElement.checkbox.disabled }))),
+        rightElement.type === "arrow" && (React.createElement(View, { testID: "right-element-arrow-icon" },
+            React.createElement(ChevronRightMedium, { size: 24, color: String(tokens["colors-content-default-default"]) }))),
+        rightElement.type === "edit" && (React.createElement(IconButton, { onPress: onEditPress, testID: "right-element-edit-icon" },
+            React.createElement(PenMedium, { size: 16, color: String(tokens["colors-content-default-default"]) })))));
+};
+export const AccountItem = ({ onClick, account, rightElement, showIcon = true, backgroundColor, }) => {
+    const theme = useTheme();
+    const colorType = theme.colors.type === "dark" ? "dark" : "light";
+    const tokens = useTokens(colorType, [
+        "spacing-xxxs",
+        "spacing-xs",
+        "margin-s",
+        "radius-s",
+        "colors-content-default-default",
+        "colors-content-subdued-default-default",
+        "colors-surface-transparent-hover",
+        "colors-surface-transparent-pressed",
+    ]);
+    const { name, balance, fiatValue, protocol, address, ticker, cryptoId, parentId } = account;
+    const handlePress = () => {
+        if (onClick) {
+            onClick();
+        }
+    };
+    const handleEditPress = () => {
+        if (rightElement?.type === "edit") {
+            rightElement.onClick();
+        }
+    };
+    return (React.createElement(Wrapper, { backgroundColor: backgroundColor, isClickable: Boolean(onClick), onPress: handlePress, style: ({ pressed }) => ({
+            paddingTop: onClick ? Number(tokens["margin-s"]) : 0,
+            borderRadius: onClick ? Number(tokens["radius-s"]) : 0,
+            opacity: pressed && onClick ? 0.7 : 1,
+        }), testID: "account-item" },
+        React.createElement(ContentContainer, null,
+            React.createElement(AccountInfoContainer, null,
+                React.createElement(NameRow, { style: { marginBottom: Number(tokens["spacing-xxxs"]) } },
+                    React.createElement(NameWrapper, null,
+                        React.createElement(Text, { variant: "largeLineHeight", fontWeight: "semiBold", color: String(tokens["colors-content-default-default"]), fontSize: "18px", numberOfLines: 1, ellipsizeMode: "tail" }, name)),
+                    protocol && (React.createElement(TagWrapper, { style: { marginLeft: Number(tokens["spacing-xs"]) } },
+                        React.createElement(Tag, { textTransform: "uppercase" }, protocol)))),
+                React.createElement(Address, { address: address, cryptoId: cryptoId, ticker: ticker, parentId: parentId, showIcon: showIcon })),
+            React.createElement(BalanceContainer, { style: { gap: Number(tokens["spacing-xxxs"]) } },
+                fiatValue && (React.createElement(Text, { fontSize: "18px", color: String(tokens["colors-content-default-default"]) }, fiatValue)),
+                balance && (React.createElement(Text, { fontSize: "14px", color: String(tokens["colors-content-subdued-default-default"]) }, balance))),
+            rightElement && (React.createElement(RightElementRenderer, { rightElement: rightElement, tokens: tokens, onEditPress: handleEditPress })))));
+};

package/lib/pre-ldls/components/AccountItem/AccountItem.stories.d.ts

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { AccountItem } from "./AccountItem";
+declare const meta: Meta<typeof AccountItem>;
+export default meta;
+type Story = StoryObj<typeof AccountItem>;
+export declare const Default: Story;
+export declare const TestAccount: Story;
+export declare const TestWithoutProtocol: Story;
+export declare const TestWithoutAddressIcon: Story;
+export declare const TestWithCheckbox: Story;
+export declare const TestWithArrow: Story;
+export declare const TestWithEdit: Story;
+//# sourceMappingURL=AccountItem.stories.d.ts.map

package/lib/pre-ldls/components/AccountItem/AccountItem.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccountItem.stories.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AccountItem/AccountItem.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AACvD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CAwBlC,CAAC;AACF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAE1C,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC;AAEjC,eAAO,MAAM,WAAW,EAAE,KAczB,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,KAajC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAYpC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAoB9B,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAc3B,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,KAgB1B,CAAC"}

package/lib/pre-ldls/components/AccountItem/AccountItem.stories.js

@@ -0,0 +1,123 @@
+import { AccountItem } from "./AccountItem";
+const onClick = () => console.log("Account clicked");
+const meta = {
+    component: AccountItem,
+    title: "PreLdls/Components/AccountItem",
+    tags: ["autodocs"],
+    args: {
+        onClick: onClick,
+        account: {
+            address: "n4A9...Zgty",
+            balance: "0.118 ETH",
+            cryptoId: "bitcoin",
+            fiatValue: "$5,969.83",
+            id: "12345",
+            name: "Main BTC",
+            ticker: "btc",
+        },
+    },
+    parameters: {
+        docs: {
+            description: {
+                component: "AccountItem displays an account with its name, address, balance, and fiat value. Use it to represent selectable accounts in lists.",
+            },
+        },
+    },
+};
+export default meta;
+export const Default = {};
+export const TestAccount = {
+    args: {
+        onClick: onClick,
+        account: {
+            address: "n4A9...Zgty",
+            balance: "0.118 BTC",
+            cryptoId: "bitcoin",
+            fiatValue: "$5,969.83",
+            id: "12345",
+            name: "Main BTC",
+            protocol: "Native Segwit",
+            ticker: "btc",
+        },
+    },
+};
+export const TestWithoutProtocol = {
+    args: {
+        onClick: onClick,
+        account: {
+            address: "n4A9...Zgty",
+            balance: "0.118 BTC",
+            cryptoId: "bitcoin",
+            fiatValue: "$5,969.83",
+            id: "21345",
+            name: "Main BTC",
+            ticker: "btc",
+        },
+    },
+};
+export const TestWithoutAddressIcon = {
+    args: {
+        onClick: onClick,
+        account: {
+            address: "n4A9...Zgty",
+            balance: "0.118 BTC",
+            fiatValue: "$5,969.83",
+            id: "bitcoin",
+            name: "Main BTC",
+        },
+        showIcon: false,
+    },
+};
+export const TestWithCheckbox = {
+    args: {
+        account: {
+            address: "n4A9...Zgty",
+            balance: "0.118",
+            cryptoId: "bitcoin",
+            fiatValue: "$5,969.83",
+            id: "12345",
+            name: "Main BTC",
+            ticker: "btc",
+        },
+        onClick: onClick,
+        rightElement: {
+            type: "checkbox",
+            checkbox: {
+                checked: false,
+                onChange: () => { },
+            },
+        },
+    },
+};
+export const TestWithArrow = {
+    args: {
+        account: {
+            address: "n4A9...Zgty",
+            cryptoId: "bitcoin",
+            fiatValue: "$5,969.83",
+            id: "12345",
+            name: "Main BTC",
+            ticker: "btc",
+        },
+        rightElement: {
+            type: "arrow",
+        },
+    },
+};
+export const TestWithEdit = {
+    args: {
+        account: {
+            address: "n4A9...Zgty",
+            cryptoId: "bitcoin",
+            fiatValue: "$5,969.83",
+            id: "12345",
+            name: "Main BTC",
+            ticker: "btc",
+        },
+        onClick: undefined,
+        rightElement: {
+            type: "edit",
+            onClick: onClick,
+        },
+    },
+};

package/lib/pre-ldls/components/AddAccountButton/AddAccountButton.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+export declare const AddAccountButton: ({ label, onClick, disabled, }: {
+    onClick: () => void;
+    disabled?: boolean | undefined;
+    label: string;
+}) => React.JSX.Element;
+//# sourceMappingURL=AddAccountButton.d.ts.map

package/lib/pre-ldls/components/AddAccountButton/AddAccountButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddAccountButton.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AddAccountButton/AddAccountButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAmB1B,eAAO,MAAM,gBAAgB;aAKlB,MAAM,IAAI;;WAEZ,MAAM;uBAuBd,CAAC"}

package/lib/pre-ldls/components/AddAccountButton/AddAccountButton.js

@@ -0,0 +1,31 @@
+import React from "react";
+import styled, { useTheme } from "styled-components/native";
+import { Pressable } from "react-native";
+import Text from "../../../components/Text";
+import { Icon } from "../../../components/Icon";
+const StyledPressable = styled(Pressable) `
+  border-width: 1px;
+  border-style: dotted;
+  padding: 16px;
+  margin-vertical: 8px;
+  border-radius: 12px;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  column-gap: 12px;
+`;
+export const AddAccountButton = ({ label, onClick, disabled = false, }) => {
+    const theme = useTheme();
+    return (React.createElement(StyledPressable, { disabled: disabled, style: ({ pressed }) => [
+            {
+                opacity: pressed ? 0.5 : 1.0,
+                marginVertical: 12,
+                width: "100%",
+                borderColor: theme.colors.opacityDefault.c10,
+            },
+            disabled && { opacity: 0.5 },
+        ], hitSlop: 6, onPress: () => onClick(), testID: "add-new-account-button" },
+        React.createElement(Text, { variant: "large" }, label),
+        React.createElement(Icon, { name: "Plus", size: 20, color: "neutral.c100" })));
+};

package/lib/pre-ldls/components/AddAccountButton/AddAccountButton.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import { AddAccountButton } from "./AddAccountButton";
+declare const meta: Meta<typeof AddAccountButton>;
+export default meta;
+type Story = StoryObj<typeof AddAccountButton>;
+export declare const Default: Story;
+//# sourceMappingURL=AddAccountButton.stories.d.ts.map

package/lib/pre-ldls/components/AddAccountButton/AddAccountButton.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddAccountButton.stories.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AddAccountButton/AddAccountButton.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAEvD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAEtD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,gBAAgB,CAgBvC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE/C,eAAO,MAAM,OAAO,EAAE,KAAU,CAAC"}

package/lib/pre-ldls/components/AddAccountButton/AddAccountButton.stories.js

@@ -0,0 +1,19 @@
+import React from "react";
+import { View } from "react-native";
+import { AddAccountButton } from "./AddAccountButton";
+const meta = {
+    component: AddAccountButton,
+    decorators: [
+        (Story) => (React.createElement(View, { style: { height: 400, width: 400 } },
+            React.createElement(Story, null))),
+    ],
+    title: "PreLdls/Components/AddAccountButton",
+    tags: ["autodocs"],
+    args: {
+        t: (key) => key,
+        onClick: () => { },
+        label: "Add new or existing account",
+    },
+};
+export default meta;
+export const Default = {};

package/lib/pre-ldls/components/Address/Address.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export declare const Address: ({ address, showIcon, cryptoId, ticker, parentId, }: {
+    address: string;
+    showIcon: boolean;
+    cryptoId?: string | undefined;
+    ticker?: string | undefined;
+    parentId?: string | undefined;
+}) => React.JSX.Element;
+//# sourceMappingURL=Address.d.ts.map

package/lib/pre-ldls/components/Address/Address.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Address.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Address/Address.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,eAAO,MAAM,OAAO;aAOT,MAAM;cACL,OAAO;;;;uBAqBlB,CAAC"}

package/lib/pre-ldls/components/Address/Address.js

@@ -0,0 +1,18 @@
+import React from "react";
+import { View } from "react-native";
+import styled, { useTheme } from "styled-components/native";
+import Text from "../../../components/Text";
+import { CryptoIcon } from "../CryptoIcon/CryptoIcon";
+import { useTokens } from "../../libs";
+const Wrapper = styled(View) `
+  flex-direction: row;
+  align-items: center;
+`;
+export const Address = ({ address, showIcon, cryptoId, ticker, parentId, }) => {
+    const { theme } = useTheme();
+    const colorType = theme;
+    const tokens = useTokens(colorType, ["spacing-xxxs", "colors-content-subdued-default-default"]);
+    return (React.createElement(Wrapper, null,
+        React.createElement(Text, { fontSize: "14px", color: String(tokens["colors-content-subdued-default-default"]), marginRight: showIcon ? Number(tokens["spacing-xxxs"]) : 0 }, address),
+        showIcon && React.createElement(CryptoIcon, { ledgerId: cryptoId, network: parentId, ticker: ticker, size: 20 })));
+};

package/lib/pre-ldls/components/AssetItem/AssetItem.js

@@ -35,7 +35,7 @@ export const AssetItem = ({ name, ticker, id, onClick, leftElement, rightElement
         "colors-surface-transparent-default",
     ]);
     return (React.createElement(Wrapper, { onPress: () => onClick({ name, ticker, id }), style: ({ pressed }) => ({
-            padding: Number(tokens["spacing-xxs"]),
+            paddingVertical: Number(tokens["spacing-xxs"]),
             borderRadius: Number(tokens["radius-s"]),
             backgroundColor: String(tokens["colors-surface-transparent-default"]),
             opacity: pressed ? 0.7 : 1,

package/lib/pre-ldls/components/AssetTypeList/AssetList.d.ts

@@ -1,9 +1,11 @@
 import React from "react";
 import { AssetType } from "../AssetItem/AssetItem";
-export declare const AssetList: ({ assets, onClick, onVisibleItemsScrollEnd, scrollToTop, hasNextPage, }: {
+export declare const AssetList: ({ assets, onClick, onVisibleItemsScrollEnd, onScrollDown, onScrollUp, scrollToTop, hasNextPage, }: {
     assets: AssetType[];
     onClick: (asset: AssetType) => void;
     onVisibleItemsScrollEnd?: (() => void) | undefined;
+    onScrollDown?: (() => void) | undefined;
+    onScrollUp?: (() => void) | undefined;
     scrollToTop?: boolean | undefined;
     hasNextPage?: boolean | undefined;
 }) => React.JSX.Element;

package/lib/pre-ldls/components/AssetTypeList/AssetList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AssetList.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetTypeList/AssetList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAa,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAK9D,eAAO,MAAM,SAAS;YAOZ,SAAS,EAAE;qBACF,SAAS,KAAK,IAAI;qCACH,IAAI;;;uBA0CrC,CAAC"}
+{"version":3,"file":"AssetList.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/AssetTypeList/AssetList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAa,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAK9D,eAAO,MAAM,SAAS;YASZ,SAAS,EAAE;qBACF,SAAS,KAAK,IAAI;qCACH,IAAI;0BACf,IAAI;wBACN,IAAI;;;uBA+DxB,CAAC"}

package/lib/pre-ldls/components/AssetTypeList/AssetList.js

@@ -3,7 +3,7 @@ import { FlatList } from "react-native";
 import { AssetItem } from "../AssetItem/AssetItem";
 const ITEM_PADDING = 8;
 const ITEM_HEIGHT = 48 + ITEM_PADDING * 2;
-export const AssetList = ({ assets, onClick, onVisibleItemsScrollEnd, scrollToTop, hasNextPage, }) => {
+export const AssetList = ({ assets, onClick, onVisibleItemsScrollEnd, onScrollDown, onScrollUp, scrollToTop, hasNextPage, }) => {
     const flatListRef = useRef(null);
     const renderAssetItem = useCallback(({ item }) => React.createElement(AssetItem, { ...item, onClick: onClick }), [onClick]);
     const keyExtractor = useCallback((item, index) => `${item.id}-${index}`, []);
@@ -17,6 +17,18 @@ export const AssetList = ({ assets, onClick, onVisibleItemsScrollEnd, scrollToTo
             onVisibleItemsScrollEnd();
         }
     }, [hasNextPage, onVisibleItemsScrollEnd]);
+    const handleViewableItemsChanged = useCallback((info) => {
+        if (info.changed.length === 0)
+            return;
+        const isScrollingDown = info.changed[0].index > info.changed[info.changed.length - 1].index;
+        const isScrollingUp = info.changed[0].index < info.changed[info.changed.length - 1].index;
+        if (onScrollDown && isScrollingDown) {
+            onScrollDown();
+        }
+        if (onScrollUp && isScrollingUp) {
+            onScrollUp();
+        }
+    }, [onScrollUp, onScrollDown]);
     const flatListProps = {
         data: assets,
         renderItem: renderAssetItem,
@@ -31,6 +43,7 @@ export const AssetList = ({ assets, onClick, onVisibleItemsScrollEnd, scrollToTo
             onEndReached: handleEndReached,
             onEndReachedThreshold: 0.1,
         }),
+        onViewableItemsChanged: handleViewableItemsChanged,
     };
     return React.createElement(FlatList, { ref: flatListRef, ...flatListProps });
 };

package/lib/pre-ldls/components/Input/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAqB,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAQ,MAAM,cAAc,CAAC;AAI/C,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,KAAK,CAAC;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAkCF,eAAO,MAAM,KAAK;uBA/BE,SAAS,KAAK,WAAW;mCA2C3C,CAAC"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,SAAS,EAAQ,MAAM,cAAc,CAAC;AAI/C,MAAM,MAAM,SAAS,GAAG;IACtB,IAAI,CAAC,EAAE,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,GAAG,KAAK,CAAC;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAyCF,eAAO,MAAM,KAAK;uBAtCE,SAAS,KAAK,WAAW;mCAsE5C,CAAC"}

package/lib/pre-ldls/components/Input/Input.js

@@ -1,11 +1,12 @@
-import React, { useContext } from "react";
+import React, { useContext, useState } from "react";
 import { TextInput, View } from "react-native";
 import styled, { ThemeContext } from "styled-components/native";
 import { useTokens } from "../../libs";
 const Wrapper = styled(View) `
   height: 40px;
   min-width: 328px;
-  padding-horizontal: ${({ tokens }) => tokens["spacing-s"]}px;
+  padding-left: ${({ isFocused, tokens }) => isFocused ? Number(tokens["spacing-s"]) - 2 : Number(tokens["spacing-s"])}px;
+  padding-right: ${({ isFocused, tokens }) => isFocused ? Number(tokens["spacing-s"]) - 2 : Number(tokens["spacing-s"])}px;
   align-items: center;
   flex-direction: row;
   gap: ${({ tokens }) => tokens["spacing-xxs"]}px;
@@ -13,6 +14,8 @@ const Wrapper = styled(View) `
   background-color: ${({ tokens }) => tokens["colors-surface-transparent-subdued-default"]};
   overflow: hidden;
   color: ${({ tokens }) => tokens["colors-content-subdued-default-default"]};
+  border-width: ${({ isFocused }) => (isFocused ? "2px" : "0px")};
+  border-color: ${({ isFocused, tokens }) => isFocused ? tokens["colors-border-active"] : "transparent"};
 `;
 const StyledInput = styled(TextInput) `
   flex: 1;
@@ -26,13 +29,23 @@ const TOKEN_KEYS = [
     "radius-s",
     "colors-surface-transparent-subdued-default",
     "colors-content-subdued-default-default",
+    "colors-border-active",
 ];
-export const Input = React.forwardRef(({ icon: Icon, ...props }, ref) => {
+export const Input = React.forwardRef(({ icon: Icon, onFocus, onBlur, ...props }, ref) => {
+    const [isFocused, setIsFocused] = useState(false);
     const theme = useContext(ThemeContext);
     const themeType = theme?.colors?.type ?? "light";
     const tokens = useTokens(themeType, [...TOKEN_KEYS]);
-    return (React.createElement(Wrapper, { tokens: tokens },
+    const handleFocus = (e) => {
+        setIsFocused(true);
+        onFocus?.(e);
+    };
+    const handleBlur = (e) => {
+        setIsFocused(false);
+        onBlur?.(e);
+    };
+    return (React.createElement(Wrapper, { tokens: tokens, isFocused: isFocused },
         !!Icon && React.createElement(Icon, { color: String(tokens["colors-content-subdued-default-default"]) }),
-        React.createElement(StyledInput, { ...props, ref: ref, tokens: tokens })));
+        React.createElement(StyledInput, { ...props, ref: ref, tokens: tokens, onFocus: handleFocus, onBlur: handleBlur, placeholderTextColor: String(tokens["colors-content-subdued-default-default"]) })));
 });
 Input.displayName = "Input";

package/lib/pre-ldls/components/NetworkItem/NetworkItem.js

@@ -6,7 +6,7 @@ import Text from "../../../components/Text";
 import { CryptoIcon } from "../CryptoIcon/CryptoIcon";
 const Wrapper = styled(Pressable) `
   flex-direction: row;
-  padding: ${({ tokens }) => tokens["spacing-xxs"]}px;
+  padding-vertical: ${({ tokens }) => tokens["spacing-xxs"]}px;
   border-radius: ${({ tokens }) => tokens["radius-s"]}px;
   align-items: center;
   width: 100%;

package/lib/pre-ldls/components/Search/Search.d.ts

@@ -3,7 +3,8 @@ import { TextInputProps } from "react-native";
 type Props = Readonly<TextInputProps & {
     onDebouncedChange?: (current: string, prev: string) => void;
     debounceTime?: number;
+    onPressIn?: () => void;
 }>;
-export declare function Search({ onDebouncedChange, debounceTime, onChange, ...props }: Props): React.JSX.Element;
+export declare function Search({ onDebouncedChange, debounceTime, onChange, onPressIn, ...props }: Props): React.JSX.Element;
 export {};
 //# sourceMappingURL=Search.d.ts.map

package/lib/pre-ldls/components/Search/Search.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Search.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Search/Search.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAI/C,OAAO,EAAkD,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9F,KAAK,KAAK,GAAG,QAAQ,CACnB,cAAc,GAAG;IACf,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5D,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CACF,CAAC;AAEF,wBAAgB,MAAM,CAAC,EAAE,iBAAiB,EAAE,YAAkB,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAE,EAAE,KAAK,qBAyB1F"}
+{"version":3,"file":"Search.d.ts","sourceRoot":"","sources":["../../../../src/pre-ldls/components/Search/Search.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAI/C,OAAO,EAAkD,cAAc,EAAE,MAAM,cAAc,CAAC;AAE9F,KAAK,KAAK,GAAG,QAAQ,CACnB,cAAc,GAAG;IACf,iBAAiB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5D,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB,CACF,CAAC;AAEF,wBAAgB,MAAM,CAAC,EACrB,iBAAiB,EACjB,YAAkB,EAClB,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,qBAiCP"}

package/lib/pre-ldls/components/Search/Search.js

@@ -2,7 +2,7 @@ import React, { useMemo, useRef } from "react";
 import { Icons } from "../../../assets";
 import { useDebouncedCallback } from "../../hooks";
 import { Input } from "..";
-export function Search({ onDebouncedChange, debounceTime = 500, onChange, ...props }) {
+export function Search({ onDebouncedChange, debounceTime = 500, onChange, onPressIn, ...props }) {
     const initialValue = props.value ?? props.defaultValue ?? "";
     const prevValue = useRef(String(initialValue));
     const handleDebouncedChange = useDebouncedCallback(useMemo(() => {
@@ -22,5 +22,5 @@ export function Search({ onDebouncedChange, debounceTime = 500, onChange, ...pro
             handleDebouncedChange?.(current);
         };
     }, [handleDebouncedChange, onChange]);
-    return React.createElement(Input, { ...props, icon: Icons.Search, onChange: handleChange });
+    return (React.createElement(Input, { ...props, style: { height: "100%" }, icon: Icons.Search, onChange: handleChange, onPressIn: onPressIn }));
 }

package/lib/pre-ldls/components/index.d.ts

@@ -5,4 +5,7 @@ export * from "./NetworkItem/NetworkItem";
 export * from "./NetworkList/NetworkList";
 export * from "./Tag/Tag";
 export * from "./Search/Search";
+export * from "./AccountItem/AccountItem";
+export * from "./Address/Address";
+export * from "./AddAccountButton/AddAccountButton";
 //# sourceMappingURL=index.d.ts.map

package/lib/pre-ldls/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pre-ldls/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pre-ldls/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,uBAAuB,CAAC;AACtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,2BAA2B,CAAC;AAC1C,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,mBAAmB,CAAC;AAClC,cAAc,qCAAqC,CAAC"}

package/lib/pre-ldls/components/index.js

@@ -5,3 +5,6 @@ export * from "./NetworkItem/NetworkItem";
 export * from "./NetworkList/NetworkList";
 export * from "./Tag/Tag";
 export * from "./Search/Search";
+export * from "./AccountItem/AccountItem";
+export * from "./Address/Address";
+export * from "./AddAccountButton/AddAccountButton";

package/lib/pre-ldls/libs/index.d.ts

@@ -18,9 +18,11 @@ declare const overrideColor: {
         readonly "surface-transparent-pressed": "#0000001A";
         readonly "border-subdued-default-hover": "#D5D5D5";
         readonly "border-subdued-default-pressed": "#C1C1C1";
+        readonly "border-active": "#D4A0FF";
     };
     readonly dark: {
         readonly "opacity-default-10": "#FFFFFF1A";
+        readonly "border-active": "#D4A0FF";
     };
 };
 export type Tokens = Record<string, string | number>;

package/lib/pre-ldls/libs/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pre-ldls/libs/index.ts"],"names":[],"mappings":";AACA,OAAO,EAAe,UAAU,EAAW,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAGjF,QAAA,MAAM,aAAa;;;;;;;;;;;CAWT,CAAC;AAEX,QAAA,MAAM,aAAa;;;;;;;;;;CAUT,CAAC;AAEX,MAAM,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AACrD,KAAK,UAAU,GACX,UAAU,MAAM,UAAU,EAAE,GAC5B,UAAU,MAAM,OAAO,aAAa,CAAC,KAAK,EAAE,GAC5C,UAAU,MAAM,OAAO,aAAa,CAAC,IAAI,EAAE,CAAC;AAEhD,KAAK,UAAU,GAAG,MAAM,CAAC,YAAY,GAAG,OAAO,aAAa,CAAC,CAAC;AAC9D,KAAK,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;AAY9B,eAAO,MAAM,SAAS,WACZ,KAAK,cAAc,MAAM,UAAU,GAAG,UAAU,CAAC,gDA2B1D,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pre-ldls/libs/index.ts"],"names":[],"mappings":";AACA,OAAO,EAAe,UAAU,EAAW,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAGjF,QAAA,MAAM,aAAa;;;;;;;;;;;CAWT,CAAC;AAEX,QAAA,MAAM,aAAa;;;;;;;;;;;;CAYT,CAAC;AAEX,MAAM,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;AACrD,KAAK,UAAU,GACX,UAAU,MAAM,UAAU,EAAE,GAC5B,UAAU,MAAM,OAAO,aAAa,CAAC,KAAK,EAAE,GAC5C,UAAU,MAAM,OAAO,aAAa,CAAC,IAAI,EAAE,CAAC;AAEhD,KAAK,UAAU,GAAG,MAAM,CAAC,YAAY,GAAG,OAAO,aAAa,CAAC,CAAC;AAC9D,KAAK,KAAK,GAAG,MAAM,GAAG,OAAO,CAAC;AAY9B,eAAO,MAAM,SAAS,WACZ,KAAK,cAAc,MAAM,UAAU,GAAG,UAAU,CAAC,gDA2B1D,CAAC"}

package/lib/pre-ldls/libs/index.js

@@ -19,9 +19,11 @@ const overrideColor = {
         "surface-transparent-pressed": "#0000001A",
         "border-subdued-default-hover": "#D5D5D5",
         "border-subdued-default-pressed": "#C1C1C1",
+        "border-active": "#D4A0FF",
     },
     dark: {
         "opacity-default-10": "#FFFFFF1A",
+        "border-active": "#D4A0FF",
     },
 };
 function pxToNumber(value) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ledgerhq/native-ui",
-  "version": "0.41.0",
+  "version": "0.42.0-nightly.0",
   "description": "Ledger Live - Mobile UI",
   "repository": {
     "type": "git",
@@ -35,12 +35,12 @@
     "lib/**/*"
   ],
   "dependencies": {
-    "@ledgerhq/crypto-icons": "1.1.2",
+    "@ledgerhq/crypto-icons": "1.1.3",
     "color": "^4.0.0",
     "react-native-modal": "14.0.0-rc.1",
     "rn-range-slider": "2.1.1",
     "styled-system": "^5.1.5",
-    "@ledgerhq/crypto-icons-ui": "^1.16.0",
+    "@ledgerhq/crypto-icons-ui": "^1.17.0-nightly.0",
     "@ledgerhq/icons-ui": "^0.13.0",
     "@ledgerhq/ui-shared": "^0.3.0"
   },