@swan-io/lake 11.3.6 → 11.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@swan-io/lake",
-  "version": "11.3.6",
+  "version": "11.4.0",
   "engines": {
     "node": "^22.12.0",
     "pnpm": "^10.2.0"

package/src/assets/main.css

@@ -318,9 +318,9 @@ body {
 
   --focus-ring-color: #0019fe;
 
-  --font-family-primary: Inter, -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Helvetica,
-    Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji,
-    sans-serif;
+  --font-family-primary:
+    Inter, -apple-system, system-ui, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif,
+    Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji, sans-serif;
   --font-family-card-font: "Inter Card", monospace;
   --font-family-code: SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
   --font-family-iban: "Roboto Mono", monospace;

package/src/components/FilterChooser.d.ts

@@ -1,4 +1,4 @@
-export declare function FilterChooser<FilterName extends string>({ filters, openFilters, label, title, availableFilters, large, onAddFilter, }: {
+export declare const FilterChooser: <FilterName extends string>({ filters, openFilters, label, title, availableFilters, large, onAddFilter, }: {
     filters: Partial<Record<FilterName, unknown>>;
     openFilters: FilterName[];
     label: string;
@@ -9,4 +9,4 @@ export declare function FilterChooser<FilterName extends string>({ filters, open
     }[];
     large?: boolean;
     onAddFilter: (filterName: FilterName) => void;
-}): import("react/jsx-runtime").JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;

package/src/components/FilterChooser.js

@@ -4,7 +4,6 @@ import { Pressable, StyleSheet, View } from "react-native";
 import { colors } from "../constants/design";
 import { useDisclosure } from "../hooks/useDisclosure";
 import { isNotNullishOrEmpty } from "../utils/nullish";
-import { Box } from "./Box";
 import { FlatList } from "./FlatList";
 import { Icon } from "./Icon";
 import { LakeButton } from "./LakeButton";
@@ -36,14 +35,14 @@ const styles = StyleSheet.create({
         paddingHorizontal: 24,
     },
 });
-export function FilterChooser({ filters, openFilters, label, title, availableFilters, large = true, onAddFilter, }) {
+export const FilterChooser = ({ filters, openFilters, label, title, availableFilters, large = true, onAddFilter, }) => {
     const inputRef = useRef(null);
     const [visible, { close, toggle }] = useDisclosure(false);
-    return (_jsxs(_Fragment, { children: [_jsx(Box, { direction: "row", justifyContent: "start", alignItems: "center", children: _jsx(LakeButton, { size: "small", mode: "secondary", color: "gray", onPress: toggle, ref: inputRef, icon: large ? "chevron-down-filled" : "filter-filled", iconPosition: "end", ariaLabel: label, children: large ? label : null }) }), _jsx(Popover, { role: "listbox", matchReferenceMinWidth: true, onDismiss: close, referenceRef: inputRef, returnFocus: false, visible: visible, children: _jsxs(View, { style: styles.list, children: [isNotNullishOrEmpty(title) ? (_jsxs(_Fragment, { children: [_jsx(LakeText, { style: styles.availableFiltersTitle, children: title }), _jsx(Space, { height: 8 })] })) : null, _jsx(FlatList, { role: "list", data: availableFilters, keyExtractor: (_, index) => `filter-item-${index}`, renderItem: ({ item }) => {
+    return (_jsxs(_Fragment, { children: [_jsx(LakeButton, { size: "small", mode: "secondary", color: "gray", onPress: toggle, ref: inputRef, icon: large ? "chevron-down-filled" : "filter-filled", iconPosition: "end", ariaLabel: label, children: large ? label : null }), _jsx(Popover, { role: "listbox", matchReferenceMinWidth: true, onDismiss: close, referenceRef: inputRef, returnFocus: false, visible: visible, children: _jsxs(View, { style: styles.list, children: [isNotNullishOrEmpty(title) ? (_jsxs(_Fragment, { children: [_jsx(LakeText, { style: styles.availableFiltersTitle, children: title }), _jsx(Space, { height: 8 })] })) : null, _jsx(FlatList, { role: "list", data: availableFilters, keyExtractor: (_, index) => `filter-item-${index}`, renderItem: ({ item }) => {
                                 const isSet = Boolean(filters[item.name]) || openFilters.includes(item.name);
                                 return (_jsxs(Pressable, { style: ({ hovered }) => [styles.item, hovered && styles.itemHovered], role: "button", disabled: isSet, onPress: () => {
                                         onAddFilter(item.name);
                                         close();
                                     }, children: [_jsx(LakeText, { variant: "smallRegular", style: isSet && styles.selected, children: item.label }), isSet && _jsx(Icon, { color: colors.positive[500], name: "checkmark-filled", size: 14 })] }));
                             } })] }) })] }));
-}
+};

package/src/components/WithCurrentColor.d.ts

@@ -1,10 +1,10 @@
-import { MutableRefObject, ReactElement } from "react";
+import { MutableRefObject, ReactNode } from "react";
 import { ViewProps } from "react-native";
 import { ColorVariants } from "../constants/design";
 type Props = {
     variant?: ColorVariants;
     style?: ViewProps["style"];
-    children: ReactElement;
+    children: ReactNode;
 };
 export declare const CurrentColorContext: import("react").Context<"gray" | "live" | "sandbox" | "positive" | "warning" | "negative" | "current" | "partner" | "swan" | "shakespear" | "darkPink" | "sunglow" | "mediumSladeBlue" | undefined>;
 export declare const useCurrentColor: (containerRef: MutableRefObject<HTMLElement | null>, variant: ColorVariants | undefined) => void;