@swan-io/lake 4.5.2 → 4.6.0

package/package.json

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

package/src/components/FixedListView.js

@@ -280,11 +280,14 @@ const styles = StyleSheet.create({
         left: 0,
         right: 0,
         bottom: 0,
+        backgroundColor: backgroundColor.default,
+    },
+    emptyListContentContainer: {
         flexDirection: "column",
         alignItems: "center",
         justifyContent: "center",
         padding: spacings[48],
-        backgroundColor: backgroundColor.default,
+        minHeight: "100%",
     },
     emptyList: {
         flexDirection: "column",
@@ -808,7 +811,7 @@ export const FixedListView = ({ data: originalData, mode = "tile", keyExtractor,
                                         ], children: [_jsx(View, { style: [
                                                     styles.stickyColumnEndOverflow,
                                                     { width: horizontalPadding, backgroundColor: headerBackgroundColor },
-                                                ] }), _jsx(HeaderSegment, { columns: stickedToEndColumns, extraInfo: extraInfo, viewId: viewId, width: stickedToEndColumnsWidth }), _jsx(View, { style: [styles.topGradient, isScrolled && styles.visibleTopGradient] })] }), _jsx(View, { style: { height: rowsHeight }, children: endRows })] })) : null] })] }), data.length === 0 && isNotNullish(renderEmptyList) && !isLoading ? (_jsx(View, { style: styles.emptyListContainer, children: renderEmptyList() })) : null, _jsx(View, { ref: endFocusAnchorRef, tabIndex: 0 })] }));
+                                                ] }), _jsx(HeaderSegment, { columns: stickedToEndColumns, extraInfo: extraInfo, viewId: viewId, width: stickedToEndColumnsWidth }), _jsx(View, { style: [styles.topGradient, isScrolled && styles.visibleTopGradient] })] }), _jsx(View, { style: { height: rowsHeight }, children: endRows })] })) : null] })] }), data.length === 0 && isNotNullish(renderEmptyList) && !isLoading ? (_jsx(ScrollView, { style: styles.emptyListContainer, contentContainerStyle: styles.emptyListContentContainer, children: renderEmptyList() })) : null, _jsx(View, { ref: endFocusAnchorRef, tabIndex: 0 })] }));
 };
 export const FixedListViewPlaceholder = ({ count, rowHeight, rowVerticalSpacing, groupHeaderHeight, headerHeight, paddingHorizontal = HORIZONTAL_SAFE_AREA, }) => {
     const totalRowHeight = rowHeight + rowVerticalSpacing;

package/src/components/LakeTagInput.d.ts

@@ -7,6 +7,7 @@ export type LakeTagInputProps = Merge<TextInputProps, {
     disabled?: boolean;
     valid?: boolean;
     hideErrors?: boolean;
+    validateOnBlur?: boolean;
     help?: string;
     validator?: (value: string) => boolean;
     values: string[];
@@ -211,6 +212,7 @@ export declare const LakeTagInput: import("react").ForwardRefExoticComponent<{
     disabled?: boolean | undefined;
     valid?: boolean | undefined;
     hideErrors?: boolean | undefined;
+    validateOnBlur?: boolean | undefined;
     help?: string | undefined;
     validator?: ((value: string) => boolean) | undefined;
     placeholder?: string | undefined;

package/src/components/LakeTagInput.js

@@ -77,7 +77,7 @@ const styles = StyleSheet.create({
     },
 });
 const SEPARATORS_REGEX = /,| /;
-export const LakeTagInput = forwardRef(({ validator = () => true, onFocus: originalOnFocus, onBlur: originalOnBlur, values, onValuesChanged, readOnly = false, disabled = false, valid = false, hideErrors = false, placeholder, help, error, }, forwardRef) => {
+export const LakeTagInput = forwardRef(({ validator = () => true, onFocus: originalOnFocus, onBlur: originalOnBlur, validateOnBlur = true, values, onValuesChanged, readOnly = false, disabled = false, valid = false, hideErrors = false, placeholder, help, error, }, forwardRef) => {
     const inputRef = useRef(null);
     const containerRef = useRef(null);
     const [isFocused, setIsFocused] = useState(false);
@@ -97,6 +97,9 @@ export const LakeTagInput = forwardRef(({ validator = () => true, onFocus: origi
         }
     }, [pushNewValues]);
     const onTextInputKeyPress = useCallback(({ nativeEvent }) => {
+        if (disabled || readOnly) {
+            return;
+        }
         match({ key: nativeEvent.key, input: inputRef.current })
             .with({ key: "Backspace", input: P.instanceOf(HTMLInputElement) }, ({ input }) => {
             if (isNullishOrEmpty(input.value)) {
@@ -108,7 +111,7 @@ export const LakeTagInput = forwardRef(({ validator = () => true, onFocus: origi
                 pushNewValues([input.value]);
             }
         });
-    }, [onValuesChanged, pushNewValues, values]);
+    }, [onValuesChanged, pushNewValues, values, disabled, readOnly]);
     const autoFocus = useCallback(() => {
         inputRef.current?.focus();
     }, []);
@@ -117,9 +120,15 @@ export const LakeTagInput = forwardRef(({ validator = () => true, onFocus: origi
         originalOnFocus?.(event);
     }, [originalOnFocus]);
     const onBlur = useCallback((event) => {
+        const input = inputRef.current;
+        if (input instanceof HTMLInputElement &&
+            isNotNullishOrEmpty(input.value) &&
+            validateOnBlur) {
+            pushNewValues([input.value]);
+        }
         setIsFocused(false);
         originalOnBlur?.(event);
-    }, [originalOnBlur]);
+    }, [pushNewValues, originalOnBlur, validateOnBlur]);
     const mergedRef = useMergeRefs(inputRef, forwardRef);
     const hasError = isNotNullishOrEmpty(error);
     return (_jsxs(View, { children: [_jsxs(Pressable, { style: [