@izumisy-tailor/tailor-data-viewer 0.2.16 → 0.2.18

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@izumisy-tailor/tailor-data-viewer",
   "private": false,
-  "version": "0.2.16",
+  "version": "0.2.18",
   "type": "module",
   "description": "Flexible data viewer component for Tailor Platform",
   "files": [

package/src/component/collection/use-collection.ts

@@ -54,10 +54,7 @@ type ResolveVariables<TQuery> =
  * const [result] = useQuery({ ...collection.toQueryArgs() });
  * ```
  */
-export function useCollection<
-  const TTable extends TableMetadata,
-  TQuery,
->(
+export function useCollection<const TTable extends TableMetadata, TQuery>(
   options: UseCollectionOptions<
     TableFieldName<TTable>,
     TableMetadataFilter<TTable>

package/src/component/data-table/use-data-table.ts

@@ -1,4 +1,4 @@
-import { useCallback, useMemo, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import type {
   Column,
   DataTableCellProps,
@@ -54,7 +54,7 @@ export function useDataTable<TRow extends Record<string, unknown>>(
   const rows = optimisticRows ?? sourceRows;
 
   // Reset optimistic state when source data changes
-  useMemo(() => {
+  useEffect(() => {
     setOptimisticRows(null);
   }, [sourceRows]);
 
@@ -70,11 +70,11 @@ export function useDataTable<TRow extends Record<string, unknown>>(
   }, [data]);
 
   // Sync pageInfo to collection so hasPrevPage/hasNextPage are up-to-date
-  useMemo(() => {
+  useEffect(() => {
     if (data?.pageInfo) {
       collection?.setPageInfo(data.pageInfo);
     }
-  }, [data?.pageInfo, collection]);
+  }, [data?.pageInfo, collection?.setPageInfo]);
 
   // ---------------------------------------------------------------------------
   // Column visibility management

package/src/component/field-helpers.ts

@@ -130,41 +130,49 @@ export function createColumnHelper<TRow extends Record<string, unknown>>(): {
  * Automatically infers sort/filter configuration from field types,
  * including enum options.
  *
+ * @typeParam TRow - The row type for type-safe renderer access.
  * @param tableMetadata - A single table metadata object from the generated map.
  *
  * @example
  * ```tsx
  * import { tableMetadata } from "./generated/data-viewer-metadata.generated";
  *
- * const { column, columns } = inferColumnHelper(tableMetadata.task);
+ * type Task = { id: string; title: string; status: string; dueDate: string };
+ *
+ * const { column, columns } = inferColumnHelper<Task>(tableMetadata.task);
  *
  * const taskColumns = [
  *   column("title"),           // sort/filter auto-detected
  *   column("status"),          // enum options auto-populated
  *   column("dueDate"),         // date type auto-recognized
- *   display("actions", { render: (row) => <ActionMenu row={row} /> }),
+ *   column("title", {
+ *     renderer: ({ row }) => <span>{row.title}</span>, // row: Task
+ *   }),
  * ];
  * ```
  */
-export function inferColumnHelper<const TTable extends TableMetadata>(
+export function inferColumnHelper<
+  TRow extends Record<string, unknown>,
+  const TTable extends TableMetadata = TableMetadata,
+>(
   tableMetadata: TTable,
 ): {
   column: (
     dataKey: TableFieldName<TTable>,
-    options?: MetadataFieldOptions,
-  ) => FieldColumn<Record<string, unknown>>;
+    options?: MetadataFieldOptions<TRow>,
+  ) => FieldColumn<TRow>;
 
   columns: (
     dataKeys: TableFieldName<TTable>[],
     options?: MetadataFieldsOptions,
-  ) => FieldColumn<Record<string, unknown>>[];
+  ) => FieldColumn<TRow>[];
 } {
   const fields = tableMetadata.fields;
 
   const column = (
     dataKey: TableFieldName<TTable>,
-    columnOptions?: MetadataFieldOptions,
-  ): FieldColumn<Record<string, unknown>> => {
+    columnOptions?: MetadataFieldOptions<TRow>,
+  ): FieldColumn<TRow> => {
     const fieldMeta = fields.find((f) => f.name === dataKey);
     if (!fieldMeta) {
       throw new Error(
@@ -197,20 +205,19 @@ export function inferColumnHelper<const TTable extends TableMetadata>(
       width: columnOptions?.width,
       sort,
       filter,
-      renderer: columnOptions?.renderer as
-        | CellRenderer<Record<string, unknown>>
-        | undefined,
+      renderer: columnOptions?.renderer as CellRenderer<TRow> | undefined,
     };
   };
 
   const columnsHelper = (
     dataKeys: TableFieldName<TTable>[],
     options?: MetadataFieldsOptions,
-  ): FieldColumn<Record<string, unknown>>[] => {
+  ): FieldColumn<TRow>[] => {
     return dataKeys.map((dataKey) => {
       const overrides = options?.overrides?.[dataKey as string];
       return column(dataKey, {
-        ...overrides,
+        label: overrides?.label,
+        width: overrides?.width,
         sort: overrides?.sort ?? options?.sort,
         filter: overrides?.filter ?? options?.filter,
       });

package/src/component/types.ts

@@ -942,14 +942,18 @@ export type MatchingTableName<
 
 /**
  * Options for metadata-based single field definition.
+ *
+ * @typeParam TRow - The row type for type-safe renderer access.
  */
-export interface MetadataFieldOptions {
+export interface MetadataFieldOptions<
+  TRow extends Record<string, unknown> = Record<string, unknown>,
+> {
   /** Label override (defaults to metadata description or field name) */
   label?: string;
   /** Column width */
   width?: number;
-  /** Custom cell renderer */
-  renderer?: CellRenderer<Record<string, unknown>>;
+  /** Custom cell renderer with typed row data */
+  renderer?: CellRenderer<TRow>;
   /** Enable/disable sort (default: auto-detected from type) */
   sort?: boolean;
   /** Enable/disable filter (default: auto-detected from type) */