@ledgerhq/native-ui 0.13.0-nightly.3 → 0.14.0-nightly.0

package/lib/components/Form/Switch/index.d.ts

@@ -5,6 +5,7 @@ export type SwitchProps = {
     onChange?: (value: boolean) => void;
     disabled?: boolean;
     label?: string;
+    testID?: string;
 } & Omit<Partial<NativeSwitchProps>, "onChange">;
-declare const Switch: ({ checked, onChange, disabled, label }: SwitchProps) => JSX.Element;
+declare const Switch: ({ checked, onChange, disabled, label, testID }: SwitchProps) => JSX.Element;
 export default Switch;

package/lib/components/Form/Switch/index.js

@@ -7,7 +7,7 @@ const Pressable = proxyStyled(BasePressable).attrs({
     flexDirection: "row",
     alignItems: "center",
 }) ``;
-const Switch = ({ checked, onChange, disabled, label }) => {
+const Switch = ({ checked, onChange, disabled, label, testID }) => {
     const { colors, space } = useTheme();
     const handlePress = useCallback(() => {
         if (disabled)
@@ -18,7 +18,7 @@ const Switch = ({ checked, onChange, disabled, label }) => {
         React.createElement(NativeSwitch, { trackColor: {
                 false: colors.neutral.c50,
                 true: colors.primary.c80,
-            }, thumbColor: colors.neutral.c00, onValueChange: onChange, value: checked, disabled: disabled, ios_backgroundColor: colors.neutral.c50 }),
+            }, thumbColor: colors.neutral.c00, onValueChange: onChange, value: checked, disabled: disabled, ios_backgroundColor: colors.neutral.c50, testID: testID }),
         label ? (React.createElement(Text, { variant: "body", color: checked ? colors.primary.c90 : colors.neutral.c100, style: { marginLeft: space[3], flexShrink: 1 } }, label)) : null));
 };
 export default Switch;

package/lib/components/Layout/Divider/index.d.ts

@@ -6,9 +6,5 @@ declare const Divider: import("styled-components").StyledComponent<typeof import
     display?: string | undefined;
     position?: string | undefined;
     maxHeight?: string | number | undefined;
-} & {
-    my: number;
-    height: number;
-    backgroundColor: string;
-}, "height" | "backgroundColor" | "my">;
+}, never>;
 export default Divider;

package/lib/components/Layout/Divider/index.js

@@ -1,7 +1,7 @@
-import { Flex } from "../index";
+import Flex from "../Flex";
 import styled from "styled-components/native";
-const Divider = styled(Flex).attrs(() => ({
-    my: 4,
+const Divider = styled(Flex).attrs((p) => ({
+    my: p.my || 4,
     height: 1,
     backgroundColor: "neutral.c40",
 })) ``;

package/lib/components/tags/Tag/index.d.ts

@@ -4,10 +4,12 @@ import { IconType } from "../../Icon/type";
 export interface TagProps extends FlexBoxProps {
     type?: "shade" | "color" | "warning";
     size?: "small" | "medium";
+    color?: string;
+    textColor?: string;
     Icon?: IconType;
     uppercase?: boolean;
     children?: React.ReactNode;
     numberOfLines?: number;
     ellipsizeMode?: "head" | "middle" | "tail" | "clip";
 }
-export default function Tag({ type, size, uppercase, Icon, children, numberOfLines, ellipsizeMode, ...props }: TagProps): JSX.Element;
+export default function Tag({ type, size, color, textColor, uppercase, Icon, children, numberOfLines, ellipsizeMode, ...props }: TagProps): JSX.Element;

package/lib/components/tags/Tag/index.js

@@ -19,9 +19,9 @@ const typeColor = {
     warning: "warning.c100",
 };
 export default function Tag(_a) {
-    var { type = "shade", size = "small", uppercase, Icon, children, numberOfLines, ellipsizeMode } = _a, props = __rest(_a, ["type", "size", "uppercase", "Icon", "children", "numberOfLines", "ellipsizeMode"]);
-    return (React.createElement(Flex, Object.assign({ px: size === "small" ? "6px" : 3, alignItems: "center", justifyContent: "center", flexDirection: "row", borderRadius: 6, bg: typeColor[type], height: size === "small" ? "18px" : "28px" }, props),
+    var { type = "shade", size = "small", color, textColor, uppercase, Icon, children, numberOfLines, ellipsizeMode } = _a, props = __rest(_a, ["type", "size", "color", "textColor", "uppercase", "Icon", "children", "numberOfLines", "ellipsizeMode"]);
+    return (React.createElement(Flex, Object.assign({ px: size === "small" ? "6px" : 3, alignItems: "center", justifyContent: "center", flexDirection: "row", borderRadius: 6, bg: color || typeColor[type], height: size === "small" ? "18px" : "28px" }, props),
         Icon && (React.createElement(Box, { pr: 2 },
             React.createElement(Icon, { size: size === "small" ? 16 : 20, color: type === "shade" ? "neutral.c90" : "neutral.c00" }))),
-        React.createElement(Text, { variant: size === "small" ? "subtitle" : "small", fontWeight: "bold", uppercase: uppercase !== false, textAlign: "center", color: type === "shade" ? "neutral.c90" : "neutral.c00", numberOfLines: numberOfLines, ellipsizeMode: ellipsizeMode }, children)));
+        React.createElement(Text, { variant: size === "small" ? "subtitle" : "small", fontWeight: "bold", uppercase: uppercase !== false, textAlign: "center", color: textColor || (type === "shade" ? "neutral.c90" : "neutral.c00"), numberOfLines: numberOfLines, ellipsizeMode: ellipsizeMode }, children)));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ledgerhq/native-ui",
-  "version": "0.13.0-nightly.3",
+  "version": "0.14.0-nightly.0",
   "description": "Ledger Live - Mobile UI",
   "repository": {
     "type": "git",
@@ -43,7 +43,7 @@
     "styled-system": "^5.1.5",
     "victory-native": "^35.5.5",
     "@ledgerhq/crypto-icons-ui": "^0.2.1",
-    "@ledgerhq/icons-ui": "^0.3.1-nightly.3",
+    "@ledgerhq/icons-ui": "^0.3.2",
     "@ledgerhq/ui-shared": "^0.1.10"
   },
   "peerDependencies": {