@swan-io/lake 2.7.6 → 2.7.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swan-io/lake",
-  "version": "2.7.6",
+  "version": "2.7.7",
   "engines": {
     "node": ">=18.0.0",
     "yarn": "^1.22.0"
@@ -27,9 +27,9 @@
   "license": "MIT",
   "dependencies": {
     "@popperjs/core": "^2.11.8",
-    "@react-three/drei": "^9.79.3",
-    "@react-three/fiber": "^8.13.5",
-    "@swan-io/boxed": "^1.0.2",
+    "@react-three/drei": "^9.80.1",
+    "@react-three/fiber": "^8.13.6",
+    "@swan-io/boxed": "^1.1.0",
     "@swan-io/chicane": "^1.4.1",
     "dayjs": "^1.11.9",
     "polished": "^4.2.2",
@@ -39,21 +39,21 @@
     "react-dom": "^18.2.0",
     "react-native-web": "^0.19.7",
     "react-popper": "^2.3.0",
-    "react-ux-form": "^1.4.0",
+    "react-ux-form": "^1.5.0",
     "rifm": "^0.12.1",
-    "three": "^0.154.0",
+    "three": "^0.155.0",
     "ts-dedent": "^2.2.0",
-    "ts-pattern": "^5.0.4",
-    "urql": "^4.0.4",
+    "ts-pattern": "^5.0.5",
+    "urql": "^4.0.5",
     "uuid": "^9.0.0"
   },
   "devDependencies": {
-    "@types/react": "^18.2.15",
+    "@types/react": "^18.2.19",
     "@types/react-dom": "^18.2.7",
     "@types/react-native": "^0.72.2",
-    "@types/three": "^0.154.0",
+    "@types/three": "^0.155.0",
     "@types/uuid": "^9.0.2",
     "jsdom": "^22.1.0",
-    "type-fest": "^4.0.0"
+    "type-fest": "^4.2.0"
   }
 }

package/src/components/FixedListViewCells.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode, ComponentProps } from "react";
+import { ComponentProps, ReactNode } from "react";
 import { ColorVariants } from "../constants/design";
 import { TextVariant } from "./LakeText";
 import { LakeTooltip } from "./LakeTooltip";

package/src/components/FixedListViewCells.js

@@ -115,11 +115,12 @@ export const SimpleRegularTextCell = ({ variant = "regular", text, textAlign = "
 };
 export const CopyableRegularTextCell = ({ variant = "regular", text, textToCopy, copyWording, copiedWording, tooltip, }) => {
     const [visibleState, setVisibleState] = useState("copy");
+    const clipboardText = textToCopy ?? text;
     const onPress = useCallback((event) => {
         event.preventDefault();
-        Clipboard.setString(textToCopy ?? text);
+        Clipboard.setString(clipboardText);
         setVisibleState("copied");
-    }, [text]);
+    }, [clipboardText]);
     return (_jsxs(View, { style: styles.cell, children: [_jsx(LakeTooltip, { placement: "top", onHide: () => setVisibleState("copy"), togglableOnFocus: true, content: visibleState === "copy" ? copyWording : copiedWording, containerStyle: styles.iconContainer, children: _jsx(Pressable, { role: "button", "aria-label": copyWording, onPress: onPress, style: ({ hovered }) => [styles.icon, hovered && styles.underline], children: ({ hovered }) => (_jsx(Icon, { name: hovered ? "copy-filled" : "copy-regular", color: "currentColor", size: 14 })) }) }), _jsx(Space, { width: 4 }), _jsx(LakeText, { tooltip: tooltip, color: colors.gray[900], style: styles.regularText, variant: variant, children: text })] }));
 };
 // TODO: handle `+` sign properly

package/src/components/LakeCombobox.js

@@ -3,7 +3,6 @@ import { forwardRef, useCallback, useId, useImperativeHandle, useRef, useState,
 import { FlatList, Pressable, StyleSheet, Text, View, } from "react-native";
 import { backgroundColor, colors, spacings } from "../constants/design";
 import { typography } from "../constants/typography";
-import { useDisclosure } from "../hooks/useDisclosure";
 import { useMergeRefs } from "../hooks/useMergeRefs";
 import { getFocusableElements } from "../utils/a11y";
 import { Box } from "./Box";
@@ -86,9 +85,10 @@ const LakeComboboxWithRef = ({ inputRef, value, items, itemHeight = DEFAULT_ELEM
     const listRef = useRef(null);
     const listContainerRef = useRef(null);
     const blurTimeoutId = useRef(undefined);
-    const [isFocused, { open, close }] = useDisclosure(false, () => setHasChanged(false));
+    const [isFocused, setIsFocused] = useState(false);
     const [isFetchingAdditionalInfo, setIsFetchingAdditionalInfo] = useState(false);
-    const [hasChanged, setHasChanged] = useState(false);
+    const open = useCallback(() => ref.current?.focus(), []);
+    const close = useCallback(() => ref.current?.blur(), []);
     useImperativeHandle(externalRef, () => {
         return {
             open,
@@ -133,19 +133,16 @@ const LakeComboboxWithRef = ({ inputRef, value, items, itemHeight = DEFAULT_ELEM
     const handleFocus = useCallback(() => {
         window.clearTimeout(blurTimeoutId.current);
         blurTimeoutId.current = window.setTimeout(() => {
-            open();
+            setIsFocused(true);
         }, 100);
-    }, [open]);
+    }, []);
     const handleBlur = useCallback(() => {
         window.clearTimeout(blurTimeoutId.current);
         blurTimeoutId.current = window.setTimeout(() => {
-            close();
+            setIsFocused(false);
         }, 100);
-    }, [close]);
-    return (_jsxs(View, { children: [_jsx(LakeTextInput, { containerRef: inputTextRef, style: styles.input, ariaExpanded: isFocused, ariaControls: isFocused ? suggestionsId : "", enterKeyHint: "search", icon: icon, role: "combobox", placeholder: placeholder, value: value, disabled: disabled, error: error, hideErrors: hideErrors, onChangeText: onValueChange, onChange: event => {
-                    setHasChanged(true);
-                    onChange?.(event);
-                }, onFocus: handleFocus, onBlur: handleBlur, onKeyPress: handleKeyPress, id: id, readOnly: readOnly }), _jsx(Popover, { id: suggestionsId, role: "listbox", matchReferenceWidth: true, onDismiss: close, referenceRef: ref, autoFocus: false, returnFocus: true, visible: isFocused && !items.isNotAsked() && hasChanged, underlay: false, forcedMode: "Dropdown", children: _jsx(View, { style: [styles.list, { maxHeight: itemHeight * nbItemsDisplayed }], children: items.match({
+    }, []);
+    return (_jsxs(View, { children: [_jsx(LakeTextInput, { containerRef: inputTextRef, style: styles.input, ariaExpanded: isFocused, ariaControls: isFocused ? suggestionsId : "", enterKeyHint: "search", icon: icon, role: "combobox", placeholder: placeholder, value: value, disabled: disabled, error: error, hideErrors: hideErrors, onChangeText: onValueChange, onChange: onChange, onFocus: handleFocus, onBlur: handleBlur, onKeyPress: handleKeyPress, id: id, readOnly: readOnly }), _jsx(Popover, { id: suggestionsId, role: "listbox", matchReferenceWidth: true, onDismiss: close, referenceRef: ref, autoFocus: false, returnFocus: false, visible: isFocused && !items.isNotAsked(), underlay: false, forcedMode: "Dropdown", children: _jsx(View, { style: [styles.list, { maxHeight: itemHeight * nbItemsDisplayed }], children: items.match({
                         NotAsked: () => null,
                         Loading: () => _jsx(LoadingView, { style: styles.loader }),
                         Done: items => items.match({

package/src/hooks/useDisclosure.d.ts

@@ -1,4 +1,4 @@
-export declare const useDisclosure: (initialValue: boolean, onClose?: () => void) => [
+export declare const useDisclosure: (initialValue: boolean) => [
     visible: boolean,
     fns: {
         open: () => void;

package/src/hooks/useDisclosure.js

@@ -1,14 +1,11 @@
 import { useMemo, useState } from "react";
-export const useDisclosure = (initialValue, onClose) => {
+export const useDisclosure = (initialValue) => {
     const [value, setValue] = useState(initialValue);
     return [
         value,
         useMemo(() => ({
             open: () => setValue(true),
-            close: () => {
-                setValue(false);
-                onClose?.();
-            },
+            close: () => setValue(false),
             toggle: () => setValue(prevValue => !prevValue),
         }), []),
     ];