@swan-io/lake 2.3.0 → 2.4.0

package/package.json

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

package/src/components/ErrorBoundary.d.ts

@@ -5,7 +5,7 @@ type Props = {
         error: Error;
         resetError: () => void;
     }) => ReactElement;
-    onError?: (error: Error, componentStack: ErrorInfo["componentStack"]) => void;
+    onError?: (error: Error, errorInfo: ErrorInfo) => void;
 };
 type State = {
     error: Error | null;
@@ -13,7 +13,7 @@ type State = {
 export declare class ErrorBoundary extends Component<Props, State> {
     state: State;
     static getDerivedStateFromError(error: Error): State;
-    componentDidCatch(error: Error, { componentStack }: ErrorInfo): void;
+    componentDidCatch(error: Error, errorInfo: ErrorInfo): void;
     resetError: () => void;
     render(): ReactNode;
 }

package/src/components/ErrorBoundary.js

@@ -37,16 +37,16 @@ export class ErrorBoundary extends Component {
     static getDerivedStateFromError(error) {
         return { error };
     }
-    componentDidCatch(error, { componentStack }) {
+    componentDidCatch(error, errorInfo) {
         const { onError } = this.props;
         if (isError(error)) {
             const cause = new Error(error.message);
             cause.name = `ErrorBoundary ${cause.name}`;
-            cause.stack = componentStack;
+            cause.stack = errorInfo.componentStack;
             setCause(error, cause);
         }
         if (onError != null) {
-            onError(error, componentStack);
+            onError(error, errorInfo);
         }
     }
     resetError = () => {

package/src/components/Filters.d.ts

@@ -11,6 +11,7 @@ export type FilterCheckboxDef<T> = {
     type: "checkbox";
     label: string;
     items: Item<T>[];
+    width?: number;
     submitText: string;
     checkAllLabel?: string;
 };
@@ -18,6 +19,7 @@ export type FilterRadioDef<T> = {
     type: "radio";
     label: string;
     items: Item<T>[];
+    width?: number;
 };
 export type FilterDateDef = {
     type: "date";

package/src/components/Filters.js

@@ -59,6 +59,11 @@ const styles = StyleSheet.create({
         height: 32,
         paddingHorizontal: 24,
     },
+    itemLabel: {
+        textOverflow: "ellipsis",
+        overflow: "hidden",
+        whiteSpace: "nowrap",
+    },
     input: {
         minWidth: 200,
     },
@@ -75,19 +80,19 @@ const FilterTag = forwardRef(({ onPress, onPressRemove, label, value = "", isAct
     const mergedRef = useMergeRefs(ref, forwardRef);
     return (_jsx(Pressable, { ref: mergedRef, onPress: onPress, children: ({ hovered }) => (_jsxs(_Fragment, { children: [_jsx(View, { style: [styles.shadowed, hovered && styles.hovered] }), _jsx(Tag, { label: label, color: "current", onPressRemove: onPressRemove, children: _jsxs(Box, { direction: "row", alignItems: "center", children: [_jsx(Text, { numberOfLines: 1, style: styles.value, children: value }), _jsx(Space, { width: 4 }), _jsx(Icon, { color: colors.current.primary, name: isActive ? "chevron-up-filled" : "chevron-down-filled", size: 16 })] }) })] })) }));
 });
-function FilterRadio({ label, items, value, onValueChange, onPressRemove, autoOpen = false, }) {
+function FilterRadio({ label, items, width, value, onValueChange, onPressRemove, autoOpen = false, }) {
     const inputRef = useRef(null);
     const [visible, { close, toggle }] = useDisclosure(autoOpen);
     const currentValue = useMemo(() => items.find(i => i.value === value), [items, value]);
-    return (_jsxs(View, { style: styles.container, children: [_jsx(FilterTag, { label: label, onPress: toggle, ref: inputRef, onPressRemove: onPressRemove, isActive: visible, value: currentValue?.label }), _jsx(Popover, { role: "listbox", matchReferenceWidth: false, onDismiss: close, referenceRef: inputRef, returnFocus: false, visible: visible, children: _jsx(View, { style: styles.dropdown, children: _jsx(FlatList, { role: "list", data: items, contentContainerStyle: styles.content, keyExtractor: (_, index) => `filter-item-${index}`, renderItem: ({ item }) => {
+    return (_jsxs(View, { style: styles.container, children: [_jsx(FilterTag, { label: label, onPress: toggle, ref: inputRef, onPressRemove: onPressRemove, isActive: visible, value: currentValue?.label }), _jsx(Popover, { role: "listbox", matchReferenceWidth: false, onDismiss: close, referenceRef: inputRef, returnFocus: false, visible: visible, children: _jsx(View, { style: [styles.dropdown, { width }], children: _jsx(FlatList, { role: "list", data: items, contentContainerStyle: styles.content, keyExtractor: (_, index) => `filter-item-${index}`, renderItem: ({ item }) => {
                             const isSelected = value === item.value;
                             return (_jsxs(Pressable, { role: "radio", "aria-checked": isSelected, style: ({ hovered }) => [styles.radio, hovered && styles.itemHovered], onPress: () => {
                                     onValueChange(item.value);
                                     close();
-                                }, children: [_jsx(LakeRadio, { value: isSelected }), _jsx(Space, { width: 12 }), _jsx(Text, { children: item.label })] }));
+                                }, children: [_jsx(LakeRadio, { value: isSelected }), _jsx(Space, { width: 12 }), _jsx(Text, { style: styles.itemLabel, children: item.label })] }));
                         } }) }) })] }));
 }
-function FilterCheckbox({ label, items, checkAllLabel, value, onValueChange, applyButtonLabel, onPressRemove, autoOpen = false, }) {
+function FilterCheckbox({ label, items, width, checkAllLabel, value, onValueChange, applyButtonLabel, onPressRemove, autoOpen = false, }) {
     const inputRef = useRef(null);
     const [visible, { close, toggle }] = useDisclosure(autoOpen);
     const [localValue, setLocalValue] = useState(value);
@@ -114,7 +119,7 @@ function FilterCheckbox({ label, items, checkAllLabel, value, onValueChange, app
             setLocalValue(value);
         }
     }, [visible, value]);
-    return (_jsxs(View, { style: styles.container, children: [_jsx(FilterTag, { label: label, onPress: toggle, ref: inputRef, onPressRemove: onPressRemove, isActive: visible, value: allChecked ? checkAllLabel : currentValue.map(item => item.label).join(", ") }), _jsx(Popover, { role: "listbox", matchReferenceWidth: false, onDismiss: close, referenceRef: inputRef, returnFocus: false, visible: visible, children: _jsxs(View, { style: styles.dropdown, children: [_jsx(FlatList, { role: "list", data: listItems, contentContainerStyle: styles.content, keyExtractor: (_, index) => `filter-item-${index}`, renderItem: ({ item }) => {
+    return (_jsxs(View, { style: styles.container, children: [_jsx(FilterTag, { label: label, onPress: toggle, ref: inputRef, onPressRemove: onPressRemove, isActive: visible, value: allChecked ? checkAllLabel : currentValue.map(item => item.label).join(", ") }), _jsx(Popover, { role: "listbox", matchReferenceWidth: false, onDismiss: close, referenceRef: inputRef, returnFocus: false, visible: visible, children: _jsxs(View, { style: [styles.dropdown, { width }], children: [_jsx(FlatList, { role: "list", data: listItems, contentContainerStyle: styles.content, keyExtractor: (_, index) => `filter-item-${index}`, renderItem: ({ item }) => {
                                 const isSelected = match(item)
                                     .with({ checked: P.any }, ({ checked }) => checked)
                                     .with({ value: P.any }, ({ value }) => values.has(value))
@@ -146,7 +151,7 @@ function FilterCheckbox({ label, items, checkAllLabel, value, onValueChange, app
                                     }
                                 })
                                     .exhaustive();
-                                return (_jsxs(Pressable, { role: "radio", "aria-checked": isSelected, style: ({ hovered }) => [styles.radio, hovered && styles.itemHovered], onPress: onPress, children: [_jsx(LakeCheckbox, { value: isSelected }), _jsx(Space, { width: 12 }), _jsx(Text, { children: item.label })] }));
+                                return (_jsxs(Pressable, { role: "radio", "aria-checked": isSelected, style: ({ hovered }) => [styles.radio, hovered && styles.itemHovered], onPress: onPress, children: [_jsx(LakeCheckbox, { value: isSelected }), _jsx(Space, { width: 12 }), _jsx(Text, { style: styles.itemLabel, children: item.label })] }));
                             } }), _jsx(Space, { height: 8 }), _jsx(View, { style: styles.buttonContainer, children: _jsx(LakeButton, { color: "current", onPress: save, children: applyButtonLabel }) }), _jsx(Space, { height: 24 })] }) })] }));
 }
 function FilterDate({ label, initialValue, noValueText, submitText, dateFormat, rifmProps, validate, onSave, onPressRemove, autoOpen = false, }) {
@@ -212,11 +217,11 @@ export const FiltersStack = ({ filters, openedFilters, definition, onChangeOpene
                 return null;
             }
             return (_jsx(View, { children: match(filterDefinition)
-                    .with({ type: "radio" }, ({ type, label, items }) => (_jsx(FilterRadio, { label: label, items: items, autoOpen: lastOpenedFilter === filterName, onPressRemove: () => {
+                    .with({ type: "radio" }, ({ type, label, items, width }) => (_jsx(FilterRadio, { label: label, items: items, width: width, autoOpen: lastOpenedFilter === filterName, onPressRemove: () => {
                         onChangeFilters({ ...filters, [filterName]: undefined });
                         onChangeOpened(openedFilters.filter(f => f !== filterName));
                     }, value: getFilterValue(type, filters, filterName), onValueChange: value => onChangeFilters({ ...filters, [filterName]: value }) })))
-                    .with({ type: "checkbox" }, ({ type, label, items, checkAllLabel, submitText }) => (_jsx(FilterCheckbox, { label: label, items: items, checkAllLabel: checkAllLabel, autoOpen: lastOpenedFilter === filterName, applyButtonLabel: submitText, value: getFilterValue(type, filters, filterName), onValueChange: value => onChangeFilters({ ...filters, [filterName]: value }), onPressRemove: () => {
+                    .with({ type: "checkbox" }, ({ type, label, items, width, checkAllLabel, submitText }) => (_jsx(FilterCheckbox, { label: label, items: items, width: width, checkAllLabel: checkAllLabel, autoOpen: lastOpenedFilter === filterName, applyButtonLabel: submitText, value: getFilterValue(type, filters, filterName), onValueChange: value => onChangeFilters({ ...filters, [filterName]: value }), onPressRemove: () => {
                         onChangeFilters({ ...filters, [filterName]: undefined });
                         onChangeOpened(openedFilters.filter(f => f !== filterName));
                     } })))

package/src/components/FixedListViewCells.d.ts

@@ -18,10 +18,11 @@ export declare const SimpleTitleCell: ({ isHighlighted, text, }: {
     isHighlighted?: boolean | undefined;
     text: string;
 }) => import("react/jsx-runtime").JSX.Element;
-export declare const SimpleRegularTextCell: ({ variant, text, textAlign, }: {
+export declare const SimpleRegularTextCell: ({ variant, text, textAlign, color, }: {
     variant?: "semibold" | "medium" | "regular" | "light" | "smallSemibold" | "smallMedium" | "smallRegular" | undefined;
     text: string;
     textAlign?: "left" | "right" | "center" | undefined;
+    color?: string | undefined;
 }) => import("react/jsx-runtime").JSX.Element;
 export declare const CopyableRegularTextCell: ({ variant, text, copyWording, copiedWording, }: {
     variant?: "semibold" | "medium" | "regular" | "light" | "smallSemibold" | "smallMedium" | "smallRegular" | undefined;

package/src/components/FixedListViewCells.js

@@ -110,8 +110,8 @@ export const ColorPatchCell = ({ isHovered, alternativeText, color, }) => {
     return isHovered ? (_jsx(View, { style: [styles.colorPatch, { backgroundColor: colors[color].primary }], children: isNotNullish(alternativeText) ? (_jsx(LakeText, { style: styles.alternativeText, children: alternativeText })) : null })) : null;
 };
 export const SimpleTitleCell = ({ isHighlighted = false, text, }) => (_jsx(View, { style: styles.cell, children: _jsx(LakeText, { numberOfLines: 1, color: isHighlighted ? colors.current.primary : colors.gray[900], style: styles.regularText, variant: "medium", children: text }) }));
-export const SimpleRegularTextCell = ({ variant = "regular", text, textAlign = "left", }) => {
-    return (_jsx(View, { style: styles.cell, children: _jsx(LakeText, { align: textAlign, color: colors.gray[900], style: styles.regularText, variant: variant, children: text }) }));
+export const SimpleRegularTextCell = ({ variant = "regular", text, textAlign = "left", color = colors.gray[900], }) => {
+    return (_jsx(View, { style: styles.cell, children: _jsx(LakeText, { align: textAlign, color: color, style: styles.regularText, variant: variant, children: text }) }));
 };
 export const CopyableRegularTextCell = ({ variant = "regular", text, copyWording, copiedWording, }) => {
     const [visibleState, setVisibleState] = useState("copy");

package/src/components/Icon.d.ts

@@ -3,6 +3,7 @@ import { StyleProp, ViewStyle, WebAccessibilityProps } from "react-native";
 declare const paths: {
     "lake-calendar-arrow-swap": string;
     "lake-card": string;
+    "lake-card-filled": string;
     "lake-card-one-off": string;
     "lake-card-physical": string;
     "lake-card-recurring": string;

package/src/components/LakeTextInput.d.ts

@@ -224,7 +224,7 @@ export declare const LakeTextInput: import("react").ForwardRefExoticComponent<{
     disabled?: boolean | undefined;
     color?: "current" | "gray" | "live" | "sandbox" | "positive" | "warning" | "negative" | "partner" | "swan" | "shakespear" | "darkPink" | "sunglow" | "mediumSladeBlue" | undefined;
     multiline?: boolean | undefined;
-    icon?: "lake-calendar-arrow-swap" | "lake-card" | "lake-card-one-off" | "lake-card-physical" | "lake-card-recurring" | "lake-card-single-use" | "lake-card-virtual" | "lake-chevron-double" | "lake-clipboard-bullet" | "lake-clock" | "lake-clock-arrow-swap" | "lake-close" | "lake-currencies" | "lake-delivery-grouped" | "lake-delivery-individual" | "lake-document-csv" | "lake-document-jpg" | "lake-document-pdf" | "lake-document-png" | "lake-document-xls" | "lake-email" | "lake-id-card" | "lake-inbox-empty" | "lake-menu" | "lake-people" | "lake-person-arrow-swap" | "lake-phone" | "lake-receipt" | "lake-settings" | "lake-signature" | "lake-transfer" | "lake-world-map" | "add-circle-filled" | "add-circle-regular" | "add-filled" | "approvals-app-filled" | "apps-list-filled" | "apps-list-regular" | "arrow-counterclockwise-filled" | "arrow-down-filled" | "arrow-down-regular" | "arrow-download-filled" | "arrow-left-filled" | "arrow-left-regular" | "arrow-right-filled" | "arrow-right-regular" | "arrow-swap-filled" | "arrow-swap-regular" | "arrow-up-filled" | "arrow-up-regular" | "arrow-upload-filled" | "arrow-upload-regular" | "beaker-filled" | "beaker-regular" | "board-regular" | "box-regular" | "building-bank-filled" | "building-bank-regular" | "building-filled" | "building-multiple-regular" | "building-regular" | "building-shop-regular" | "calendar-ltr-regular" | "cart-regular" | "chat-help-filled" | "chat-help-regular" | "checkmark-circle-regular" | "checkmark-filled" | "chevron-down-filled" | "chevron-left-filled" | "chevron-right-filled" | "chevron-up-down-regular" | "chevron-up-filled" | "clipboard-search-regular" | "clock-filled" | "clock-regular" | "cloud-sync-filled" | "cloud-sync-regular" | "code-filled" | "code-regular" | "color-regular" | "comment-note-regular" | "copy-filled" | "copy-regular" | "cursor-click-regular" | "database-filled" | "database-regular" | "delete-filled" | "delete-regular" | "desktop-regular" | "device-meeting-room-regular" | "dismiss-circle-regular" | "dismiss-filled" | "dismiss-regular" | "document-regular" | "earth-regular" | "edit-filled" | "edit-regular" | "error-circle-filled" | "error-circle-regular" | "eye-filled" | "eye-off-filled" | "eye-regular" | "filter-filled" | "flag-filled" | "flag-regular" | "flash-filled" | "flash-regular" | "form-new-filled" | "form-new-regular" | "hand-right-regular" | "image-add-filled" | "image-add-regular" | "image-filled" | "image-regular" | "info-filled" | "info-regular" | "key-regular" | "link-filled" | "live-filled" | "live-regular" | "lock-closed-filled" | "lock-closed-regular" | "lock-open-filled" | "lock-open-regular" | "mail-filled" | "mail-regular" | "money-regular" | "more-vertical-filled" | "open-filled" | "open-regular" | "options-regular" | "paint-brush-filled" | "paint-brush-regular" | "pause-regular" | "payment-filled" | "payment-regular" | "people-add-regular" | "people-community-filled" | "people-community-regular" | "people-filled" | "people-regular" | "people-team-regular" | "person-accounts-filled" | "person-accounts-regular" | "person-add-regular" | "person-call-filled" | "person-call-regular" | "person-filled" | "person-lock-regular" | "person-regular" | "phone-filled" | "phone-regular" | "pin-regular" | "play-filled" | "play-regular" | "preview-link-filled" | "question-circle-regular" | "receipt-money-filled" | "receipt-money-regular" | "rocket-regular" | "search-filled" | "send-filled" | "send-regular" | "settings-filled" | "settings-regular" | "shield-checkmark-filled" | "shield-checkmark-regular" | "shield-error-regular" | "shield-regular" | "sign-out-regular" | "signature-filled" | "signature-regular" | "subtract-circle-filled" | "subtract-circle-regular" | "target-arrow-regular" | "warning-filled" | "warning-regular" | "window-dev-tools-filled" | "window-dev-tools-regular" | undefined;
+    icon?: "lake-calendar-arrow-swap" | "lake-card" | "lake-card-filled" | "lake-card-one-off" | "lake-card-physical" | "lake-card-recurring" | "lake-card-single-use" | "lake-card-virtual" | "lake-chevron-double" | "lake-clipboard-bullet" | "lake-clock" | "lake-clock-arrow-swap" | "lake-close" | "lake-currencies" | "lake-delivery-grouped" | "lake-delivery-individual" | "lake-document-csv" | "lake-document-jpg" | "lake-document-pdf" | "lake-document-png" | "lake-document-xls" | "lake-email" | "lake-id-card" | "lake-inbox-empty" | "lake-menu" | "lake-people" | "lake-person-arrow-swap" | "lake-phone" | "lake-receipt" | "lake-settings" | "lake-signature" | "lake-transfer" | "lake-world-map" | "add-circle-filled" | "add-circle-regular" | "add-filled" | "approvals-app-filled" | "apps-list-filled" | "apps-list-regular" | "arrow-counterclockwise-filled" | "arrow-down-filled" | "arrow-down-regular" | "arrow-download-filled" | "arrow-left-filled" | "arrow-left-regular" | "arrow-right-filled" | "arrow-right-regular" | "arrow-swap-filled" | "arrow-swap-regular" | "arrow-up-filled" | "arrow-up-regular" | "arrow-upload-filled" | "arrow-upload-regular" | "beaker-filled" | "beaker-regular" | "board-regular" | "box-regular" | "building-bank-filled" | "building-bank-regular" | "building-filled" | "building-multiple-regular" | "building-regular" | "building-shop-regular" | "calendar-ltr-regular" | "cart-regular" | "chat-help-filled" | "chat-help-regular" | "checkmark-circle-regular" | "checkmark-filled" | "chevron-down-filled" | "chevron-left-filled" | "chevron-right-filled" | "chevron-up-down-regular" | "chevron-up-filled" | "clipboard-search-regular" | "clock-filled" | "clock-regular" | "cloud-sync-filled" | "cloud-sync-regular" | "code-filled" | "code-regular" | "color-regular" | "comment-note-regular" | "copy-filled" | "copy-regular" | "cursor-click-regular" | "database-filled" | "database-regular" | "delete-filled" | "delete-regular" | "desktop-regular" | "device-meeting-room-regular" | "dismiss-circle-regular" | "dismiss-filled" | "dismiss-regular" | "document-regular" | "earth-regular" | "edit-filled" | "edit-regular" | "error-circle-filled" | "error-circle-regular" | "eye-filled" | "eye-off-filled" | "eye-regular" | "filter-filled" | "flag-filled" | "flag-regular" | "flash-filled" | "flash-regular" | "form-new-filled" | "form-new-regular" | "hand-right-regular" | "image-add-filled" | "image-add-regular" | "image-filled" | "image-regular" | "info-filled" | "info-regular" | "key-regular" | "link-filled" | "live-filled" | "live-regular" | "lock-closed-filled" | "lock-closed-regular" | "lock-open-filled" | "lock-open-regular" | "mail-filled" | "mail-regular" | "money-regular" | "more-vertical-filled" | "open-filled" | "open-regular" | "options-regular" | "paint-brush-filled" | "paint-brush-regular" | "pause-regular" | "payment-filled" | "payment-regular" | "people-add-regular" | "people-community-filled" | "people-community-regular" | "people-filled" | "people-regular" | "people-team-regular" | "person-accounts-filled" | "person-accounts-regular" | "person-add-regular" | "person-call-filled" | "person-call-regular" | "person-filled" | "person-lock-regular" | "person-regular" | "phone-filled" | "phone-regular" | "pin-regular" | "play-filled" | "play-regular" | "preview-link-filled" | "question-circle-regular" | "receipt-money-filled" | "receipt-money-regular" | "rocket-regular" | "search-filled" | "send-filled" | "send-regular" | "settings-filled" | "settings-regular" | "shield-checkmark-filled" | "shield-checkmark-regular" | "shield-error-regular" | "shield-regular" | "sign-out-regular" | "signature-filled" | "signature-regular" | "subtract-circle-filled" | "subtract-circle-regular" | "target-arrow-regular" | "warning-filled" | "warning-regular" | "window-dev-tools-filled" | "window-dev-tools-regular" | undefined;
     unit?: string | undefined;
     inputMode?: TextInputProps["inputMode"];
     pattern?: string | undefined;

package/src/components/PlainListView.d.ts

@@ -20,6 +20,7 @@ type Props<T, ExtraInfo> = {
     smallColumns?: ColumnConfig<T, ExtraInfo>[];
     onEndReached?: () => void;
     onEndReachedThresholdPx?: number;
+    headerStyle?: ViewStyle | null | undefined;
     rowStyle?: (item: T, large: boolean) => ViewStyle | null | undefined;
     getRowLink?: (config: LinkConfig<T, ExtraInfo>) => ReactElement<{
         children: (state: PressableStateCallbackType) => React.ReactNode;
@@ -36,5 +37,5 @@ type Props<T, ExtraInfo> = {
     withoutScroll?: boolean;
     stickyOffset?: number;
 };
-export declare const PlainListView: <T, ExtraInfo>({ data: originalData, keyExtractor, rowHeight, groupHeaderHeight, headerHeight, columns, smallColumns, extraInfo, onEndReached, onEndReachedThresholdPx, rowStyle, getRowLink, activeRowId, renderEmptyList, onActiveRowChange, groupBy, loading, breakpoint, withoutScroll, stickyOffset, }: Props<T, ExtraInfo>) => import("react/jsx-runtime").JSX.Element;
+export declare const PlainListView: <T, ExtraInfo>({ data: originalData, keyExtractor, rowHeight, groupHeaderHeight, headerHeight, columns, smallColumns, extraInfo, onEndReached, onEndReachedThresholdPx, headerStyle, rowStyle, getRowLink, activeRowId, renderEmptyList, onActiveRowChange, groupBy, loading, breakpoint, withoutScroll, stickyOffset, }: Props<T, ExtraInfo>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/src/components/PlainListView.js

@@ -106,7 +106,7 @@ const Row = ({ id, item, index, rowHeight, columns, extraInfo, isActive, isHover
                 },
             ], id: columnId, children: renderCell({ columnId, item, index, extraInfo, isHovered }) }, columnId))) }));
 };
-export const PlainListView = ({ data: originalData, keyExtractor, rowHeight, groupHeaderHeight, headerHeight, columns, smallColumns = columns, extraInfo, onEndReached, onEndReachedThresholdPx = 200, rowStyle, getRowLink, activeRowId, renderEmptyList, onActiveRowChange, groupBy, loading, breakpoint = breakpoints.large, withoutScroll = false, stickyOffset = 0, }) => {
+export const PlainListView = ({ data: originalData, keyExtractor, rowHeight, groupHeaderHeight, headerHeight, columns, smallColumns = columns, extraInfo, onEndReached, onEndReachedThresholdPx = 200, headerStyle, rowStyle, getRowLink, activeRowId, renderEmptyList, onActiveRowChange, groupBy, loading, breakpoint = breakpoints.large, withoutScroll = false, stickyOffset = 0, }) => {
     const viewId = useId();
     const scrollTrackerRef = useRef(null);
     const groups = useMemo(() => {
@@ -165,7 +165,7 @@ export const PlainListView = ({ data: originalData, keyExtractor, rowHeight, gro
         ] })), [isLoading, loading?.count, rowHeight, totalHeight, withoutScroll]);
     return (_jsx(ResponsiveContainer, { style: withoutScroll ? (isEmpty ? commonStyles.fill : undefined) : styles.root, breakpoint: breakpoint, children: ({ large }) => {
             const displayColumns = large ? columns : smallColumns;
-            return (_jsxs(_Fragment, { children: [!isEmpty && large ? (_jsx(View, { style: [styles.segment, large && styles.segmentLarge], children: displayColumns.map(({ id, width, title, renderTitle }) => {
+            return (_jsxs(_Fragment, { children: [!isEmpty && large ? (_jsx(View, { style: [styles.segment, styles.segmentLarge, headerStyle], children: displayColumns.map(({ id, width, title, renderTitle }) => {
                             const columnId = `${viewId}_${id}`;
                             return (_jsx(View, { style: [
                                     styles.segmentHeaderCell,

package/src/components/QuickActions.d.ts

@@ -2,15 +2,16 @@ import { IconName } from "./Icon";
 export type QuickAction = {
     icon: IconName;
     label: string;
+    tooltipText?: string;
+    tooltipDisabled?: boolean;
     onPress: () => void;
+    disabled?: boolean;
     isLoading?: boolean;
     backgroundColor?: string;
     color?: string;
 };
 type Props = {
     actions: QuickAction[];
-    tooltipDisabled?: boolean;
-    tooltipText?: string;
 };
-export declare const QuickActions: ({ actions, tooltipDisabled, tooltipText }: Props) => import("react/jsx-runtime").JSX.Element;
+export declare const QuickActions: ({ actions }: Props) => import("react/jsx-runtime").JSX.Element;
 export {};

package/src/components/QuickActions.js

@@ -38,8 +38,8 @@ const styles = StyleSheet.create({
         lineHeight: 16,
     },
 });
-export const QuickActions = ({ actions, tooltipDisabled = false, tooltipText }) => {
-    return (_jsx(View, { style: styles.container, children: actions.map((action, index) => (_jsx(LakeTooltip, { content: tooltipText, placement: "top", disabled: tooltipDisabled || isNullishOrEmpty(tooltipText), containerStyle: styles.actionContainer, children: _jsxs(Pressable, { onPress: action.onPress, style: [styles.action, !tooltipDisabled && styles.disabled], disabled: action.isLoading === true || !tooltipDisabled, children: [_jsx(View, { style: [
+export const QuickActions = ({ actions }) => {
+    return (_jsx(View, { style: styles.container, children: actions.map((action, index) => (_jsx(LakeTooltip, { content: action.tooltipText, placement: "top", containerStyle: styles.actionContainer, disabled: action.tooltipDisabled === true || isNullishOrEmpty(action.tooltipText), children: _jsxs(Pressable, { onPress: action.onPress, style: [styles.action, action.disabled === true && styles.disabled], disabled: action.isLoading === true || action.disabled === true, children: [_jsx(View, { style: [
                             styles.icon,
                             action.backgroundColor != null
                                 ? { backgroundColor: action.backgroundColor, borderColor: action.backgroundColor }

package/src/icons/custom-icons.json

@@ -1,6 +1,7 @@
 {
   "lake-calendar-arrow-swap": "M9 12.38a1.13 1.13 0 1 1-2.25 0 1.13 1.13 0 0 1 2.25 0Zm-1.12 4.87a1.13 1.13 0 1 0 0-2.25 1.13 1.13 0 0 0 0 2.25Zm4.36-.03a1.13 1.13 0 0 1-1.37-1.1 1.13 1.13 0 0 1 1.86-.85 6.73 6.73 0 0 0-.49 1.95Z M12.43 19.5H6.75c-1.24 0-2.25-1-2.25-2.25V9h15v2.36c.52.06 1.02.18 1.5.36V6.75A3.75 3.75 0 0 0 17.25 3H6.75A3.75 3.75 0 0 0 3 6.75v10.5A3.75 3.75 0 0 0 6.75 21h6.29a6.47 6.47 0 0 1-.6-1.5ZM4.5 6.75c0-1.24 1-2.25 2.25-2.25h10.5c1.24 0 2.25 1 2.25 2.25v.75h-15v-.75Z M16.91 11.57a1.12 1.12 0 0 0-1.9.91c.57-.4 1.21-.7 1.9-.9ZM12 13.5a1.13 1.13 0 1 0 0-2.25 1.13 1.13 0 0 0 0 2.25Z M18.73 22.97a5.14 5.14 0 1 0 0-10.28 5.14 5.14 0 0 0 0 10.28Zm.59-7.47c.1-.1.26-.1.36 0l1.03 1.03c.1.1.1.27 0 .37l-1.03 1.02a.26.26 0 1 1-.36-.36l.59-.59h-2.98a.26.26 0 1 1 0-.51h2.98l-.6-.6a.26.26 0 0 1 0-.36Zm-1.18 2.23c.1.1.1.27 0 .37l-.6.59h2.99a.26.26 0 0 1 0 .51h-2.98l.59.59a.26.26 0 0 1-.36.36l-1.03-1.03a.26.26 0 0 1 0-.36l1.03-1.03c.1-.1.26-.1.36 0Z",
   "lake-card": "M5.54815 10.596H18.4521V15.398C18.4521 15.8962 18.0483 16.3 17.5501 16.3H6.45015C5.95199 16.3 5.54815 15.8962 5.54815 15.398V10.596ZM5.54815 10V8.498C5.54815 7.99984 5.95199 7.596 6.45015 7.596H17.5501C18.0483 7.596 18.4521 7.99984 18.4521 8.498V10H5.54815ZM14.6999 13.84C14.4856 13.84 14.3119 14.0137 14.3119 14.228C14.3119 14.4423 14.4856 14.616 14.6999 14.616H16.4999C16.7142 14.616 16.8879 14.4423 16.8879 14.228C16.8879 14.0137 16.7142 13.84 16.4999 13.84H14.6999ZM6.45015 7C5.62283 7 4.95215 7.67068 4.95215 8.498V15.398C4.95215 16.2253 5.62283 16.896 6.45015 16.896H17.5501C18.3775 16.896 19.0481 16.2253 19.0481 15.398V8.498C19.0481 7.67068 18.3775 7 17.5501 7H6.45015Z",
+  "lake-card-filled": "M15.75 15C15.3358 15 15 15.3358 15 15.75C15 16.1642 15.3358 16.5 15.75 16.5H18.75C19.1642 16.5 19.5 16.1642 19.5 15.75C19.5 15.3358 19.1642 15 18.75 15H15.75ZM1.5 7.5C1.5 5.84315 2.84315 4.5 4.5 4.5H19.5C21.1569 4.5 22.5 5.84315 22.5 7.5V16.5C22.5 18.1569 21.1569 19.5 19.5 19.5H4.5C2.84315 19.5 1.5 18.1569 1.5 16.5V7.5ZM21 7.5C21 6.67157 20.3284 6 19.5 6H4.5C3.67157 6 3 6.67157 3 7.5V9H21V7.5ZM3 16.5C3 17.3284 3.67157 18 4.5 18H19.5C20.3284 18 21 17.3284 21 16.5V10.5H3V16.5Z",
   "lake-card-one-off": "M2.726 9.571h18.64v6.963c0 .769-.623 1.392-1.392 1.392h-8.926l-.594.645h9.52a2.037 2.037 0 0 0 2.038-2.037V6.677a2.037 2.037 0 0 0-2.038-2.037H4.117A2.037 2.037 0 0 0 2.08 6.677v9.857c0 1.125.912 2.037 2.037 2.037h.317a1.061 1.061 0 0 1-.02-.645h-.297a1.391 1.391 0 0 1-1.391-1.392V9.571Zm0-.645V6.677c0-.768.623-1.391 1.391-1.391h15.857c.769 0 1.392.623 1.392 1.391v2.249H2.726Zm13.177 5.485a.451.451 0 0 0 0 .903h2.571a.452.452 0 0 0 0-.903h-2.571ZM5.885 17.925H7.03a.312.312 0 0 1 .244.119.31.31 0 0 1 .056.265l-.576 2.307 3.667-3.99H8.947a.303.303 0 0 1-.113-.02.31.31 0 0 1-.175-.402l.793-2.017h-2.37l-1.197 3.738Zm5.469-1.398a.31.31 0 0 0-.228-.52H9.4l.793-2.017a.31.31 0 0 0-.288-.422h-3.05a.31.31 0 0 0-.295.215L5.167 18.14a.31.31 0 0 0 .295.404h1.172l-.776 3.101a.31.31 0 0 0 .528.285l4.968-5.403Z",
   "lake-card-physical": "M21.32 9.537H2.68V16.5c0 .768.623 1.391 1.391 1.391h15.857c.769 0 1.392-.622 1.392-1.391V9.537ZM2.68 6.643V8.89h18.64V6.643c0-.769-.623-1.392-1.392-1.392H4.072c-.768 0-1.391.623-1.391 1.392Zm12.725 8.186c0-.25.202-.452.452-.452h2.571a.452.452 0 0 1 0 .903h-2.571a.451.451 0 0 1-.452-.451ZM2.035 6.643c0-1.125.911-2.037 2.036-2.037h15.857c1.125 0 2.038.912 2.038 2.037V16.5a2.037 2.037 0 0 1-2.038 2.037H4.072A2.037 2.037 0 0 1 2.034 16.5V6.643Z",
   "lake-card-recurring": "M2.68 9.537h18.64V16.5c0 .768-.623 1.391-1.392 1.391h-5.852a5.137 5.137 0 0 1-.017.646h5.87a2.037 2.037 0 0 0 2.037-2.037V6.643a2.037 2.037 0 0 0-2.038-2.037H4.072a2.037 2.037 0 0 0-2.037 2.037V16.5c0 1.125.912 2.037 2.037 2.037h.11a5.02 5.02 0 0 1-.018-.646h-.092A1.391 1.391 0 0 1 2.68 16.5V9.537Zm0-.646V6.643c0-.769.623-1.392 1.391-1.392h15.857c.769 0 1.392.623 1.392 1.392V8.89H2.68Zm13.177 5.486a.451.451 0 0 0 0 .903h2.571a.451.451 0 1 0 0-.903h-2.571Z M9.12 21.593a3.513 3.513 0 0 0 3.494-3.883c-.017-.162.105-.31.267-.31.152 0 .282.11.298.26a4.08 4.08 0 1 1-1.225-2.516v-.634a.283.283 0 1 1 .566 0v1.473a.283.283 0 0 1-.283.284h-1.474a.283.283 0 0 1 0-.567h.941a3.513 3.513 0 1 0-2.584 5.893Z M9.118 15.614a.283.283 0 0 0-.565.03v2.72l.002.028a.283.283 0 0 0 .282.255h1.813l.029-.002a.283.283 0 0 0-.03-.565H9.12V15.614Z",