@swan-io/lake 13.1.0 → 13.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swan-io/lake",
-  "version": "13.1.0",
+  "version": "13.1.2",
   "engines": {
     "node": "^22.12.0"
   },

package/src/components/LakeTextInput.d.ts

@@ -27,8 +27,9 @@ export type LakeTextInputProps = Except<TextInputProps, "editable" | "keyboardTy
     onUnitChange?: (value: string) => void;
     maxCharCount?: number;
     help?: string;
+    info?: ReactNode | null | undefined;
     warning?: boolean;
     renderEnd?: () => ReactNode;
     containerRef?: Ref<View>;
 };
-export declare const LakeTextInput: ({ ref, ariaExpanded, ariaControls, error, disabled, validating, valid, readOnly, icon, children, unit, units, color, inputMode, hideErrors, onChange, onUnitChange, pattern, style: stylesFromProps, containerStyle: containerStylesFromProps, onFocus: originalOnFocus, onBlur: originalOnBlur, value, defaultValue, multiline, containerRef, maxCharCount, help, warning, renderEnd, ...props }: LakeTextInputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const LakeTextInput: ({ ref, ariaExpanded, ariaControls, error, disabled, validating, valid, readOnly, icon, children, unit, units, color, inputMode, hideErrors, onChange, onUnitChange, pattern, style: stylesFromProps, containerStyle: containerStylesFromProps, onFocus: originalOnFocus, onBlur: originalOnBlur, value, defaultValue, multiline, containerRef, maxCharCount, help, warning, info, renderEnd, ...props }: LakeTextInputProps) => import("react/jsx-runtime").JSX.Element;

package/src/components/LakeTextInput.js

@@ -128,7 +128,7 @@ export const LakeTextInput = ({ ref, ariaExpanded, ariaControls, error, disabled
 //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
-maxCharCount, help, warning = false, renderEnd, ...props }) => {
+maxCharCount, help, warning = false, info, renderEnd, ...props }) => {
     const inputRef = useRef(null);
     const [isHovered, setIsHovered] = useState(false);
     const [isFocused, setIsFocused] = useState(false);
@@ -148,6 +148,7 @@ maxCharCount, help, warning = false, renderEnd, ...props }) => {
     const mergedRef = useMergeRefs(inputRef, ref);
     const isInteractive = !disabled && !readOnly;
     const hasError = isNotNullishOrEmpty(error);
+    const hasInfo = isNotNullish(info);
     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, containerStylesFromProps], children: [_jsxs(View, { style: [
                                     styles.contents,
@@ -159,6 +160,7 @@ maxCharCount, help, warning = false, renderEnd, ...props }) => {
                                     isFocused && styles.focused,
                                     isNotNullish(unit !== null && unit !== void 0 ? unit : units) && styles.inputWithUnit,
                                     warning && { borderColor: colors.warning[500] },
+                                    hasInfo && { borderColor: colors.shakespear[500] },
                                     hasError && styles.error,
                                     valid && styles.valid,
                                     stylesFromProps,
@@ -168,5 +170,5 @@ maxCharCount, help, warning = false, renderEnd, ...props }) => {
                                             readOnly && hasError && styles.readOnlyError,
                                             disabled && styles.disabled,
                                             readOnly && styles.readOnly,
-                                        ] }), isNotNullish(renderEnd) && _jsx(View, { style: styles.endComponents, children: renderEnd() }), validating && (_jsx(ActivityIndicator, { size: "small", style: styles.endIcon, color: colors.current[500] })), !validating && hasError && (_jsx(Icon, { name: "warning-regular", size: 20, color: colors.negative[400], style: [styles.endIcon, readOnly && styles.readOnlyEndIcon] })), !validating && warning && !hasError && (_jsx(Icon, { name: "warning-regular", size: 20, color: colors.warning[500], style: [styles.endIcon, readOnly && styles.readOnlyEndIcon] })), !validating && !hasError && valid && (_jsx(Icon, { name: "checkmark-filled", size: 20, color: colors.positive[400], style: [styles.endIcon, readOnly && styles.readOnlyEndIcon] }))] }), isNotNullish(units) && isNotNullish(onUnitChange) ? (_jsx(Box, { children: _jsx(LakeSelect, { value: unit, onValueChange: onUnitChange, items: units.map(value => ({ name: value, value })), disabled: disabled, style: [styles.unit, (disabled || readOnly) && styles.unitDisabled], mode: "borderless", hideErrors: true }) })) : isNotNullish(unit) ? (_jsx(LakeText, { color: colors.gray[900], style: [styles.unit, (disabled || readOnly) && styles.unitDisabled], children: unit })) : null] }), children] }), !hideErrors && (_jsxs(Box, { direction: "row", style: styles.errorContainer, children: [isNotNullish(error) ? (_jsx(LakeText, { variant: "smallRegular", color: colors.negative[500], children: error })) : (_jsx(LakeText, { variant: "smallRegular", color: colors.gray[500], children: help !== null && help !== void 0 ? help : " " })), isNotNullish(maxCharCount) && (_jsxs(_Fragment, { children: [_jsx(Fill, { minWidth: 4 }), _jsxs(LakeText, { variant: "smallRegular", color: charCount > maxCharCount ? colors.negative[500] : colors.gray[400], style: styles.descriptionLimitation, children: [charCount, " / ", maxCharCount] })] }))] }))] }));
+                                        ] }), isNotNullish(renderEnd) && _jsx(View, { style: styles.endComponents, children: renderEnd() }), validating && (_jsx(ActivityIndicator, { size: "small", style: styles.endIcon, color: colors.current[500] })), !validating && hasError && (_jsx(Icon, { name: "warning-regular", size: 20, color: colors.negative[400], style: [styles.endIcon, readOnly && styles.readOnlyEndIcon] })), !validating && warning && !hasError && (_jsx(Icon, { name: "warning-regular", size: 20, color: colors.warning[500], style: [styles.endIcon, readOnly && styles.readOnlyEndIcon] })), !validating && info && !hasError && (_jsx(Icon, { name: "info-regular", size: 20, color: colors.shakespear[500], style: [styles.endIcon, readOnly && styles.readOnlyEndIcon] })), !validating && !hasError && valid && (_jsx(Icon, { name: "checkmark-filled", size: 20, color: colors.positive[400], style: [styles.endIcon, readOnly && styles.readOnlyEndIcon] }))] }), isNotNullish(units) && isNotNullish(onUnitChange) ? (_jsx(Box, { children: _jsx(LakeSelect, { value: unit, onValueChange: onUnitChange, items: units.map(value => ({ name: value, value })), disabled: disabled, style: [styles.unit, (disabled || readOnly) && styles.unitDisabled], mode: "borderless", hideErrors: true }) })) : isNotNullish(unit) ? (_jsx(LakeText, { color: colors.gray[900], style: [styles.unit, (disabled || readOnly) && styles.unitDisabled], children: unit })) : null] }), children] }), !hideErrors && (_jsxs(Box, { direction: "row", style: styles.errorContainer, children: [isNotNullish(error) ? (_jsx(LakeText, { variant: "smallRegular", color: colors.negative[500], children: error })) : (_jsx(LakeText, { variant: "smallRegular", color: colors.gray[500], children: help !== null && help !== void 0 ? help : " " })), isNotNullish(info) && (_jsx(LakeText, { variant: "smallRegular", color: colors.shakespear[500], children: info })), isNotNullish(maxCharCount) && (_jsxs(_Fragment, { children: [_jsx(Fill, { minWidth: 4 }), _jsxs(LakeText, { variant: "smallRegular", color: charCount > maxCharCount ? colors.negative[500] : colors.gray[400], style: styles.descriptionLimitation, children: [charCount, " / ", maxCharCount] })] }))] }))] }));
 };