@navikt/ds-react
Version:
React components from the Norwegian Labour and Welfare Administration.
94 lines • 4.6 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.useLatestDate = exports.useEarliestDate = exports.useTimelineRows = void 0;
const date_fns_1 = require("date-fns");
const react_1 = require("react");
const calc_1 = require("../utils/calc");
const filter_1 = require("../utils/filter");
const sort_1 = require("../utils/sort");
const spatialPeriod = (period, timelineStart, timelineEndInclusive, direction = "left", i, periods, rowIndex) => {
const start = period.start;
const endInclusive = period.end;
const rightOverlap = i < periods.length - 1 && !(0, date_fns_1.isAfter)(periods[i + 1].start, endInclusive);
const { horizontalPosition, width } = (0, calc_1.horizontalPositionAndWidth)((0, date_fns_1.startOfDay)(start), (0, date_fns_1.endOfDay)(rightOverlap
? (0, date_fns_1.startOfDay)((0, date_fns_1.subDays)(periods[i + 1].start, 1))
: endInclusive), timelineStart, timelineEndInclusive);
return {
id: `r-${rowIndex}-p-${i}`,
start,
endInclusive,
horizontalPosition,
direction,
width,
end: endInclusive,
status: period.status,
onSelectPeriod: period.onSelectPeriod,
icon: period.icon,
children: period.children,
isActive: period.isActive,
statusLabel: period.statusLabel,
};
};
const adjustedEdges = (period, i, allPeriods) => {
const left = i > 0 && (0, filter_1.withinADay)(period.start, allPeriods[i - 1].endInclusive);
const right = i < allPeriods.length - 1 &&
(0, filter_1.withinADay)(allPeriods[i + 1].start, period.endInclusive);
return left && right
? Object.assign(Object.assign({}, period), { cropped: "both" }) : left
? Object.assign(Object.assign({}, period), { cropped: "left" }) : right
? Object.assign(Object.assign({}, period), { cropped: "right" }) : period;
};
const trimmedPeriods = (period) => {
let { horizontalPosition, width, cropped } = period;
if (horizontalPosition + width > 100) {
width = 100 - horizontalPosition;
cropped = cropped === "left" || cropped === "both" ? "both" : "right";
}
if (horizontalPosition < 0 && horizontalPosition + width > 0) {
width = horizontalPosition + width;
horizontalPosition = 0;
cropped = cropped === "right" || cropped === "both" ? "both" : "left";
}
return Object.assign(Object.assign({}, period), { width,
horizontalPosition,
cropped });
};
const useTimelineRows = (rows, startDate, endDate, direction) => (0, react_1.useMemo)(() => rows.map((periods, rowIndex) => {
const timelinePeriods = periods.periods
.sort((a, b) => a.start.valueOf() - b.start.valueOf())
.map((period, i) => (Object.assign(Object.assign({}, spatialPeriod(period, startDate, endDate, direction, i, periods.periods, rowIndex)), { restProps: period === null || period === void 0 ? void 0 : period.restProps, ref: period === null || period === void 0 ? void 0 : period.ref })))
.sort(sort_1.lastPeriod)
.map(adjustedEdges)
.map(trimmedPeriods)
.filter(filter_1.invisiblePeriods);
return {
id: `tl-row-${rowIndex}`,
label: periods.label,
headingTag: periods.headingTag || "h3",
icon: periods.icon,
periods: direction === "left" ? timelinePeriods : timelinePeriods.reverse(),
restProps: periods === null || periods === void 0 ? void 0 : periods.restProps,
ref: periods === null || periods === void 0 ? void 0 : periods.ref,
};
}), [rows, startDate, endDate, direction]);
exports.useTimelineRows = useTimelineRows;
const useEarliestDate = ({ startDate, rows, }) => (0, react_1.useMemo)(() => {
if (startDate) {
return startDate;
}
const startDates = rows
.flat()
.filter((period) => period.start)
.map((period) => period.start);
if (startDates.length === 0) {
return new Date();
}
const earliestDate = startDates.reduce((earliest, current) => current < earliest ? current : earliest);
return earliestDate;
}, [startDate, rows]);
exports.useEarliestDate = useEarliestDate;
const latestDate = (latest, period) => period.end > latest ? period.end : latest;
const latestTomDate = (rows) => rows.flat().reduce(latestDate, new Date(0));
const useLatestDate = ({ endDate, rows }) => (0, react_1.useMemo)(() => (endDate ? endDate : (0, date_fns_1.addDays)(latestTomDate(rows), 1)), [endDate, rows]);
exports.useLatestDate = useLatestDate;
//# sourceMappingURL=useTimelineRows.js.map