tinybase 9.0.0 → 9.1.0-beta.1

package/@types/common/index.d.ts

@@ -83,11 +83,26 @@ export type ParameterizedCallback<Parameter> = (parameter?: Parameter) => void;
 export type Callback = () => void;
 
 /**
- * The SortKey type represents a value that can be used by a sort function.
+ * The SortKey type represents a Cell value, or `undefined`, that can be used by
+ * a sort function.
  * @category Parameter
  * @since v1.0.0
  */
-export type SortKey = string | number | boolean | null;
+export type SortKey = CellOrUndefined;
+
+/**
+ * The Sorter type represents a function that compares two SortKey values.
+ *
+ * A Sorter is provided to methods that sort Row Ids when the default
+ * alphanumeric ordering is not appropriate. Return a positive or negative
+ * number to indicate which of the two SortKey values should be ordered first.
+ * @param sortKey1 The first item of the pair to compare.
+ * @param sortKey2 The second item of the pair to compare.
+ * @returns A number indicating how to sort the pair.
+ * @category Parameter
+ * @since v9.1.0
+ */
+export type Sorter = (sortKey1: SortKey, sortKey2: SortKey) => number;
 
 /**
  * The GetNow type is used to represent a function that returns the current time

package/@types/common/with-schemas/index.d.ts

@@ -95,11 +95,27 @@ export type ParameterizedCallback<Parameter> = (parameter?: Parameter) => void;
 export type Callback = () => void;
 
 /**
- * The SortKey type represents a value that can be used by a sort function.
+ * The SortKey type represents a Cell value, or `undefined`, that can be used by
+ * a sort function.
  * @category Parameter
  * @since v1.0.0
  */
-export type SortKey = string | number | boolean;
+export type SortKey =
+  string | number | boolean | null | AnyObject | AnyArray | undefined;
+
+/**
+ * The Sorter type represents a function that compares two SortKey values.
+ *
+ * A Sorter is provided to methods that sort Row Ids when the default
+ * alphanumeric ordering is not appropriate. Return a positive or negative
+ * number to indicate which of the two SortKey values should be ordered first.
+ * @param sortKey1 The first item of the pair to compare.
+ * @param sortKey2 The second item of the pair to compare.
+ * @returns A number indicating how to sort the pair.
+ * @category Parameter
+ * @since v9.1.0
+ */
+export type Sorter = (sortKey1: SortKey, sortKey2: SortKey) => number;
 
 /**
  * The GetNow type is used to represent a function that returns the current time

package/@types/store/index.d.ts

@@ -18,6 +18,7 @@ import type {
   IdOrNull,
   Ids,
   Json,
+  Sorter,
 } from '../common/index.d.ts';
 
 /**
@@ -625,7 +626,7 @@ export type DoRollback = (store: Store) => boolean;
  * the getSortedRowIds method.
  *
  * It's an object containing the Id of the Table in the Store, and optional
- * `cellId`, `descending`, `offset`, and `limit` parameters. See the
+ * `cellId`, `descending`, `offset`, `limit`, and `sorter` parameters. See the
  * getSortedRowIds method for specific examples.
  * @category Store
  * @since v6.1.0
@@ -662,6 +663,13 @@ export type SortedRowIdsArgs = {
    * @since v6.1.0
    */
   limit?: number;
+  /**
+   * A custom function for comparing the sorting values, defaulting to the
+   * defaultSorter function.
+   * @category Argument
+   * @since v9.1.0
+   */
+  sorter?: Sorter;
 };
 
 /**
@@ -2196,10 +2204,11 @@ export interface Store {
    * The getSortedRowIds method returns the Ids of every Row in a given Table,
    * sorted according to the values in a specified Cell.
    *
-   * The sorting of the rows is alphanumeric, and you can indicate whether it
-   * should be in descending order. The `offset` and `limit` parameters are used
-   * to paginate results, but default to `0` and `undefined` to return all
-   * available Row Ids if not specified.
+   * By default the sorting of the rows is alphanumeric, and you can indicate
+   * whether it should be in descending order. The `offset` and `limit`
+   * parameters are used to paginate results, but default to `0` and
+   * `undefined` to return all available Row Ids if not specified. The `sorter`
+   * parameter can provide a custom comparison function.
    *
    * Note that every call to this method will perform the sorting afresh - there
    * is no caching of the results - and so you are advised to memoize the
@@ -2216,6 +2225,8 @@ export interface Store {
    * any.
    * @param limit The maximum number of Row Ids to return, or `undefined` for
    * all.
+   * @param sorter A custom function for comparing the sorting values, or
+   * `undefined` to use the defaultSorter function.
    * @returns An array of the sorted Ids of appropriate Rows in the Table.
    * @example
    * This example retrieves sorted Row Ids in a Table.
@@ -2287,6 +2298,24 @@ export interface Store {
    * // -> ['cujo', 'felix', 'fido']
    * ```
    * @example
+   * This example retrieves Row Ids sorted numerically by their own value.
+   *
+   * ```js
+   * import {createStore} from 'tinybase';
+   *
+   * const store = createStore();
+   * ['1', '10', '2'].forEach((rowId) =>
+   *   store.setRow('pets', rowId, {sold: false}),
+   * );
+   * const numericSorter = (sortKey1, sortKey2) =>
+   *   Number(sortKey1) - Number(sortKey2);
+   *
+   * console.log(
+   *   store.getSortedRowIds({tableId: 'pets', sorter: numericSorter}),
+   * );
+   * // -> ['1', '2', '10']
+   * ```
+   * @example
    * This example retrieves the sorted Row Ids of a Table that does not exist,
    * returning an empty array.
    *
@@ -2306,13 +2335,14 @@ export interface Store {
     descending?: boolean,
     offset?: number,
     limit?: number,
+    sorter?: Sorter,
   ): Ids;
 
   /**
    * When called with one object argument, the getSortedRowIds method
    * destructures it to make it easier to skip optional parameters.
    * @param args A SortedRowIdsArgs object containing the Id of the Table in the
-   * Store, and optional `cellId`, `descending`, `offset`, and `limit`
+   * Store, and optional `cellId`, `descending`, `offset`, `limit`, and `sorter`
    * parameters.
    * @returns An array of the sorted Ids of appropriate Rows in the Table.
    * @example
@@ -5813,7 +5843,7 @@ export interface Store {
    * addSortedRowIdsListener method destructures it to make it easier to skip
    * optional parameters.
    * @param args A SortedRowIdsArgs object containing the Id of the Table in the
-   * Store, and optional `cellId`, `descending`, `offset`, and `limit`
+   * Store, and optional `cellId`, `descending`, `offset`, `limit`, and `sorter`
    * parameters.
    * @param listener The function that will be called whenever the sorted Row
    * Ids in the Table change.

package/@types/store/with-schemas/index.d.ts

@@ -29,6 +29,7 @@ import type {
   IdOrNull,
   Ids,
   Json,
+  Sorter,
 } from '../../common/with-schemas/index.d.ts';
 
 /**
@@ -947,7 +948,7 @@ export type DoRollback<Schemas extends OptionalSchemas> = (
  * the getSortedRowIds method.
  *
  * It's an object containing the Id of the Table in the Store, and optional
- * `cellId`, `descending`, `offset`, and `limit` parameters. See the
+ * `cellId`, `descending`, `offset`, `limit`, and `sorter` parameters. See the
  * getSortedRowIds method for specific examples.
  * @category Store
  * @since v6.1.0
@@ -989,6 +990,13 @@ export type SortedRowIdsArgs<
    * @since v6.1.0
    */
   limit?: number;
+  /**
+   * A custom function for comparing the sorting values, defaulting to the
+   * defaultSorter function.
+   * @category Argument
+   * @since v9.1.0
+   */
+  sorter?: Sorter;
 };
 
 /**
@@ -3216,13 +3224,15 @@ export interface Store<in out Schemas extends OptionalSchemas> {
    *   descending?: boolean,
    *   offset?: number,
    *   limit?: number,
+   *   sorter?: Sorter,
    * ): Ids;
    * ```
    *
-   * The sorting of the rows is alphanumeric, and you can indicate whether it
-   * should be in descending order. The `offset` and `limit` parameters are used
-   * to paginate results, but default to `0` and `undefined` to return all
-   * available Row Ids if not specified.
+   * By default the sorting of the rows is alphanumeric, and you can indicate
+   * whether it should be in descending order. The `offset` and `limit`
+   * parameters are used to paginate results, but default to `0` and
+   * `undefined` to return all available Row Ids if not specified. The `sorter`
+   * parameter can provide a custom comparison function.
    *
    * Note that every call to this method will perform the sorting afresh - there
    * is no caching of the results - and so you are advised to memoize the
@@ -3239,6 +3249,8 @@ export interface Store<in out Schemas extends OptionalSchemas> {
    * any.
    * @param limit The maximum number of Row Ids to return, or `undefined` for
    * all.
+   * @param sorter A custom function for comparing the sorting values, or
+   * `undefined` to use the defaultSorter function.
    * @returns An array of the sorted Ids of appropriate Rows in the Table.
    * @example
    * This example retrieves sorted Row Ids in a Table.
@@ -3310,6 +3322,24 @@ export interface Store<in out Schemas extends OptionalSchemas> {
    * // -> ['cujo', 'felix', 'fido']
    * ```
    * @example
+   * This example retrieves Row Ids sorted numerically by their own value.
+   *
+   * ```js
+   * import {createStore} from 'tinybase';
+   *
+   * const store = createStore();
+   * ['1', '10', '2'].forEach((rowId) =>
+   *   store.setRow('pets', rowId, {sold: false}),
+   * );
+   * const numericSorter = (sortKey1, sortKey2) =>
+   *   Number(sortKey1) - Number(sortKey2);
+   *
+   * console.log(
+   *   store.getSortedRowIds({tableId: 'pets', sorter: numericSorter}),
+   * );
+   * // -> ['1', '2', '10']
+   * ```
+   * @example
    * This example retrieves the sorted Row Ids of a Table that does not exist,
    * returning an empty array.
    *
@@ -3329,13 +3359,14 @@ export interface Store<in out Schemas extends OptionalSchemas> {
     descending?: boolean,
     offset?: number,
     limit?: number,
+    sorter?: Sorter,
   ): Ids;
 
   /**
    * When called with one object argument, the getSortedRowIds method
    * destructures it to make it easier to skip optional parameters.
    * @param args A SortedRowIdsArgs object containing the Id of the Table in the
-   * Store, and optional `cellId`, `descending`, `offset`, and `limit`
+   * Store, and optional `cellId`, `descending`, `offset`, `limit`, and `sorter`
    * parameters.
    * @returns An array of the sorted Ids of appropriate Rows in the Table.
    * @example
@@ -7295,7 +7326,7 @@ export interface Store<in out Schemas extends OptionalSchemas> {
    * addSortedRowIdsListener method destructures it to make it easier to skip
    * optional parameters.
    * @param args A SortedRowIdsArgs object containing the Id of the Table in the
-   * Store, and optional `cellId`, `descending`, `offset`, and `limit`
+   * Store, and optional `cellId`, `descending`, `offset`, `limit`, and `sorter`
    * parameters.
    * @param listener The function that will be called whenever the sorted Row
    * Ids in the Table change.

package/@types/ui-react/index.d.ts

@@ -36,6 +36,7 @@ import type {
   IdOrNull,
   Ids,
   ParameterizedCallback,
+  Sorter,
 } from '../common/index.d.ts';
 import type {
   Indexes,
@@ -1797,6 +1798,7 @@ export function useSortedRowIds(
   descending?: boolean,
   offset?: number,
   limit?: number,
+  sorterOrStoreOrStoreId?: Sorter | StoreOrStoreId,
   storeOrStoreId?: StoreOrStoreId,
 ): Ids;
 
@@ -1804,7 +1806,8 @@ export function useSortedRowIds(
  * When called with an object as the first argument, the useSortedRowIds method
  * destructures it to make it easier to skip optional parameters.
  * @param args A SortedRowIdsArgs object containing the Id of the Table in the
- * Store, and optional `cellId`, `descending`, `offset`, and `limit` parameters.
+ * Store, and optional `cellId`, `descending`, `offset`, `limit`, and `sorter`
+ * parameters.
  * @param storeOrStoreId The Store to be accessed: omit for the default context
  * Store, provide an Id for a named context Store, or provide an explicit
  * reference.
@@ -5178,7 +5181,8 @@ export function useSortedRowIdsListener(
  * When called with an object as the first argument, the useSortedRowIds method
  * destructures it to make it easier to skip optional parameters.
  * @param args A SortedRowIdsArgs object containing the Id of the Table in the
- * Store, and optional `cellId`, `descending`, `offset`, and `limit` parameters.
+ * Store, and optional `cellId`, `descending`, `offset`, `limit`, and `sorter`
+ * parameters.
  * @param listener The function that will be called whenever the sorted Row Ids
  * in the Table change.
  * @param listenerDeps An optional array of dependencies for the `listener`

package/@types/ui-react/with-schemas/index.d.ts

@@ -82,6 +82,7 @@ import type {
   IdOrNull,
   Ids,
   ParameterizedCallback,
+  Sorter,
 } from '../../common/with-schemas/index.d.ts';
 import type {
   Indexes,
@@ -1901,6 +1902,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *   descending?: boolean,
  *   offset?: number,
  *   limit?: number,
+ *   sorterOrStoreOrStoreId?: Sorter | StoreOrStoreId,
  *   storeOrStoreId?: StoreOrStoreId,
  * ): Ids;
  * ```
@@ -2032,6 +2034,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
       descending?: boolean,
       offset?: number,
       limit?: number,
+      sorterOrStoreOrStoreId?: Sorter | StoreOrStoreId<Schemas>,
       storeOrStoreId?: StoreOrStoreId<Schemas>,
     ): Ids;
 
@@ -2039,7 +2042,8 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  * When called with an object as the first argument, the useSortedRowIds method
  * destructures it to make it easier to skip optional parameters.
  * @param args A SortedRowIdsArgs object containing the Id of the Table in the
- * Store, and optional `cellId`, `descending`, `offset`, and `limit` parameters.
+ * Store, and optional `cellId`, `descending`, `offset`, `limit`, and `sorter`
+ * parameters.
  * @param storeOrStoreId The Store to be accessed: omit for the default context
  * Store, provide an Id for a named context Store, or provide an explicit
  * reference.
@@ -5957,7 +5961,8 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  * When called with an object as the first argument, the useSortedRowIds method
  * destructures it to make it easier to skip optional parameters.
  * @param args A SortedRowIdsArgs object containing the Id of the Table in the
- * Store, and optional `cellId`, `descending`, `offset`, and `limit` parameters.
+ * Store, and optional `cellId`, `descending`, `offset`, `limit`, and `sorter`
+ * parameters.
  * @param listener The function that will be called whenever the sorted Row Ids
  * in the Table change.
  * @param listenerDeps An optional array of dependencies for the `listener`

package/@types/ui-react-dom/index.d.ts

@@ -692,7 +692,7 @@ export type SortedTablePaginatorProps = {
  *
  * See the <TableInHtmlTable /> (React) demo for this component in action:
  *
- * ![TableInHtmlTable example](https://tinybase.org/shots/tableinhtmltable-react-demo.png
+ * ![TableInHtmlTable example](https://beta.tinybase.org/shots/tableinhtmltable-react-demo.png
  * "TableInHtmlTable example")
  *
  * The component's props identify which Table to render based on Table Id, and
@@ -838,7 +838,7 @@ export function TableInHtmlTable(
  * See the <SortedTableInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![SortedTableInHtmlTable example](https://tinybase.org/shots/sortedtableinhtmltable-react-demo.png
+ * ![SortedTableInHtmlTable example](https://beta.tinybase.org/shots/sortedtableinhtmltable-react-demo.png
  * "SortedTableInHtmlTable example")
  *
  * The component's props identify which Table to render based on Table Id, and
@@ -1011,7 +1011,7 @@ export function SortedTableInHtmlTable(
  *
  * See the <ValuesInHtmlTable /> (React) demo for this component in action:
  *
- * ![ValuesInHtmlTable example](https://tinybase.org/shots/valuesinhtmltable-react-demo.png
+ * ![ValuesInHtmlTable example](https://beta.tinybase.org/shots/valuesinhtmltable-react-demo.png
  * "ValuesInHtmlTable example")
  *
  * The component's props identify which Row to render based on Table Id, Row Id,
@@ -1142,7 +1142,7 @@ export function ValuesInHtmlTable(
  *
  * See the <SliceInHtmlTable /> (React) demo for this component in action:
  *
- * ![SliceInHtmlTable example](https://tinybase.org/shots/sliceinhtmltable-react-demo.png
+ * ![SliceInHtmlTable example](https://beta.tinybase.org/shots/sliceinhtmltable-react-demo.png
  * "SliceInHtmlTable example")
  *
  * The component's props identify which Slice to render based on Index Id, Slice
@@ -1300,7 +1300,7 @@ export function SliceInHtmlTable(
  * See the <RelationshipInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![RelationshipInHtmlTable example](https://tinybase.org/shots/relationshipinhtmltable-react-demo.png
+ * ![RelationshipInHtmlTable example](https://beta.tinybase.org/shots/relationshipinhtmltable-react-demo.png
  * "RelationshipInHtmlTable example")
  *
  * The component's props identify which Relationship to render based on
@@ -1478,7 +1478,7 @@ export function RelationshipInHtmlTable(
  * See the <ResultTableInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![ResultTableInHtmlTable example](https://tinybase.org/shots/resulttableinhtmltable-react-demo.png
+ * ![ResultTableInHtmlTable example](https://beta.tinybase.org/shots/resulttableinhtmltable-react-demo.png
  * "ResultTableInHtmlTable example")
  *
  * The component's props identify which ResultTable to render based on query Id,
@@ -1631,7 +1631,7 @@ export function ResultTableInHtmlTable(
  * See the <ResultSortedTableInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![ResultSortedTableInHtmlTable example](https://tinybase.org/shots/resultsortedtableinhtmltable-react-demo.png
+ * ![ResultSortedTableInHtmlTable example](https://beta.tinybase.org/shots/resultsortedtableinhtmltable-react-demo.png
  * "ResultSortedTableInHtmlTable example")
  *
  * The component's props identify which ResultTable to render based on query Id,
@@ -1805,7 +1805,7 @@ export function ResultSortedTableInHtmlTable(
  *
  * See the <EditableCellView /> (React) demo for this component in action:
  *
- * ![EditableCellView example](https://tinybase.org/shots/editablecellview-react-demo.png
+ * ![EditableCellView example](https://beta.tinybase.org/shots/editablecellview-react-demo.png
  * "EditableCellView example")
  *
  * The component's props identify which Cell to render based on Table Id, Row
@@ -1876,7 +1876,7 @@ export function EditableCellView(
  *
  * See the <EditableValueView /> (React) demo for this component in action:
  *
- * ![EditableValueView example](https://tinybase.org/shots/editablevalueview-react-demo.png
+ * ![EditableValueView example](https://beta.tinybase.org/shots/editablevalueview-react-demo.png
  * "EditableValueView example")
  *
  * The component's props identify which Value to render based on Table Id, Row
@@ -1947,7 +1947,7 @@ export function EditableValueView(
  * See the <SortedTableInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![SortedTablePaginator example](https://tinybase.org/shots/sortedtablepaginator-react-demo.png
+ * ![SortedTablePaginator example](https://beta.tinybase.org/shots/sortedtablepaginator-react-demo.png
  * "SortedTablePaginator example")
  *
  * The component displays 'previous' and 'next' buttons for paging through the

package/@types/ui-react-dom/with-schemas/index.d.ts

@@ -668,7 +668,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the <TableInHtmlTable /> (React) demo for this component in action:
  *
- * ![TableInHtmlTable example](https://tinybase.org/shots/tableinhtmltable-react-demo.png
+ * ![TableInHtmlTable example](https://beta.tinybase.org/shots/tableinhtmltable-react-demo.png
  * "TableInHtmlTable example")
  *
  * The component's props identify which Table to render based on Table Id, and
@@ -822,7 +822,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  * See the <SortedTableInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![SortedTableInHtmlTable example](https://tinybase.org/shots/sortedtableinhtmltable-react-demo.png
+ * ![SortedTableInHtmlTable example](https://beta.tinybase.org/shots/sortedtableinhtmltable-react-demo.png
  * "SortedTableInHtmlTable example")
  *
  * The component's props identify which Table to render based on Table Id, and
@@ -1003,7 +1003,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the <ValuesInHtmlTable /> (React) demo for this component in action:
  *
- * ![ValuesInHtmlTable example](https://tinybase.org/shots/valuesinhtmltable-react-demo.png
+ * ![ValuesInHtmlTable example](https://beta.tinybase.org/shots/valuesinhtmltable-react-demo.png
  * "ValuesInHtmlTable example")
  *
  * The component's props identify which Row to render based on Table Id, Row Id,
@@ -1142,7 +1142,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the <SliceInHtmlTable /> (React) demo for this component in action:
  *
- * ![SliceInHtmlTable example](https://tinybase.org/shots/sliceinhtmltable-react-demo.png
+ * ![SliceInHtmlTable example](https://beta.tinybase.org/shots/sliceinhtmltable-react-demo.png
  * "SliceInHtmlTable example")
  *
  * The component's props identify which Slice to render based on Index Id, Slice
@@ -1308,7 +1308,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  * See the <RelationshipInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![RelationshipInHtmlTable example](https://tinybase.org/shots/relationshipinhtmltable-react-demo.png
+ * ![RelationshipInHtmlTable example](https://beta.tinybase.org/shots/relationshipinhtmltable-react-demo.png
  * "RelationshipInHtmlTable example")
  *
  * The component's props identify which Relationship to render based on
@@ -1494,7 +1494,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  * See the <ResultTableInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![ResultTableInHtmlTable example](https://tinybase.org/shots/resulttableinhtmltable-react-demo.png
+ * ![ResultTableInHtmlTable example](https://beta.tinybase.org/shots/resulttableinhtmltable-react-demo.png
  * "ResultTableInHtmlTable example")
  *
  * The component's props identify which ResultTable to render based on query Id,
@@ -1655,7 +1655,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  * See the <ResultSortedTableInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![ResultSortedTableInHtmlTable example](https://tinybase.org/shots/resultsortedtableinhtmltable-react-demo.png
+ * ![ResultSortedTableInHtmlTable example](https://beta.tinybase.org/shots/resultsortedtableinhtmltable-react-demo.png
  * "ResultSortedTableInHtmlTable example")
  *
  * The component's props identify which ResultTable to render based on query Id,
@@ -1837,7 +1837,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the <EditableCellView /> (React) demo for this component in action:
  *
- * ![EditableCellView example](https://tinybase.org/shots/editablecellview-react-demo.png
+ * ![EditableCellView example](https://beta.tinybase.org/shots/editablecellview-react-demo.png
  * "EditableCellView example")
  *
  * The component's props identify which Cell to render based on Table Id, Row
@@ -1922,7 +1922,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the <EditableValueView /> (React) demo for this component in action:
  *
- * ![EditableValueView example](https://tinybase.org/shots/editablevalueview-react-demo.png
+ * ![EditableValueView example](https://beta.tinybase.org/shots/editablevalueview-react-demo.png
  * "EditableValueView example")
  *
  * The component's props identify which Value to render based on Table Id, Row
@@ -1993,7 +1993,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  * See the <SortedTableInHtmlTable /> (React) demo for this component in
  * action:
  *
- * ![SortedTablePaginator example](https://tinybase.org/shots/sortedtablepaginator-react-demo.png
+ * ![SortedTablePaginator example](https://beta.tinybase.org/shots/sortedtablepaginator-react-demo.png
  * "SortedTablePaginator example")
  *
  * The component displays 'previous' and 'next' buttons for paging through the

package/@types/ui-react-dom-charts/index.d.ts

@@ -483,7 +483,7 @@ export type YAxisProps = {
  *
  * See the Composing Charts (React) demo for this component in action:
  *
- * ![CartesianChart component example](https://tinybase.org/shots/composing-charts-react-demo.png
+ * ![CartesianChart component example](https://beta.tinybase.org/shots/composing-charts-react-demo.png
  * "CartesianChart component example")
  *
  * The series children declare their own xCellId and yCellId bindings. The
@@ -542,7 +542,7 @@ export function CartesianChart(
  *
  * See the Axis Overrides (React) demo for this component in action:
  *
- * ![XAxis component example](https://tinybase.org/shots/axis-overrides-react-demo.png
+ * ![XAxis component example](https://beta.tinybase.org/shots/axis-overrides-react-demo.png
  * "XAxis component example")
  * @category Store components
  * @since v8.5.0
@@ -558,7 +558,7 @@ export function XAxis(props: XAxisProps): ComponentReturnType;
  *
  * See the Axis Overrides (React) demo for this component in action:
  *
- * ![YAxis component example](https://tinybase.org/shots/axis-overrides-react-demo.png
+ * ![YAxis component example](https://beta.tinybase.org/shots/axis-overrides-react-demo.png
  * "YAxis component example")
  * @category Store components
  * @since v8.5.0
@@ -574,7 +574,7 @@ export function YAxis(props: YAxisProps): ComponentReturnType;
  *
  * See the Composing Charts (React) demo for this component in action:
  *
- * ![LineSeries component example](https://tinybase.org/shots/composing-charts-react-demo.png
+ * ![LineSeries component example](https://beta.tinybase.org/shots/composing-charts-react-demo.png
  * "LineSeries component example")
  * @category Store components
  * @since v8.5.0
@@ -590,7 +590,7 @@ export function LineSeries(props: SeriesProps): ComponentReturnType;
  *
  * See the Composing Charts (React) demo for this component in action:
  *
- * ![BarSeries component example](https://tinybase.org/shots/composing-charts-react-demo.png
+ * ![BarSeries component example](https://beta.tinybase.org/shots/composing-charts-react-demo.png
  * "BarSeries component example")
  * @category Store components
  * @since v8.5.0
@@ -607,7 +607,7 @@ export function BarSeries(props: SeriesProps): ComponentReturnType;
  *
  * See the <LineChart /> (React) demo for this component in action:
  *
- * ![LineChart component example](https://tinybase.org/shots/basic-chart-react-demo.png "LineChart
+ * ![LineChart component example](https://beta.tinybase.org/shots/basic-chart-react-demo.png "LineChart
  * component example")
  * @category Store components
  * @since v8.5.0
@@ -660,7 +660,7 @@ export function LineChart(
  *
  * See the Sorting And Types (React) demo for this component in action:
  *
- * ![BarChart component example](https://tinybase.org/shots/sorting-and-types-react-demo.png
+ * ![BarChart component example](https://beta.tinybase.org/shots/sorting-and-types-react-demo.png
  * "BarChart component example")
  * @category Store components
  * @since v8.5.0

package/@types/ui-react-dom-charts/with-schemas/index.d.ts

@@ -544,7 +544,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the Composing Charts (React) demo for this component in action:
  *
- * ![CartesianChart component example](https://tinybase.org/shots/composing-charts-react-demo.png
+ * ![CartesianChart component example](https://beta.tinybase.org/shots/composing-charts-react-demo.png
  * "CartesianChart component example")
  *
  * The series children declare their own xCellId and yCellId bindings. The
@@ -609,7 +609,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the Axis Overrides (React) demo for this component in action:
  *
- * ![XAxis component example](https://tinybase.org/shots/axis-overrides-react-demo.png
+ * ![XAxis component example](https://beta.tinybase.org/shots/axis-overrides-react-demo.png
  * "XAxis component example")
  * @category Store components
  * @since v8.5.0
@@ -625,7 +625,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the Axis Overrides (React) demo for this component in action:
  *
- * ![YAxis component example](https://tinybase.org/shots/axis-overrides-react-demo.png
+ * ![YAxis component example](https://beta.tinybase.org/shots/axis-overrides-react-demo.png
  * "YAxis component example")
  * @category Store components
  * @since v8.5.0
@@ -641,7 +641,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the Composing Charts (React) demo for this component in action:
  *
- * ![LineSeries component example](https://tinybase.org/shots/composing-charts-react-demo.png
+ * ![LineSeries component example](https://beta.tinybase.org/shots/composing-charts-react-demo.png
  * "LineSeries component example")
  * @category Store components
  * @since v8.5.0
@@ -657,7 +657,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the Composing Charts (React) demo for this component in action:
  *
- * ![BarSeries component example](https://tinybase.org/shots/composing-charts-react-demo.png
+ * ![BarSeries component example](https://beta.tinybase.org/shots/composing-charts-react-demo.png
  * "BarSeries component example")
  * @category Store components
  * @since v8.5.0
@@ -684,7 +684,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the <LineChart /> (React) demo for this component in action:
  *
- * ![LineChart component example](https://tinybase.org/shots/basic-chart-react-demo.png "LineChart
+ * ![LineChart component example](https://beta.tinybase.org/shots/basic-chart-react-demo.png "LineChart
  * component example")
  * @category Store components
  * @since v8.5.0
@@ -750,7 +750,7 @@ export type WithSchemas<Schemas extends OptionalSchemas> = {
  *
  * See the Sorting And Types (React) demo for this component in action:
  *
- * ![BarChart component example](https://tinybase.org/shots/sorting-and-types-react-demo.png
+ * ![BarChart component example](https://beta.tinybase.org/shots/sorting-and-types-react-demo.png
  * "BarChart component example")
  * @category Store components
  * @since v8.5.0

package/@types/ui-react-inspector/index.d.ts

@@ -46,7 +46,7 @@ export type InspectorProps = {
  *
  * See the <Inspector /> (React) demo for this component in action:
  *
- * ![Inspector example](https://tinybase.org/shots/inspector-react-demo.png
+ * ![Inspector example](https://beta.tinybase.org/shots/inspector-react-demo.png
  * "Inspector example")
  *
  * The component displays a nub in the corner of the screen which you may then