@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
109 lines • 3.18 kB
JavaScript
import _extends from "@babel/runtime/helpers/esm/extends";
import React from 'react';
import classnames from 'classnames';
import { TableAccordionHead } from "./table-accordion/TableAccordionHead.js";
import { TableNavigationHead } from "./table-navigation/TableNavigationHead.js";
import { TableAccordionContentRow } from "./table-accordion/TableAccordionContent.js";
import { TableContext } from "./TableContext.js";
export default function Tr(componentProps) {
const {
variant,
noWrap,
className: _className,
...restProps
} = componentProps;
const {
currentVariant,
isLast,
count
} = useHandleTrVariant({
variant
});
const className = classnames('dnb-table__tr', _className, currentVariant && `dnb-table__tr--${currentVariant}`, isLast && 'dnb-table__tr--last', noWrap && 'dnb-table--no-wrap');
const tableContext = React.useContext(TableContext);
const deprecatedAccordionProp = tableContext?.allProps?.accordion;
if (deprecatedAccordionProp || tableContext?.allProps?.mode === 'accordion') {
return React.createElement(TableAccordionHead, _extends({
count: count,
className: className
}, restProps));
}
if (tableContext?.allProps?.mode === 'navigation') {
return React.createElement(TableNavigationHead, _extends({
className: className
}, restProps));
}
const {
expanded,
disabled,
noAnimation,
keepInDOM,
onClick,
onOpened,
onClosed,
...trProps
} = restProps;
return React.createElement("tr", _extends({
role: "row",
className: className
}, trProps));
}
function useHandleTrVariant({
variant
}) {
const tableContext = React.useContext(TableContext);
const countRef = tableContext?.trCountRef.current;
const increment = React.useCallback(() => {
if (typeof countRef === 'undefined') {
return 0;
}
if (!variant || variant === 'even' && countRef.count % 2 === 1 || variant === 'odd' && countRef.count % 2 === 0) {
countRef.count++;
}
return countRef.count;
}, [countRef, variant]);
const [count, setCount] = React.useState(() => {
if (typeof window === 'undefined') {
return increment();
}
});
React.useEffect(() => {
setCount(increment());
}, [tableContext?.rerenderAlias, increment]);
let currentVariant = variant;
if (!currentVariant) {
currentVariant = count % 2 ? 'odd' : 'even';
}
const isLast = typeof countRef !== 'undefined' && countRef.count === count;
return {
currentVariant,
isLast,
count
};
}
export function useHandleOddEven({
children
}) {
const trCountRef = React.useRef({
count: 0
});
const [rerenderAlias, setRerenderAlias] = React.useState({});
const forceRerender = React.useCallback(() => {
trCountRef.current.count = 0;
setRerenderAlias({});
}, []);
const isMounted = React.useRef(false);
React.useEffect(() => {
if (isMounted.current) {
forceRerender();
}
isMounted.current = true;
}, [children, forceRerender]);
return {
trCountRef,
rerenderAlias,
setRerenderAlias
};
}
Tr.AccordionContent = TableAccordionContentRow;
//# sourceMappingURL=TableTr.js.map