@etsoo/materialui/lib/cjs/ViewContainer.d.ts

TypeScript Material-UI Implementation

import React from "react";
import { DataTypes } from "@etsoo/shared";
import { GridColumnRenderProps, GridDataType } from "@etsoo/react";
import { GridProps } from "@mui/material/Grid";
import { Breakpoint } from "@mui/material/styles";
/**
 * View page item size
 */
export type ViewPageItemSize = Record<Breakpoint, number | undefined>;
/**
 * View page grid item size
 */
export declare namespace ViewPageSize {
    const large: ViewPageItemSize;
    const medium: ViewPageItemSize;
    const line: ViewPageItemSize;
    const small: ViewPageItemSize;
    const smallLine: ViewPageItemSize;
    function matchSize(size: ViewPageItemSize): {
        [k: string]: number | undefined;
    };
}
/**
 * View page row width type
 */
export type ViewPageRowType = boolean | "default" | "small" | "medium" | "large" | ViewPageItemSize;
/**
 * View page grid item properties
 */
export type ViewPageGridItemProps = GridProps & {
    data: React.ReactNode;
    label?: React.ReactNode;
    singleRow?: ViewPageRowType;
    horizontal?: boolean;
};
/**
 * View page grid item
 * @param props Props
 * @returns Result
 */
export declare function ViewPageGridItem(props: ViewPageGridItemProps): import("react/jsx-runtime").JSX.Element;
/**
 * View page display field
 */
export interface ViewPageField<T extends object> extends GridProps {
    /**
     * Data field
     */
    data: (string & keyof T) | ((item: T) => React.ReactNode);
    /**
     * Data type
     */
    dataType?: GridDataType;
    /**
     * Label field
     */
    label?: string | ((item: T) => React.ReactNode);
    /**
     * Display as single row
     */
    singleRow?: ViewPageRowType;
    /**
     * Render as horizontal or not
     */
    horizontal?: boolean;
    /**
     * Render props
     */
    renderProps?: GridColumnRenderProps;
}
type ViewPageFieldTypeNarrow<T extends object> = (string & keyof T) | [string & keyof T, GridDataType, GridColumnRenderProps?, ViewPageRowType?] | ViewPageField<T>;
/**
 * View page field type
 */
export type ViewPageFieldType<T extends object> = ViewPageFieldTypeNarrow<T> | ((data: T, refresh: () => Promise<void>) => React.ReactNode | [React.ReactNode, ViewPageItemSize]);
export type ViewContainerProps<T extends DataTypes.StringRecord> = {
    /**
     * Data
     */
    data: T;
    /**
     * Fields to display
     */
    fields: ViewPageFieldType<T>[];
    /**
     * Grid container reference
     */
    gridRef?: React.Ref<HTMLDivElement>;
    /**
     * Left container
     */
    leftContainer?: (data: T) => React.ReactNode;
    /**
     * Left container height in lines
     */
    leftContainerLines?: number;
    /**
     * Left container properties
     */
    leftContainerProps?: Omit<GridProps, "size"> & {
        size?: ViewPageItemSize;
    };
    /**
     * Refresh function
     */
    refresh: () => Promise<void>;
    /**
     * Grid spacing
     */
    spacing?: Record<string, string | number>;
};
export declare function ViewContainer<T extends DataTypes.StringRecord>(props: ViewContainerProps<T>): import("react/jsx-runtime").JSX.Element;
export {};