fix: debug wrapper layout; export TChartGroupLoaderProps

CHANGELOG.md

@@ -10,13 +10,20 @@ This file is not shipped in the npm package — the tarball root is `lib/`, whic
 
 ## [Unreleased]
 
+### Added
+
+-   `TChartGroupLoaderProps` is exported, matching every other component's props type.
+
 ### Fixed
 
 -   The import-time `wasmUrl: "/scichart.wasm"` default could overwrite the app's own
     `SciChartSurface.configure(...)` when chart code is lazy-loaded and `configureDefaults` is
     evaluated after it. The default is now applied only while `SciChartSurface.isWasmConfigured`
     is false, so the app's configuration wins in either order. Requires scichart 6.0.8, which adds
     that flag.
+-   `SciChartMemoryDebugWrapper` rendered its children inside a `position: fixed` box, which
+    collapsed percentage-based sizing and put anything below the fold out of reach of scrolling.
+    The controls are `sticky` now and the children render in normal flow.
 
 ### Changed
 

src/ChartGroupLoader.tsx

@@ -6,7 +6,8 @@ import { SciChartGroup } from "./SciChartGroup";
 import { IInitResult } from "./types";
 
 type TDivProps = DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
-type TChartGroupLoaderProps = TDivProps & {
+/** Props for {@link ChartGroupLoader}: a div's own props, plus the group's loading and init hooks. */
+export type TChartGroupLoaderProps = TDivProps & {
     fallback?: ReactNode | undefined;
     onInit?: (chartInitResults: IInitResult[]) => void;
     onInitError?: (error: any) => void;

src/SciChartMemoryDebugWrapper.tsx

@@ -35,13 +35,17 @@ export function SciChartMemoryDebugWrapper(
 
     return (
         <>
-            <div style={{ position: "fixed", top: 0, left: 0 }}>
+            {/* Sticky rather than fixed, and the children sit outside it. A fixed box with no
+                width shrink-wraps to its content, so children rendered inside it lost their
+                sizing - a chart asking for a percentage width resolved it against the collapsed
+                box - and, being out of flow, anything below the fold could not be scrolled to.
+                Sticky keeps the controls in view while leaving the children in normal flow. */}
+            <div style={{ position: "sticky", top: 0, zIndex: 20, background: "#fff" }}>
                 <input type="checkbox" checked={drawChart} onChange={handleCheckbox} /> Render Child Components Tree
                 <br />
                 <input type="button" onClick={handleClick} value="Log Object Registry State"></input>
-                <br />
-                {drawChart ? props.children : null}
             </div>
+            {drawChart ? props.children : null}
         </>
     );
 }

src/index.ts

@@ -1,4 +1,5 @@
 // This file is generated by generate-exports-file.ts script, do not edit it manually!
+export type { TChartGroupLoaderProps } from "./ChartGroupLoader";
 export { ChartGroupLoader } from "./ChartGroupLoader";
 export { DefaultFallback } from "./DefaultFallback";
 export { SciChartReact } from "./SciChart";