Hacktoberfest 2026:メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

`aggregatedCell` not typed against bound `cellComponents` in `createAppColumnHelper`

オープン
#6,583 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
78/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
react, typescript
領域
frontend

調査の方向性

packages/react-table/src/createTableHook.tsx から始め、特に AppColumnDefBase と rowAggregationFeature の ColumnDef_RowAggregation 型を確認し、その後、リンクされた TypeScript playground で不一致を再現します。aggregatedCell が cell と同じバインド済みセルコンポーネントの型を受け取ることを確認し、リポジトリに用意されている場合は、型チェックに特化したテストを追加または実行します。

索引モデルが issue の本文から書いたものです。

説明

TanStack Table version

v9.2.4

Framework/Library version

React v19.2.6

Describe the bug and the steps to reproduce it

createTableHook's AppColumnDefBase enhances cell/header/footer with the
registered cellComponents/headerComponents, via:

Omit<IdentifiedColumnDef<...>, 'cell' | 'header' | 'footer'> & { cell?: ..., header?: ..., footer?: ... }

aggregatedCell (added by rowAggregationFeature's ColumnDef_RowAggregation) is not
included in that Omit list, so it stays typed against the plain, unenhanced CellContext.
Accessing a bound cell component works fine inside cell on a column, but fails inside
aggregatedCell on the exact same column.

Steps to reproduce:

  1. Register a cellComponents map via createTableHook (e.g. { NumberCell }).
  2. Create a column with both cell and aggregatedCell, each destructuring cell and
    accessing cell.NumberCell.
  3. cell.NumberCell type-checks inside cell, but TypeScript reports
    "Property 'NumberCell' does not exist on type 'Cell<...>'" inside aggregatedCell.

Confirmed by reading packages/react-table/src/createTableHook.tsx directly (not just from
the compiled .d.ts) — AppColumnDefBase's Omit list is 'cell' | 'header' | 'footer' only.

Your Minimal, Reproducible Example - (Sandbox Highly Recommended)

https://www.typescriptlang.org/play/?#code/JYWwDg9gTgLgBAbwFBzgYygUwIY0wFWwCMAbTACQggGsAaFOGYsgMRxgFcsBne1KCAHcAggHNRWUbmAQAdm1xdMfdBBIcQsgOICOYYLNELOWFRnaYdEPZgAmAJSEBZCLcwkV2cZOlyWsgH0QHFkkAF84ADMBEDgAcgABJlluJjRqAHosbDQYAFomUkw4pCQYAE8wTDhHQTgAXkQ4CWswAC44VKgDUQBuOAA3bHVMDtkNIkwoODDSyI5ZXJlZOAA5CamAYXcSAAoASkQGLBMV8ZIScNK0OVSo9iVuBsZmTGNH3eR+ITEJTCkYMt3qYGDd1JorHoesDlAwWjYHM5XO4OuZcJZdFVEYIXG49vtPN5-r55CkOgg4MFsLIOl4-gCgYEqStZmF9tdbvAKWi8MIwGBNmoNLJyO4qtMIo0eQRXpQaJ8GJEHjwzDtBeA5JhZDBuOS1hsoNsLjNwuykDcUvAABZiqbPaV8gVCzSikjigA8tQAfAdSja3VMAHQ5NCYbjcaC7OJDEZxWhHVDAWwdaPDDjFVUXDqfdA7GaHepe3MXQPrECTQ07eMZDJwADyAGkGHSfIC-DT4sy482iQC7EaSNnuXm2Q0i6GS2WKwPTUggA

Screenshots or Videos (Optional)

No response

Do you intend to try to help solve this bug with your own PR?
export function createAppColumnHelper<TData extends RowData>() {
    const helper = createRawColumnHelper<TData>()

    function accessor<
        TAccessor extends AccessorFn<TData> | DeepKeys<TData>,
        TValue extends TAccessor extends AccessorFn<TData, infer TReturn>
            ? TReturn
            : TAccessor extends DeepKeys<TData>
              ? DeepValue<TData, TAccessor>
              : never
    >(
        accessorArg: TAccessor,
        column: Omit<
            AppColumnDefBase<typeof appFeatures, TData, TValue, CellComponents, HeaderComponents>,
            'aggregatedCell'
        > & {
            aggregatedCell?: AggregatedCellRender<TData, any>
        } & (TAccessor extends AccessorFn<TData> ? { id: string } : {})
    ): TAccessor extends AccessorFn<TData>
        ? AccessorFnColumnDef<typeof appFeatures, TData, TValue>
        : AccessorKeyColumnDef<typeof appFeatures, TData, TValue> {
        const { aggregatedCell, ...rest } = column

        return helper.accessor(
            accessorArg as never,
            {
                ...rest,
                ...(typeof aggregatedCell === 'function'
                    ? {
                          aggregatedCell: (ctx: CellContext<typeof appFeatures, TData, TValue>) =>
                              aggregatedCell(
                                  ctx as unknown as AppCellContext<
                                      typeof appFeatures,
                                      TData,
                                      any,
                                      CellComponents
                                  >
                              )
                      }
                    : { aggregatedCell })
            } as never
        ) as never
    }

    return { ...helper, accessor }
}
Terms & Code of Conduct
  • I agree to follow this project's Code of Conduct
  • I understand that if my bug cannot be reliable reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.
主要言語
TypeScript
スター
28.4k
フォーク
3.6k
平均マージ
1日 1時間
マージ済み PR(30日)
7

コントリビューションガイド

コントリビューションガイドを開く

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

TanStack/table のほかの issue

TanStack/table の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。