Docs improvements (#888)

* Update docs compilation pipelin and rendering components

* Replaced custom markdown processor for better formatting

* Fix continue links

* Fix <ul> formatting

Author: bvaughn

README.md

@@ -238,8 +238,8 @@ Grid will automatically re-render cells when values in this object change.</p>
     </tr>
     <tr>
       <td>dir</td>
-      <td><p>Corresponds to the HTML dir attribute:
-<a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir">https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir</a></p>
+      <td><p>Indicates the directionality of grid cells.</p>
+<p>ℹ️ See HTML <code>dir</code> <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir">global attribute</a> for more information.</p>
 </td>
     </tr>
     <tr>
@@ -268,8 +268,7 @@ This value is important for server rendering.</p>
     </tr>
     <tr>
       <td>gridRef</td>
-      <td><p>Ref used to interact with this component&#39;s imperative API.</p>
-<p>This API has imperative methods for scrolling and a getter for the outermost DOM element.</p>
+      <td><p>Imperative Grid API.</p>
 <p>ℹ️ The <code>useGridRef</code> and <code>useGridCallbackRef</code> hooks are exported for convenience use in TypeScript projects.</p>
 </td>
     </tr>

lib/components/grid/Grid.tsx

@@ -15,6 +15,9 @@ import type { Align, TagNames } from "../../types";
 import { arePropsEqual } from "../../utils/arePropsEqual";
 import type { GridProps } from "./types";
 
+/**
+ * Renders data with many rows and columns.
+ */
 export function Grid<
   CellProps extends object,
   TagName extends TagNames = "div"

lib/components/grid/types.ts

@@ -85,15 +85,14 @@ export type GridProps<
   defaultWidth?: number;
 
   /**
-   * Corresponds to the HTML dir attribute:
-   * https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir
+   * Indicates the directionality of grid cells.
+   *
+   * ℹ️ See HTML `dir` [global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/dir) for more information.
    */
   dir?: "ltr" | "rtl";
 
   /**
-   * Ref used to interact with this component's imperative API.
-   *
-   * This API has imperative methods for scrolling and a getter for the outermost DOM element.
+   * Imperative Grid API.
    *
    * ℹ️ The `useGridRef` and `useGridCallbackRef` hooks are exported for convenience use in TypeScript projects.
    */
@@ -244,7 +243,7 @@ export type CachedBounds = Map<
  *
  * ℹ️ The `useGridRef` and `useGridCallbackRef` hooks are exported for convenience use in TypeScript projects.
  */
-export type GridImperativeAPI = {
+export interface GridImperativeAPI {
   /**
    * Outermost HTML element for the grid if mounted and null (if not mounted.
    */
@@ -261,7 +260,7 @@ export type GridImperativeAPI = {
    *
    * @throws RangeError if an invalid row or column index is provided
    */
-  scrollToCell({
+  scrollToCell: ({
     behavior,
     columnAlign,
     columnIndex,
@@ -273,7 +272,7 @@ export type GridImperativeAPI = {
     columnIndex: number;
     rowAlign?: "auto" | "center" | "end" | "smart" | "start";
     rowIndex: number;
-  }): void;
+  }) => void;
 
   /**
    * Scrolls the grid so that the specified column is visible.
@@ -284,15 +283,15 @@ export type GridImperativeAPI = {
    *
    * @throws RangeError if an invalid column index is provided
    */
-  scrollToColumn({
+  scrollToColumn: ({
     align,
     behavior,
     index
   }: {
     align?: "auto" | "center" | "end" | "smart" | "start";
     behavior?: "auto" | "instant" | "smooth";
     index: number;
-  }): void;
+  }) => void;
 
   /**
    * Scrolls the grid so that the specified row is visible.
@@ -303,13 +302,13 @@ export type GridImperativeAPI = {
    *
    * @throws RangeError if an invalid row index is provided
    */
-  scrollToRow({
+  scrollToRow: ({
     align,
     behavior,
     index
   }: {
     align?: "auto" | "center" | "end" | "smart" | "start";
     behavior?: "auto" | "instant" | "smooth";
     index: number;
-  }): void;
-};
+  }) => void;
+}

lib/components/list/List.tsx

@@ -18,6 +18,9 @@ import type { ListProps } from "./types";
 
 export const DATA_ATTRIBUTE_LIST_INDEX = "data-react-window-index";
 
+/**
+ * Renders data with many rows.
+ */
 export function List<
   RowProps extends object,
   TagName extends TagNames = "div"

lib/components/list/types.ts

@@ -174,13 +174,11 @@ export type CachedBounds = Map<
 >;
 
 /**
- * Ref used to interact with this component's imperative API.
- *
- * This API has imperative methods for scrolling and a getter for the outermost DOM element.
+ * Imperative List API.
  *
  * ℹ️ The `useListRef` and `useListCallbackRef` hooks are exported for convenience use in TypeScript projects.
  */
-export type ListImperativeAPI = {
+export interface ListImperativeAPI {
   /**
    * Outermost HTML element for the list if mounted and null (if not mounted.
    */
@@ -195,13 +193,13 @@ export type ListImperativeAPI = {
    *
    * @throws RangeError if an invalid row index is provided
    */
-  scrollToRow({
+  scrollToRow: ({
     align,
     behavior,
     index
   }: {
     align?: "auto" | "center" | "end" | "smart" | "start";
     behavior?: "auto" | "instant" | "smooth";
     index: number;
-  }): void;
-};
+  }) => void;
+}

package.json

@@ -61,6 +61,8 @@
     "@testing-library/jest-dom": "^6.6.4",
     "@testing-library/react": "^16.3.0",
     "@testing-library/user-event": "^14.6.1",
+    "@ts-ast-parser/core": "^0.8.0",
+    "@types/markdown-it": "^14.1.2",
     "@types/node": "^24.2.0",
     "@types/react": "^19.1.8",
     "@types/react-dom": "^19.1.6",
@@ -74,6 +76,7 @@
     "husky": "^9.1.7",
     "jsdom": "^26.1.0",
     "lint-staged": "^16.1.4",
+    "markdown-it": "^14.1.0",
     "marked": "^16.4.1",
     "postcss": "^8.5.6",
     "prettier": "3.6.2",