tinybase 9.4.0 → 9.5.0-beta.1

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

@@ -231,6 +231,18 @@ export type TableInHtmlTableProps<
               [CellId in CellIdFromSchema<Schemas[0], TableId>]?:
                 string | CustomCell<Schemas, TableId, CellId>;
             };
+        /**
+   * An optional list of extra Cells to render before the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+        readonly extraCellsBefore?: ExtraRowCell<Schemas, TableId>[];
+        /**
+   * An optional list of extra Cells to render after the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+        readonly extraCellsAfter?: ExtraRowCell<Schemas, TableId>[];
       }
     : never
   : never;
@@ -311,6 +323,18 @@ export type SortedTableInHtmlTableProps<
                 string | CustomCell<Schemas, TableId, CellId>;
             };
         /**
+   * An optional list of extra Cells to render before the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+        readonly extraCellsBefore?: ExtraRowCell<Schemas, TableId>[];
+        /**
+   * An optional list of extra Cells to render after the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+        readonly extraCellsAfter?: ExtraRowCell<Schemas, TableId>[];
+        /**
    * Whether the table should be interactive such that clicking a header changes
    * the sorting and/or direction.
    * @category Prop
@@ -378,6 +402,18 @@ export type ValuesInHtmlTableProps<Schemas extends OptionalSchemas> = {
    * @since v4.1.0
    */
   readonly getValueComponentProps?: (valueId: Id) => ExtraProps;
+  /**
+   * An optional list of extra Cells to render before the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+  readonly extraCellsBefore?: ExtraValueCell<Schemas>[];
+  /**
+   * An optional list of extra Cells to render after the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+  readonly extraCellsAfter?: ExtraValueCell<Schemas>[];
 };
 
 /**
@@ -426,6 +462,18 @@ export type SliceInHtmlTableProps<Schemas extends OptionalSchemas> = {
    */
   readonly customCells?:
     Ids | {[cellId: Id]: string | CustomCell<NoSchemas, Id, Id>};
+  /**
+   * An optional list of extra Cells to render before the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+  readonly extraCellsBefore?: ExtraRowCell<NoSchemas, Id>[];
+  /**
+   * An optional list of extra Cells to render after the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+  readonly extraCellsAfter?: ExtraRowCell<NoSchemas, Id>[];
 };
 
 /**
@@ -476,6 +524,18 @@ export type RelationshipInHtmlTableProps<Schemas extends OptionalSchemas> = {
    */
   readonly customCells?:
     Ids | {[cellId: Id]: string | CustomCell<NoSchemas, Id, Id>};
+  /**
+   * An optional list of extra Cells to render before the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+  readonly extraCellsBefore?: ExtraRowCell<NoSchemas, Id>[];
+  /**
+   * An optional list of extra Cells to render after the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+  readonly extraCellsAfter?: ExtraRowCell<NoSchemas, Id>[];
 };
 
 /**
@@ -511,6 +571,18 @@ export type ResultTableInHtmlTableProps<Schemas extends OptionalSchemas> = {
    */
   readonly customCells?:
     Ids | {[cellId: Id]: string | CustomResultCell<Schemas>};
+  /**
+   * An optional list of extra Cells to render before the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+  readonly extraCellsBefore?: ExtraRowCell<NoSchemas, Id>[];
+  /**
+   * An optional list of extra Cells to render after the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+  readonly extraCellsAfter?: ExtraRowCell<NoSchemas, Id>[];
 };
 
 /**
@@ -574,6 +646,18 @@ export type ResultSortedTableInHtmlTableProps<Schemas extends OptionalSchemas> =
     readonly customCells?:
       Ids | {[cellId: Id]: string | CustomResultCell<Schemas>};
     /**
+   * An optional list of extra Cells to render before the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+    readonly extraCellsBefore?: ExtraRowCell<NoSchemas, Id>[];
+    /**
+   * An optional list of extra Cells to render after the main table Cells.
+   * @category Prop
+   * @since v6.6.0
+   */
+    readonly extraCellsAfter?: ExtraRowCell<NoSchemas, Id>[];
+    /**
    * Whether the table should be interactive such that clicking a header changes
    * the sorting and/or direction.
    * @category Prop
@@ -668,7 +752,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 +906,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 +1087,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 +1226,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 +1392,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 +1578,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 +1739,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 +1921,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 +2006,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 +2077,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

package/@types/ui-react-inspector/with-schemas/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