Merge pull request #14 from krjakbrjak/VNI-docs

Docs

.github/workflows/main.yml

@@ -24,4 +24,3 @@ jobs:
     - run: yarn install
     - run: yarn build --if-present -- --env production
     - run: yarn test
-    - run: yarn jsdoc:gen

package.json

@@ -18,7 +18,6 @@
     "homepage": "https://github.com/krjakbrjak/virtualtable#readme",
     "main": "dist/index.js",
     "dependencies": {
-        "@types/react-bootstrap": "^0.32.35",
         "bootstrap": "^5.3.2",
         "normalize.css": "^8.0.1",
         "prop-types": "^15.8.1",
@@ -43,7 +42,6 @@
         "@types/react": "^18.2.37",
         "@types/react-dom": "^18.2.15",
         "babel-loader": "^9.1.3",
-        "better-docs": "^2.7.2",
         "css-loader": "^6.8.1",
         "eslint": "^8.53.0",
         "eslint-config-airbnb": "^19.0.4",
@@ -53,7 +51,6 @@
         "eslint-webpack-plugin": "^4.0.1",
         "identity-obj-proxy": "^3.0.0",
         "jest": "^29.7.0",
-        "jsdoc": "^4.0.2",
         "sinon": "^17.0.1",
         "style-loader": "^3.3.3",
         "ts-jest": "^29.1.1",

src/VirtualTable.tsx

@@ -81,19 +81,23 @@ function reducer<Type>(state: State<Type>, action: Action<Type>): State<Type> {
  */
 
 /**
- * @description VirtualTable component.
- *
- * Displays a large set of data (with a low memory usage).
- *
- * @param {VirtualTable.Props} props Properties
- * @component
+ * Represent the rectangular.
  */
 interface Rect {
     x: number;
     y: number;
     height: number;
     width: number;
 }
+
+/**
+ * @description VirtualTable component.
+ *
+ * Displays a large set of data (with a low memory usage).
+ *
+ * @param {VirtualTable.Props} props Properties
+ * @component
+ */
 export default function VirtualTable<Type>({ height, renderer, fetcher, style }: Args<Type>): JSX.Element {
     const ref = useRef(null);
     const [collection, setCollection] = useState<LazyPaginatedCollection<Type>>(new LazyPaginatedCollection<Type>(1, fetcher));

src/helpers/LazyPaginatedCollection.ts

@@ -33,7 +33,7 @@ export class LazyPaginatedCollection<Type> {
      * Constructs a new collection.
      *
      * @param {number} pageSize Page size
-     * @param {LazyPaginatedCollection.retrieve} retrieve A callback to fetch the data
+     * @param {Fetcher<Type>} retrieve A callback to fetch the data
      */
     constructor(pageSize: number, retrieve: Fetcher<Type>) {
         this.#pageOffsets = {};

src/helpers/collections.ts

@@ -1,11 +1,15 @@
 /**
+ * Represent a page.
  * @typedef {Object} Slice
- * @property {number} offset An offset (the index of the first item in the slice)
- * @property {Array.Object} items Items
  */
-
 interface Page<Type> {
+    /**
+     * Page items
+     */
     items: Array<Type>;
+    /**
+     * An offset (the index of the first item in the slice)
+     */
     offset: number;
 }
 

src/helpers/types.ts

@@ -1,13 +1,46 @@
+/**
+ * Represents the result of the fetch.
+ */
 export interface Result<Type> {
+    /**
+     * The starting index to fetch the items.
+     */
     from: number;
+    /**
+     * An array of fetched items.
+     */
     items: Array<Type>;
+    /**
+     * Total number of items that can be retrieved.
+     */
     totalCount: number;
 }
 
+/**
+ * A callback function to fetch the items.
+ * 
+ * @typedef {Function} Fetcher
+ * @template Type - The type of the element to be returned from the function.
+ * @param {number} index - The strating index to fetch items.
+ * @param {number} count - The number of items to fetch.
+ * @returns {Promise<Result<Type>>} - A promise holding the result of the fetch.
+ */
 export type Fetcher<Type> = (index: number, count: number) => Promise<Result<Type>>;
 
+/**
+ * Represents the style of the item in the table.
+ */
 export interface Style {
+    /**
+     * Class that will be added to the item when it is hovered.
+     */
     hover: string;
+    /**
+     * Class that will be added to the item when it is selected.
+     */
     select: string;
+    /**
+     * Class that will be added to each item.
+     */
     item: string;
 }