in packages/bonito-ui/src/components/data-grid/data-grid.tsx [153:199]
function useColumns<T>(
columns: DataGridProps<T>["columns"],
columnDefaultMaxWidth: DataGridProps["columnDefaultMaxWidth"]
): IColumn[] {
const detailsListColumns = React.useMemo(() => {
const detailsListCols: IColumn[] = [];
if (columns) {
let i = 1;
for (const c of columns) {
if (typeof c === "string") {
// Simple column names
detailsListCols.push({
key: `column${i++}`,
name: c,
fieldName: c,
onRender: (item) => autoFormat(item[c]),
minWidth: defaultColumnMinWidth,
maxWidth: columnDefaultMaxWidth,
isResizable: true,
});
} else if (c.prop) {
// Column props
detailsListCols.push({
key: `column${i++}`,
name: c.label ?? c.prop,
fieldName: c.prop,
onRender:
c.onRender ??
((item) =>
autoFormat(c.prop ? item[c.prop] : null)),
minWidth: c.minWidth ?? defaultColumnMinWidth,
maxWidth: c.maxWidth ?? columnDefaultMaxWidth,
isResizable: true,
});
} else {
throw new Error(
"Invalid DataGrid column configuration: " +
JSON.stringify(c)
);
}
}
}
return detailsListCols;
}, [columns, columnDefaultMaxWidth]);
return detailsListColumns;
}