@tanstack/react-query-devtools
Version:
Developer tools to interact with and visualize the TanStack/react-query cache
48 lines • 1.69 kB
text/typescript
import * as React from "react";
import { DevtoolsErrorType, Theme } from "@tanstack/query-devtools";
import { QueryClient } from "@tanstack/react-query";
declare namespace ReactQueryDevtoolsPanel_d_exports {
export { DevtoolsPanelOptions, ReactQueryDevtoolsPanel };
}
interface DevtoolsPanelOptions {
/**
* Custom instance of QueryClient
*/
client?: QueryClient;
/**
* Use this so you can define custom errors that can be shown in the devtools.
*/
errorTypes?: Array<DevtoolsErrorType>;
/**
* Use this to pass a nonce to the style tag that is added to the document head. This is useful if you are using a Content Security Policy (CSP) nonce to allow inline styles.
*/
styleNonce?: string;
/**
* Use this so you can attach the devtool's styles to specific element in the DOM.
*/
shadowDOMTarget?: ShadowRoot;
/**
* Custom styles for the devtools panel
* @default { height: '500px' }
* @example { height: '100%' }
* @example { height: '100%', width: '100%' }
*/
style?: React.CSSProperties;
/**
* Callback function that is called when the devtools panel is closed
*/
onClose?: () => void;
/**
* Set this to true to hide disabled queries from the devtools panel.
*/
hideDisabledQueries?: boolean;
/**
* Set this to 'light', 'dark', or 'system' to change the theme of the devtools panel.
* Defaults to 'system'.
*/
theme?: Theme;
}
declare function ReactQueryDevtoolsPanel(props: DevtoolsPanelOptions): React.ReactElement | null;
//#endregion
export { DevtoolsPanelOptions, ReactQueryDevtoolsPanel, ReactQueryDevtoolsPanel_d_exports as t };
//# sourceMappingURL=ReactQueryDevtoolsPanel.d.cts.map