UNPKG

@dnb/eufemia

Version:

DNB Eufemia Design System UI Library

155 lines (154 loc) 4.8 kB
"use strict"; "use client"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = Tr; exports.useHandleOddEven = useHandleOddEven; var _react = require("react"); var _clsx = require("clsx"); var _TableAccordionHead = require("./table-accordion/TableAccordionHead.js"); var _TableNavigationHead = require("./table-navigation/TableNavigationHead.js"); var _TableAccordionContent = require("./table-accordion/TableAccordionContent.js"); var _TableContext = require("./TableContext.js"); var _TableTrContext = require("./TableTrContext.js"); var _jsxRuntime = require("react/jsx-runtime"); function Tr(componentProps) { const { variant, noWrap, verticalAlign, highlight, className: _className, ...restProps } = componentProps; const { currentVariant, isLast, count } = useHandleTrVariant({ variant }); const className = (0, _clsx.clsx)('dnb-table__tr', currentVariant && `dnb-table__tr--${currentVariant}`, isLast && 'dnb-table__tr--last', noWrap && 'dnb-table--no-wrap', verticalAlign && `dnb-table__tr--vertical-align-${verticalAlign}`, _className); const tableContext = (0, _react.useContext)(_TableContext.TableContext); const trContext = highlight ? { highlight } : null; if (tableContext?.allProps?.mode == 'accordion') { return (0, _jsxRuntime.jsx)(_TableTrContext.TableTrContext, { value: trContext, children: (0, _jsxRuntime.jsx)(_TableAccordionHead.TableAccordionHead, { count: count, className: className, ...restProps }) }); } if (tableContext?.allProps?.mode === 'navigation') { return (0, _jsxRuntime.jsx)(_TableTrContext.TableTrContext, { value: trContext, children: (0, _jsxRuntime.jsx)(_TableNavigationHead.TableNavigationHead, { className: className, ...restProps }) }); } const { expanded, disabled, noAnimation, keepInDOM, onClick, onOpen, onClose, ...trProps } = restProps; return (0, _jsxRuntime.jsx)(_TableTrContext.TableTrContext, { value: trContext, children: (0, _jsxRuntime.jsx)("tr", { role: "row", className: className, ...trProps }) }); } function useHandleTrVariant({ variant }) { const tableContext = (0, _react.useContext)(_TableContext.TableContext); const countRef = tableContext?.trCountRef.current; const lastRenderAliasRef = (0, _react.useRef)(null); const hasIncrementedRef = (0, _react.useRef)(false); const increment = (0, _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] = (0, _react.useState)(() => { if (hasIncrementedRef.current) { var _countRef$count; return (_countRef$count = countRef?.count) !== null && _countRef$count !== void 0 ? _countRef$count : 0; } hasIncrementedRef.current = true; return increment(); }); (0, _react.useEffect)(() => { if (lastRenderAliasRef.current === null) { lastRenderAliasRef.current = tableContext?.rerenderAlias; return; } if (lastRenderAliasRef.current !== tableContext?.rerenderAlias) { lastRenderAliasRef.current = tableContext?.rerenderAlias; hasIncrementedRef.current = false; } if (!hasIncrementedRef.current) { hasIncrementedRef.current = true; setCount(increment()); } }, [tableContext?.rerenderAlias, increment]); let currentVariant = variant; if (!currentVariant) { currentVariant = count % 2 ? 'odd' : 'even'; } const isLast = tableContext?.totalCount > 0 ? tableContext.totalCount === count : typeof countRef !== 'undefined' && countRef.count === count; return { currentVariant, isLast, count }; } function useHandleOddEven({ children }) { const trCountRef = (0, _react.useRef)({ count: 0 }); const [totalCount, setTotalCount] = (0, _react.useState)(0); const [rerenderAlias, setRerenderAlias] = (0, _react.useState)({}); const forceRerender = (0, _react.useCallback)(() => { trCountRef.current.count = 0; setRerenderAlias({}); }, []); const isMounted = (0, _react.useRef)(false); (0, _react.useEffect)(() => { if (isMounted.current) { forceRerender(); } isMounted.current = true; }, [children, forceRerender]); (0, _react.useEffect)(() => { setTotalCount(trCountRef.current.count); }); return { trCountRef, rerenderAlias, totalCount, setRerenderAlias }; } Tr.AccordionContent = _TableAccordionContent.TableAccordionContentRow; //# sourceMappingURL=TableTr.js.map