@atlaskit/editor-common/dist/types-ts4.5/hooks/useSharedPluginState.d.ts

A package that contains common classes and components for editor and renderer

import type { BasePluginDependenciesAPI, EditorInjectionAPI, ExtractInjectionAPI, ExtractPluginSharedState, NextEditorPlugin, NextEditorPluginMetadata } from '../types/next-editor-plugin';
export type NamedPluginStatesFromInjectionAPI<API extends ExtractInjectionAPI<NextEditorPlugin<any, any>>, PluginNames extends string | number | symbol> = Readonly<{
    [K in PluginNames as `${K extends string ? K : never}State`]: API[K] extends BasePluginDependenciesAPI<any> | undefined ? Exclude<API[K], undefined> extends BasePluginDependenciesAPI<infer Metadata> ? Metadata extends NextEditorPluginMetadata ? ExtractPluginSharedState<Metadata> | undefined : never : never : never;
}>;
export type ExtractPluginNames<API extends EditorInjectionAPI<any, any>> = keyof API;
type Options = {
    disabled?: boolean;
};
/**
 *
 * NOTE: Generally you want to use `useSharedPluginStateWithSelector` over this which behaves similarly
 * but selects a slice of the state which is more performant.
 *
 * ⚠️⚠️⚠️ This is a debounced hook ⚠️⚠️⚠️
 * If the plugins you are listening to generate multiple shared states while the user is typing,
 * your React Component will get only the last one.
 *
 * Usually, for UI updates, you may need only the last state. But, if you have a specific scenario requiring you to access all states,
 * do not use this hook. Instead, you can subscribe directly to the plugin sharedState API:
 *
 * ```typescript
 *
 * function ExampleSpecialCase({ api }: Props) {
 *   const [dogState, setDogState] = React.useState(null);
 *   useEffect(() => {
 *     const unsub = api.dog.sharedState.onChange(({ nextSharedState, prevSharedState }) => {
 *        setDogState(nextSharedState);
 *     });
 *
 *     return unsub;
 *   }, [api]);
 *
 *   useEffect(() => {
 *    someCriticalAndWeirdUseCase(dogState);
 *
 *   }, [dogState]);
 *
 *   return null;
 * }
 *
 * ```
 *
 * Used to return the current plugin state of
 * input dependencies
 *
 * Example in plugin:
 *
 * ```typescript
 * function ExampleContent({ api }: Props) {
 *   const { dogState, exampleState } = useSharedPluginState(
 *     api,
 *     ['dog', 'example']
 *   )
 *   return <p>{ dogState.title } { exampleState.description }</p>
 * }
 *
 * const examplePlugin: NextEditorPlugin<'example', { dependencies: [typeof pluginDog] }> = ({ api }) => {
 *   return {
 *     name: 'example',
 *     contentComponent: () =>
 *       <ExampleContent
 *         api={api}
 *         />
 *   }
 * }
 * ```
 *
 * @param injectionApi Plugin injection API from `NextEditorPlugin`
 * @param plugins Plugin names to get the shared plugin state for
 * @param options The useSharedPluginState options
 * @returns A corresponding object, the keys are names of the plugin with `State` appended,
 * the values are the shared state exposed by that plugin.
 */
export declare function useSharedPluginState<API extends EditorInjectionAPI<any, any>, PluginNames extends ExtractPluginNames<API>>(injectionApi: API | null | undefined, plugins: PluginNames[], options?: Options): NamedPluginStatesFromInjectionAPI<API, PluginNames>;
export {};