import React from 'react';
import { IJaenConnection } from '../../types';
import { IJaenPageProps } from './types';
/**
 * @function connectPage Connects a gatsby page with Jaen.
 *
 * @see {@link connectTemplate} for more information.
 *
 * Warning: This component must be used to wrap a page, not a template.
 */
export declare const connectPage: <P extends IJaenPageProps>(Component: React.ComponentType<P>, options: {
    displayName: string;
    children?: string[];
}) => IJaenConnection<P, {
    displayName: string;
    children?: string[] | undefined;
}>;
export type IPageConnection = ReturnType<typeof connectPage>;
/**
 * @function connectTemplate Connects a gatsby template with Jaen.
 *
 * @param Component The template page to wrap
 * @param {JaenTemplateOptions} templateOptions Configuration for the page
 *
 * Warning: This component must be used in conjunction with the graphql`
 *   query($jaenPageId: String!) {
 *     ...JaenPageData
 *   }
 * ``
 *
 * @example
 * ```
 * export default connectTemplate(
 *   p => {
 *     return (
 *       <>
 *         <h1>Blog</h1>
 *         <p>{JSON.stringify(p)}</p>
 *       </>
 *     )
 *   },
 *   {
 *     displayName: 'Simple Blog Page'
 *   }
 * )
 *
 * export const query = graphql`
 *   query($jaenPageId: String!) {
 *     ...JaenPageData
 *   }
 * `
 * ```
 */
export declare const connectTemplate: <P extends IJaenPageProps>(Component: React.ComponentType<P>, options: ITemplateOptions) => IJaenConnection<P, ITemplateOptions>;
export type ITemplateOptions = {
    displayName: string;
    children: Array<string>;
    isRootTemplate?: boolean;
};
export type ITemplateConnection = ReturnType<typeof connectTemplate>;
export type ISectionOptions = {
    displayName: string;
    name: string;
};
/**
 * @function connectSection Connects a section with Jaen.
 *
 * @param Component The component to wrap
 */
export declare const connectSection: <P extends {}>(Component: React.ComponentType<P>, options: ISectionOptions) => IJaenConnection<P, ISectionOptions>;
export type ISectionConnection = ReturnType<typeof connectSection>;
export interface JaenFieldProps<IDefaultValue> {
    name: string;
    displayName?: string;
    defaultValue: IDefaultValue;
    style?: React.CSSProperties;
    className?: string;
}
export interface FieldOptions<IValue, IDefaultValue, IProps = {}> {
    fieldType: string;
    getAdminWidget?: (props: {
        field: {
            defaultValue: IDefaultValue;
            value: IValue;
            onChange: (value: IValue) => void;
            name: string;
        };
    } & IProps) => JSX.Element;
}
/**
 * @function connectField - Connects a field to Jaen.
 *
 * @param Component The component to wrap
 *
 * @example
 * ```
 * const T = connectField<string>(props => {
 *   const {name, defaultValue, style, className} = props.jaenField
 *   return null
 * })
 * ```
 */
export declare const connectField: <IValue, IDefaultValue = IValue, P = {}>(Component: React.ComponentType<React.PropsWithChildren<P & {
    jaenField: JaenFieldProps<IDefaultValue> & {
        staticValue?: IValue | undefined;
        value?: IValue | undefined;
        isEditing: boolean;
        onUpdateValue: (value: IValue) => void;
    };
}>>, options: FieldOptions<IValue, IDefaultValue, P>) => React.NamedExoticComponent<P & JaenFieldProps<IDefaultValue>>;
export type IFieldConnection = ReturnType<typeof connectField>;