feat: add renderPluginLoader property (#184)

gravity-ui · Jun 30, 2023 · 3955d2f · 3955d2f
1 parent 7d8f894
commit 3955d2f
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 11 deletions.
diff --git a/src/components/ChartKit.tsx b/src/components/ChartKit.tsx
@@ -17,7 +17,7 @@ type ChartKitComponentProps<T extends ChartKitType> = Omit<ChartKitProps<T>, 'on
 
 const ChartKitComponent = <T extends ChartKitType>(props: ChartKitComponentProps<T>) => {
     const widgetRef = React.useRef<ChartKitWidgetRef>();
-    const {instanceRef, id: propsId, type, isMobile, ...restProps} = props;
+    const {instanceRef, id: propsId, type, isMobile, renderPluginLoader, ...restProps} = props;
 
     const ckId = React.useMemo(() => getRandomCKId(), []);
     const id = propsId || ckId;
@@ -48,7 +48,7 @@ const ChartKitComponent = <T extends ChartKitType>(props: ChartKitComponentProps
     );
 
     return (
-        <React.Suspense fallback={<Loader />}>
+        <React.Suspense fallback={renderPluginLoader?.() || <Loader />}>
             <div className={b({mobile: isMobile}, 'chartkit-theme_common')}>
                 <ChartComponent ref={widgetRef} id={id} lang={lang} {...restProps} />
             </div>

diff --git a/src/types/index.ts b/src/types/index.ts
@@ -38,18 +38,16 @@ export type ChartKitProps<T extends ChartKitType> = {
     id?: string;
     isMobile?: boolean;
     onLoad?: (data?: ChartKitOnLoadData<T>) => void;
-    /**
-     * called on each render
-     * @param data
-     */
+    /** Fires on each chartkit plugin's component render */
     onRender?: (data: ChartKitOnRenderData) => void;
-    /**
-     * called on chart mount
-     * @param data
-     */
+    /** Fires on chartkit plugin's component mount */
     onChartLoad?: (data: ChartKitOnChartLoad<T>) => void;
-    renderError?: RenderError;
+    /** Fires in case of unhandled plugin's exception */
     onError?: ChartKitOnError;
+    /** Used to render user's error component */
+    renderError?: RenderError;
+    /** Used to render user's plugin loader component */
+    renderPluginLoader?: () => React.ReactNode;
 } & {[key in keyof Omit<ChartKitWidget[T], 'data' | 'widget'>]: ChartKitWidget[T][key]};
 
 export type ChartKitPlugin = {