react-native-modern-elements
Version:
A modern, customizable UI component library for React Native
61 lines (60 loc) • 2.3 kB
TypeScript
import React from "react";
import { TextStyle, ViewStyle } from "react-native";
type ColumnAlignment = "left" | "center" | "right";
interface Column<T> {
label: string;
key: keyof T | string;
flex?: number;
align?: ColumnAlignment;
headerTextAlign?: ColumnAlignment;
render?: (value: any, row: any, rowIndex: any) => React.ReactNode;
headerStyle?: ViewStyle;
headerTextColors?: string;
}
interface BorderProps {
borderColor?: string;
borderWidth?: number;
headerborderRight?: boolean;
}
interface SummaryOptions<T> {
content: React.ReactNode;
align: "left" | "right";
style?: ViewStyle;
summaryWrapper?: ViewStyle;
}
interface TableProps<T> extends BorderProps {
columns: Column<T>[];
data: T[];
height?: any;
defaultAlign?: ColumnAlignment;
onRowPress?: (item: T, rowIndex: number) => void;
tableStyles?: ViewStyle;
showsVerticalScrollIndicator?: boolean;
HeaderRowStyle?: ViewStyle;
headerTexts?: TextStyle;
cellRowBottomBorder?: boolean;
cellRowStyle?: ViewStyle;
enableHeaderShadow?: boolean;
headerShadowStyle?: ViewStyle;
headerborderBottom?: boolean;
summary?: SummaryOptions<T>;
cellRowRightBorder?: boolean;
showHeader?: boolean;
contentContainerStyle?: ViewStyle;
totalResult?: any;
refreshing?: any;
loadingMore?: any;
handleRefresh?: any;
loadMore?: any;
initialLoader?: any;
hasMore?: any;
pagination?: boolean;
Refreshing?: boolean;
divider?: boolean;
dividerWight?: number | string;
dividerHeight?: number;
dividerColors?: string;
}
export declare function TableInner<T extends object>({ columns, data, height, onRowPress, defaultAlign, tableStyles, borderColor, borderWidth, headerborderRight, showsVerticalScrollIndicator, HeaderRowStyle, headerTexts, cellRowBottomBorder, cellRowRightBorder, cellRowStyle, enableHeaderShadow, headerShadowStyle, summary, headerborderBottom, showHeader, contentContainerStyle, handleRefresh, hasMore, initialLoader, loadMore, loadingMore, refreshing, totalResult, pagination, Refreshing, divider, dividerWight, dividerHeight, dividerColors, }: TableProps<T>): React.JSX.Element;
export declare const Table: React.MemoExoticComponent<typeof TableInner>;
export {};