Define type of Table#data with TypeScript generics

[the-red]

TypeScriptのジェネリクスでTable#dataの型を定義したいです。 （本文は日本語で失礼します）

Component

Table

Why

Tableコンポーネントには、任意の構成のオブジェクト配列が格納されますが、 Table#dataの型はobject[]で固定されてしまってます。 https://github.com/kintone-labs/kintone-ui-component/blob/v1.10.0/src/table/type.ts#L23

export declare type TableProps = {
  className?: string;
  id?: string;
  label?: string;
  data?: object[];
  columns?: Column[];
  actionButton?: boolean;
  visible?: boolean;
};

このため、dataを型が決まっているオブジェクトに代入しようとするとエラーになり、 asなどで逃げるしかないのが現状です。

What

コンストラクタにジェネリクスでデータ型を渡せるようにしてもらえると とっても便利になりそうです！

利用イメージ

type Method = 'GET' | 'POST' | 'PUT' | 'DELETE'
type ProxyConfig = {
  url: string
  method: Method
  headers: string
  data: string
}
const proxyConfig: ProxyConfig[] = [
  {
    url: 'https://example.com',
    method: 'GET',
    headers: '{"foo": 1}',
    data: '{}',
  },
  {
    url: 'https://example.com',
    method: 'POST',
    headers: '{"bar": 1}',
    data: '{}',
  },
]

const table = new Table<ProxyConfig>({
  columns: [
    {
      title: 'URL',
      field: 'url',
      render: renderUrl,
    },
    {
      title: 'Method',
      field: 'method',
      render: renderMethod,
    },
    {
      title: 'Headers',
      field: 'headers',
      render: renderJson,
    },
    {
      title: 'Data',
      field: 'data',
      render: renderJson,
    },
  ],
  data: proxyConfig, // <- ここの型が合わない場合はエラーを出す
})

よろしくお願いします！

[TomokoMiyake]

@the-red issue の登録ありがとうございます。 詳細確認して対応検討させていただきます。

[TomokoMiyake]

@the-red アイデアで書いていただいた通り、ジェネリクスで data 型を渡せるように修正することにしました。 次のリリースで修正版を出す予定です。

[TomokoMiyake]

@the-red We released v1.12.0 which includes the improvement of data property type definition you requested above. https://github.com/kintone-labs/kintone-ui-component/releases/tag/v1.12.0

Thank you!