mautourco-components 0.2.57 → 0.2.59

package/dist/components/molecules/ActionDropdown/ActionDropdown.js

@@ -17,7 +17,6 @@ import './ActionDropdown.css';
 export function ActionDropdown(props) {
     var data = props.data, children = props.children, _a = props.maxWidth, maxWidth = _a === void 0 ? '153px' : _a;
     var _b = useState(false), open = _b[0], setOpen = _b[1];
-    console.log(open);
     return (_jsxs(Popover, { open: open, onOpenChange: setOpen, children: [_jsx(PopoverTrigger, { children: children !== null && children !== void 0 ? children : (_jsx("span", { className: "action-dropdown-trigger", children: _jsx(Icon, { name: "more-vertical" }) })) }), _jsx(PopoverContent, { className: "action-dropdown", style: { '--max-width': maxWidth }, align: "end", side: "bottom", avoidCollisions: false, children: data.map(function (item, index) {
                     var defaultButton = (_jsx("button", { onClick: function () {
                             var _a;

package/dist/components/molecules/BookingResume/ResumeAccom/ResumeAccom.js

@@ -10,6 +10,6 @@ import { BookingResumeLayout } from '../BookingResumeLayout/BookingResumeLayout'
 import './ResumeAccom.css';
 export function ResumeAccom(props) {
     var image = props.image, dates = props.dates, clientType = props.clientType, pax = props.pax, rooms = props.rooms, hotelName = props.hotelName;
-    var stay = useStays(dates);
+    var stay = useStays(dates).stay;
     return (_jsxs(BookingResumeLayout, { title: "Accommodation", icon: "accom", image: image, className: "resume-accom", children: [_jsx(ServiceTitle, { title: hotelName }), _jsxs("div", { className: "space-y-2 mt-4", children: [_jsx(DateDisplay, { dates: dates, colorMode: "green" }), _jsxs(TextWithIcon, { icon: "night", children: [stay, " Nights"] }), _jsxs(Text, { variant: "medium", size: "sm", leading: "4", children: [_jsx("strong", { children: "Client types:" }), " ", clientType] }), _jsx(PaxDisplay, { pax: pax }), _jsx("div", { children: rooms.map(function (room, index) { return (_jsxs("div", { className: "space-y-1", children: [_jsx(TextWithIcon, { icon: "accom", textSize: "sm", textVariant: "medium", children: room.RoomName }), _jsx(ServiceInfo.Item, { icon: "utensils", iconSize: "sm", textSize: "sm", textLeading: "4", textVariant: "medium", label: "Meal-Plan", children: room.MealPlan })] }, "rm-".concat(index))); }) })] })] }));
 }

package/dist/components/molecules/DialogContentPolicy/DialogCancellationAccom.js

@@ -8,6 +8,6 @@ import TextWithIcon from '../TextWithIcon/TextWithIcon';
 import { CancellationLayout } from './CancellationLayout/CancellationLayout';
 export function DialogCancellationAccom(props) {
     var image = props.image, hotelName = props.hotelName, dates = props.dates, rooms = props.rooms, cancellationFee = props.cancellationFee, currency = props.currency;
-    var stay = useStays(dates);
+    var stay = useStays(dates).stay;
     return (_jsx(CancellationLayout, { title: "Accommodation", icon: "accom", image: image, cancellationFee: cancellationFee, currency: currency, children: _jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "space-y-1", children: [_jsx(Text, { variant: "bold", children: hotelName }), _jsx(DateDisplay, { dates: dates }), _jsxs(TextWithIcon, { icon: "night", textLeading: "4", children: [stay, " Nights"] })] }), _jsx("div", { className: "", children: rooms.map(function (room, index) { return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "space-y-1", children: [_jsxs(TextWithIcon, { icon: "accom", textLeading: "4", children: [index + 1, " Room"] }), _jsx(Text, { size: "sm", children: room.RoomName })] }), room.cancellation_policy.map(function (policy, pIndex) { return (_jsxs(Fragment, { children: [_jsxs(Chip, { type: "outline", color: "brand", isBlackText: true, children: ["Policy period applies", ' ', _jsx(DateDisplay, { dates: [policy.ValidFrom, policy.ValidTo], textSize: "xs" })] }), _jsxs(Text, { variant: "bold", size: "xs", leading: "4", children: [policy.Value, " % of total price"] }), _jsx(Text, { size: "xs", leading: "4", children: policy.Description })] }, "policy-".concat(pIndex))); })] }, "rm-".concat(index))); }) })] }) }));
 }

package/dist/components/organisms/TabCancellationPolicy/HeaderAccom.js

@@ -18,6 +18,6 @@ import TextWithIcon from '../../molecules/TextWithIcon/TextWithIcon';
  */
 export default function HeaderAccom(props) {
     var hotelName = props.hotelName, pax = props.pax, dates = props.dates;
-    var stay = useStays(dates);
+    var stay = useStays(dates).stay;
     return (_jsxs("div", { children: [_jsx(ServiceTitle, { title: hotelName, textSize: "sm" }), _jsx(TextWithIcon, { icon: "user", children: pax }), _jsx(DateDisplay, { dates: dates, arrowSize: "xs", calendarSize: "xs" }), _jsxs(TextWithIcon, { icon: "night", children: [stay, " Nights"] })] }));
 }

package/dist/components/organisms/Table/Table.d.ts

@@ -24,7 +24,10 @@ export interface TableProps<T extends TableRowData<T>> {
     /** Data for the table */
     data: T[];
     /** Callback function to be called when a row is clicked */
-    onClickRow?: (e: React.MouseEvent<HTMLTableRowElement>, row: T) => void;
+    onClickRow?: (e: React.MouseEvent<HTMLTableRowElement>, row: T, payload?: {
+        parentIndex?: number;
+        childIndex?: number;
+    }) => void;
     /** Pagination configuration for the table */
     pagination?: PaginationProps;
     /** Total rows in the table */

package/dist/components/organisms/Table/Table.js

@@ -33,7 +33,7 @@ import { TableCell } from './TableCell';
  * @returns
  */
 var NestedContent = function (_a) {
-    var rowIndex = _a.rowIndex, columns = _a.columns, children = _a.children, isGrouped = _a.isGrouped, onClickRow = _a.onClickRow;
+    var rowIndex = _a.rowIndex, columns = _a.columns, children = _a.children, isGrouped = _a.isGrouped, parentIndex = _a.parentIndex, onClickRow = _a.onClickRow;
     var contentRef = useRef(null);
     var _b = useState(0), height = _b[0], setHeight = _b[1];
     useEffect(function () {
@@ -48,7 +48,7 @@ var NestedContent = function (_a) {
             opacity: { duration: 0.15, ease: 'easeInOut' },
         }, className: "table__nested-wrapper", children: _jsx("table", { className: "table", children: _jsx("tbody", { children: children.map(function (child, childIndex) { return (_jsx("tr", { className: cn(child.className, {
                         'table__row-clickable': onClickRow,
-                    }), onClick: function (e) { return onClickRow === null || onClickRow === void 0 ? void 0 : onClickRow(e, child); }, children: _jsx(TableCell, { columns: columns, row: child, rowIndex: childIndex, childIndex: childIndex }) }, "ch-".concat(rowIndex, "-").concat(childIndex))); }) }) }) }));
+                    }), onClick: function (e) { return onClickRow === null || onClickRow === void 0 ? void 0 : onClickRow(e, child, { parentIndex: parentIndex, childIndex: childIndex }); }, children: _jsx(TableCell, { columns: columns, row: child, rowIndex: childIndex, childIndex: childIndex }) }, "ch-".concat(rowIndex, "-").concat(childIndex))); }) }) }) }));
 };
 /**
  * A table component for displaying structured data in rows and columns. Supports customizable column definitions and data rows.
@@ -85,12 +85,12 @@ export function Table(props) {
                                                     'table__row-nested': (_b = row.children) === null || _b === void 0 ? void 0 : _b.length,
                                                     'table__row-clickable': onClickRow,
                                                     'table__row-highlighted': row.isHighlighted,
-                                                }), onClick: function (e) { return onClickRow === null || onClickRow === void 0 ? void 0 : onClickRow(e, row); }, children: row.isHighlighted ? (_jsx("td", { colSpan: columns.length, className: "table__cell-highlighted", children: _jsx("div", { className: "table__row-div-highlighted", children: _jsx("table", { className: "table", children: _jsx("tbody", { children: _jsx("tr", { children: _jsx(TableCell, { columns: columns, row: row, rowIndex: rowIndex }) }) }) }) }) })) : (_jsx(TableCell, { columns: columns, row: row, rowIndex: rowIndex })) }));
-                                            return (_jsx(Fragment, { children: isGrouped ? (row.children && row.children.length > 0 ? (_jsx("tr", { className: "table__row-grouped", children: _jsx("td", { colSpan: columns.length, children: _jsx(NestedContent, { isGrouped: isGrouped, rowIndex: rowIndex, columns: columns, children: row.children || [], onClickRow: onClickRow }) }) })) : (defaultTable)) : !row.children ? (defaultTable) : (_jsx("tr", { className: "table__row-with-children", onClick: function (e) { return onClickRow === null || onClickRow === void 0 ? void 0 : onClickRow(e, row); }, children: _jsx("td", { colSpan: columns.length, className: cn({
+                                                }), onClick: function (e) { return onClickRow === null || onClickRow === void 0 ? void 0 : onClickRow(e, row, { parentIndex: rowIndex }); }, children: row.isHighlighted ? (_jsx("td", { colSpan: columns.length, className: "table__cell-highlighted", children: _jsx("div", { className: "table__row-div-highlighted", children: _jsx("table", { className: "table", children: _jsx("tbody", { children: _jsx("tr", { children: _jsx(TableCell, { columns: columns, row: row, rowIndex: rowIndex }) }) }) }) }) })) : (_jsx(TableCell, { columns: columns, row: row, rowIndex: rowIndex })) }));
+                                            return (_jsx(Fragment, { children: isGrouped ? (row.children && row.children.length > 0 ? (_jsx("tr", { className: "table__row-grouped", children: _jsx("td", { colSpan: columns.length, children: _jsx(NestedContent, { isGrouped: isGrouped, rowIndex: rowIndex, columns: columns, children: row.children || [], onClickRow: onClickRow, parentIndex: rowIndex }) }) })) : (defaultTable)) : !row.children ? (defaultTable) : (_jsx("tr", { className: "table__row-with-children", children: _jsx("td", { colSpan: columns.length, className: cn({
                                                             'table__children--visible': hasVisibleChildren,
                                                         }), children: _jsx("table", { className: "table", children: _jsxs("tbody", { children: [defaultTable, _jsx(AnimatePresence, { initial: false, children: hasVisibleChildren && (_jsx("tr", { className: cn('table__no-hover', {
                                                                                 'table__row-nested': row.children && row.children.length > 0,
-                                                                            }), children: _jsx("td", { colSpan: columns.length, className: "table__cell-nested", children: _jsx(NestedContent, { rowIndex: rowIndex, columns: columns, children: row.children || [] }) }) }, "nested-".concat(rowIndex))) })] }) }) }) })) }, "rw-".concat(rowIndex)));
+                                                                            }), children: _jsx("td", { colSpan: columns.length, className: "table__cell-nested", children: _jsx(NestedContent, { rowIndex: rowIndex, columns: columns, parentIndex: rowIndex, children: row.children || [], onClickRow: onClickRow }) }) }, "nested-".concat(rowIndex))) })] }) }) }) })) }, "rw-".concat(rowIndex)));
                                         }), data.length === 0 && (_jsx("tr", { children: _jsx("td", { colSpan: columns.length, className: "table__cell-empty", children: _jsx(Text, { size: "md", variant: "bold", className: "text-center", children: "No data found" }) }) }))] })] }) }), hasTotal && (_jsx("div", { className: 'table__total-container', children: _jsx("table", { className: "table", children: _jsx("tbody", { className: cn('table__total', {
                                 'table__total--dashed': isTotalBorderDash,
                             }), children: _jsxs("tr", { children: [_jsx("td", { colSpan: columns.length - 1 }), _jsx("td", { style: {

package/dist/hooks/useStays.d.ts

@@ -1 +1,4 @@
-export default function useStays(dates: string[]): number;
+export default function useStays(dates?: string[]): {
+    stay: number;
+    getStay: (dates?: string[]) => number;
+};

package/dist/hooks/useStays.js

@@ -1,14 +1,20 @@
 import { differenceInDays } from 'date-fns';
 import { useMemo } from 'react';
 export default function useStays(dates) {
-    var stay = useMemo(function () {
-        if (!dates) {
+    var getStay = function (dates) {
+        if (!dates || (dates === null || dates === void 0 ? void 0 : dates.length) === 0) {
             return 0;
         }
         if (dates.length) {
             return differenceInDays(dates[1], dates[0]);
         }
         return 0;
+    };
+    var stay = useMemo(function () {
+        return getStay(dates);
     }, [dates]);
-    return stay;
+    return {
+        stay: stay,
+        getStay: getStay,
+    };
 }

package/dist/index.d.ts

@@ -17,7 +17,7 @@ export { DateDisplay } from './components/molecules/DateDisplay/DateDisplay';
 export { DocketPrices } from './components/molecules/DocketPrices/DocketPrices';
 export { PriceDisplay } from './components/molecules/PriceDisplay/PriceDisplay';
 export { TransferDocket } from './components/molecules/TransferDocket/TransferDocket';
-export { ActionDropdown, type ActionDropdownItem } from './components/molecules/ActionDropdown/ActionDropdown';
+export { ActionDropdown, type ActionDropdownItem, } from './components/molecules/ActionDropdown/ActionDropdown';
 export { AddItemButton } from './components/molecules/AddItemButton/AddItemButton';
 export { default as AgeSelector } from './components/molecules/AgeSelector/AgeSelector';
 export * from './components/molecules/BookingResume';
@@ -86,43 +86,44 @@ export { default as UserIcon } from './components/atoms/Icon/icons/User';
 export { priceFormatter } from './lib/price-formatter';
 export type { DividerProps } from './components/atoms/Divider/Divider';
 export type { FeatureRowProps } from './components/molecules/FeatureRow/FeatureRow';
-export type { LocationData, LocationDropdownProps, LocationGroup, LocationOption } from './components/molecules/LocationDropdown/LocationDropdown';
-export type { ServiceOption, ServiceSelectorProps, ServiceType } from './components/molecules/ServiceSelector/ServiceSelector';
+export type { LocationData, LocationDropdownProps, LocationGroup, LocationOption, } from './components/molecules/LocationDropdown/LocationDropdown';
+export type { ServiceOption, ServiceSelectorProps, ServiceType, } from './components/molecules/ServiceSelector/ServiceSelector';
 export type { StepperProps } from './components/molecules/Stepper/Stepper';
-export type { CarBookingCardPriceRow, CarBookingCardProps, CarBookingCardSize, CarBookingCardState, CarBookingCardType } from './components/organisms/CarBookingCard/CarBookingCard';
-export type { CardContainerProps, CardContainerSpacing } from './components/organisms/CardContainer/CardContainer';
+export type { CarBookingCardPriceRow, CarBookingCardProps, CarBookingCardSize, CarBookingCardState, CarBookingCardType, } from './components/organisms/CarBookingCard/CarBookingCard';
+export type { CardContainerProps, CardContainerSpacing, } from './components/organisms/CardContainer/CardContainer';
 export type { DateTimePickerProps } from './components/organisms/DateTimePicker/DateTimePicker';
 export type { DialogProps, DialogSize } from './components/organisms/Dialog/Dialog';
 export type { FooterProps } from './components/organisms/Footer/Footer';
-export type { DocketDetailsData, DocketServiceType, MultipleQuotationDocketProps } from './components/organisms/MultipleQuotationDocket';
+export type { DocketDetailsData, DocketServiceType, MultipleQuotationDocketProps, } from './components/organisms/MultipleQuotationDocket';
 export { CHILD_CATEGORY_AGES } from './components/organisms/PaxSelector/PaxSelector';
-export type { ClientType, PaxData, PaxSelectorProps } from './components/organisms/PaxSelector/PaxSelector';
-export type { RoundTripData, RoundTripProps, RoundTripTransfer } from './components/organisms/RoundTrip/RoundTrip';
-export type { SearchBarTransferData, SearchBarTransferProps, TransferMode } from './components/organisms/SearchBarTransfer/SearchBarTransfer';
+export type { ClientType, PaxData, PaxSelectorProps, } from './components/organisms/PaxSelector/PaxSelector';
+export type { RoundTripData, RoundTripProps, RoundTripTransfer, } from './components/organisms/RoundTrip/RoundTrip';
+export type { SearchBarTransferData, SearchBarTransferProps, TransferMode, } from './components/organisms/SearchBarTransfer/SearchBarTransfer';
 export type { TopNavigationProps } from './components/organisms/TopNavigation/TopNavigation';
-export type { TransferLineData, TransferLineProps, TransferType } from './components/organisms/TransferLine/TransferLine';
+export type { TransferLineData, TransferLineProps, TransferType, } from './components/organisms/TransferLine/TransferLine';
 export type { CheckboxProps } from './components/atoms/Checkbox/Checkbox';
 export type { InputProps } from './components/atoms/Inputs/Input/Input';
 export type { AddItemButtonProps } from './components/molecules/AddItemButton/AddItemButton';
 export type { AgeSelectorProps } from './components/molecules/AgeSelector/AgeSelector';
-export type { BreadcrumbsItem, BreadcrumbsProps } from './components/molecules/Breadcrumbs/Breadcrumbs';
+export type { BreadcrumbsItem, BreadcrumbsProps, } from './components/molecules/Breadcrumbs/Breadcrumbs';
 export type { DocketPricesProps } from './components/molecules/DocketPrices/DocketPrices';
 export type { FromToProps } from './components/molecules/FromTo/FromTo';
 export type { PaxChipsProps, PaxCount } from './components/molecules/PaxChips/PaxChips';
 export type { PriceDisplayProps } from './components/molecules/PriceDisplay/PriceDisplay';
 export type { SectionTitleProps } from './components/molecules/SectionTitle/SectionTitle';
-export type { DetailsColProps, ItemColProps, RowAccommodationProps, RowExcursionProps, RowTransferProps } from './components/molecules/TableServiceItem';
+export type { DetailsColProps, ItemColProps, RowAccommodationProps, RowExcursionProps, RowTransferProps, } from './components/molecules/TableServiceItem';
 export type { ServiceAccommodationProps } from './components/molecules/TimelineItem/ServiceAccommodation';
 export type { ServiceExcursionProps } from './components/molecules/TimelineItem/ServiceExcursion';
 export type { ServiceTransferProps } from './components/molecules/TimelineItem/ServiceTransfer';
 export type { TimelineHeaderProps } from './components/molecules/TimelineItem/TimelineHeader';
 export type { ToastProps } from './components/molecules/Toast/Toast';
 export type { TransferDocketProps } from './components/molecules/TransferDocket/TransferDocket';
-export type { ComparisonData, DialogComparisonProps, MultiComparisonData } from './components/organisms/DialogComparison/DialogComparison';
+export type { ComparisonData, DialogComparisonProps, MultiComparisonData, } from './components/organisms/DialogComparison/DialogComparison';
 export type { DialogDeleteConfirmProps } from './components/organisms/DialogDeleteConfirm/DialogDeleteConfirm';
 export type { DialogQuoteRenameProps } from './components/organisms/DialogQuoteRename/DialogQuoteRename';
 export type { SelectedQuote } from './components/organisms/DialogSendingMail/DialogSendingMailMultiple/DialogSendingMailMultiple';
-export type { FilterType, QuoteHeaderProps } from './components/organisms/QuoteHeader/QuoteHeader';
-export type { TimelineProps, TimelineServices } from './components/organisms/Timeline/Timeline';
-export type { AccomodationDocket as AccomodationDocketType, ExcursionDocket as ExcursionDocketType, OtherServiceDocket as OtherServiceDocketType, ServiceDocket as ServiceDocketType, TransferDocket as TransferDocketType } from './types/docket/services.types';
+export type { FilterType, QuoteHeaderProps, } from './components/organisms/QuoteHeader/QuoteHeader';
+export type { TimelineProps, TimelineServices, } from './components/organisms/Timeline/Timeline';
+export type { AccomodationDocket as AccomodationDocketType, ExcursionDocket as ExcursionDocketType, OtherServiceDocket as OtherServiceDocketType, ServiceDocket as ServiceDocketType, TransferDocket as TransferDocketType, } from './types/docket/services.types';
 export * from './types/table';
+export * from './hooks/useStays';

package/dist/index.js

@@ -19,7 +19,7 @@ export { DocketPrices } from './components/molecules/DocketPrices/DocketPrices';
 export { PriceDisplay } from './components/molecules/PriceDisplay/PriceDisplay';
 export { TransferDocket } from './components/molecules/TransferDocket/TransferDocket';
 // Molecules - Composed components
-export { ActionDropdown } from './components/molecules/ActionDropdown/ActionDropdown';
+export { ActionDropdown, } from './components/molecules/ActionDropdown/ActionDropdown';
 export { AddItemButton } from './components/molecules/AddItemButton/AddItemButton';
 export { default as AgeSelector } from './components/molecules/AgeSelector/AgeSelector';
 export * from './components/molecules/BookingResume';
@@ -92,3 +92,5 @@ export { default as UserIcon } from './components/atoms/Icon/icons/User';
 export { priceFormatter } from './lib/price-formatter';
 export { CHILD_CATEGORY_AGES } from './components/organisms/PaxSelector/PaxSelector';
 export * from './types/table';
+// Hooks
+export * from './hooks/useStays';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mautourco-components",
-  "version": "0.2.57",
+  "version": "0.2.59",
   "private": false,
   "description": "Bibliothèque de composants Mautourco pour le redesign",
   "main": "dist/index.js",

package/src/components/molecules/ActionDropdown/ActionDropdown.tsx

@@ -38,8 +38,6 @@ export function ActionDropdown(props: ActionDropdownProps) {
   const { data, children, maxWidth = '153px' } = props;
   const [open, setOpen] = useState(false);
 
-  console.log(open);
-
   return (
     <Popover open={open} onOpenChange={setOpen}>
       <PopoverTrigger>

package/src/components/molecules/BookingResume/ResumeAccom/ResumeAccom.tsx

@@ -22,7 +22,7 @@ export interface ResumeAccomProps {
 export function ResumeAccom(props: ResumeAccomProps) {
   const { image, dates, clientType, pax, rooms, hotelName } = props;
 
-  const stay = useStays(dates);
+  const { stay } = useStays(dates);
 
   return (
     <BookingResumeLayout

package/src/components/molecules/DialogContentPolicy/DialogCancellationAccom.tsx

@@ -18,7 +18,7 @@ export interface DialogCancellationAccomProps {
 
 export function DialogCancellationAccom(props: DialogCancellationAccomProps) {
   const { image, hotelName, dates, rooms, cancellationFee, currency } = props;
-  const stay = useStays(dates);
+  const { stay } = useStays(dates);
 
   return (
     <CancellationLayout

package/src/components/organisms/TabCancellationPolicy/HeaderAccom.tsx

@@ -34,7 +34,7 @@ export interface HeaderAccomProps {
 export default function HeaderAccom(props: HeaderAccomProps) {
   const { hotelName, pax, dates } = props;
 
-  const stay = useStays(dates);
+  const { stay } = useStays(dates);
 
   return (
     <div>

package/src/components/organisms/Table/Table.tsx

@@ -36,7 +36,14 @@ export interface TableProps<T extends TableRowData<T>> {
   data: T[];
 
   /** Callback function to be called when a row is clicked */
-  onClickRow?: (e: React.MouseEvent<HTMLTableRowElement>, row: T) => void;
+  onClickRow?: (
+    e: React.MouseEvent<HTMLTableRowElement>,
+    row: T,
+    payload?: {
+      parentIndex?: number;
+      childIndex?: number;
+    }
+  ) => void;
 
   /** Pagination configuration for the table */
   pagination?: PaginationProps;
@@ -75,13 +82,15 @@ const NestedContent = <T extends TableRowData<T>>({
   columns,
   children,
   isGrouped,
+  parentIndex,
   onClickRow,
 }: {
   rowIndex: number;
   columns: ColumnType<T>[];
   children: T[];
   isGrouped?: boolean;
-  onClickRow?: (e: React.MouseEvent<HTMLTableRowElement>, row: T) => void;
+  parentIndex?: number;
+  onClickRow?: TableProps<T>['onClickRow'];
 }) => {
   const contentRef = useRef<HTMLDivElement>(null);
   const [height, setHeight] = useState<number | 'auto'>(0);
@@ -114,7 +123,7 @@ const NestedContent = <T extends TableRowData<T>>({
               className={cn(child.className, {
                 'table__row-clickable': onClickRow,
               })}
-              onClick={(e) => onClickRow?.(e, child as T)}>
+              onClick={(e) => onClickRow?.(e, child as T, { parentIndex, childIndex })}>
               <TableCell<T>
                 columns={columns}
                 row={child as T}
@@ -203,7 +212,7 @@ export function Table<T extends TableRowData<T>>(props: TableProps<T>) {
                         'table__row-clickable': onClickRow,
                         'table__row-highlighted': row.isHighlighted,
                       })}
-                      onClick={(e) => onClickRow?.(e, row)}>
+                      onClick={(e) => onClickRow?.(e, row, { parentIndex: rowIndex })}>
                       {row.isHighlighted ? (
                         <td colSpan={columns.length} className="table__cell-highlighted">
                           <div className="table__row-div-highlighted">
@@ -238,6 +247,7 @@ export function Table<T extends TableRowData<T>>(props: TableProps<T>) {
                                 columns={columns}
                                 children={row.children || []}
                                 onClickRow={onClickRow}
+                                parentIndex={rowIndex}
                               />
                             </td>
                           </tr>
@@ -247,9 +257,7 @@ export function Table<T extends TableRowData<T>>(props: TableProps<T>) {
                       ) : !row.children ? (
                         defaultTable
                       ) : (
-                        <tr
-                          className="table__row-with-children"
-                          onClick={(e) => onClickRow?.(e, row)}>
+                        <tr className="table__row-with-children">
                           <td
                             colSpan={columns.length}
                             className={cn({
@@ -272,7 +280,9 @@ export function Table<T extends TableRowData<T>>(props: TableProps<T>) {
                                         <NestedContent<T>
                                           rowIndex={rowIndex}
                                           columns={columns}
+                                          parentIndex={rowIndex}
                                           children={row.children || []}
+                                          onClickRow={onClickRow}
                                         />
                                       </td>
                                     </tr>