@ledgerhq/native-ui 0.30.1-nightly.0 → 0.31.0-nightly.1

package/lib/components/Form/Input/AnimatedInput/index.d.ts

@@ -4,6 +4,7 @@ import { StyleProp, ViewStyle, TextInput } from "react-native";
 export type InputStatus = "default" | "focused" | "filled" | "error";
 export interface AnimatedInputProps extends BaseInputType {
     style?: StyleProp<ViewStyle>;
+    largeMode?: boolean;
 }
 declare const _default: React.ForwardRefExoticComponent<AnimatedInputProps & React.RefAttributes<TextInput>>;
 export default _default;

package/lib/components/Form/Input/AnimatedInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/AnimatedInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,KAAK,UAAU,IAAI,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEtE,OAAO,EAAE,SAAS,EAAmB,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAMhF,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAC;AACrE,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;CAC9B;;AAiED,wBAA+C"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/AnimatedInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAgC,MAAM,OAAO,CAAC;AAErD,OAAO,EAAE,KAAK,UAAU,IAAI,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEtE,OAAO,EACL,SAAS,EAGT,SAAS,EACT,SAAS,EAGV,MAAM,cAAc,CAAC;AAMtB,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,OAAO,CAAC;AACrE,MAAM,WAAW,kBAAmB,SAAQ,aAAa;IACvD,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;;AA6FD,wBAA+C"}

package/lib/components/Form/Input/AnimatedInput/index.js

@@ -1,7 +1,7 @@
-import React from "react";
+import React, { useCallback, useState } from "react";
 import { BaseInput } from "..";
 import styled, { useTheme } from "styled-components/native";
-import { View } from "react-native";
+import { View, } from "react-native";
 import { inputTextColor, inputStatusColors, getInputStatus } from "./inputTextColor";
 import { useAnimatedInputFocus } from "./useAnimatedInputFocus";
 import { AnimatedNotchedLabel } from "./AnimatedNotchedLabel";
@@ -9,26 +9,42 @@ const InputContainer = styled(View) `
   position: relative;
   box-sizing: border-box;
 `;
+const LARGE_MODE_LINE_HEIGHT = 18;
+const HEIGHT = 56;
 const AnimatedInput = ({ style = { width: "100%" }, ...textInputProps }, ref) => {
-    const { placeholder, onFocus: onFocusCallback, onBlur: onBlurCallback, error, value, ...rest } = textInputProps;
+    const { placeholder, onFocus: onFocusCallback, onBlur: onBlurCallback, error, value, largeMode = false, ...rest } = textInputProps;
+    const [height, setHeight] = useState(HEIGHT);
     const theme = useTheme();
     const { onFocus, onBlur, focused } = useAnimatedInputFocus({
         onFocusCallback,
         onBlurCallback,
     });
+    const [previousLineCount, setPreviousLineCount] = useState(1);
     const inputStatus = getInputStatus({ focused, hasError: !!error, hasValue: !!value });
     const displayClearCross = inputStatus === "error" || inputStatus === "focused";
+    const handleContentSizeChange = useCallback((event) => {
+        const contentHeight = event.nativeEvent.contentSize.height;
+        const currentLineCount = Math.round(contentHeight / LARGE_MODE_LINE_HEIGHT);
+        if (currentLineCount !== previousLineCount) {
+            const newHeight = HEIGHT + (currentLineCount - 1) * LARGE_MODE_LINE_HEIGHT;
+            setHeight(newHeight);
+            setPreviousLineCount(currentLineCount);
+        }
+    }, [previousLineCount]);
     return (React.createElement(InputContainer, { status: inputStatus, style: style },
         placeholder && (React.createElement(AnimatedNotchedLabel, { placeholder: placeholder, inputStatus: inputStatus, value: value })),
-        React.createElement(BaseInput, { ref: ref, onFocus: onFocus, onBlur: onBlur, error: error, value: value, color: theme ? inputTextColor[inputStatus]({ theme }) : "neutral.c100", inputContainerStyle: {
+        React.createElement(BaseInput, { ref: ref, onFocus: onFocus, onBlur: onBlur, error: error, multiline: largeMode, value: value, color: theme ? inputTextColor[inputStatus]({ theme }) : "neutral.c100", inputContainerStyle: {
                 backgroundColor: "none",
                 borderColor: theme ? inputStatusColors[inputStatus]({ theme }) : "neutral.c100",
                 borderRadius: 8,
-                height: inputStatus !== "error" ? 56 : 48,
+                height: inputStatus !== "error" ? height : 48,
+                paddingTop: largeMode ? 14 : 0,
+                paddingBottom: largeMode ? 14 : 0,
+                marginBottom: largeMode ? 40 : 0,
             }, baseInputContainerStyle: {
-                paddingRight: displayClearCross ? 8 : 14,
+                paddingRight: displayClearCross ? (largeMode ? 20 : 8) : 14,
             }, inputErrorContainerStyles: {
                 marginTop: 8,
-            }, inputErrorColor: theme ? inputStatusColors[inputStatus]({ theme }) : "neutral.c100", showErrorIcon: true, ...rest })));
+            }, inputErrorColor: theme ? inputStatusColors[inputStatus]({ theme }) : "neutral.c100", showErrorIcon: true, onContentSizeChange: largeMode ? handleContentSizeChange : undefined, largeMode: largeMode, ...rest })));
 };
 export default React.forwardRef(AnimatedInput);

package/lib/components/Form/Input/BaseInput/index.d.ts

@@ -22,6 +22,12 @@ export type InputProps<T = string> = Omit<CommonProps, "value" | "onChange"> & {
     renderRight?: ((props: InputProps<T>, ref: React.RefObject<{
         clear: () => void;
     }>) => React.ReactNode) | React.ReactNode;
+    /**
+     * A function that will render some content at the bottom right of the input.
+     */
+    renderBottomRight?: ((props: InputProps<T>, ref: React.RefObject<{
+        clear: () => void;
+    }>) => React.ReactNode) | React.ReactNode;
     /**
      * Triggered when the input value is updated.
      */
@@ -69,6 +75,10 @@ export type InputProps<T = string> = Omit<CommonProps, "value" | "onChange"> & {
      * Optional text color parameter.
      */
     color?: string;
+    /**
+     * If true, inputBottomRight will replace inputRight.
+     */
+    largeMode?: boolean;
 };
 export declare const InputRenderLeftContainer: import("styled-components").StyledComponent<typeof import("react-native").View, import("styled-components").DefaultTheme, import("styled-system").SpaceProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("styled-system").FlexboxProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("styled-system").PositionProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("styled-system").ColorProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, string | number | symbol> & import("styled-system").LayoutProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("styled-system").OverflowProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>> & import("styled-system").BorderProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.Border<import("styled-system").TLengthStyledSystem>> & import("styled-system").BackgroundProps<Required<import("styled-system").Theme<import("styled-system").TLengthStyledSystem>>, import("csstype").Property.Background<import("styled-system").TLengthStyledSystem>> & {
     columnGap?: string | number | undefined;
@@ -94,6 +104,7 @@ export declare const InputRenderRightContainer: import("styled-components").Styl
     flexDirection: string;
     paddingLeft: string;
 }, "alignItems" | "flexDirection" | "paddingLeft">;
+export declare const InputRenderBottomRightContainer: import("styled-components").StyledComponent<typeof import("react-native").View, import("styled-components").DefaultTheme, import("../../../styled").BaseStyledProps, never>;
 declare function Input<T = string>(props: InputProps<T>, ref?: any): JSX.Element;
 declare const _default: <T>(props: InputProps<T> & {
     ref?: React.ForwardedRef<TextInput> | null;

package/lib/components/Form/Input/BaseInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/BaseInput/index.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAuE,MAAM,OAAO,CAAC;AAC5F,OAAO,EACL,SAAS,EACT,cAAc,EAEd,SAAS,EACT,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AAMtB,MAAM,MAAM,WAAW,GAAG,cAAc,GAAG;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,UAAU,CAAC,CAAC,GAAG,MAAM,IAAI,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IAC7E;;OAEG;IACH,KAAK,EAAE,CAAC,CAAC;IACT;;OAEG;IACH,UAAU,CAAC,EACP,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GACxF,KAAK,CAAC,SAAS,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EACR,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GACxF,KAAK,CAAC,SAAS,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B;;OAEG;IACH,aAAa,CAAC,EAAE,cAAc,CAAC,UAAU,CAAC,CAAC;IAC3C;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,MAAM,CAAC;IACjC;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,CAAC,CAAC;IACnC;;OAEG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC;;OAEG;IACH,mBAAmB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IACvD;;OAEG;IACH,uBAAuB,CAAC,EAAE,SAAS,CAAC;IACpC;;OAEG;IACH,yBAAyB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACjD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAsEF,eAAO,MAAM,wBAAwB;;;;;;;;;;;mDAIhC,CAAC;AAEN,eAAO,MAAM,yBAAyB;;;;;;;;;;;kDAIjC,CAAC;AAMN,iBAAS,KAAK,CAAC,CAAC,GAAG,MAAM,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CA2FvE;mCAGQ,WAAW,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,MAAM,YAAY,CAAC,SAAS,CAAC,GAAG,IAAI,CAAA;CAAE,KAClE,WAAW,YAAY,CAAC;AAF7B,wBAE8B"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/BaseInput/index.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAuE,MAAM,OAAO,CAAC;AAC5F,OAAO,EACL,SAAS,EACT,cAAc,EAEd,SAAS,EACT,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAC;AAMtB,MAAM,MAAM,WAAW,GAAG,cAAc,GAAG;IACzC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,UAAU,CAAC,CAAC,GAAG,MAAM,IAAI,IAAI,CAAC,WAAW,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IAC7E;;OAEG;IACH,KAAK,EAAE,CAAC,CAAC;IACT;;OAEG;IACH,UAAU,CAAC,EACP,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GACxF,KAAK,CAAC,SAAS,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EACR,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GACxF,KAAK,CAAC,SAAS,CAAC;IACpB;;OAEG;IACH,iBAAiB,CAAC,EACd,CAAC,CAAC,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,KAAK,CAAC,SAAS,CAAC;QAAE,KAAK,EAAE,MAAM,IAAI,CAAA;KAAE,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GACxF,KAAK,CAAC,SAAS,CAAC;IACpB;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC9B;;OAEG;IACH,aAAa,CAAC,EAAE,cAAc,CAAC,UAAU,CAAC,CAAC;IAC3C;;;;;;;;OAQG;IACH,SAAS,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,MAAM,CAAC;IACjC;;;;OAIG;IACH,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,CAAC,CAAC;IACnC;;OAEG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC;;OAEG;IACH,mBAAmB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG,SAAS,CAAC;IACvD;;OAEG;IACH,uBAAuB,CAAC,EAAE,SAAS,CAAC;IACpC;;OAEG;IACH,yBAAyB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACjD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAuEF,eAAO,MAAM,wBAAwB;;;;;;;;;;;mDAIhC,CAAC;AAEN,eAAO,MAAM,yBAAyB;;;;;;;;;;;kDAIjC,CAAC;AAEN,eAAO,MAAM,+BAA+B,6KAI3C,CAAC;AAkCF,iBAAS,KAAK,CAAC,CAAC,GAAG,MAAM,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC,OAAO,CAqGvE;mCAGQ,WAAW,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,MAAM,YAAY,CAAC,SAAS,CAAC,GAAG,IAAI,CAAA;CAAE,KAClE,WAAW,YAAY,CAAC;AAF7B,wBAE8B"}

package/lib/components/Form/Input/BaseInput/index.js

@@ -14,6 +14,7 @@ const InputContainer = styled.View `
   color: ${(p) => p.theme.colors.neutral.c100};
   align-items: center;
   padding: 0px 16px;
+  position: relative;
 
   ${(p) => p.disabled &&
     css `
@@ -73,11 +74,28 @@ export const InputRenderRightContainer = styled(FlexBox).attrs(() => ({
     flexDirection: "row",
     paddingLeft: "8px",
 })) ``;
+export const InputRenderBottomRightContainer = styled(FlexBox) `
+  position: absolute;
+  bottom: 2px;
+  right: 8px;
+`;
+const RenderRight = ({ renderRight, props, inputRef }) => {
+    if (!renderRight)
+        return null;
+    return (React.createElement(InputRenderRightContainer, null, typeof renderRight === "function" ? renderRight(props, inputRef) : renderRight));
+};
+const RenderBottomRight = ({ renderBottomRight, props, inputRef }) => {
+    if (!renderBottomRight)
+        return null;
+    return (React.createElement(InputRenderBottomRightContainer, null, typeof renderBottomRight === "function"
+        ? renderBottomRight(props, inputRef)
+        : renderBottomRight));
+};
 // Yes, this is dirty. If you can figure out a better way please change the code :).
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const IDENTITY = (_) => _;
 function Input(props, ref) {
-    const { value, onChange, onChangeText, onChangeEvent, disabled, error, renderLeft, renderRight, serialize = IDENTITY, deserialize = IDENTITY, containerStyle, hasBorder = true, inputContainerStyle, baseInputContainerStyle, inputErrorContainerStyles, autoFocus, onFocus, onBlur, color, inputErrorColor = "error.c50", showErrorIcon = false, ...textInputProps } = props;
+    const { value, onChange, onChangeText, onChangeEvent, disabled, error, renderLeft, renderRight, renderBottomRight, serialize = IDENTITY, deserialize = IDENTITY, containerStyle, hasBorder = true, inputContainerStyle, baseInputContainerStyle, inputErrorContainerStyles, autoFocus, onFocus, onBlur, color, inputErrorColor = "error.c50", showErrorIcon = false, largeMode, ...textInputProps } = props;
     const inputRef = useRef();
     useImperativeHandle(ref, () => inputRef.current, [inputRef]);
     const inputValue = useMemo(() => serialize(value), [serialize, value]);
@@ -100,7 +118,7 @@ function Input(props, ref) {
                     setFocus(false);
                     onBlur?.(e);
                 }, style: { ...(color ? { color: color } : {}), ...baseInputContainerStyle } }),
-            typeof renderRight === "function" ? renderRight(props, inputRef) : renderRight),
+            largeMode ? (React.createElement(RenderBottomRight, { renderBottomRight: renderBottomRight, props: props, inputRef: inputRef })) : (React.createElement(RenderRight, { renderRight: renderRight, props: props, inputRef: inputRef }))),
         !!error && !disabled && (React.createElement(FlexBox, { flexDirection: "row", alignItems: "center", style: inputErrorContainerStyles },
             showErrorIcon && React.createElement(DeleteCircleFill, { color: inputErrorColor, size: "S" }),
             React.createElement(InputErrorText, { color: inputErrorColor, variant: "small", mt: 3 }, error)))));

package/lib/components/Form/Input/LegendInput/index.d.ts

@@ -9,6 +9,9 @@ declare const _default: React.ForwardRefExoticComponent<Omit<import("../BaseInpu
     renderRight?: React.ReactNode | ((props: InputProps<string>, ref: React.RefObject<{
         clear: () => void;
     }>) => React.ReactNode);
+    renderBottomRight?: React.ReactNode | ((props: InputProps<string>, ref: React.RefObject<{
+        clear: () => void;
+    }>) => React.ReactNode);
     onChange?: ((value: string) => void) | undefined;
     onChangeEvent?: ((e: import("react-native").NativeSyntheticEvent<import("react-native").TextInputChangeEventData>) => void) | undefined;
     serialize?: ((value: string) => string) | undefined;
@@ -21,6 +24,7 @@ declare const _default: React.ForwardRefExoticComponent<Omit<import("../BaseInpu
     showErrorIcon?: boolean | undefined;
     hasBorder?: boolean | undefined;
     color?: string | undefined;
+    largeMode?: boolean | undefined;
 } & {
     legend: string;
 } & React.RefAttributes<TextInput>>;

package/lib/components/Form/Input/LegendInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/LegendInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAc,EAAE,UAAU,EAA6B,MAAM,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;AAsB5E,wBAA6C"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/LegendInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAc,EAAE,UAAU,EAA6B,MAAM,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsB5E,wBAA6C"}

package/lib/components/Form/Input/NumberInput/index.d.ts

@@ -9,6 +9,9 @@ declare const _default: React.ForwardRefExoticComponent<Omit<import("../BaseInpu
     renderRight?: React.ReactNode | ((props: InputProps<number | undefined>, ref: React.RefObject<{
         clear: () => void;
     }>) => React.ReactNode);
+    renderBottomRight?: React.ReactNode | ((props: InputProps<number | undefined>, ref: React.RefObject<{
+        clear: () => void;
+    }>) => React.ReactNode);
     onChange?: ((value: number | undefined) => void) | undefined;
     onChangeEvent?: ((e: import("react-native").NativeSyntheticEvent<import("react-native").TextInputChangeEventData>) => void) | undefined;
     serialize?: ((value: number | undefined) => string) | undefined;
@@ -21,6 +24,7 @@ declare const _default: React.ForwardRefExoticComponent<Omit<import("../BaseInpu
     showErrorIcon?: boolean | undefined;
     hasBorder?: boolean | undefined;
     color?: string | undefined;
+    largeMode?: boolean | undefined;
 } & {
     onPercentClick: (percent: number) => void;
     min?: number | undefined;

package/lib/components/Form/Input/NumberInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/NumberInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzC,OAAc,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;AAgFjD,wBAA6C"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/NumberInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzC,OAAc,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgFjD,wBAA6C"}

package/lib/components/Form/Input/QrCodeInput/index.d.ts

@@ -10,6 +10,9 @@ declare const _default: React.ForwardRefExoticComponent<Omit<import("../BaseInpu
     renderRight?: React.ReactNode | ((props: InputProps<string>, ref: React.RefObject<{
         clear: () => void;
     }>) => React.ReactNode);
+    renderBottomRight?: React.ReactNode | ((props: InputProps<string>, ref: React.RefObject<{
+        clear: () => void;
+    }>) => React.ReactNode);
     onChange?: ((value: string) => void) | undefined;
     onChangeEvent?: ((e: import("react-native").NativeSyntheticEvent<import("react-native").TextInputChangeEventData>) => void) | undefined;
     serialize?: ((value: string) => string) | undefined;
@@ -22,6 +25,7 @@ declare const _default: React.ForwardRefExoticComponent<Omit<import("../BaseInpu
     showErrorIcon?: boolean | undefined;
     hasBorder?: boolean | undefined;
     color?: string | undefined;
+    largeMode?: boolean | undefined;
 } & {
     onQrCodeClick?: ((event: GestureResponderEvent) => void) | undefined;
 } & React.RefAttributes<TextInput>>;

package/lib/components/Form/Input/QrCodeInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/QrCodeInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,qBAAqB,EAAoB,MAAM,cAAc,CAAC;AAEvE,OAAc,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;AA2CjD,wBAA6C"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/QrCodeInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,qBAAqB,EAAoB,MAAM,cAAc,CAAC;AAEvE,OAAc,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2CjD,wBAA6C"}

package/lib/components/Form/Input/SearchInput/index.d.ts

@@ -9,6 +9,9 @@ declare const _default: React.ForwardRefExoticComponent<Omit<import("../BaseInpu
     renderRight?: React.ReactNode | ((props: InputProps<string>, ref: React.RefObject<{
         clear: () => void;
     }>) => React.ReactNode);
+    renderBottomRight?: React.ReactNode | ((props: InputProps<string>, ref: React.RefObject<{
+        clear: () => void;
+    }>) => React.ReactNode);
     onChange?: ((value: string) => void) | undefined;
     onChangeEvent?: ((e: import("react-native").NativeSyntheticEvent<import("react-native").TextInputChangeEventData>) => void) | undefined;
     serialize?: ((value: string) => string) | undefined;
@@ -21,6 +24,7 @@ declare const _default: React.ForwardRefExoticComponent<Omit<import("../BaseInpu
     showErrorIcon?: boolean | undefined;
     hasBorder?: boolean | undefined;
     color?: string | undefined;
+    largeMode?: boolean | undefined;
 } & React.RefAttributes<TextInput>>;
 export default _default;
 //# sourceMappingURL=index.d.ts.map

package/lib/components/Form/Input/SearchInput/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/SearchInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,OAAc,EAAE,UAAU,EAA4B,MAAM,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;AAsD3E,wBAA6C"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/Form/Input/SearchInput/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzC,OAAc,EAAE,UAAU,EAA4B,MAAM,cAAc,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;AAsD3E,wBAA6C"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ledgerhq/native-ui",
-  "version": "0.30.1-nightly.0",
+  "version": "0.31.0-nightly.1",
   "description": "Ledger Live - Mobile UI",
   "repository": {
     "type": "git",