ant-design/components/descriptions/hooks/useRow.ts
叶枫 7410b536b4
feat: Description item support block ()
* feat: Descriptions support row

* feat: review

* feat: snap

* feat: test

* feat: review

* feat: review

* feat: test

* feat: test

* feat: add calc span

* feat: snap

* feat: block

* feat: test change block

* feat: doc

* feat: doc

* feat: test

* feat: empty text test

* feat: row > block

* feat: remove block

* feat: filled

* feat: fiiled 逻辑修正 最后一个始终补齐

* feat: doc

* feat: review

* feat: review

* feat: review
2024-10-28 15:19:39 +08:00

77 lines
2.0 KiB
TypeScript

import { useMemo } from 'react';
import type { InternalDescriptionsItemType } from '..';
import { devUseWarning } from '../../_util/warning';
// Calculate the sum of span in a row
function getCalcRows(
rowItems: InternalDescriptionsItemType[],
mergedColumn: number,
): [rows: InternalDescriptionsItemType[][], exceed: boolean] {
let rows: InternalDescriptionsItemType[][] = [];
let tmpRow: InternalDescriptionsItemType[] = [];
let exceed = false;
let count = 0;
rowItems
.filter((n) => n)
.forEach((rowItem) => {
const { filled, ...restItem } = rowItem;
if (filled) {
tmpRow.push(restItem);
rows.push(tmpRow);
// reset
tmpRow = [];
count = 0;
return;
}
const restSpan = mergedColumn - count;
count += rowItem.span || 1;
if (count >= mergedColumn) {
if (count > mergedColumn) {
exceed = true;
tmpRow.push({ ...restItem, span: restSpan });
} else {
tmpRow.push(restItem);
}
rows.push(tmpRow);
// reset
tmpRow = [];
count = 0;
} else {
tmpRow.push(restItem);
}
});
if (tmpRow.length > 0) {
rows.push(tmpRow);
}
rows = rows.map((rows) => {
const count = rows.reduce((acc, item) => acc + (item.span || 1), 0);
if (count < mergedColumn) {
// If the span of the last element in the current row is less than the column, then add its span to the remaining columns
const last = rows[rows.length - 1];
last.span = mergedColumn - count + 1;
return rows;
}
return rows;
});
return [rows, exceed];
}
const useRow = (mergedColumn: number, items: InternalDescriptionsItemType[]) => {
const [rows, exceed] = useMemo(() => getCalcRows(items, mergedColumn), [items, mergedColumn]);
if (process.env.NODE_ENV !== 'production') {
const warning = devUseWarning('Descriptions');
warning(!exceed, 'usage', 'Sum of column `span` in a line not match `column` of Descriptions.');
}
return rows;
};
export default useRow;