@cloudquery/plugin-config-ui-lib/dist/index.d.ts

Plugin configuration UI library for CloudQuery Cloud App

import { AccordionProps } from '@mui/material/Accordion';
import { BoxProps } from '@mui/material/Box';
import { ButtonProps } from '@mui/material/Button';
import { ChangeEventHandler } from 'react';
import { Controller } from 'react-hook-form';
import { EditorProps } from '@monaco-editor/react';
import { FormMessagePayload } from '@cloudquery/plugin-config-ui-connector';
import { FormProvider } from 'react-hook-form';
import { ForwardRefExoticComponent } from 'react';
import { ImgHTMLAttributes } from 'react';
import { JSONSchema } from 'monaco-yaml';
import { JSX as JSX_2 } from 'react/jsx-runtime';
import { LinkProps as LinkProps_2 } from '@mui/material/Link';
import { ListItemProps } from '@mui/material/ListItem';
import { ListProps } from '@mui/material/List';
import type * as Monaco from 'monaco-editor';
import { PluginUiMessageHandler } from '@cloudquery/plugin-config-ui-connector';
import { PluginUiMessagePayload } from '@cloudquery/plugin-config-ui-connector';
import { default as React_2 } from 'react';
import { ReactNode } from 'react';
import { Ref } from 'react';
import { RefAttributes } from 'react';
import { StepIconProps } from '@mui/material/StepIcon';
import { TextFieldProps } from '@mui/material/TextField';
import { useForm } from 'react-hook-form';
import { useFormContext } from 'react-hook-form';
import { UseFormReturn } from 'react-hook-form';
import { useWatch } from 'react-hook-form';
import * as yup from 'yup';

declare type AuthPluginType = 'aws' | 'gcp';

/**
 * @public
 */
export declare enum AuthType {
    OAUTH = 0,
    OTHER = 1
}

declare type Callback = (tableValues: Record<string, boolean>) => void;

/**
 * CloudQuery API base URL
 *
 * @public
 */
export declare const cloudQueryApiBaseUrl: string;

/**
 * CloudQuery OAuth Connector URL
 *
 * @public
 */
export declare const cloudQueryOauthConnectorUrl: string;

/**
 * @public
 */
export declare interface CloudQueryTable {
    name: string;
    title: string;
    description: string;
    is_incremental?: boolean;
    is_paid?: boolean;
    relations: CloudQueryTable[];
    columns: unknown[];
}

/**
 * Output shape of json from `cloudquery tables` command.
 *
 * @public
 */
export declare type CloudQueryTables = CloudQueryTable[];

/**
 * CodeSnippet component displays text in specialized text with a copy button.
 *
 * @public
 */
export declare function CodeSnippet({ text }: CodeSnippetProps): JSX_2.Element;

/**
 * @public
 */
export declare interface CodeSnippetProps {
    text: string;
}

/**
 * @public
 */
declare interface CollapsibleSectionProps {
    children: React_2.ReactNode;
    defaultExpanded?: AccordionProps['defaultExpanded'];
    title: React_2.ReactNode;
    subtitle?: React_2.ReactNode;
}

/**
 * @public
 */
declare interface CollapsibleSubSectionProps {
    children: React_2.ReactNode;
    defaultExpanded?: AccordionProps['defaultExpanded'];
    title: React_2.ReactNode;
    subtitle?: React_2.ReactNode;
}

declare interface ComponentAbstract extends ShouldRenderAbstract {
    name: string;
    schema: yup.AnySchema;
}

declare interface ConditionalRenderingProps {
    shouldRender?: (values: any) => boolean;
    children: ReactNode;
}

/**
 * This component is responsible for rendering the root of the plugin configuration UI.
 *
 * @public
 */
export declare function ConfigUIForm({ prepareSubmitValues, container }: ConfigUIFormProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ConfigUIFormProps {
    prepareSubmitValues: (config: PluginConfig, values: Record<string, any>, tablesList?: PluginTable[]) => PluginUiMessagePayload['validation_passed']['values'];
    container?: HTMLElement | ShadowRoot;
}

/**
 * This component is a react-hook-form wrapper around the MUI Switch or Checkbox component.
 *
 * @public
 */
export declare function ControlBooleanField({ name, label, type, helperText, }: ControlBooleanFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlBooleanFieldProps {
    name: string;
    type: 'toggle' | 'checkbox';
    helperText?: ReactNode;
    label: ReactNode;
}

declare interface ControlCodeFieldProps extends Omit<EditorProps, 'value' | 'onChange' | 'onMount'> {
    name: string;
    label?: string;
    helperText?: ReactNode;
    editorRef?: React_2.MutableRefObject<MonacoEditor | null>;
    onMount?: (editor: MonacoEditor, monaco: MonacoType) => Promise<void> | void;
    yamlSchema?: JSONSchema;
    container?: HTMLElement | ShadowRoot;
}

/**
 * This component is a react-hook-form wrapper around the MUI Date component.
 *
 * @public
 */
export declare function ControlDateField({ name, label, helperText, disabled, clearable, InputProps, }: ControlDateFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlDateFieldProps {
    name: string;
    helperText?: ReactNode;
    label: ReactNode;
    disabled?: boolean;
    clearable?: boolean;
    InputProps?: TextFieldProps['InputProps'];
}

/**
 * This component is a react-hook-form wrapper around the MUI DateTime component.
 *
 * @public
 */
export declare function ControlDateTimeField({ name, label, helperText, disabled, clearable, InputProps, }: ControlDateTimeFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlDateTimeFieldProps {
    name: string;
    helperText?: ReactNode;
    label: ReactNode;
    disabled?: boolean;
    clearable?: boolean;
    InputProps?: TextFieldProps['InputProps'];
}

/**
 * This component is a react-hook-form wrapper around the ExclusiveToggle component.
 *
 * @public
 */
export declare function ControlExclusiveToggleField({ name, options, children, }: ControlExclusiveToggleFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlExclusiveToggleFieldProps {
    name: string;
    options: {
        label: string;
        value: string | number;
    }[];
    children?: ReactNode;
}

export { Controller }

/**
 * This component is a react-hook-form wrapper around the MUI Autocomplete multi-select component.
 *
 * @public
 */
export declare function ControlMultiSelectField({ name, helperText, label, codeSeparators, }: ControlMultiSelectFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlMultiSelectFieldProps {
    name: string;
    label: string;
    helperText?: ReactNode;
    codeSeparators?: string[];
}

/**
 * This component is a react-hook-form wrapper around the MUI Textfield number component.
 *
 * @public
 */
export declare function ControlNumberField({ name, label, helperText, textFieldProps, }: ControlNumberFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlNumberFieldProps {
    name: string;
    helperText?: ReactNode;
    label: ReactNode;
    textFieldProps?: TextFieldProps;
}

/**
 * This component is a renders an OAuth authentication button and handles the data transfer process.
 *
 * @public
 */
export declare function ControlOAuthField({ shouldAuthenticate, getConnectPayloadSpec, getFinishPayloadSpec, }: ControlOAuthFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare type ControlOAuthFieldProps = {
    shouldAuthenticate?: () => Promise<boolean>;
    getConnectPayloadSpec?: (formValues: any) => Promise<Record<string, any>>;
    getFinishPayloadSpec?: (formValues: any) => Promise<Record<string, any>>;
};

/**
 * This component is a react-hook-form wrapper around the SecretField component.
 *
 * @public
 */
export declare function ControlSecretField({ name, label, helperText, textFieldProps, }: ControlSecretFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlSecretFieldProps {
    name: string;
    helperText?: ReactNode;
    label: ReactNode;
    textFieldProps?: TextFieldProps;
}

/**
 * This component is a react-hook-form wrapper around the MUI Textfield implementation of a select component.
 *
 * @public
 */
export declare function ControlSelectField({ name, helperText, label, options, }: ControlSelectFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlSelectFieldProps {
    name: string;
    label: string;
    helperText?: ReactNode;
    options: (string | OptionObject)[];
}

/**
 * This component is a react-hook-form wrapper around the Select Services component.
 * Usage of this component is uncommon, the Table Selector is a more common choice.
 *
 * @public
 */
export declare function ControlServicesSelectorField({ services, topServices, name, helperText, label, }: ControlServicesSelectorFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlServicesSelectorFieldProps {
    services: ServiceTypes;
    topServices?: string[];
    name: string;
    helperText?: ReactNode;
    label?: string;
}

/**
 * This component is used to manage table selection.
 *
 * @public
 */
export declare const ControlTableSelectorField: React_2.MemoExoticComponent<typeof InternalPluginTableSelector>;

/**
 * This component is a react-hook-form wrapper around the MUI Textfield component.
 *
 * @public
 */
export declare function ControlTextField({ name, label, helperText, textFieldProps, }: ControlTextFieldProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ControlTextFieldProps {
    name: string;
    helperText?: ReactNode;
    label: ReactNode;
    textFieldProps?: TextFieldProps;
}

/**
 * Converts an arbitrary string to a valid slug
 *
 * @param value - string argument to be converted to a slug
 * @public
 */
export declare function convertStringToSlug(value: string): string;

/**
 * Prepare values for submit
 *
 * @public
 */
export declare function corePrepareSubmitValues(config: PluginConfig, values: any, tablesList?: PluginTable[]): PluginUiMessagePayload['validation_passed']['values'];

/**
 * Conditionally creates a connectorId, then begins the authentication process for the new or existing connectorId
 *
 * @public
 */
export declare function createAndAuthenticateConnector<T>({ connectorId: existingConnectorId, teamName, pluginTeamName, authPluginType, pluginName, pluginKind, authenticatePayload, }: {
    connectorId?: string;
    teamName: string;
    pluginTeamName: string;
    authPluginType: AuthPluginType;
    pluginName: string;
    pluginKind: 'source' | 'destination';
    finishImmediately?: boolean;
    authenticatePayload?: Partial<{
        plugin_version: string;
        spec: Record<string, any>;
        env: Record<string, any>[];
        tables: string[];
        skip_tables: string[];
        skip_dependent_tables: boolean;
    }>;
}): Promise<T & {
    connectorId?: string;
}>;

/**
 * @public
 */
export declare interface DestinationConfig extends PluginConfig {
    type: 'destination';
}

/**
 * Escape single quotes or backslashes so a string can be safely interpolated.
 *
 * @param str - a string
 * @public
 */
export declare function escapeSingleQuotesAndBackslashes(str: string): string;

/**
 * ExclusiveToggle component acts as a styled radio
 *
 * @public
 */
export declare const ExclusiveToggle: ForwardRefExoticComponent<ExclusiveToggleProps & RefAttributes<HTMLElement>>;

/**
 * @public
 */
export declare interface ExclusiveToggleProps {
    /** Callback that is called when the selected value changes. */
    onChange: (newValue: string | number | boolean) => void;
    /** The currently selected value. */
    value: string | number | boolean;
    /** The title of the radio group. */
    title?: string;
    /** The radio buttons to display. */
    options: Array<{
        label: ReactNode;
        description?: ReactNode;
        value: string | number | boolean;
        disabled?: boolean;
    }>;
}

/**
 * Finishes authentication to a connectorId
 *
 * @public
 */
export declare function finishAuthConnectorAuthentication({ authPluginType, connectorId, teamName, method, payload, path, }: {
    connectorId: string;
    teamName: string;
    authPluginType: AuthPluginType;
    method: 'POST' | 'PATCH';
    payload: Record<string, any>;
    path?: string;
}): Promise<void>;

/**
 * @public
 */
export declare type FormActionsFormValues = PluginUiMessagePayload['current_values']['values'];

/**
 * @public
 */
export declare interface FormActionsSyncDestinationPayload {
    writeMode?: 'append' | 'overwrite' | 'overwrite-delete-stale';
    migrateMode?: 'forced' | 'safe';
}

/**
 * @public
 */
export declare interface FormActionsSyncSourcePayload {
    tables?: string[];
    skipTables?: string[];
}

/**
 * This component is used to visually group form fields.
 *
 * @public
 */
export declare function FormFieldGroup({ children, subheader, title }: FormFieldGroupProps): JSX_2.Element;

/**
 * @public
 */
export declare interface FormFieldGroupProps {
    children: ReactNode;
    subheader?: ReactNode;
    title?: ReactNode;
}

/**
 * This component is used to reset a form field whose initial value
 * includes environment variable
 *
 * @public
 */
export declare function FormFieldReset({ isResetted, onReset, onCancel, inputSelectorToFocus, sx, }: FormFieldResetProps): JSX_2.Element;

/**
 * @public
 */
export declare interface FormFieldResetProps {
    isResetted: boolean;
    onReset: () => void;
    onCancel: () => void;
    inputSelectorToFocus?: string;
    sx?: ButtonProps['sx'];
}

/**
 * FormFooter component that renders the footer section of a form, including
 * buttons for navigating to the previous step, deleting the form, testing the
 * connection, and submitting the form.
 *
 * @public
 */
export declare function FormFooter({ isUpdating, isSubmitting, isTestingConnection, testConnectionError, pluginKind, submitPayload, onCancelTestConnection, onDelete, onGoToPreviousStep, onTestConnectionSuccess, submitLabel, submitDisabled, showPreviousStepButton, pluginName, teamName, testConnectionId, }: FormFooterProps): JSX_2.Element;

/**
 * @public
 */
export declare interface FormFooterProps {
    /** Indicates whether the form is currently being updated */
    isUpdating: boolean;
    /** Indicates whether the connection is currently being tested */
    isTestingConnection: boolean;
    /** Indicates whether the form is currently being submitted */
    isSubmitting: boolean;
    /** Error message for connection testing, if any */
    testConnectionError: (Error & {
        code?: string;
    }) | undefined;
    /** The type of plugin, either 'source' or 'destination' */
    pluginKind: 'source' | 'destination';
    /** Payload to be submitted, containing form values and connection ID */
    submitPayload: (FormValues & {
        connectionId: string;
    }) | undefined;
    /** Callback to cancel the connection test */
    onCancelTestConnection: () => void;
    /** Callback to handle delete action */
    onDelete: () => Promise<void>;
    /** Callback to navigate to the previous step */
    onGoToPreviousStep: () => void;
    /** Label for the submit button */
    submitLabel?: string;
    /** Indicates whether the submit button should be disabled */
    submitDisabled?: boolean;
    /** Callback to handle test connection success */
    onTestConnectionSuccess: () => void;
    /** Indicates whether the previous step button should be shown */
    showPreviousStepButton: boolean;
    /** The name of the plugin */
    pluginName: string;
    /** The name of the current team */
    teamName: string;
    /** The ID of the test connection */
    testConnectionId?: string;
}

export { FormProvider }

/**
 * FormStepper component manages navigation of multi-step forms, intended for re-use across custom plugins.
 *
 * @public
 */
export declare function FormStepper({ steps, activeIndex, setActiveIndex }: Props): JSX_2.Element;

/**
 * @public
 */
declare interface FormSubmitFailure {
    values?: never;
    errors: PluginUiMessagePayload['validation_failed']['errors'];
}

/**
 * @public
 */
declare interface FormSubmitSuccess {
    values: PluginUiMessagePayload['validation_passed']['values'];
    errors?: never;
}

declare type FormValues = PluginUiMessagePayload['current_values']['values'];

/**
 * Wrapper to support disabling forms while submitting
 *
 * @public
 */
export declare function FormWrapper({ children, formDisabled }: FormWrapperProps): JSX_2.Element;

/**
 * @public
 */
export declare type FormWrapperProps = {
    children: ReactNode;
    formDisabled: boolean;
};

/**
 * @public
 * Encapsulatees the GCP Connector logic in a Button or Link.
 */
export declare function GCPConnect({ variant }: GCPConnectProps): JSX_2.Element;

/**
 * @public
 */
export declare type GCPConnectProps = {
    variant?: 'link' | 'button';
};

/**
 * Generate abort error
 *
 * @public
 */
export declare function generateApiAbortError(message?: string): Error;

/**
 * Generate display name for the sync source/destination based on the plugin display name
 *
 * @param pluginDisplayName - display name of the plugin
 * @public
 */
export declare function generateDisplayName(pluginDisplayName: string): string;

/**
 * Generate name for the sync source/destination based on the plugin name
 *
 * @param pluginName - name of the plugin
 * @public
 * @deprecated After introduction of generateDisplayName, this should be replaced with generateUniqueName
 */
export declare function generateName(pluginName: string): string;

/**
 * generatePluginTableList utility takes the output of `useGetTables` and reshapes the data
 * to compatability with the TableSelector component.
 *
 * @public
 */
export declare function generatePluginTableList(tables?: PluginTable[]): PluginTableListItem[];

/**
 * Utility takes the output of `cloudquery tables` to recursively expand child nodes under their parents.
 *
 * @public
 */
export declare const generateTablesFromJson: (tablesJson: CloudQueryTable[]) => PluginTable[];

/**
 * @public
 *
 * Returns the root element and shadow root container of the app.
 * This is useful for plugins that need to render in the app.
 *
 * @param rootSelector - The selector for the root element (default: '#root')
 * @param shadowRootWindowKey - The key to access shadow root from window object (default: 'REACT_ROOT')
 *
 */
export declare function getAppRootElements({ rootSelector, shadowRootWindowKey, }?: {
    rootSelector?: string;
    shadowRootWindowKey?: string;
}): {
    rootElement: HTMLElement;
    shadowRootContainer: HTMLElement | undefined;
};

/**
 * Gets the authenticate connector for a given connectorId
 * @public
 */
export declare function getAuthenticateConnector({ connectorId, teamName, authPluginType, }: {
    connectorId: string;
    teamName: string;
    authPluginType: AuthPluginType;
}): Promise<{
    role_arn: string;
    external_id: string;
}>;

/**
 * getEnabledTablesObject utility takes the list of tables and the list of enabled tables
 * and returns an object with the enabled tables set to true.
 *
 * @public
 */
export declare const getEnabledTablesObject: ({ tablesList, tables, }: {
    tablesList?: PluginTable[];
    tables?: string[];
}) => Record<string, boolean>;

/**
 * Returns a helper text for a form field, combining an error message (if present) with additional helper text.
 * If an error message is provided, it is displayed first, followed by the helper text.
 *
 * @param errorMessage - The error message to display, if any.
 * @param helperText - Additional helper text or ReactNode to display.
 * @returns A string or ReactNode containing the combined error message and helper text.
 *
 * @public
 */
export declare function getFieldHelperText(errorMessage: string | undefined, helperText: string | ReactNode): string | number | boolean | Iterable<ReactNode> | JSX_2.Element | null | undefined;

/**
 * @public
 * Returns the `children` array for a PluginConfig section to render
 * the Authentication options for any GCP-based plugin.
 */
export declare const getGCPAuthFormula: ({ initialValues }: GetGCPAuthFormulaProps) => ({
    component: string;
    name: string;
    options: {
        label: string;
        value: AuthType;
    }[];
    schema: yup.MixedSchema<{} | undefined, yup.AnyObject, AuthType, "d">;
    shouldRender?: undefined;
    children?: undefined;
} | {
    component: string;
    shouldRender: (values: any) => boolean;
    children: (typeof GCPConnect)[];
    name?: undefined;
    options?: undefined;
    schema?: undefined;
} | {
    component: string;
    shouldRender: (values: any) => boolean;
    children: {
        name: string;
        component: typeof UploadJSON;
        schema: yup.StringSchema<string | undefined, yup.AnyObject, any, "">;
    }[];
    name?: undefined;
    options?: undefined;
    schema?: undefined;
})[];

/**
 * @public
 */
export declare type GetGCPAuthFormulaProps = {
    initialValues?: FormMessagePayload['init']['initialValues'] | undefined;
    pluginUiMessageHandler: PluginUiMessageHandler;
};

/**
 * Generate random ID with optional length (7 by default, 36 is maximum)
 *
 * @public
 */
export declare function getRandomId(length?: number): string;

/**
 * This function returns a resolver function that can be used with react-hook-form.
 * It is using yup validation schema to validate the data and returns values when the data is valid.
 * If the data is invalid, it returns the errors with parsed messages based on the yup validation schema.
 *
 * @public
 */
export declare function getYupValidationResolver<FieldValues extends yup.AnyObject, Schema extends yup.ObjectSchema<FieldValues>>(validationSchema: Schema): (data: any) => Promise<{
    errors: {};
    values: Schema["__outputType"];
} | {
    errors: any;
    values: {};
}>;

/**
 * Renderer for the config guide.
 *
 * @public
 */
export declare function GuideComponent(): JSX_2.Element | null;

/**
 * @public
 */
export declare interface GuideConfig {
    title: string | ((values: any) => string);
    sections: GuideSection[];
}

/**
 * @public
 */
export declare type GuideSection = {
    header?: string;
    bodies: GuideSectionBody[];
    shouldRender?: (values: any) => boolean;
};

/**
 * @public
 */
export declare type GuideSectionBody = {
    code?: string;
    image?: string;
    text?: any;
    shouldRender?: (values: any) => boolean;
};

declare function InternalPluginTableSelector(): JSX_2.Element | null;

/**
 * Check if error is an abort error
 *
 * @public
 */
export declare function isApiAbortError(error: Error): boolean;

declare type IterableStepComponent = RenderSection | LayoutComponent | ReservedLayoutComponent | ReactField;

declare interface LayoutBooleanField extends ComponentAbstract, ControlBooleanFieldProps {
    component: 'control-boolean-field';
}

declare interface LayoutCodeField extends ComponentAbstract, ControlCodeFieldProps {
    component: 'control-code-field';
}

declare interface LayoutCollapsibleSection extends SectionAbstract, Omit<CollapsibleSectionProps, 'children'> {
    component: 'collapsible-section';
}

declare interface LayoutCollapsibleSubSection extends SectionAbstract, Omit<CollapsibleSubSectionProps, 'children'> {
    component: 'collapsible-sub-section';
}

declare type LayoutComponent = LayoutTextField | LayoutSecretInput | LayoutNumberField | LayoutDateTimeField | LayoutDateField | LayoutBooleanField | LayoutSelectField | LayoutMultiSelectField | LayoutExclusiveToggle | LayoutServicesSelector | LayoutCodeField;

declare interface LayoutDateField extends ComponentAbstract, ControlDateFieldProps {
    component: 'control-date-field';
}

declare interface LayoutDateTimeField extends ComponentAbstract, ControlDateTimeFieldProps {
    component: 'control-date-time-field';
}

declare interface LayoutExclusiveToggle extends ComponentAbstract, ControlExclusiveToggleFieldProps {
    component: 'control-exclusive-toggle';
}

declare interface LayoutMultiSelectField extends ComponentAbstract, ControlMultiSelectFieldProps {
    component: 'control-multi-select';
}

declare interface LayoutNumberField extends ComponentAbstract, ControlNumberFieldProps {
    component: 'control-number-field';
}

declare interface LayoutOAuth extends ShouldRenderAbstract, ControlOAuthFieldProps {
    component: 'control-oauth';
}

declare interface LayoutSecretInput extends ComponentAbstract, ControlSecretFieldProps {
    component: 'control-secret-field';
}

declare interface LayoutSection extends SectionAbstract, Omit<SectionProps, 'children'> {
    component: 'section';
}

declare interface LayoutSelectField extends ComponentAbstract, ControlSelectFieldProps {
    component: 'control-select-field';
}

declare interface LayoutServicesSelector extends ComponentAbstract, ControlServicesSelectorFieldProps {
    component: 'control-services-selector';
}

declare interface LayoutSubSection extends SectionAbstract, Omit<SubSectionProps, 'children'> {
    component: 'sub-section';
}

declare interface LayoutTableSelector extends ShouldRenderAbstract {
    component: 'control-table-selector';
}

declare interface LayoutTextField extends ComponentAbstract, ControlTextFieldProps {
    component: 'control-text-field';
}

/**
 * This component displays an image that can be opened in a lightbox.
 *
 * @public
 */
export declare function LightboxImage({ sizes, ...props }: ImgHTMLAttributes<HTMLImageElement>): JSX_2.Element;

/**
 * Wrapper for MUI Link component that opens a URL in the plugin UI top app.
 *
 * @public
 */
export declare const Link: React_2.ForwardRefExoticComponent<Omit<LinkProps, "ref"> & React_2.RefAttributes<HTMLAnchorElement>>;

/**
 * @public
 */
export declare type LinkProps = Omit<LinkProps_2, 'onClick' | 'children' | 'href'> & {
    children: ReactNode;
    href: string;
};

/**
 * Logo component standardizes the look of service and company logos in the custom plugins.
 *
 * @public
 */
export declare function Logo({ width, height, src, alt, fallbackSrc }: LogoProps): JSX_2.Element;

/**
 * @public
 */
export declare interface LogoProps {
    width?: number;
    height?: number;
    src: string;
    fallbackSrc?: string;
    alt?: string;
}

declare type MonacoEditor = Monaco.editor.IStandaloneCodeEditor;

declare type MonacoType = typeof Monaco;

/**
 * MultiAutocomplete component is a multi value, free entry component.
 *
 * @public
 */
export declare const MultiAutocomplete: React_2.ForwardRefExoticComponent<MultiAutocompleteProps & React_2.RefAttributes<HTMLDivElement>>;

/**
 * @public
 */
export declare interface MultiAutocompleteProps {
    value: any;
    onChange: (value: any) => void;
    onBlur: () => void;
    disabled?: boolean | undefined;
    name: string;
    error?: boolean;
    helperText?: ReturnType<typeof getFieldHelperText>;
    label: string;
    codeSeparators?: string[];
}

declare type OptionObject = {
    value: any;
    label: string;
};

/**
 * @public
 */
export declare interface PluginConfig {
    name: string;
    type: 'source' | 'destination';
    label: string;
    docsLink: string;
    iconLink: string;
    steps: PluginConfigFormStep[];
    stateSchema?: Record<string, yup.AnySchema>;
    auth: AuthType[];
    guide: React_2.FC | GuideConfig;
    errorCodes?: Record<string, string>;
    debug?: boolean;
}

/**
 * @public
 */
export declare type PluginConfigFormStep = {
    children: (IterableStepComponent | React_2.FC<any>)[];
    title: string;
    submitGuard?: (formValues: any, teamName: string, setValue: (field: string, value: any) => void) => Promise<boolean | {
        errorMessage: string;
    }>;
};

declare interface PluginContextProps {
    config: PluginConfig;
    plugin: {
        name: string;
        kind: string;
        version: string;
        team: string;
    };
    teamName: string;
    hideStepper: boolean;
    tablesList?: PluginTable[];
    pluginUiMessageHandler: any;
    initialValues?: FormMessagePayload['init']['initialValues'] | undefined;
}

/**
 * Provider for shared/static plugin context.
 *
 * @public
 */
export declare const PluginContextProvider: ({ children, config, teamName, getTablesData, hideStepper, pluginUiMessageHandler, initialValues, }: PluginContextProviderProps) => JSX_2.Element;

/**
 * @public
 */
export declare interface PluginContextProviderProps {
    config: PluginConfig;
    teamName: string;
    getTablesData?: () => Promise<{
        default: CloudQueryTables;
    }>;
    hideStepper: boolean;
    children: React_2.ReactNode;
    pluginUiMessageHandler: any;
    initialValues?: FormMessagePayload['init']['initialValues'] | undefined;
}

/**
 * PluginTable[] is shape of the response from `cloudquery tables` command
 *
 * @public
 */
export declare interface PluginTable {
    /** Description of the table */
    description: string;
    /** Whether the table is incremental */
    is_incremental: boolean;
    /** Whether the table is paid */
    is_paid?: boolean;
    name: string;
    /** Name of the parent table, if any */
    parent?: string;
    /** Names of the tables that depend on this table */
    relations: string[];
    /** Title of the table */
    title: string;
}

/**
 * PluginTableListItem[] is the expected shape of tables for the TableSelector component.
 *
 * @public
 */
export declare interface PluginTableListItem {
    name: string;
    parent?: string;
    relations?: string[];
    relationTables: PluginTableListItem[];
    parentTable?: PluginTableListItem;
}

declare interface Props {
    steps: string[];
    activeIndex: number;
    setActiveIndex?: (index: number) => void;
}

declare interface ReactField extends ComponentAbstract {
    component: React_2.FC<any>;
}

/**
 * readSecretsFromInitialValues util is designed to be used in a plugin's `prepareInitialValues` function.
 * It takes the default environment object and an array of API environment variables and returns a new object
 * This works well with the SecretInput component and it's counterpart utility writeSecretsToPrepareValues.
 *
 * @public
 * @deprecated - This is not used in the new pattern, but it must remain until all plugins are upgraded.
 * Then it should be deleted.
 */
export declare function readSecretsFromInitialValues<T extends object>(defaultEnv: T, apiEnv?: {
    name: string;
    value: string;
}[]): T;

/**
 * RenderGuide component formats and displays Guide sections with code snippets and images.
 *
 * @public
 */
export declare function RenderGuide({ sections }: RenderGuideProps): JSX_2.Element;

/**
 * @public
 */
export declare type RenderGuideProps = {
    sections: GuideSection[];
};

declare type RenderSection = ShouldRenderAbstract & (LayoutSection | LayoutCollapsibleSection | LayoutCollapsibleSubSection | LayoutSubSection);

declare type ReservedLayoutComponent = LayoutTableSelector | LayoutOAuth;

/**
 * This function resets the default error messages of the yup validation schema.
 *
 * @public
 */
export declare function resetYupDefaultErrorMessages(yup: typeof yup): void;

/**
 * Scroll to the first form field with an error
 *
 * @param errorFieldNames - Array of field names that contain errors
 * @public
 */
export declare function scrollToFirstFormFieldError(errorFieldNames: string[]): void;

/**
 * This component displays a search field
 *
 * @public
 */
export declare function SearchInput(props: TextFieldProps): JSX_2.Element;

/**
 * Universal placeholder for the SecretInput value
 *
 * @public
 * @deprecated - this should no longer be used and will be removed in a future version.
 * see secretValueHandling util instead.
 */
export declare const secretFieldValue = "b25b8efe-63fd-4c32-9f87-059cfd649128";

/**
 * SecretInput component is a TextField wrapper to obfuscate sensitive values, while allowing value override.
 *
 * @public
 */
export declare const SecretInput: React_2.ForwardRefExoticComponent<Omit<SecretInputProps, "ref"> & React_2.RefAttributes<HTMLDivElement>>;

/**
 * @public
 */
export declare interface SecretInputProps {
    editMode: boolean;
    label: ReactNode;
    onChange?: ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement> | undefined;
    onBlur?: (e: any) => void;
    value: any;
    defaultValues: any;
    disabled?: boolean;
    name: string;
    ref: Ref<HTMLDivElement>;
    textFieldProps?: TextFieldProps;
    setValue: (name: string, value: any) => void;
    getValues: (name?: string) => any;
    error?: boolean;
    helperText?: ReactNode;
}

declare interface SectionAbstract extends ShouldRenderAbstract {
    children: (RenderSection | LayoutComponent | ReservedLayoutComponent | React_2.FC<any>)[];
}

/**
 * @public
 */
declare interface SectionProps {
    children: React_2.ReactNode;
    title?: React_2.ReactNode;
    subtitle?: React_2.ReactNode;
}

/**
 * ServiceList component is multi-select form component for selecting services
 * with an expandable view of all available services.
 *
 * @public
 */
export declare function ServiceList({ services, topServices, fallbackLogoSrc, value, onChange, maxHeight, disabled, }: ServiceListProps): JSX_2.Element;

/**
 * @public
 */
export declare interface ServiceListProps {
    services: ServiceTypes;
    topServices?: string[];
    value?: string[];
    onChange?: (value: string[]) => void;
    fallbackLogoSrc?: string;
    maxHeight?: BoxProps['maxHeight'];
    disabled?: boolean;
}

declare type ServiceType = {
    name: string;
    label: string;
    shortLabel?: string;
    logo: string;
    tables: string[];
};

/**
 * ServiceTypes type is the required shape of the services for the ServiceList
 *
 * @public
 */
export declare type ServiceTypes = Record<string, ServiceType>;

/**
 * Display setup guide wrapper
 *
 * @public
 */
export declare function SetupGuide({ docsLink, title, children, maxHeight }: SetupGuideProps): JSX_2.Element;

/**
 * @public
 */
export declare interface SetupGuideProps {
    docsLink?: string;
    title: string;
    maxHeight?: number;
    children: ReactNode;
}

declare type ShouldRenderAbstract = Pick<ConditionalRenderingProps, 'shouldRender'>;

/**
 * @public
 */
export declare interface SourceConfig extends PluginConfig {
    type: 'source';
}

declare type SubscribeToTablesValueChange = (callback: Callback) => Unsubscribe;

/**
 * @public
 */
declare interface SubSectionProps {
    children: React_2.ReactNode;
    title?: React_2.ReactNode;
    subtitle?: React_2.ReactNode;
    isSubSection?: boolean;
}

/**
 * @public
 */
export declare type SyncFormStepIconProps = StepIconProps & {
    label: string;
};

/**
 * @internal
 */
export declare enum SyncLogLevel {
    DEBUG = "debug",
    ERROR = "error",
    INFO = "info",
    WARNING = "warning"
}

/**
 * This component allows users to select tables from a list with filtering options.
 *
 * @public
 */
export declare function TableSelector({ subscribeToTablesValueChange, errorMessage, value, onChange, tableList, disabled, }: TableSelectorProps): JSX_2.Element;

/**
 * @public
 */
export declare interface TableSelectorProps {
    /**
     * This function is used to subscribe to the table values change.
     * It returns a function to unsubscribe.
     */
    subscribeToTablesValueChange: SubscribeToTablesValueChange;
    /** Error message to display if there is an error. */
    errorMessage?: string;
    /** Current selected table values. */
    value: Record<string, boolean>;
    /** Callback function to handle value changes. */
    onChange: (value: Record<string, boolean>) => void;
    /** List of tables to display in the selector. */
    tableList: PluginTableListItem[];
    /** Form disabled boolean */
    disabled?: boolean;
}

/**
 * This component is used for grouping tree nodes inside a `TreeNode`.
 *
 * @public
 */
export declare const TreeGroup: React_2.NamedExoticComponent<TreeGroupProps>;

/**
 * @public
 */
export declare interface TreeGroupProps extends ListProps {
    children: ReactNode;
}

/**
 * This component is used as node element for the tree.
 *
 * @public
 */
export declare const TreeNode: React_2.NamedExoticComponent<TreeNodeProps>;

/**
 * @public
 */
export declare interface TreeNodeProps extends ListItemProps {
    children: ReactNode;
    isExpanded: boolean;
    isSelected: boolean;
    onSelect: () => void;
}

/**
 * This component is used as root element for the tree.
 *
 * @public
 */
export declare function TreeRoot({ children, ...props }: TreeRootProps): JSX_2.Element;

/**
 * @public
 */
export declare interface TreeRootProps extends ListProps {
    children: ReactNode;
}

declare type Unsubscribe = () => void;

/**
 * Button to upload JSON and assign it to a form value.
 *
 * @public
 */
export declare function UploadJSON({ name, helperText, }: UploadJSONProps): JSX_2.Element;

/**
 *
 * @public
 */
export declare type UploadJSONProps = {
    name?: string;
    helperText?: string;
};

/**
 * @public
 */
export declare const useConfigUIForm: () => UseFormReturn<any, any, any>;

/**
 * Custom hook to handle form schema instantiation.
 *
 * @public
 */
export declare const useCoreFormSchema: ({ initialValues, fields, secretFields, stateFields, }: UseCoreFormSchemaProps) => yup.ObjectSchema<{
    _secretKeys: any[];
    _editMode: boolean;
    _authType: {};
    _step: number;
    tables?: unknown;
    name: string;
    displayName: string;
    connectorId: string;
}, yup.AnyObject, {
    _secretKeys: string[];
    _editMode: boolean;
    _authType: AuthType;
    _step: 0;
    tables?: undefined;
    name: string;
    displayName: string;
    connectorId: string;
}, "">;

/**
 * @public
 */
export declare interface UseCoreFormSchemaProps {
    initialValues: FormMessagePayload['init']['initialValues'];
    fields: Record<string, yup.AnySchema>;
    secretFields?: Record<string, yup.AnySchema>;
    stateFields?: Record<string, yup.AnySchema>;
}

export { useForm }

/**
 * Custom hook to handle form actions such as test connection, submit, cancel, and delete.
 *
 * @public
 */
export declare function useFormActions<PluginKind extends 'source' | 'destination'>({ getValues, pluginUiMessageHandler, pluginTeamName, pluginName, pluginKind, teamName, pluginVersion, isUpdating, }: {
    pluginUiMessageHandler: PluginUiMessageHandler;
    teamName: string;
    pluginTeamName: string;
    pluginName: string;
    pluginKind: PluginKind;
    getValues: () => FormActionsFormValues;
    pluginVersion: string;
    isUpdating: boolean;
    apiBaseUrl?: string;
}): {
    submitError: any;
    handleCancelTestConnection: () => void;
    handleDelete: () => Promise<void>;
    handleGoToPreviousStep: () => void;
    handleTestConnection: () => Promise<string | null>;
    handleSubmit: (submitData?: PluginKind extends "source" ? FormActionsSyncSourcePayload : FormActionsSyncDestinationPayload) => Promise<void>;
    isSubmitting: boolean;
    isTestingConnection: boolean;
    testConnectionError: (Error & {
        code?: string;
    }) | undefined;
    submitPayload: ({
        name: string;
        displayName?: string;
        migrateMode?: "forced" | "safe";
        envs: Array<{
            name: string;
            value: string;
        }>;
        spec: Record<string, any>;
        tables?: string[];
        skipTables?: string[];
        writeMode?: "append" | "overwrite" | "overwrite-delete-stale";
        connectorId?: string;
    } & {
        connectionId: string;
    }) | undefined;
    testConnectionId: string | undefined;
};

export { useFormContext }

/**
 * This hook is used to notify CloudQuery Cloud App about the current values of the form.
 *
 * @public
 */
export declare function useFormCurrentValues(pluginUiMessageHandler: PluginUiMessageHandler, getCurrentValues: () => PluginUiMessagePayload['current_values']['values']): void;

/**
 * This hook is used to initialize the plugin UI form.
 * It subscribes to the `init` message to get initial values
 * and sends a `ready` message to the CloudQuery Cloud App
 * with information whether to hide the submit button from the beginning.
 *
 * @public
 */
export declare function useFormInit(pluginUiMessageHandler: PluginUiMessageHandler, implementsCustomFooter: boolean): {
    initialized: boolean;
    initialValues: FormMessagePayload['init']['initialValues'] | undefined;
    teamName: string;
    context: FormMessagePayload['init']['context'] | undefined;
    isManagedDestination: boolean;
    user: {
        id: string;
        name: string;
        email: string;
    };
};

/**
 * @public
 */
export declare const useFormSchema: () => yup.AnyObjectSchema;

/**
 * This hook is used to handle form submit in the plugin UI.
 * It requires a function that should validate the form and return
 * either a success object with values or a failure object with errors.
 *
 * @public
 */
export declare function useFormSubmit(onValidate: () => Promise<FormSubmitSuccess | FormSubmitFailure> | FormSubmitSuccess | FormSubmitFailure, pluginUiMessageHandler: PluginUiMessageHandler): {
    formDisabled: boolean;
    submitError: any | undefined;
};

/**
 * This hook is used to create an OAuth connector and authenticate it.
 *
 * @param pluginUiMessageHandler - Plugin UI message handler
 * @param teamName - Team name
 * @param pluginTeamName - Plugin team name
 * @param pluginName - Plugin name
 * @param pluginKind - Plugin kind
 * @param successBaseUrl - Base URL that will be used to redirect the user upon successful authentication
 * @param getConnectPayloadSpec - An async callback which returns a spec object added to the authenticate/oauth POST request payload
 * @param getFinishPayloadSpec - An async callback which returns a spec object added to the authenticate/oauth PATCH request payload
 *
 * @public
 */
export declare function useOauthConnector({ pluginUiMessageHandler, teamName, pluginKind, pluginName, pluginTeamName, successBaseUrl, getConnectPayloadSpec, getFinishPayloadSpec, }: UseOauthConnectorProps): {
    authenticate: () => Promise<void>;
    isLoading: boolean;
    connectorId: string | null;
    authConnectorResult: Record<string, string> | null;
    error: Error | null;
    cancel: () => void;
};

declare interface UseOauthConnectorProps {
    pluginUiMessageHandler: PluginUiMessageHandler;
    teamName: string;
    pluginTeamName: string;
    pluginName: string;
    pluginKind: 'source' | 'destination';
    successBaseUrl: string;
    getConnectPayloadSpec?: () => Promise<Record<string, any> | undefined>;
    getFinishPayloadSpec?: () => Promise<Record<string, any> | undefined>;
}

/**
 * Shared/static plugin context.
 *
 * @public
 */
export declare const usePluginContext: () => PluginContextProps;

/**
 * Custom hook to handle testing of connections with the ability to cancel the test.
 *
 * @public
 */
export declare function useTestConnection(): {
    cancelTestConnection: () => void;
    testConnection: (values: {
        name: string;
        path: string;
        version: string;
        spec: Record<string, any>;
        env: Array<{
            name: string;
            value?: string;
        }>;
        connector_id?: string;
    }, teamName: string, pluginKind: "source" | "destination", isUpdating: boolean) => Promise<string>;
    testConnectionId: string | undefined;
};

export { useWatch }

/**
 * writeSecretsToPrepareValues util is designed to be used in a plugin's `prepareSubmitValues` function.
 * It takes the form values and returns an array of API environment variables and a cleaned spec object.
 * This works well with the SecretInput component.
 *
 * @public
 * @deprecated - This is not used in the new pattern, but it must remain until all plugins are upgraded.
 * Then it should be deleted.
 */
export declare function writeSecretsToPrepareValues(env?: Record<string, string>): {
    envs: {
        name: string;
        value: string;
    }[];
    spec: Record<string, string>;
};

export { }