@swan-io/lake 2.7.14 → 2.7.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swan-io/lake",
-  "version": "2.7.14",
+  "version": "2.7.15",
   "engines": {
     "node": ">=18.0.0",
     "yarn": "^1.22.0"

package/src/components/LakeSearchField.js

@@ -21,6 +21,7 @@ const styles = StyleSheet.create({
         // to trigger the change
         maxWidth: 202,
         minWidth: 38,
+        justifyContent: "flex-end",
     },
     focus: {
         outlineStyle: "none",
@@ -38,6 +39,11 @@ const styles = StyleSheet.create({
         justifyContent: "flex-end",
         flexGrow: 1,
     },
+    largeInputContainer: {
+        flexDirection: "row",
+        justifyContent: "flex-end",
+        flexGrow: 1,
+    },
     openSearchFieldContainer: {
         position: "absolute",
         right: 0,
@@ -74,7 +80,7 @@ const ExpandedSearchField = ({ inputRef, placeholder, initialValue, onChange, se
             timeoutRef.current = window.setTimeout(() => {
                 setFocused.off();
             }, 300);
-        }, style: [styles.input, hasFocus ? styles.focus : null] }));
+        }, containerStyle: styles.largeInputContainer, style: [styles.input, hasFocus ? styles.focus : null] }));
 };
 export const LakeSearchField = ({ initialValue, placeholder, onChangeText, debounceDuration = 500, maxWidth, renderEnd, }) => {
     const [hasFocus, setFocused] = useBoolean(false);

package/src/components/LakeTextInput.d.ts

@@ -1,5 +1,5 @@
 import { ChangeEventHandler, ReactNode, Ref } from "react";
-import { NativeSyntheticEvent, TextInput, TextInputFocusEventData, TextInputProps, View } from "react-native";
+import { NativeSyntheticEvent, TextInput, TextInputFocusEventData, TextInputProps, View, ViewProps } from "react-native";
 import { Except } from "type-fest";
 import { ColorVariants } from "../constants/design";
 import { IconName } from "./Icon";
@@ -20,6 +20,7 @@ export type LakeTextInputProps = Except<TextInputProps, "editable" | "keyboardTy
     children?: ReactNode;
     hideErrors?: boolean;
     style?: TextInputProps["style"];
+    containerStyle?: ViewProps["style"];
     onChange?: ChangeEventHandler<HTMLInputElement>;
     maxCharCount?: number;
     help?: string;
@@ -233,6 +234,7 @@ export declare const LakeTextInput: import("react").ForwardRefExoticComponent<{
     children?: ReactNode;
     hideErrors?: boolean | undefined;
     style?: TextInputProps["style"];
+    containerStyle?: ViewProps["style"];
     onChange?: ChangeEventHandler<HTMLInputElement> | undefined;
     maxCharCount?: number | undefined;
     help?: string | undefined;

package/src/components/LakeTextInput.js

@@ -121,7 +121,7 @@ const styles = StyleSheet.create({
         paddingTop: spacings[4],
     },
 });
-export const LakeTextInput = forwardRef(({ ariaExpanded, ariaControls, error, disabled = false, validating = false, valid = false, readOnly = false, icon, children, unit, color = "gray", inputMode = "text", hideErrors = false, onChange, pattern, style: stylesFromProps, onFocus: originalOnFocus, onBlur: originalOnBlur, value, defaultValue, multiline = false, containerRef, 
+export const LakeTextInput = forwardRef(({ ariaExpanded, ariaControls, error, disabled = false, validating = false, valid = false, readOnly = false, icon, children, unit, color = "gray", inputMode = "text", hideErrors = false, onChange, pattern, style: stylesFromProps, containerStyle: containerStylesFromProps, onFocus: originalOnFocus, onBlur: originalOnBlur, value, defaultValue, multiline = false, containerRef, 
 //maxCharCount is different from maxLength(props inherited of TextInput)
 //maxLength truncates the text in the limitation asked,
 //maxCharCount doesn't have limitation but displays a counter of characters
@@ -146,7 +146,7 @@ maxCharCount, help, renderEnd, ...props }, forwardRef) => {
     const isInteractive = !disabled && !readOnly;
     const hasError = isNotNullishOrEmpty(error);
     const charCount = isNullish(value) ? 0 : value.length;
-    return (_jsxs(View, { style: commonStyles.fill, children: [_jsxs(View, { style: styles.root, "aria-errormessage": error, children: [_jsxs(View, { style: styles.container, children: [_jsxs(View, { style: [
+    return (_jsxs(View, { style: commonStyles.fill, children: [_jsxs(View, { style: styles.root, "aria-errormessage": error, children: [_jsxs(View, { style: [styles.container, containerStylesFromProps], children: [_jsxs(View, { style: [
                                     styles.contents,
                                     isHovered && isInteractive && styles.hovered,
                                     isFocused && { borderColor: colors[color][500] },