docs(changeset): Added selectFirstRowOnMount and fixed selection of first row

src/Gridler/components/GridlerStore.tsx

@@ -56,7 +56,6 @@ export type FilterOptionOperator =
   | 'startswith';
 
 export interface GridlerProps extends PropsWithChildren {
-  askAPIRowNumber?: (key: string) => Promise<number>;
   columns?: GridlerColumns;
 
   defaultSort?: Array<SortOption>;
@@ -99,13 +98,14 @@ export interface GridlerProps extends PropsWithChildren {
     top?: React.ReactNode;
   };
   selectedRow?: number;
+  selectFirstRowOnMount?: boolean;
   selectMode?: 'cell' | 'row';
   showMenu?: (id: string, options?: Partial<MantineBetterMenuInstance>) => void;
   title?: string;
   tooltipBarProps?: React.HTMLAttributes<HTMLDivElement>;
   total_rows?: number;
   uniqueid: string;
-  useAPIQuery?: (index: number) => Promise<Array<Record<string, any>>>;
+
   values?: Array<Record<string, any>>;
   width?: number | string;
 }
@@ -124,13 +124,14 @@ export interface GridlerState {
   _visiblePages: Rectangle;
 
   addError: (err: string, ...args: Array<any>) => void;
+  askAPIRowNumber?: (key: string) => Promise<number>;
   colFilters?: Array<FilterOption>;
   colOrder?: Record<string, number>;
   colSize?: Record<string, number>;
   colSort?: Array<SortOption>;
   data?: Array<any>;
-
   errors: Array<string>;
+
   focused?: boolean;
   get: () => GridlerState;
   getCellContent: (cell: Item) => GridCell;
@@ -140,8 +141,8 @@ export interface GridlerState {
   ) => CellArray | GetCellsThunk;
   getRowBuffer: (row: number) => Record<string, any>;
   getState: <K extends keyof GridlerStoreState>(key: K) => GridlerStoreState[K];
-
   hasLocalData: boolean;
+
   loadingData?: boolean;
   loadPage: (page: number, clearMode?: 'all' | 'page') => Promise<void>;
   mounted: boolean;
@@ -159,7 +160,6 @@ export interface GridlerState {
   onHeaderClicked: (colIndex: number, event: HeaderClickedEventArgs) => void;
   onHeaderMenuClick: (col: number, screenPosition: Rectangle) => void;
   onItemHovered: (args: GridMouseEventArgs) => void;
-
   onVisibleRegionChanged: (
     r: Rectangle,
     tx: number,
@@ -172,6 +172,7 @@ export interface GridlerState {
   ) => void;
 
   pageSize: number;
+
   ready: boolean;
   reload?: () => Promise<void>;
   renderColumns?: GridlerColumns;
@@ -184,6 +185,7 @@ export interface GridlerState {
     value: (current: GridlerStoreState[K]) => Partial<GridlerStoreState[K]>
   ) => Promise<void>;
   toCell: <TRowType extends Record<string, string>>(row: TRowType, col: number) => GridCell;
+  useAPIQuery?: (index: number) => Promise<Array<Record<string, any>>>;
 }
 
 export type GridlerStoreState = GridlerProps & GridlerState;
@@ -842,6 +844,11 @@ const { Provider, useStore: useGridlerStore } = createSyncStore<GridlerStoreStat
 
         if (rowIndex > 0) {
           ref.scrollTo(0, rowIndex);
+          getState('_events').dispatchEvent(
+            new CustomEvent('selectedRowFound', {
+              detail: { rowNumber: rowIndex, selectedRow: selectedRow },
+            })
+          );
         } else if (typeof askAPIRowNumber === 'function') {
           askAPIRowNumber(String(selectedRow))
             .then((r) => {
@@ -868,6 +875,7 @@ const { Provider, useStore: useGridlerStore } = createSyncStore<GridlerStoreStat
     return {
       ...props,
 
+      colSort: props.defaultSort ?? getState('colSort') ?? [],
       hideMenu: props.hideMenu ?? menus.hide,
       showMenu: props.showMenu ?? menus.show,
       total_rows: props.total_rows ?? getState('total_rows') ?? 0,