[ui-react] Split components into files

Author: jamesgpearce

src/ui-react-dom/RelationshipInHtmlTable.tsx

@@ -9,13 +9,13 @@ import {objToArray} from '../common/obj.ts';
 import {isUndefined} from '../common/other.ts';
 import {getProps, getRelationshipsStoreTableIds} from '../common/react.ts';
 import {DOT, strSplit} from '../common/strings.ts';
-import {CellView} from '../ui-react/components.tsx';
 import {
   useRelationshipsOrRelationshipsById,
   useRemoteRowId,
   useRowIds,
   useTableCellIds,
 } from '../ui-react/hooks.ts';
+import {CellView} from '../ui-react/index.ts';
 import {EditableCellView} from './EditableCellView.tsx';
 import {
   extraHeaders,

src/ui-react-dom/ResultSortedTableInHtmlTable.tsx

@@ -3,12 +3,12 @@ import type {
   ResultSortedTableInHtmlTable as ResultSortedTableInHtmlTableDecl,
   ResultSortedTableInHtmlTableProps,
 } from '../@types/ui-react-dom/index.js';
-import {ResultCellView} from '../ui-react/components.tsx';
 import {
   useResultRowCount,
   useResultSortedRowIds,
   useResultTableCellIds,
 } from '../ui-react/hooks.ts';
+import {ResultCellView} from '../ui-react/index.ts';
 import {
   HtmlTable,
   useCells,

src/ui-react-dom/ResultTableInHtmlTable.tsx

@@ -3,8 +3,8 @@ import type {
   ResultTableInHtmlTable as ResultTableInHtmlTableDecl,
   ResultTableInHtmlTableProps,
 } from '../@types/ui-react-dom/index.js';
-import {ResultCellView} from '../ui-react/components.tsx';
 import {useResultRowIds, useResultTableCellIds} from '../ui-react/hooks.ts';
+import {ResultCellView} from '../ui-react/index.ts';
 import {
   HtmlTable,
   useCells,

src/ui-react-dom/SliceInHtmlTable.tsx

@@ -5,12 +5,12 @@ import type {
   SliceInHtmlTableProps,
 } from '../@types/ui-react-dom/index.js';
 import {getIndexStoreTableId} from '../common/react.ts';
-import {CellView} from '../ui-react/components.tsx';
 import {
   useIndexesOrIndexesById,
   useSliceRowIds,
   useTableCellIds,
 } from '../ui-react/hooks.ts';
+import {CellView} from '../ui-react/index.ts';
 import {EditableCellView} from './EditableCellView.tsx';
 import {
   HtmlTable,

src/ui-react-dom/SortedTableInHtmlTable.tsx

@@ -3,12 +3,12 @@ import type {
   SortedTableInHtmlTable as SortedTableInHtmlTableDecl,
   SortedTableInHtmlTableProps,
 } from '../@types/ui-react-dom/index.js';
-import {CellView} from '../ui-react/components.tsx';
 import {
   useRowCount,
   useSortedRowIds,
   useTableCellIds,
 } from '../ui-react/hooks.ts';
+import {CellView} from '../ui-react/index.ts';
 import {EditableCellView} from './EditableCellView.tsx';
 import {
   HtmlTable,

src/ui-react-dom/TableInHtmlTable.tsx

@@ -3,8 +3,8 @@ import type {
   TableInHtmlTable as TableInHtmlTableDecl,
   TableInHtmlTableProps,
 } from '../@types/ui-react-dom/index.js';
-import {CellView} from '../ui-react/components.tsx';
 import {useRowIds, useTableCellIds} from '../ui-react/hooks.ts';
+import {CellView} from '../ui-react/index.ts';
 import {EditableCellView} from './EditableCellView.tsx';
 import {
   HtmlTable,

src/ui-react-dom/ValuesInHtmlTable.tsx

@@ -8,8 +8,8 @@ import type {ValueProps} from '../@types/ui-react/index.d.ts';
 import {arrayMap} from '../common/array.ts';
 import {getProps} from '../common/react.ts';
 import {EXTRA, VALUE} from '../common/strings.ts';
-import {ValueView} from '../ui-react/components.tsx';
 import {useValueIds} from '../ui-react/hooks.ts';
+import {ValueView} from '../ui-react/index.ts';
 import {EditableValueView} from './EditableValueView.tsx';
 import {extraHeaders, extraKey} from './common.tsx';
 

src/ui-react/BackwardCheckpointsView.tsx

@@ -0,0 +1,5 @@
+import type {BackwardCheckpointsView as BackwardCheckpointsViewDecl} from '../@types/ui-react/index.js';
+import {getUseCheckpointView} from './common.tsx';
+
+export const BackwardCheckpointsView: typeof BackwardCheckpointsViewDecl =
+  getUseCheckpointView((checkpointIds) => checkpointIds[0]);

src/ui-react/CellView.tsx

@@ -0,0 +1,21 @@
+import type {
+  CellProps,
+  CellView as CellViewDecl,
+} from '../@types/ui-react/index.js';
+import {EMPTY_STRING} from '../common/strings.ts';
+import {wrap} from './common.tsx';
+import {useCell} from './hooks.ts';
+
+export const CellView: typeof CellViewDecl = ({
+  tableId,
+  rowId,
+  cellId,
+  store,
+  debugIds,
+}: CellProps): any =>
+  wrap(
+    EMPTY_STRING + (useCell(tableId, rowId, cellId, store) ?? EMPTY_STRING),
+    undefined,
+    debugIds,
+    cellId,
+  );

src/ui-react/CheckpointView.tsx

@@ -0,0 +1,19 @@
+import type {
+  CheckpointProps,
+  CheckpointView as CheckpointViewDecl,
+} from '../@types/ui-react/index.js';
+import {EMPTY_STRING} from '../common/strings.ts';
+import {wrap} from './common.tsx';
+import {useCheckpoint} from './hooks.ts';
+
+export const CheckpointView: typeof CheckpointViewDecl = ({
+  checkpoints,
+  checkpointId,
+  debugIds,
+}: CheckpointProps): any =>
+  wrap(
+    useCheckpoint(checkpointId, checkpoints) ?? EMPTY_STRING,
+    undefined,
+    debugIds,
+    checkpointId,
+  );