@adecore/database 0.26.0 → 0.26.2

package/dist/DatabaseProvider.js

@@ -1,18 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { use, useMemo, useState } from 'react';
-import { useTranslation } from 'react-i18next';
+import { use, useMemo } from 'react';
 import { DatabaseContext } from './client-context.js';
-import { addDatabaseResources } from './locales.js';
+import { useDatabaseResources } from './use-database-resources.js';
 /* Hands every view below it the client and the app's hooks, and adds the package's words to the i18next the app's `UIProvider` was given. Mount it inside that provider. */
 export function DatabaseProvider({ client, onAction, onNotice, storage, files, numberNotation, children }) {
-    const { i18n } = useTranslation();
+    useDatabaseResources();
     const outer = use(DatabaseContext);
-    const [added, setAdded] = useState(null);
-    // In render, as `UIProvider` does, so the first view already reads its words.
-    if (added !== i18n) {
-        addDatabaseResources(i18n);
-        setAdded(i18n);
-    }
     const ownClient = client ?? outer?.client;
     const ownAction = onAction ?? outer?.onAction;
     const ownNotice = onNotice ?? outer?.onNotice;

package/dist/grid/DataGrid.js

@@ -8,6 +8,7 @@ import { formatNumber } from '@adecore/ui/format';
 import { assignRef } from '../assign-ref.js';
 import { useNumberNotation } from '../client-context.js';
 import { usePopupPress } from '../use-popup-press.js';
+import { useDatabaseResources } from '../use-database-resources.js';
 import { useStableCallback } from '../use-stable-callback.js';
 import { fullRect, rectBetween, rectContains } from './cell-range.js';
 import { captureLayout, restoreLayout, sameLayout } from './column-layout.js';
@@ -32,12 +33,15 @@ const signatureOf = (columns) => columns.map((column) => column.name).join('\u00
 const textOf = (view) => (view.suffix === undefined ? view.text : `${view.text} ${view.suffix}`);
 const estimateWidths = (columns, rows, notation) => columns.map((column, index) => estimateColumnWidth(column.name, rows.slice(0, 50).map((row) => textOf(cellView(row.cells[index] ?? null, column.kind, columnNotation(column, notation)))), column.primaryKey === true));
 /*
- * The table of the table view and of the console. Only the rows in view are drawn, at a fixed
+ * The table of the table view and of the console, and of any rows an app has on its own: it needs no
+ * `DatabaseProvider`, only the `UIProvider` of `@adecore/ui`. Only the rows in view are drawn, at a fixed
  * height, inside a box as tall as all of them; the header and the row-number gutter stick to the edges
  * of the scroll box. Focus stays on that box and points at the cell with `aria-activedescendant`, so
  * a cell scrolled out of the window loses nothing.
  */
 export function DataGrid({ columns, rows, label, editable = false, selectedKeys, onSelectedKeysChange, onCommit, loadValue, onNotice, sorts, onSortsChange, onFocusedCellChange, onDeleteSelected, sqlTarget, queryMenu, menu, onDuplicateRows, onFollow, canFollow, onRangeChange, initialLayout, onLayoutChange, focusRequest, columnRequest, empty, className, ref }) {
+    // A grid drawn without a `DatabaseProvider`, such as one over the rows of a file, still reads its words.
+    useDatabaseResources();
     const { t } = useTranslation('database');
     const gridId = useId();
     const scroller = useRef(null);

package/dist/index.d.ts

@@ -1,5 +1,7 @@
 export { createDatabaseClient, DatabaseRequestError, type Connection, type DatabaseClient, type DatabaseClientOptions, type DatabaseSession, type DatabaseTransport, type ExecuteOptions, type ExecuteResult, type ExportRequest, type ExportResult, type ImportRequest, type PageQuery, type RequestOptions, type RowsQuery, type SchemaChange, type TableRef } from './client/index.ts';
 export type { DatabaseAction, DatabaseFiles, DatabaseNotice, DatabaseStorage, ExplorerSelection } from './actions.ts';
+export type { Cell, Value, ValueKind } from './protocol/index.ts';
+export type { SortDirection } from './sql.ts';
 export { ConnectionForm, type ConnectionFormProps } from './connections/ConnectionForm.tsx';
 export { isValidConfig, type ConfigProblem, type ConfigProblems } from './connections/connection-config.ts';
 export { ConnectionManager, type ConnectionManagerProps } from './connections/ConnectionManager.tsx';
@@ -9,7 +11,11 @@ export type { ExplorerFolder, ExplorerItem } from './explorer/folders.ts';
 export { TableDesigner, type TableDesignerProps } from './designer/TableDesigner.tsx';
 export { DatabaseProvider, type DatabaseProviderProps } from './DatabaseProvider.tsx';
 export { useDatabaseClient } from './client-context.ts';
+export { DataGrid, type DataGridProps } from './grid/DataGrid.tsx';
+export type { GridLayout } from './grid/column-layout.ts';
 export type { NumberNotation } from './grid/display.ts';
+export type { GridSort } from './grid/sort.ts';
+export type { FocusedCell, GridColumn, GridMenuContext, GridRow, GridRowState } from './grid/types.ts';
 export { QueryConsole, type QueryConsoleProps } from './console/QueryConsole.tsx';
 export type { QueryConsoleEditorHandle, QueryConsoleEditorProps, QueryConsoleRunScope } from './console/editor-slot.ts';
 export { runScopeOf } from './console/shortcuts.ts';

package/dist/index.js

@@ -8,6 +8,7 @@ export { DatabaseExplorer } from './explorer/DatabaseExplorer.js';
 export { TableDesigner } from './designer/TableDesigner.js';
 export { DatabaseProvider } from './DatabaseProvider.js';
 export { useDatabaseClient } from './client-context.js';
+export { DataGrid } from './grid/DataGrid.js';
 export { QueryConsole } from './console/QueryConsole.js';
 export { runScopeOf } from './console/shortcuts.js';
 export { StructureView } from './structure/StructureView.js';

package/dist/use-database-resources.d.ts

@@ -0,0 +1 @@
+export declare function useDatabaseResources(): void;

package/dist/use-database-resources.js

@@ -0,0 +1,12 @@
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { addDatabaseResources } from './locales.js';
+/* Adds the package's words to the i18next the app's `UIProvider` was given. In render, as `UIProvider` does, so the first view already reads them. */
+export function useDatabaseResources() {
+    const { i18n } = useTranslation();
+    const [added, setAdded] = useState(null);
+    if (added !== i18n) {
+        addDatabaseResources(i18n);
+        setAdded(i18n);
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@adecore/database",
-  "version": "0.26.0",
+  "version": "0.26.2",
   "description": "Browse, query and edit SQLite and MySQL databases: React views for the page, a host for the backend and a native helper that talks to the server.",
   "license": "FSL-1.1-MIT",
   "author": "Bas Milius",
@@ -61,20 +61,20 @@
     "lucide-react": "^1.47.0"
   },
   "optionalDependencies": {
-    "@adecore/database-darwin-arm64": "0.26.0",
-    "@adecore/database-linux-arm64": "0.26.0",
-    "@adecore/database-linux-x64": "0.26.0",
-    "@adecore/database-win32-x64": "0.26.0"
+    "@adecore/database-darwin-arm64": "0.26.2",
+    "@adecore/database-linux-arm64": "0.26.2",
+    "@adecore/database-linux-x64": "0.26.2",
+    "@adecore/database-win32-x64": "0.26.2"
   },
   "peerDependencies": {
-    "@adecore/ui": "^0.26.0",
+    "@adecore/ui": "^0.26.2",
     "i18next": "^26.4.2",
     "react": "^19.3.0",
     "react-dom": "^19.3.0",
     "react-i18next": "^17.0.15"
   },
   "devDependencies": {
-    "@adecore/ui": "0.26.0",
+    "@adecore/ui": "0.26.2",
     "@happy-dom/global-registrator": "^20.14.5",
     "@types/bun": "^1.4.2",
     "@types/node": "^24.13.6",

package/src/DatabaseProvider.tsx

@@ -1,10 +1,9 @@
-import { use, useMemo, useState, type ReactNode } from 'react';
-import { useTranslation } from 'react-i18next';
+import { use, useMemo, type ReactNode } from 'react';
 import type { DatabaseAction, DatabaseFiles, DatabaseNotice, DatabaseStorage } from './actions.ts';
 import type { DatabaseClient } from './client/types.ts';
 import { DatabaseContext } from './client-context.ts';
 import type { NumberNotation } from './grid/display.ts';
-import { addDatabaseResources } from './locales.ts';
+import { useDatabaseResources } from './use-database-resources.ts';
 
 export interface DatabaseProviderProps {
     /* Required on the outermost provider. A provider inside another takes every prop it leaves out from the one above. */
@@ -26,14 +25,8 @@ export interface DatabaseProviderProps {
 
 /* Hands every view below it the client and the app's hooks, and adds the package's words to the i18next the app's `UIProvider` was given. Mount it inside that provider. */
 export function DatabaseProvider({ client, onAction, onNotice, storage, files, numberNotation, children }: DatabaseProviderProps) {
-    const { i18n } = useTranslation();
+    useDatabaseResources();
     const outer = use(DatabaseContext);
-    const [added, setAdded] = useState<typeof i18n | null>(null);
-    // In render, as `UIProvider` does, so the first view already reads its words.
-    if (added !== i18n) {
-        addDatabaseResources(i18n);
-        setAdded(i18n);
-    }
 
     const ownClient = client ?? outer?.client;
     const ownAction = onAction ?? outer?.onAction;

package/src/grid/DataGrid.tsx

@@ -22,6 +22,7 @@ import { assignRef } from '../assign-ref.ts';
 import type { SqlTarget } from '../sql.ts';
 import { useNumberNotation } from '../client-context.ts';
 import { usePopupPress } from '../use-popup-press.ts';
+import { useDatabaseResources } from '../use-database-resources.ts';
 import { useStableCallback } from '../use-stable-callback.ts';
 import type { RangeBlock } from './aggregates.ts';
 import { fullRect, rectBetween, rectContains } from './cell-range.ts';
@@ -75,6 +76,7 @@ export interface DataGridProps {
     onNotice?(notice: DatabaseNotice): void;
     /* The sorted columns by name, in order. Only shown unless `onSortsChange` is given, which is what makes the headers sort. */
     sorts?: readonly GridSort[];
+    /* A header's menu picked a sort. The grid draws `rows` in the order given, so the handler orders them and passes `sorts` back. */
     onSortsChange?(sorts: readonly GridSort[]): void;
     /* The cell that holds the focus changed, or lost it. */
     onFocusedCellChange?(cell: FocusedCell | null): void;
@@ -141,7 +143,8 @@ const estimateWidths = (columns: readonly GridColumn[], rows: readonly GridRow[]
     );
 
 /*
- * The table of the table view and of the console. Only the rows in view are drawn, at a fixed
+ * The table of the table view and of the console, and of any rows an app has on its own: it needs no
+ * `DatabaseProvider`, only the `UIProvider` of `@adecore/ui`. Only the rows in view are drawn, at a fixed
  * height, inside a box as tall as all of them; the header and the row-number gutter stick to the edges
  * of the scroll box. Focus stays on that box and points at the cell with `aria-activedescendant`, so
  * a cell scrolled out of the window loses nothing.
@@ -175,6 +178,8 @@ export function DataGrid({
     className,
     ref
 }: DataGridProps) {
+    // A grid drawn without a `DatabaseProvider`, such as one over the rows of a file, still reads its words.
+    useDatabaseResources();
     const { t } = useTranslation('database');
     const gridId = useId();
     const scroller = useRef<HTMLDivElement | null>(null);

package/src/grid/types.ts

@@ -23,6 +23,7 @@ export interface GridRow {
     readonly key: string;
     /* The number in the gutter; `null` for a row that does not exist yet. */
     readonly number: number | null;
+    /* One per column, in the order of the columns. A `null` draws as a faint NULL, so an empty text is `''`. */
     readonly cells: readonly Shown[];
     readonly state?: GridRowState;
     /* Indexes of the cells with a pending edit. */

package/src/index.ts

@@ -21,6 +21,8 @@ export {
 } from './client/index.ts';
 
 export type { DatabaseAction, DatabaseFiles, DatabaseNotice, DatabaseStorage, ExplorerSelection } from './actions.ts';
+export type { Cell, Value, ValueKind } from './protocol/index.ts';
+export type { SortDirection } from './sql.ts';
 
 export { ConnectionForm, type ConnectionFormProps } from './connections/ConnectionForm.tsx';
 export { isValidConfig, type ConfigProblem, type ConfigProblems } from './connections/connection-config.ts';
@@ -31,7 +33,11 @@ export type { ExplorerFolder, ExplorerItem } from './explorer/folders.ts';
 export { TableDesigner, type TableDesignerProps } from './designer/TableDesigner.tsx';
 export { DatabaseProvider, type DatabaseProviderProps } from './DatabaseProvider.tsx';
 export { useDatabaseClient } from './client-context.ts';
+export { DataGrid, type DataGridProps } from './grid/DataGrid.tsx';
+export type { GridLayout } from './grid/column-layout.ts';
 export type { NumberNotation } from './grid/display.ts';
+export type { GridSort } from './grid/sort.ts';
+export type { FocusedCell, GridColumn, GridMenuContext, GridRow, GridRowState } from './grid/types.ts';
 export { QueryConsole, type QueryConsoleProps } from './console/QueryConsole.tsx';
 export type { QueryConsoleEditorHandle, QueryConsoleEditorProps, QueryConsoleRunScope } from './console/editor-slot.ts';
 export { runScopeOf } from './console/shortcuts.ts';

package/src/use-database-resources.ts

@@ -0,0 +1,14 @@
+import { useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import type { i18n as I18n } from 'i18next';
+import { addDatabaseResources } from './locales.ts';
+
+/* Adds the package's words to the i18next the app's `UIProvider` was given. In render, as `UIProvider` does, so the first view already reads them. */
+export function useDatabaseResources(): void {
+    const { i18n } = useTranslation();
+    const [added, setAdded] = useState<I18n | null>(null);
+    if (added !== i18n) {
+        addDatabaseResources(i18n);
+        setAdded(i18n);
+    }
+}