@xaui/native 0.0.7 → 0.0.8

package/dist/view/index.d.cts

@@ -0,0 +1,517 @@
+import React, { ReactNode, ReactElement, ComponentType } from 'react';
+import { ViewStyle, StyleProp, ColorValue, ScrollViewProps } from 'react-native';
+
+type MainAxisAlignment = 'start' | 'center' | 'end' | 'space-between' | 'space-around' | 'space-evenly';
+type CrossAxisAlignment = 'start' | 'center' | 'end' | 'stretch' | 'baseline';
+type RowProps = {
+    /**
+     * The content to render inside the row.
+     */
+    children: ReactNode;
+    /**
+     * Main axis alignment for row items.
+     * @default 'start'
+     */
+    mainAxisAlignment?: MainAxisAlignment;
+    /**
+     * Cross axis alignment for row items.
+     * @default 'center'
+     */
+    crossAxisAlignment?: CrossAxisAlignment;
+    /**
+     * Spacing between children.
+     */
+    spacing?: number;
+    /**
+     * Reverse the row direction.
+     * @default false
+     */
+    reverse?: boolean;
+    /**
+     * Force the container to take the full width.
+     * @default false
+     */
+    fullWidth?: boolean;
+    /**
+     * Custom style for the row container.
+     */
+    style?: ViewStyle;
+};
+type ColumnProps = RowProps;
+
+declare const Column: React.FC<ColumnProps>;
+
+declare const Row: React.FC<RowProps>;
+
+type SpacerProps = {
+    /**
+     * Flex factor for the spacer.
+     * @default 1
+     */
+    flex?: number;
+    /**
+     * Custom style for the spacer.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+
+declare const Spacer: React.FC<SpacerProps>;
+
+type PaddingProps = {
+    /**
+     * Content to render inside the padding container.
+     */
+    children: ReactNode;
+    /**
+     * Padding on all sides.
+     */
+    all?: number;
+    /**
+     * Horizontal padding.
+     */
+    horizontal?: number;
+    /**
+     * Vertical padding.
+     */
+    vertical?: number;
+    /**
+     * Top padding.
+     */
+    top?: number;
+    /**
+     * Right padding.
+     */
+    right?: number;
+    /**
+     * Bottom padding.
+     */
+    bottom?: number;
+    /**
+     * Left padding.
+     */
+    left?: number;
+    /**
+     * Custom style for the padding container.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+
+declare const Padding: React.FC<PaddingProps>;
+
+type MarginProps = {
+    /**
+     * Content to render inside the margin container.
+     */
+    children: ReactNode;
+    /**
+     * Margin on all sides.
+     */
+    value?: number;
+    /**
+     * Horizontal margin.
+     */
+    horizontal?: number;
+    /**
+     * Vertical margin.
+     */
+    vertical?: number;
+    /**
+     * Top margin.
+     */
+    top?: number;
+    /**
+     * Right margin.
+     */
+    right?: number;
+    /**
+     * Bottom margin.
+     */
+    bottom?: number;
+    /**
+     * Left margin.
+     */
+    left?: number;
+    /**
+     * Custom style for the margin container.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+
+declare const Margin: React.FC<MarginProps>;
+
+type SizedBoxProps = {
+    /**
+     * Content to render inside the box.
+     */
+    children?: ReactNode;
+    /**
+     * Width of the box.
+     */
+    width?: number;
+    /**
+     * Height of the box.
+     */
+    height?: number;
+    /**
+     * Custom style for the box.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+
+declare const SizedBox: React.FC<SizedBoxProps>;
+
+type PositionedViewProps = {
+    /**
+     * Content to render inside the positioned container.
+     */
+    children: ReactNode;
+    /**
+     * Top offset.
+     */
+    top?: number;
+    /**
+     * Right offset.
+     */
+    right?: number;
+    /**
+     * Bottom offset.
+     */
+    bottom?: number;
+    /**
+     * Left offset.
+     */
+    left?: number;
+    /**
+     * Z-index for stacking context.
+     */
+    zIndex?: number;
+    /**
+     * Custom style for the positioned container.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+
+declare const PositionedView: React.FC<PositionedViewProps>;
+
+type BlurViewProps = {
+    children: ReactNode;
+    unlockable?: boolean;
+    intensity?: number;
+    overlayColor?: ColorValue;
+    style?: StyleProp<ViewStyle>;
+};
+
+declare const BlurView: React.FC<BlurViewProps>;
+
+type GridProps = {
+    /**
+     * The grid items to render.
+     */
+    children: ReactNode;
+    /**
+     * Number of columns in the grid.
+     * @default 2
+     */
+    columns?: number;
+    /**
+     * Spacing between rows and columns.
+     */
+    spacing?: number;
+    /**
+     * Spacing between rows.
+     */
+    rowSpacing?: number;
+    /**
+     * Spacing between columns.
+     */
+    columnSpacing?: number;
+    /**
+     * Custom style for the grid container.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Custom style for each grid item.
+     */
+    itemStyle?: StyleProp<ViewStyle>;
+};
+
+declare const Grid: React.FC<GridProps>;
+
+type GridItemProps = {
+    /**
+     * The content to render inside the grid item.
+     */
+    children: ReactNode;
+    /**
+     * Number of columns to span.
+     * @default 1
+     */
+    span?: number;
+    /**
+     * Custom style for the grid item.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+
+declare const GridItem: React.FC<GridItemProps>;
+
+type GridBuilderRenderItem<T> = (info: {
+    item: T;
+    index: number;
+}) => ReactElement | null;
+type GridBuilderItemBuilder<T> = (info: {
+    item?: T;
+    index: number;
+}) => ReactElement | null;
+type GridBuilderProps<T> = {
+    /**
+     * Data to render in the grid.
+     */
+    data?: readonly T[];
+    /**
+     * Number of items to render (Flutter-style).
+     */
+    itemCount?: number;
+    /**
+     * Render function for each item.
+     */
+    renderItem?: GridBuilderRenderItem<T>;
+    /**
+     * Builder function for each item (Flutter-style).
+     */
+    itemBuilder?: GridBuilderItemBuilder<T>;
+    /**
+     * Extract a stable key for each item.
+     */
+    keyExtractor?: (item: T, index: number) => string;
+    /**
+     * Number of columns in the grid.
+     * @default 2
+     */
+    columns?: number;
+    /**
+     * Spacing between rows and columns.
+     */
+    spacing?: number;
+    /**
+     * Spacing between rows.
+     */
+    rowSpacing?: number;
+    /**
+     * Spacing between columns.
+     */
+    columnSpacing?: number;
+    /**
+     * Custom style for the grid container.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Custom style for each grid item container.
+     */
+    itemStyle?: StyleProp<ViewStyle>;
+    /**
+     * Enable or disable scrolling.
+     */
+    scrollEnabled?: boolean;
+    /**
+     * Called when the scroll reaches the end.
+     */
+    onEndReached?: () => void;
+    /**
+     * Distance from end (as a fraction of the viewport height).
+     * @default 0.1
+     */
+    onEndReachedThreshold?: number;
+    /**
+     * Content container style for the list.
+     */
+    contentContainerStyle?: StyleProp<ViewStyle>;
+    /**
+     * Optional header element.
+     */
+    header?: ReactElement | ComponentType<any> | null;
+    /**
+     * Optional footer element.
+     */
+    footer?: ReactElement | ComponentType<any> | null;
+};
+
+declare const GridBuilder: {
+    <T>({ data, itemCount, renderItem, itemBuilder, keyExtractor, columns, spacing, rowSpacing, columnSpacing, style, itemStyle, scrollEnabled, onEndReached, onEndReachedThreshold, contentContainerStyle, header, footer, }: GridBuilderProps<T>): React.JSX.Element | null;
+    displayName: string;
+};
+
+type ConditionalViewAnimation = 'fade' | 'scale';
+type ConditionalViewProps = {
+    /**
+     * Whether the view is visible.
+     */
+    isVisible: boolean;
+    /**
+     * The content to render when visible.
+     */
+    children: ReactNode;
+    /**
+     * The animation to use when the view appears.
+     * @default 'fade'
+     */
+    animation?: ConditionalViewAnimation;
+    /**
+     * Disable animations entirely.
+     * @default false
+     */
+    disableAnimation?: boolean;
+};
+
+declare const ConditionalView: React.FC<ConditionalViewProps>;
+
+type MasonryGridProps = {
+    /**
+     * Items to render inside the masonry grid.
+     */
+    children: ReactNode;
+    /**
+     * Number of columns.
+     * @default 2
+     */
+    columns?: number;
+    /**
+     * Spacing between rows and columns.
+     */
+    spacing?: number;
+    /**
+     * Spacing between rows.
+     */
+    rowSpacing?: number;
+    /**
+     * Spacing between columns.
+     */
+    columnSpacing?: number;
+    /**
+     * Custom style for the grid container.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Custom style for each column container.
+     */
+    columnStyle?: StyleProp<ViewStyle>;
+};
+
+declare const MasonryGrid: React.FC<MasonryGridProps>;
+
+type MasonryGridItemProps = {
+    /**
+     * The content to render inside the masonry item.
+     */
+    children: ReactNode;
+    /**
+     * Custom style for the masonry item container.
+     */
+    style?: StyleProp<ViewStyle>;
+};
+
+declare const MasonryGridItem: React.FC<MasonryGridItemProps>;
+
+type MasonryGridBuilderRenderItem<T> = (info: {
+    item: T;
+    index: number;
+}) => ReactElement | null;
+type MasonryGridBuilderItemBuilder<T> = (info: {
+    item?: T;
+    index: number;
+}) => ReactElement | null;
+type MasonryGridBuilderProps<T> = {
+    /**
+     * Data to render in the masonry grid.
+     */
+    data?: readonly T[];
+    /**
+     * Number of items to render (Flutter-style).
+     */
+    itemCount?: number;
+    /**
+     * Render function for each item.
+     */
+    renderItem?: MasonryGridBuilderRenderItem<T>;
+    /**
+     * Builder function for each item (Flutter-style).
+     */
+    itemBuilder?: MasonryGridBuilderItemBuilder<T>;
+    /**
+     * Extract a stable key for each item.
+     */
+    keyExtractor?: (item: T, index: number) => string;
+    /**
+     * Number of columns.
+     * @default 2
+     */
+    columns?: number;
+    /**
+     * Spacing between rows and columns.
+     */
+    spacing?: number;
+    /**
+     * Spacing between rows.
+     */
+    rowSpacing?: number;
+    /**
+     * Spacing between columns.
+     */
+    columnSpacing?: number;
+    /**
+     * Custom style for the masonry container.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Custom style for each column container.
+     */
+    columnStyle?: StyleProp<ViewStyle>;
+    /**
+     * Called when the scroll reaches the end.
+     */
+    onEndReached?: () => void;
+    /**
+     * Distance from end (as a fraction of the viewport height).
+     * @default 0.1
+     */
+    onEndReachedThreshold?: number;
+    /**
+     * Optional header element.
+     */
+    header?: ReactNode;
+    /**
+     * Optional footer element.
+     */
+    footer?: ReactNode;
+    /**
+     * Content container style for the ScrollView.
+     */
+    contentContainerStyle?: StyleProp<ViewStyle>;
+    /**
+     * Enable or disable scrolling.
+     */
+    scrollEnabled?: boolean;
+    /**
+     * Show the vertical scroll indicator.
+     */
+    showsVerticalScrollIndicator?: boolean;
+    /**
+     * Show the horizontal scroll indicator.
+     */
+    showsHorizontalScrollIndicator?: boolean;
+    /**
+     * Enable or disable bouncing.
+     */
+    bounces?: boolean;
+    /**
+     * Scroll handler called alongside internal infinite-scroll logic.
+     */
+    onScroll?: ScrollViewProps['onScroll'];
+};
+
+declare const MasonryGridBuilder: {
+    <T>({ data, itemCount, renderItem, itemBuilder, keyExtractor, columns, spacing, rowSpacing, columnSpacing, style, columnStyle, onEndReached, onEndReachedThreshold, header, footer, scrollEnabled, contentContainerStyle, showsVerticalScrollIndicator, showsHorizontalScrollIndicator, bounces, onScroll, }: MasonryGridBuilderProps<T>): React.JSX.Element | null;
+    displayName: string;
+};
+
+export { BlurView, type BlurViewProps, Column, type ColumnProps, ConditionalView, type ConditionalViewAnimation, type ConditionalViewProps, type CrossAxisAlignment, Grid, GridBuilder, type GridBuilderProps, GridItem, type GridItemProps, type GridProps, type MainAxisAlignment, Margin, type MarginProps, MasonryGrid, MasonryGridBuilder, type MasonryGridBuilderProps, MasonryGridItem, type MasonryGridItemProps, type MasonryGridProps, Padding, type PaddingProps, PositionedView, type PositionedViewProps, Row, type RowProps, SizedBox, type SizedBoxProps, Spacer, type SpacerProps };